From 6fe3d2e22656023fed60ea55eb56a8ba17a78f3c Mon Sep 17 00:00:00 2001
From: Ashish Rai <ashish.rai@plivo.com>
Date: Wed, 20 Sep 2023 10:28:39 +0530
Subject: [PATCH 1/5] updated UI of phoneNumInput comp & added to export

---
 src/components/PhoneNumberInput/country-dropdown.js |  5 +++--
 src/components/PhoneNumberInput/styles.scss         | 12 ++++++++++++
 src/index.js                                        |  1 +
 3 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/src/components/PhoneNumberInput/country-dropdown.js b/src/components/PhoneNumberInput/country-dropdown.js
index 6ece6e6..ed14497 100644
--- a/src/components/PhoneNumberInput/country-dropdown.js
+++ b/src/components/PhoneNumberInput/country-dropdown.js
@@ -75,8 +75,9 @@ const CountryDropdown = ({
                 circle
                 size={20}
               />
-              <Text ellipsis type="caption">
-                {country[0]} (+{country[2]})
+              <Text className="sg-country-list-item-label" type="caption">
+                <span className="sg-country-list-item-label__country-name">{country[0]}</span>
+                <span className="sg-country-list-item-label__country-code">+{country[2]}</span>
               </Text>
             </Block>
           ))
diff --git a/src/components/PhoneNumberInput/styles.scss b/src/components/PhoneNumberInput/styles.scss
index 5afd0e2..c2f0a17 100644
--- a/src/components/PhoneNumberInput/styles.scss
+++ b/src/components/PhoneNumberInput/styles.scss
@@ -36,6 +36,18 @@
         &:hover, &.selected {
             background-color: var(--background-highlight-color);
         }
+
+        .sg-country-list-item-label {
+            display: flex;
+            align-items: center;
+            justify-content: space-between;
+
+            &__country-name {
+                text-overflow: ellipsis;
+                max-width: 78%;
+                overflow: auto;
+            }
+        }
     }
     .sg-country-search {
         padding: 16px 16px 8px;
diff --git a/src/index.js b/src/index.js
index 37a2779..9ea9c7e 100644
--- a/src/index.js
+++ b/src/index.js
@@ -23,3 +23,4 @@ export * from './components/Cascader/index'
 export * from './components/DatePicker/index'
 export * from './components/KeyValueEditor/index'
 export * from './components/TimeLeftBar/index'
+export * from './components/PhoneNumberInput/index'
\ No newline at end of file

From 3ac7bea6839465a34142e0e4b27e221be7b83453 Mon Sep 17 00:00:00 2001
From: Ashish Rai <ashish.rai@plivo.com>
Date: Wed, 20 Sep 2023 10:29:58 +0530
Subject: [PATCH 2/5] updated version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index fef652d..64526e1 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "registry": "https://npm.pkg.github.com"
   },
   "repository": "git://github.com/contacto-io/contacto-console",
-  "version": "0.5.26",
+  "version": "0.5.36",
   "main": "build/index.js",
   "module": "build/index.es.js",
   "files": [

From c0c0296752e991457bc4b80354d5fe9bb7b8913b Mon Sep 17 00:00:00 2001
From: Ashish Rai <ashish.rai@plivo.com>
Date: Wed, 20 Sep 2023 11:37:47 +0530
Subject: [PATCH 3/5] css fix for phone num input

---
 src/components/PhoneNumberInput/styles.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/PhoneNumberInput/styles.scss b/src/components/PhoneNumberInput/styles.scss
index c2f0a17..0d26c93 100644
--- a/src/components/PhoneNumberInput/styles.scss
+++ b/src/components/PhoneNumberInput/styles.scss
@@ -41,6 +41,7 @@
             display: flex;
             align-items: center;
             justify-content: space-between;
+            flex: 1;
 
             &__country-name {
                 text-overflow: ellipsis;

From ae175c30cda10b933ef8733f63c2593b48de8add Mon Sep 17 00:00:00 2001
From: Ashish Rai <ashish.rai@plivo.com>
Date: Wed, 20 Sep 2023 11:38:58 +0530
Subject: [PATCH 4/5] updated version

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 64526e1..bf63e45 100644
--- a/package.json
+++ b/package.json
@@ -4,7 +4,7 @@
     "registry": "https://npm.pkg.github.com"
   },
   "repository": "git://github.com/contacto-io/contacto-console",
-  "version": "0.5.36",
+  "version": "0.5.37",
   "main": "build/index.js",
   "module": "build/index.es.js",
   "files": [

From 9b4c591e06a689ca63016c8ffbd4f42cec40b5e1 Mon Sep 17 00:00:00 2001
From: Ashish Rai <ashish.rai@plivo.com>
Date: Wed, 20 Sep 2023 13:51:26 +0530
Subject: [PATCH 5/5] updated pkg-lock json

---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index 63ec12e..ce65c06 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,6 +1,6 @@
 {
   "name": "@contacto-io/style-guide",
-  "version": "0.5.16",
+  "version": "0.5.37",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {