@itilite/iui-user-management 1.4.494 → 1.4.496

package/dist/index.css

@@ -344,7 +344,7 @@
   position: absolute;
   z-index: 1000;
   right: 15px;
-  top: 10px;
+  top: 8px;
   transform: rotate(90deg);
 }
 
@@ -377,6 +377,7 @@
   justify-content: space-between;
   padding: 2px 0;
   max-width: 85%;
+  margin-left: 5px;
 }
 ._2d9GY ._194K1 ._l3kQ9 {
   color: #363e4f;
@@ -393,9 +394,9 @@
   max-height: 40px;
   max-width: 48px;
   border-radius: 4px;
-  margin-right: 5px;
   -o-object-fit: cover;
      object-fit: cover;
+  border: 1px solid #d1d5db;
 }
 
 ._35aiF ._2d5UD {
@@ -424,6 +425,7 @@
   border: 1px solid #d1d5db;
   padding-left: 10px;
   width: 100%;
+  border-radius: 6px;
 }
 ._1oiP4:focus-visible {
   outline: #fed7aa auto 1px;
@@ -468,7 +470,7 @@
   align-items: center;
   justify-content: space-between;
   width: 80%;
-  margin: 10px 0;
+  margin: 10px 0 20px 0;
 }
 ._2cSoW ._1Thb8 {
   display: flex;
@@ -483,8 +485,10 @@
   width: 48px;
   height: 40px;
   border-radius: 4px;
+  -o-object-fit: cover;
+     object-fit: cover;
 }
-._2cSoW ._3CdwB img {
+._2cSoW img {
   width: 48px;
   height: 40px;
   -o-object-fit: cover;
@@ -512,7 +516,6 @@
 ._2d9GY ._2d5UD {
   height: 40px;
   width: 48px;
-  margin-right: 5px;
   background-color: #ffe9cf;
   display: flex;
   justify-content: center;

package/dist/index.js

@@ -4490,7 +4490,9 @@ var ExpandLessIcon = function ExpandLessIcon(props) {
 
 var styles$3 = {"divider":"_3v2HU","selectSearchBox":"_1bAuu","chevronIcon":"_33J5X","selectWrapper":"_AJzhr","membershipList":"_u-SZq","memberItem":"_2d9GY","membershipDetails":"_194K1","title":"_l3kQ9","subtitle":"_33IR-","saveMembership":"_35aiF","newMembershipIcon":"_2d5UD","loading":"_1quY2","searchInput":"_1oiP4","membershipChainInfo":"_10Fx3","addNewMembership":"_3Y8Dj","savedMembership":"_2cSoW","iconWrapper":"_1Thb8","icon":"_3CdwB","number":"_1eJyq","actions":"_f_N1r"};
 
-var ChevronNext = function ChevronNext() {
+var ChevronNext = function ChevronNext(_ref) {
+  var _ref$color = _ref.color,
+    color = _ref$color === void 0 ? '#9CA3AF' : _ref$color;
   return /*#__PURE__*/React__default.createElement("svg", {
     xmlns: "http://www.w3.org/2000/svg",
     width: "8",
@@ -4498,7 +4500,7 @@ var ChevronNext = function ChevronNext() {
     fill: "none",
     viewBox: "0 0 8 16"
   }, /*#__PURE__*/React__default.createElement("path", {
-    stroke: "#9CA3AF",
+    stroke: color,
     strokeLinecap: "round",
     strokeLinejoin: "round",
     d: "M2 4l4 4-4 4"
@@ -4529,6 +4531,13 @@ var MembershipForm = function MembershipForm(_ref) {
       src: url
     }));
   };
+  var placeholder = 'e.g. SkyMiles';
+  if (type === 'hotel') {
+    placeholder = 'e.g. Best Western';
+  }
+  if (type === 'rental_car') {
+    placeholder = 'e.g. Firefly Car Rental';
+  }
   return /*#__PURE__*/React__default.createElement("div", {
     className: styles$3.saveMembership
   }, isOtherMembership ? /*#__PURE__*/React__default.createElement("div", {
@@ -4539,7 +4548,7 @@ var MembershipForm = function MembershipForm(_ref) {
     label: "Membership name",
     required: true
   }), /*#__PURE__*/React__default.createElement(iuistyles.IUISearch, {
-    placeholder: "",
+    placeholder: placeholder,
     value: membershipName,
     onChangeHandler: function onChangeHandler(e) {
       return setMembershipName(e.target.value);
@@ -4547,7 +4556,8 @@ var MembershipForm = function MembershipForm(_ref) {
     iconComponent: null,
     style: {
       width: '50%',
-      paddingLeft: 0
+      paddingLeft: 0,
+      borderRadius: 6
     }
   })) : /*#__PURE__*/React__default.createElement("div", {
     className: styles$3.membershipChainInfo
@@ -4567,7 +4577,7 @@ var MembershipForm = function MembershipForm(_ref) {
     label: "Membership number",
     required: true
   }), /*#__PURE__*/React__default.createElement(iuistyles.IUISearch, {
-    placeholder: "",
+    placeholder: "e.g. ABCD1234",
     value: membershipNumber,
     onChangeHandler: function onChangeHandler(e) {
       setMembershipNumber(e.target.value);
@@ -4575,7 +4585,8 @@ var MembershipForm = function MembershipForm(_ref) {
     iconComponent: null,
     style: {
       width: '50%',
-      paddingLeft: 0
+      paddingLeft: 0,
+      borderRadius: 6
     }
   }));
 };
@@ -5265,7 +5276,8 @@ var Membership = function Membership(_ref) {
     modalBodyStyle: {
       padding: selectedMembershipChain ? '0px 24px 25px' : '10px 24px 0px',
       minHeight: selectedMembershipChain ? 120 : 80,
-      borderBottom: selectedMembershipChain && '1px solid #E5E7EB'
+      borderBottom: selectedMembershipChain && '1px solid #E5E7EB',
+      marginBottom: selectedMembershipChain ? 0 : -40
     }
   }, /*#__PURE__*/React__default.createElement(React.Fragment, null, selectedMembershipChain ? /*#__PURE__*/React__default.createElement(MembershipForm, {
     selectedMembershipChain: selectedMembershipChain,
@@ -5299,7 +5311,9 @@ var Membership = function Membership(_ref) {
     value: searchQuery
   }), /*#__PURE__*/React__default.createElement("div", {
     className: styles$3.chevronIcon
-  }, /*#__PURE__*/React__default.createElement(ChevronNext, null))), isInputFocused && /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(ChevronNext, {
+    color: "#6B7280"
+  }))), isInputFocused && /*#__PURE__*/React__default.createElement("div", {
     className: styles$3.membershipList
   }, /*#__PURE__*/React__default.createElement(RenderList, {
     items: items,