ordering-ui-admin-external 1.13.4 → 1.14.0

package/_modules/components/Stores/PaymentOptionStripeDirect/index.js

@@ -36,7 +36,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
-  var _sitesState$sites, _ref2, _changesState$sandbox, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da3, _changesState$data_sa3, _changesState$data_sa4, _businessPaymethod$da4, _sitesState$sites2;
+  var _localState$sites, _businessPaymethod$si, _sitesState$sites2, _ref2, _changesState$sandbox, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da3, _changesState$data_sa3, _changesState$data_sa4, _businessPaymethod$da4, _sitesState$sites3;
   var open = props.open,
     onClose = props.onClose,
     orderTypes = props.orderTypes,
@@ -79,16 +79,35 @@ var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
     _useState8 = _slicedToArray(_useState7, 2),
     localState = _useState8[0],
     setLocalState = _useState8[1];
+  var filteredOptions = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.filter(function (a) {
+    var _sitesState$sites;
+    return sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.find(function (b) {
+      return a.id === b.id;
+    });
+  });
+  var _useState9 = (0, _react.useState)(!(filteredOptions !== null && filteredOptions !== void 0 && filteredOptions.length)),
+    _useState10 = _slicedToArray(_useState9, 2),
+    all = _useState10[0],
+    setAll = _useState10[1];
   var setPaymethodInfo = function setPaymethodInfo(values) {
-    var _ref, _changesState$values$, _businessPaymethod$va;
     var data = {};
-    var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
-      return i.id;
-    })) !== null && _ref !== void 0 ? _ref : [];
-    array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
-      return item !== values.value;
-    }) : [].concat(_toConsumableArray(array), [values.value])));
-    data[values.key] = array.length > 0 ? array : [];
+    if ((values === null || values === void 0 ? void 0 : values.value) === 'All') {
+      data[values.key] = [];
+      setAll(!all);
+    } else {
+      var _ref, _changesState$values$, _businessPaymethod$va;
+      var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
+        return i.id;
+      })) !== null && _ref !== void 0 ? _ref : [];
+      array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
+        return item !== values.value;
+      }) : [].concat(_toConsumableArray(array), [values.value])));
+      data[values.key] = array.length > 0 ? array : [];
+      if (values.key === 'sites') {
+        var _data$sites;
+        setAll(!(data !== null && data !== void 0 && (_data$sites = data.sites) !== null && _data$sites !== void 0 && _data$sites.length));
+      }
+    }
     handleChangeBusinessPaymentState(data);
   };
   var actionSidebar = function actionSidebar(value) {
@@ -137,16 +156,10 @@ var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
     cleanChangesState(initState);
   }, []);
   (0, _react.useEffect)(function () {
-    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) {
-      setLocalState({
-        allowed_order_types: changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types
-      });
-    }
-    if (changesState !== null && changesState !== void 0 && changesState.sites) {
-      setLocalState({
-        sites: changesState === null || changesState === void 0 ? void 0 : changesState.sites
-      });
-    }
+    var changes = {};
+    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) changes.allowed_order_types = changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types;
+    if (changesState !== null && changesState !== void 0 && changesState.sites) changes.sites = changesState === null || changesState === void 0 ? void 0 : changesState.sites;
+    if (Object.keys(changes).length > 0) setLocalState(JSON.parse(JSON.stringify(changes)));
   }, [changesState === null || changesState === void 0 ? void 0 : changesState.sites, changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Container, {
     id: "stripe_direct"
@@ -168,7 +181,7 @@ var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
     onClick: function onClick() {
       return setPaymentTabs(0);
     }
-  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
+  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
     active: paymentTabs === 1,
     onClick: function onClick() {
       return setPaymentTabs(1);
@@ -211,8 +224,18 @@ var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
     onChange: function onChange(e) {
       return handleChangeInput(e, true);
     }
-  })), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
-    var _ref3, _localState$sites, _businessPaymethod$si;
+  })), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites3 = sitesState.sites) === null || _sitesState$sites3 === void 0 ? void 0 : _sitesState$sites3.length) > 0 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.TabOption, {
+    key: "all",
+    onClick: function onClick() {
+      return setPaymethodInfo({
+        key: 'sites',
+        value: 'All'
+      });
+    }
+  }, all ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
+    className: "fill"
+  }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles2.TabOptionName, null, t('ALL', 'All'))), !all && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
+    var _ref3, _localState$sites2, _businessPaymethod$si2;
     return /*#__PURE__*/_react.default.createElement(_styles2.TabOption, {
       key: site.id,
       onClick: function onClick() {
@@ -221,12 +244,12 @@ var PaymentOptionStripeDirect = function PaymentOptionStripeDirect(props) {
           value: site.id
         });
       }
-    }, (_ref3 = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.map(function (s) {
+    }, (_ref3 = (_localState$sites2 = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites2 !== void 0 ? _localState$sites2 : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si2 = businessPaymethod.sites) === null || _businessPaymethod$si2 === void 0 ? void 0 : _businessPaymethod$si2.map(function (s) {
       return s.id;
     })) !== null && _ref3 !== void 0 && _ref3.includes(site.id) ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
       className: "fill"
     }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles2.TabOptionName, null, site.name));
-  })), paymentTabs === 2 && orderTypes.map(function (type) {
+  }))), paymentTabs === 2 && orderTypes.map(function (type) {
     var _ref4, _localState$allowed_o;
     return /*#__PURE__*/_react.default.createElement(_styles2.TabOption, {
       key: type.value,

package/_modules/components/Stores/PaymethodOptionStripeConnect/index.js

@@ -38,7 +38,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props) {
-  var _sitesState$sites, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data5, _changesState$data6, _businessPaymethod$da3, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da4, _sitesState$sites2;
+  var _localState$sites, _businessPaymethod$si, _sitesState$sites2, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data5, _changesState$data6, _businessPaymethod$da3, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da4, _sitesState$sites3;
   var business = props.business,
     open = props.open,
     onClose = props.onClose,
@@ -81,16 +81,35 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
     _useState8 = _slicedToArray(_useState7, 2),
     localState = _useState8[0],
     setLocalState = _useState8[1];
+  var filteredOptions = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.filter(function (a) {
+    var _sitesState$sites;
+    return sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.find(function (b) {
+      return a.id === b.id;
+    });
+  });
+  var _useState9 = (0, _react.useState)(!(filteredOptions !== null && filteredOptions !== void 0 && filteredOptions.length)),
+    _useState10 = _slicedToArray(_useState9, 2),
+    all = _useState10[0],
+    setAll = _useState10[1];
   var setPaymethodInfo = function setPaymethodInfo(values) {
-    var _ref, _changesState$values$, _businessPaymethod$va;
     var data = {};
-    var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
-      return i.id;
-    })) !== null && _ref !== void 0 ? _ref : [];
-    array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
-      return item !== values.value;
-    }) : [].concat(_toConsumableArray(array), [values.value])));
-    data[values.key] = array.length > 0 ? array : [];
+    if ((values === null || values === void 0 ? void 0 : values.value) === 'All') {
+      data[values.key] = [];
+      setAll(!all);
+    } else {
+      var _ref, _changesState$values$, _businessPaymethod$va;
+      var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
+        return i.id;
+      })) !== null && _ref !== void 0 ? _ref : [];
+      array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
+        return item !== values.value;
+      }) : [].concat(_toConsumableArray(array), [values.value])));
+      data[values.key] = array.length > 0 ? array : [];
+      if (values.key === 'sites') {
+        var _data$sites;
+        setAll(!(data !== null && data !== void 0 && (_data$sites = data.sites) !== null && _data$sites !== void 0 && _data$sites.length));
+      }
+    }
     handleChangeBusinessPaymentState(data);
   };
   var actionSidebar = function actionSidebar(value) {
@@ -131,16 +150,10 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
     });
   }, [businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod.allowed_order_types]);
   (0, _react.useEffect)(function () {
-    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) {
-      setLocalState({
-        allowed_order_types: changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types
-      });
-    }
-    if (changesState !== null && changesState !== void 0 && changesState.sites) {
-      setLocalState({
-        sites: changesState === null || changesState === void 0 ? void 0 : changesState.sites
-      });
-    }
+    var changes = {};
+    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) changes.allowed_order_types = changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types;
+    if (changesState !== null && changesState !== void 0 && changesState.sites) changes.sites = changesState === null || changesState === void 0 ? void 0 : changesState.sites;
+    if (Object.keys(changes).length > 0) setLocalState(JSON.parse(JSON.stringify(changes)));
   }, [changesState === null || changesState === void 0 ? void 0 : changesState.sites, changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Container, {
     id: "stripe_connect"
@@ -162,7 +175,7 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
     onClick: function onClick() {
       return setPaymentTabs(0);
     }
-  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
+  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
     active: paymentTabs === 1,
     onClick: function onClick() {
       return setPaymentTabs(1);
@@ -203,7 +216,8 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
     placeholder: t('FIXED_FEE', 'Fixed fee'),
     onChange: function onChange(e) {
       return handleChangeStripeInput(e);
-    }
+    },
+    min: 0
   })), /*#__PURE__*/_react.default.createElement(_styles2.InputWrapper, null, /*#__PURE__*/_react.default.createElement(_styles2.FieldName, null, t('PERCENTAGE_FEE', 'Percentage fee')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
     type: "number",
     name: "percentage_usage_fee",
@@ -211,9 +225,20 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
     placeholder: t('PERCENTAGE_FEE', 'Percentage fee'),
     onChange: function onChange(e) {
       return handleChangeStripeInput(e);
+    },
+    min: 0
+  })))), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites3 = sitesState.sites) === null || _sitesState$sites3 === void 0 ? void 0 : _sitesState$sites3.length) > 0 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
+    key: "all",
+    onClick: function onClick() {
+      return setPaymethodInfo({
+        key: 'sites',
+        value: 'All'
+      });
     }
-  })))), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
-    var _ref2, _localState$sites, _businessPaymethod$si;
+  }, all ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
+    className: "fill"
+  }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles4.TabOptionName, null, t('ALL', 'All'))), !all && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
+    var _ref2, _localState$sites2, _businessPaymethod$si2;
     return /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
       key: site.id,
       onClick: function onClick() {
@@ -222,12 +247,12 @@ var PaymethodOptionStripeConnect = function PaymethodOptionStripeConnect(props)
           value: site.id
         });
       }
-    }, (_ref2 = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.map(function (s) {
+    }, (_ref2 = (_localState$sites2 = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites2 !== void 0 ? _localState$sites2 : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si2 = businessPaymethod.sites) === null || _businessPaymethod$si2 === void 0 ? void 0 : _businessPaymethod$si2.map(function (s) {
       return s.id;
     })) !== null && _ref2 !== void 0 && _ref2.includes(site.id) ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
       className: "fill"
     }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles4.TabOptionName, null, site.name));
-  })), paymentTabs === 2 && orderTypes.map(function (type) {
+  }))), paymentTabs === 2 && orderTypes.map(function (type) {
     var _ref3, _localState$allowed_o;
     return /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
       key: type.value,

package/_modules/components/Stores/PaymethodOptionStripeRedirect/index.js

@@ -37,7 +37,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props) {
-  var _sitesState$sites, _ref2, _changesState$sandbox, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da3, _changesState$data_sa3, _changesState$data_sa4, _businessPaymethod$da4, _sitesState$sites2;
+  var _localState$sites, _businessPaymethod$si, _sitesState$sites2, _ref2, _changesState$sandbox, _changesState$data, _changesState$data2, _businessPaymethod$da, _changesState$data3, _changesState$data4, _businessPaymethod$da2, _changesState$data_sa, _changesState$data_sa2, _businessPaymethod$da3, _changesState$data_sa3, _changesState$data_sa4, _businessPaymethod$da4, _sitesState$sites3;
   var open = props.open,
     onClose = props.onClose,
     changesState = props.changesState,
@@ -80,16 +80,35 @@ var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props
     _useState8 = _slicedToArray(_useState7, 2),
     localState = _useState8[0],
     setLocalState = _useState8[1];
+  var filteredOptions = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.filter(function (a) {
+    var _sitesState$sites;
+    return sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.find(function (b) {
+      return a.id === b.id;
+    });
+  });
+  var _useState9 = (0, _react.useState)(!(filteredOptions !== null && filteredOptions !== void 0 && filteredOptions.length)),
+    _useState10 = _slicedToArray(_useState9, 2),
+    all = _useState10[0],
+    setAll = _useState10[1];
   var setPaymethodInfo = function setPaymethodInfo(values) {
-    var _ref, _changesState$values$, _businessPaymethod$va;
     var data = {};
-    var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
-      return i.id;
-    })) !== null && _ref !== void 0 ? _ref : [];
-    array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
-      return item !== values.value;
-    }) : [].concat(_toConsumableArray(array), [values.value])));
-    data[values.key] = array.length > 0 ? array : [];
+    if ((values === null || values === void 0 ? void 0 : values.value) === 'All') {
+      data[values.key] = [];
+      setAll(!all);
+    } else {
+      var _ref, _changesState$values$, _businessPaymethod$va;
+      var array = (_ref = (_changesState$values$ = changesState === null || changesState === void 0 ? void 0 : changesState[values.key]) !== null && _changesState$values$ !== void 0 ? _changesState$values$ : values.key === 'allowed_order_types' ? businessPaymethod === null || businessPaymethod === void 0 ? void 0 : businessPaymethod[values.key] : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$va = businessPaymethod[values.key]) === null || _businessPaymethod$va === void 0 ? void 0 : _businessPaymethod$va.map(function (i) {
+        return i.id;
+      })) !== null && _ref !== void 0 ? _ref : [];
+      array = _toConsumableArray(new Set(array.includes(values.value) ? array.filter(function (item) {
+        return item !== values.value;
+      }) : [].concat(_toConsumableArray(array), [values.value])));
+      data[values.key] = array.length > 0 ? array : [];
+      if (values.key === 'sites') {
+        var _data$sites;
+        setAll(!(data !== null && data !== void 0 && (_data$sites = data.sites) !== null && _data$sites !== void 0 && _data$sites.length));
+      }
+    }
     handleChangeBusinessPaymentState(data);
   };
   var actionSidebar = function actionSidebar(value) {
@@ -138,16 +157,10 @@ var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props
     cleanChangesState(initState);
   }, []);
   (0, _react.useEffect)(function () {
-    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) {
-      setLocalState({
-        allowed_order_types: changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types
-      });
-    }
-    if (changesState !== null && changesState !== void 0 && changesState.sites) {
-      setLocalState({
-        sites: changesState === null || changesState === void 0 ? void 0 : changesState.sites
-      });
-    }
+    var changes = {};
+    if (changesState !== null && changesState !== void 0 && changesState.allowed_order_types) changes.allowed_order_types = changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types;
+    if (changesState !== null && changesState !== void 0 && changesState.sites) changes.sites = changesState === null || changesState === void 0 ? void 0 : changesState.sites;
+    if (Object.keys(changes).length > 0) setLocalState(JSON.parse(JSON.stringify(changes)));
   }, [changesState === null || changesState === void 0 ? void 0 : changesState.sites, changesState === null || changesState === void 0 ? void 0 : changesState.allowed_order_types]);
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles2.Container, {
     id: "stripe_redirect"
@@ -169,7 +182,7 @@ var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props
     onClick: function onClick() {
       return setPaymentTabs(0);
     }
-  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites = sitesState.sites) === null || _sitesState$sites === void 0 ? void 0 : _sitesState$sites.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
+  }, t('GENERAL', 'General')), (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && /*#__PURE__*/_react.default.createElement(_styles3.Tab, {
     active: paymentTabs === 1,
     onClick: function onClick() {
       return setPaymentTabs(1);
@@ -212,8 +225,18 @@ var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props
     onChange: function onChange(e) {
       return handleChangeInput(e, true);
     }
-  })), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites2 = sitesState.sites) === null || _sitesState$sites2 === void 0 ? void 0 : _sitesState$sites2.length) > 0 && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
-    var _ref3, _localState$sites, _businessPaymethod$si;
+  })), paymentTabs === 1 && (sitesState === null || sitesState === void 0 ? void 0 : (_sitesState$sites3 = sitesState.sites) === null || _sitesState$sites3 === void 0 ? void 0 : _sitesState$sites3.length) > 0 && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
+    key: "all",
+    onClick: function onClick() {
+      return setPaymethodInfo({
+        key: 'sites',
+        value: 'All'
+      });
+    }
+  }, all ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
+    className: "fill"
+  }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles4.TabOptionName, null, t('ALL', 'All'))), !all && (sitesState === null || sitesState === void 0 ? void 0 : sitesState.sites.map(function (site) {
+    var _ref3, _localState$sites2, _businessPaymethod$si2;
     return /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
       key: site.id,
       onClick: function onClick() {
@@ -222,12 +245,12 @@ var PaymethodOptionStripeRedirect = function PaymethodOptionStripeRedirect(props
           value: site.id
         });
       }
-    }, (_ref3 = (_localState$sites = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites !== void 0 ? _localState$sites : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si = businessPaymethod.sites) === null || _businessPaymethod$si === void 0 ? void 0 : _businessPaymethod$si.map(function (s) {
+    }, (_ref3 = (_localState$sites2 = localState === null || localState === void 0 ? void 0 : localState.sites) !== null && _localState$sites2 !== void 0 ? _localState$sites2 : businessPaymethod === null || businessPaymethod === void 0 ? void 0 : (_businessPaymethod$si2 = businessPaymethod.sites) === null || _businessPaymethod$si2 === void 0 ? void 0 : _businessPaymethod$si2.map(function (s) {
       return s.id;
     })) !== null && _ref3 !== void 0 && _ref3.includes(site.id) ? /*#__PURE__*/_react.default.createElement(_RiCheckboxFill.default, {
       className: "fill"
     }) : /*#__PURE__*/_react.default.createElement(_RiCheckboxBlankLine.default, null), /*#__PURE__*/_react.default.createElement(_styles4.TabOptionName, null, site.name));
-  })), paymentTabs === 2 && orderTypes.map(function (type) {
+  }))), paymentTabs === 2 && orderTypes.map(function (type) {
     var _ref4, _localState$allowed_o;
     return /*#__PURE__*/_react.default.createElement(_styles4.TabOption, {
       key: type.value,

package/_modules/components/Stores/ProductDetails/index.js

@@ -140,7 +140,8 @@ var ProductDetailsUI = function ProductDetailsUI(props) {
   }, (!isExtendExtraOpen || width < 1000) && /*#__PURE__*/_react.default.createElement(_ProductSummary.ProductSummary, _extends({}, props, {
     actionSidebar: actionSidebar,
     showOption: showOption,
-    handleShowOption: handleShowOption
+    handleShowOption: handleShowOption,
+    extraOpen: extraOpen
   })), extraOpen && /*#__PURE__*/_react.default.createElement(_Shared.MoreSidebarLayout, {
     isExtendExtraOpen: isExtendExtraOpen,
     onClose: handleCloseExtraOpen

package/_modules/components/Stores/ProductDetailsAdvanced/index.js

@@ -392,7 +392,26 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
         id: val
       });
     }
-  })), /*#__PURE__*/_react.default.createElement(_styles2.FieldRow, null, /*#__PURE__*/_react.default.createElement(_styles2.InputContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.LabelCustom, {
+  })), /*#__PURE__*/_react.default.createElement(_styles2.FieldRow, {
+    fullWidth: true
+  }, /*#__PURE__*/_react.default.createElement(_styles2.InputContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.LabelCustom, {
+    htmlFor: "external_id"
+  }, t('EXTERNAL_ID', 'External Id')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
+    name: "external_id",
+    placeholder: t('EXTERNAL_ID', 'External Id'),
+    defaultValue: productState === null || productState === void 0 ? void 0 : productState.external_id,
+    onChange: function onChange(e) {
+      var _e$target$value2;
+      return handleClickProperty('external_id', (_e$target$value2 = e.target.value) !== null && _e$target$value2 !== void 0 ? _e$target$value2 : null);
+    },
+    disabled: formState.loading,
+    autoComplete: "off",
+    onKeyPress: function onKeyPress(e) {
+      if (!/^[0-9]$/.test(e.key)) {
+        e.preventDefault();
+      }
+    }
+  }))), /*#__PURE__*/_react.default.createElement(_styles2.FieldRow, null, /*#__PURE__*/_react.default.createElement(_styles2.InputContainer, null, /*#__PURE__*/_react.default.createElement(_styles2.LabelCustom, {
     htmlFor: "cost_price"
   }, t('PRODUCT_COST', 'Product cost')), /*#__PURE__*/_react.default.createElement(_styles.Input, {
     name: "cost_price",
@@ -400,8 +419,8 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
     placeholder: "0.00",
     defaultValue: (_productState$cost_pr = productState === null || productState === void 0 ? void 0 : productState.cost_price) !== null && _productState$cost_pr !== void 0 ? _productState$cost_pr : '',
     onChange: function onChange(e) {
-      var _e$target$value2;
-      return handleClickProperty('cost_price', (_e$target$value2 = e.target.value) !== null && _e$target$value2 !== void 0 ? _e$target$value2 : null);
+      var _e$target$value3;
+      return handleClickProperty('cost_price', (_e$target$value3 = e.target.value) !== null && _e$target$value3 !== void 0 ? _e$target$value3 : null);
     },
     disabled: formState.loading,
     autoComplete: "off",
@@ -418,8 +437,8 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
     placeholder: "0.00",
     defaultValue: (_productState$cost_of = productState === null || productState === void 0 ? void 0 : productState.cost_offer_price) !== null && _productState$cost_of !== void 0 ? _productState$cost_of : '',
     onChange: function onChange(e) {
-      var _e$target$value3;
-      return handleClickProperty('cost_offer_price', (_e$target$value3 = e.target.value) !== null && _e$target$value3 !== void 0 ? _e$target$value3 : null);
+      var _e$target$value4;
+      return handleClickProperty('cost_offer_price', (_e$target$value4 = e.target.value) !== null && _e$target$value4 !== void 0 ? _e$target$value4 : null);
     },
     disabled: formState.loading,
     autoComplete: "off",
@@ -439,8 +458,8 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
       required: t('MINIMUM_QUANTITY_REQUIRED', 'The minimum quantity is required')
     }),
     onChange: function onChange(e) {
-      var _e$target$value4;
-      return handleClickProperty('minimum_per_order', (_e$target$value4 = e.target.value) !== null && _e$target$value4 !== void 0 ? _e$target$value4 : null);
+      var _e$target$value5;
+      return handleClickProperty('minimum_per_order', (_e$target$value5 = e.target.value) !== null && _e$target$value5 !== void 0 ? _e$target$value5 : null);
     },
     disabled: formState.loading,
     autoComplete: "off",
@@ -476,8 +495,8 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
     placeholder: "0.00",
     defaultValue: (_productState$calorie = productState === null || productState === void 0 ? void 0 : productState.calories) !== null && _productState$calorie !== void 0 ? _productState$calorie : '',
     onChange: function onChange(e) {
-      var _e$target$value5;
-      return handleClickProperty('calories', (_e$target$value5 = e.target.value) !== null && _e$target$value5 !== void 0 ? _e$target$value5 : null);
+      var _e$target$value6;
+      return handleClickProperty('calories', (_e$target$value6 = e.target.value) !== null && _e$target$value6 !== void 0 ? _e$target$value6 : null);
     },
     disabled: formState.loading,
     autoComplete: "off",
@@ -494,8 +513,8 @@ var ProductDetailsAdvancedUI = function ProductDetailsAdvancedUI(props) {
     placeholder: "0.00",
     defaultValue: (_productState$weight = productState === null || productState === void 0 ? void 0 : productState.weight) !== null && _productState$weight !== void 0 ? _productState$weight : '',
     onChange: function onChange(e) {
-      var _e$target$value6;
-      return handleClickProperty('weight', (_e$target$value6 = e.target.value) !== null && _e$target$value6 !== void 0 ? _e$target$value6 : null);
+      var _e$target$value7;
+      return handleClickProperty('weight', (_e$target$value7 = e.target.value) !== null && _e$target$value7 !== void 0 ? _e$target$value7 : null);
     },
     disabled: formState.loading,
     autoComplete: "off",

package/_modules/components/Stores/ProductDetailsAdvanced/styles.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.WrapperRow = exports.WeightWrapper = exports.TypeSelectWrapper = exports.PropertyOptionWrapper = exports.PropertyOption = exports.PropertiesContainer = exports.PricePerUnit = exports.OptionCenter = exports.Option = exports.LabelCustom = exports.InputContainer = exports.FieldRow = exports.EditTaxContainer = exports.ButtonGroup = void 0;
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21;
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
@@ -43,16 +43,19 @@ var EditTaxContainer = _styledComponents.default.form(_templateObject14 || (_tem
 exports.EditTaxContainer = EditTaxContainer;
 var WrapperRow = _styledComponents.default.div(_templateObject15 || (_templateObject15 = _taggedTemplateLiteral(["\n  display: flex;\n  width: 100% !important;\n  flex-direction: column;\n  justify-content: space-between;\n\n  & > div {\n    width: 100%;\n    height: 100px;\n    margin-bottom: 20px;\n    border: none;\n  }\n\n  .date-filter-container {\n    z-index: 100;\n  }\n\n  > input {\n    width: 100%;\n    height: 57px;\n    margin-bottom: 20px;\n    padding: 10px 25px;\n    box-sizing: border-box;\n    &::-webkit-outer-spin-button,\n    &::-webkit-inner-spin-button {\n      -webkit-appearance: none;\n      margin: 0;\n    }\n    -moz-appearance: textfield;\n  }\n\n  @media (min-width: 992px) {\n    flex-direction: row;\n    & > div {\n      width: 48%;\n    }\n\n    > input {\n      width: 48%;\n    }\n  }\n"])));
 exports.WrapperRow = WrapperRow;
-var FieldRow = _styledComponents.default.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  flex-direction: column;\n  label:first-child{\n    margin-top: 30px;\n  }\n  > div {\n    width: 100%;\n    padding: 0px;\n  }\n\n  @media (min-width: 576px) {\n    flex-direction: row;\n    > div {\n      width: 48%;\n    }\n  }\n"])));
+var FieldRow = _styledComponents.default.div(_templateObject16 || (_templateObject16 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n  flex-direction: column;\n  label:first-child{\n    margin-top: 30px;\n  }\n  > div {\n    width: 100%;\n    padding: 0px;\n  }\n\n  @media (min-width: 576px) {\n    flex-direction: row;\n    > div {\n      width: 48%;\n    }\n    ", "\n  }\n"])), function (_ref5) {
+  var fullWidth = _ref5.fullWidth;
+  return fullWidth && (0, _styledComponents.css)(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n      > div {\n        width: 100%;\n      }\n    "])));
+});
 exports.FieldRow = FieldRow;
-var InputContainer = _styledComponents.default.div(_templateObject17 || (_templateObject17 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  padding: 0 10px;\n\n  &.growUnset {\n    flex-grow: unset;\n  }\n\n  &.showWeight {\n    width: 40%;\n  }\n"])));
+var InputContainer = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  max-width: 100%;\n  padding: 0 10px;\n\n  &.growUnset {\n    flex-grow: unset;\n  }\n\n  &.showWeight {\n    width: 40%;\n  }\n"])));
 exports.InputContainer = InputContainer;
-var WeightWrapper = _styledComponents.default.div(_templateObject18 || (_templateObject18 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n\n  input {\n    width: 55%;\n  }\n\n  .select {\n    width: 40%;\n    padding-top: 3.5px;\n    font-size: 14px;\n\n    .list {\n      padding-top: 7px;\n      padding-bottom: 7px;\n      margin-bottom: 10px;\n    }\n  }\n"])));
+var WeightWrapper = _styledComponents.default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  display: flex;\n  justify-content: space-between;\n\n  input {\n    width: 55%;\n  }\n\n  .select {\n    width: 40%;\n    padding-top: 3.5px;\n    font-size: 14px;\n\n    .list {\n      padding-top: 7px;\n      padding-bottom: 7px;\n      margin-bottom: 10px;\n    }\n  }\n"])));
 exports.WeightWrapper = WeightWrapper;
-var PropertyOptionWrapper = _styledComponents.default.div(_templateObject19 || (_templateObject19 = _taggedTemplateLiteral(["\n  display: block;\n  margin-top: 30px;\n"])));
+var PropertyOptionWrapper = _styledComponents.default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n  display: block;\n  margin-top: 30px;\n"])));
 exports.PropertyOptionWrapper = PropertyOptionWrapper;
-var PricePerUnit = _styledComponents.default.div(_templateObject20 || (_templateObject20 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  label {\n    font-size: 14px;\n    margin: 0;\n    margin-right: 15px;\n    ", "\n  }\n  \n  .select {\n    font-size: 14px;\n    padding: 3.5px;\n    .list {\n      padding-top: 7px;\n      padding-bottom: 7px;\n    }\n  }\n"])), function (props) {
+var PricePerUnit = _styledComponents.default.div(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n\n  label {\n    font-size: 14px;\n    margin: 0;\n    margin-right: 15px;\n    ", "\n  }\n  \n  .select {\n    font-size: 14px;\n    padding: 3.5px;\n    .list {\n      padding-top: 7px;\n      padding-bottom: 7px;\n    }\n  }\n"])), function (props) {
   var _props$theme2;
-  return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject21 || (_templateObject21 = _taggedTemplateLiteral(["\n    margin-right: 0;\n    margin-left: 15px;\n    "])));
+  return ((_props$theme2 = props.theme) === null || _props$theme2 === void 0 ? void 0 : _props$theme2.rtl) && (0, _styledComponents.css)(_templateObject22 || (_templateObject22 = _taggedTemplateLiteral(["\n    margin-right: 0;\n    margin-left: 15px;\n    "])));
 });
 exports.PricePerUnit = PricePerUnit;