@7shifts/sous-chef 3.30.1 → 3.31.0

package/dist/forms/DateRangeField/DateRangeField.d.ts

@@ -1,12 +1,12 @@
 import React from 'react';
-import { WeekStart, DateRange, BlockedDays } from '../../utils/date';
+import { WeekStart, DateRange, BlockedDays, DisabledDays } from '../../utils/date';
 type Props = {
     name: string;
     /** If not provided it will generate a random id so the label links properly with the text input */
     id?: string;
     value?: DateRange;
     /** It disable some dates so the user can't click on them. Refer to this [doc](https://react-day-picker.js.org/api/types/matcher) to see what values you can use. */
-    disabledDays?: BlockedDays;
+    disabledDays?: DisabledDays | BlockedDays;
     /** Reference this for valid formats: https://date-fns.org/v2.18.0/docs/format */
     format?: string;
     onChange?: (e: DateRange) => void;

package/dist/index.css

@@ -3249,6 +3249,19 @@ input:disabled + ._1aaPx::after {
   border-radius: 0;
   border-top-right-radius: 4px;
 }
+._2K8Ob {
+  background-color: white;
+  position: absolute;
+  height: 36px;
+  margin-top: 1px;
+  margin-left: 25px;
+  align-items: center;
+  display: flex;
+  pointer-events: none;
+  font-size: 14px;
+  font-family: "Proxima Nova", sans-serif;
+  color: var(--color-grey-500);
+}
 ._1uJbR {
   flex-grow: 1;
   display: flex;

package/dist/index.js

@@ -9344,7 +9344,7 @@ var ToDate = function ToDate(_ref, ref) {
 var ToDate$1 = React.forwardRef(ToDate);
 
 var DateRangeField = function DateRangeField(_ref) {
-  var _classnames;
+  var _classnames, _disabledDays$start, _disabledDays$end;
   var name = _ref.name,
     inputId = _ref.id,
     value = _ref.value,
@@ -9400,7 +9400,7 @@ var DateRangeField = function DateRangeField(_ref) {
     weekStart: weekStart,
     maxDays: maxDays,
     disabled: disabled,
-    disabledDays: disabledDays,
+    disabledDays: typeof disabledDays === 'object' && ('start' in disabledDays || 'end' in disabledDays) ? (_disabledDays$start = disabledDays.start) != null ? _disabledDays$start : undefined : disabledDays,
     readOnly: readOnly,
     onChange: function onChange(val) {
       return controllers.onChange({
@@ -9425,7 +9425,7 @@ var DateRangeField = function DateRangeField(_ref) {
     weekStart: weekStart,
     maxDays: maxDays,
     disabled: disabled,
-    disabledDays: disabledDays,
+    disabledDays: typeof disabledDays === 'object' && ('start' in disabledDays || 'end' in disabledDays) ? (_disabledDays$end = disabledDays.end) != null ? _disabledDays$end : undefined : disabledDays,
     readOnly: readOnly,
     onBlur: controllers.onBlur,
     onChange: function onChange(val) {
@@ -9827,6 +9827,8 @@ var TimeRangeField = function TimeRangeField(_ref) {
   })));
 };
 
+var styles$14 = {"currency-field__mask-display":"_2K8Ob"};
+
 var _excluded$2D = ["currencySymbol", "step"];
 var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
   var _ref$currencySymbol = _ref.currencySymbol,
@@ -9839,8 +9841,16 @@ var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
     })),
     inputProps = _useTextField.inputProps,
     fieldProps = _useTextField.fieldProps;
+  var hasValue = !!inputProps.value;
+  var _useState = React.useState(hasValue),
+    showMask = _useState[0],
+    setShowMask = _useState[1];
   var isWholeNumber = Number.isInteger(step);
-  return React__default.createElement(Field, _extends({}, fieldProps), React__default.createElement(AffixContainer, {
+  var formatThousandsSparator = function formatThousandsSparator(value) {
+    var numberValue = parseFloat(value).toFixed(isWholeNumber ? 0 : 2);
+    return numberValue.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+  };
+  return React__default.createElement(Field, _extends({}, fieldProps), React__default.createElement(React.Fragment, null, React__default.createElement(AffixContainer, {
     prefix: currencySymbol
   }, React__default.createElement("input", _extends({}, inputProps, {
     type: "number",
@@ -9859,11 +9869,18 @@ var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
       e.currentTarget.value = parseFloat(e.currentTarget.value).toFixed(isWholeNumber ? 0 : 2);
       inputProps.onChange(e);
       inputProps.onBlur(e);
+      setShowMask(true);
     },
     onWheel: function onWheel(e) {
       e.target.blur();
+    },
+    onFocus: function onFocus(e) {
+      setShowMask(false);
+      inputProps.onFocus(e);
     }
-  }))));
+  }))), showMask && !!inputProps.value && React__default.createElement("div", {
+    className: styles$14['currency-field__mask-display']
+  }, formatThousandsSparator(inputProps.value.toString() || ''))));
 };
 var CurrencyField = React.forwardRef(CurrencyFieldElement);
 
@@ -9955,7 +9972,7 @@ var FormFeedback = function FormFeedback(_ref) {
   }, children);
 };
 
-var styles$14 = {"phone-field":"_1uJbR","phone-field__input--with-square-borders":"_1zowl","phone-field__flag":"_Fc99X"};
+var styles$15 = {"phone-field":"_1uJbR","phone-field__input--with-square-borders":"_1zowl","phone-field__flag":"_Fc99X"};
 
 var usePhoneFieldControllers = function usePhoneFieldControllers(_ref) {
   var name = _ref.name,
@@ -10816,7 +10833,7 @@ var COUNTRIES = {
 };
 var COUNTRY_CODES = Object.keys(COUNTRIES);
 
-var styles$15 = {"country-selector":"_2T1pu","country-selector--with-error":"_1OxwW","country-selector__trigger":"_3mUO5","country-selector--disabled":"_10MbE","country-selector__trigger--with-error":"_5Dh7e","country-selector__trigger--disabled":"_2myDP","country-selector__trigger-flag":"_IHf11","country-selector__flag":"_1KMRs"};
+var styles$16 = {"country-selector":"_2T1pu","country-selector--with-error":"_1OxwW","country-selector__trigger":"_3mUO5","country-selector--disabled":"_10MbE","country-selector__trigger--with-error":"_5Dh7e","country-selector__trigger--disabled":"_2myDP","country-selector__trigger-flag":"_IHf11","country-selector__flag":"_1KMRs"};
 
 var flagIcons = {"fi":"_M2doN","fis":"_3vbi0","fi-ac":"_30baC","fi-ad":"_3ZYxj","fi-ae":"_2LJGN","fi-af":"_lqly3","fi-ag":"_B1gnt","fi-ai":"_1NIqt","fi-al":"_20Sg9","fi-am":"_JXRFR","fi-ao":"_3dUc_","fi-ar":"_2zSuY","fi-as":"_31Bje","fi-at":"_1_3ab","fi-au":"_3ifhl","fi-aw":"_3H9aN","fi-ax":"_3A_KZ","fi-az":"_2ObKm","fi-ba":"_3v41n","fi-bb":"_1fjfa","fi-bd":"_24NEp","fi-be":"_3AF8j","fi-bf":"_2jlZh","fi-bg":"_2ACy1","fi-bh":"_298rj","fi-bi":"_AP8aY","fi-bj":"_1SvG2","fi-bl":"_10exo","fi-bm":"_dPwTT","fi-bn":"_1e3FY","fi-bo":"_1P6lb","fi-bq":"_3yLu_","fi-br":"_2reHT","fi-bs":"_34VqI","fi-bt":"_3L-ek","fi-bw":"_2P46Z","fi-by":"_3k3ji","fi-bz":"_Wm-7Z","fi-ca":"_3mCU8","fi-cc":"_1TnnA","fi-cd":"_1n3mG","fi-cf":"_mRVOk","fi-cg":"_3yqWy","fi-ch":"_S-QqO","fi-ci":"_3yq28","fi-ck":"_1MnXX","fi-cl":"_2BAiD","fi-cm":"_17muc","fi-cn":"_zHGeX","fi-co":"_2xeW0","fi-cr":"_2PCnB","fi-cu":"_BFNAl","fi-cv":"_G2jRt","fi-cw":"_1grh-","fi-cx":"_1QOKC","fi-cy":"_3ld7b","fi-cz":"_bN_Fv","fi-de":"_280yy","fi-dj":"_3cZp9","fi-dk":"_23TZO","fi-dm":"_1sbTf","fi-do":"_1M5wH","fi-dz":"_2cicq","fi-ec":"_3caqA","fi-ee":"_3ZCIU","fi-eg":"_23ytE","fi-eh":"_pmU44","fi-er":"_1B8BU","fi-es":"_2jhKE","fi-et":"_sk0P2","fi-fi":"_1SEmk","fi-fj":"_sSQMg","fi-fk":"_27XSg","fi-fm":"_ClziM","fi-fo":"_uI-xC","fi-fr":"_M2iAw","fi-ga":"_2dwxx","fi-gb":"_1e-nA","fi-gd":"_2RZeE","fi-ge":"_2EvCn","fi-gf":"_3IH4K","fi-gg":"_1Jcke","fi-gh":"_2EPke","fi-gi":"_12Nbn","fi-gl":"_3__lH","fi-gm":"_2V2JG","fi-gn":"_1snaM","fi-gp":"_3Ra5n","fi-gq":"_3sbjK","fi-gr":"_-xgIE","fi-gt":"_1IL-n","fi-gu":"_X2BnD","fi-gw":"_183f_","fi-gy":"_3euCo","fi-hk":"_3vkSA","fi-hn":"_2wum3","fi-hr":"_394Be","fi-ht":"_2SZVb","fi-hu":"_1LPfs","fi-id":"_XxFIw","fi-ie":"_38xYb","fi-il":"_xsU9l","fi-im":"_1hyCQ","fi-in":"_1WZwW","fi-io":"_2OqV4","fi-iq":"_wS2T_","fi-ir":"_2gomh","fi-is":"_1DFTj","fi-it":"_2xqL9","fi-je":"_1YQZ8","fi-jm":"_2e2gd","fi-jo":"_3SD_b","fi-jp":"_2iU8m","fi-ke":"_2HTh-","fi-kg":"_P_BgY","fi-kh":"_3cL-5","fi-ki":"_UVsN_","fi-km":"_5_aHV","fi-kn":"_1ytYB","fi-kp":"_3h4nD","fi-kr":"_5Ayl_","fi-kw":"_11J0K","fi-ky":"_3JNZj","fi-kz":"_odoDB","fi-la":"_1NsIw","fi-lb":"_3sNSR","fi-lc":"_qIIiy","fi-li":"_2EYin","fi-lk":"_YC0sS","fi-lr":"_3M5Be","fi-ls":"_3mNd-","fi-lt":"_3Lod8","fi-lu":"_PADgP","fi-lv":"_1edmr","fi-ly":"_2Qaxl","fi-ma":"_3woQF","fi-mc":"_3Tcvg","fi-md":"_304sg","fi-me":"_3Y4qN","fi-mf":"_2Ta4d","fi-mg":"_3cyLg","fi-mh":"_3oa6y","fi-mk":"_2JG9M","fi-ml":"_E244m","fi-mm":"_3vntQ","fi-mn":"_1NFiz","fi-mo":"_17P3Y","fi-mp":"_2TsiM","fi-mq":"_1y2tW","fi-mr":"_hmY4g","fi-ms":"_2Rj7s","fi-mt":"_1nmC4","fi-mu":"_xO9Yk","fi-mv":"_13arY","fi-mw":"_2NJbp","fi-mx":"_3jDAz","fi-my":"_1R-kq","fi-mz":"_2JrIx","fi-na":"_2bezu","fi-nc":"_RXHw0","fi-ne":"_17FYh","fi-nf":"_2f17Z","fi-ng":"_pkj4b","fi-ni":"_2M9Kl","fi-nl":"_XP4Cy","fi-no":"_vWBdS","fi-np":"_3HCj0","fi-nr":"_35I9J","fi-nu":"_1qVGc","fi-nz":"_3sy04","fi-om":"_1ru-J","fi-pa":"_gVRbx","fi-pe":"_rPJml","fi-pf":"_b_9in","fi-pg":"_3svVP","fi-ph":"_qf4jP","fi-pk":"_ETc1B","fi-pl":"_2iKV_","fi-pm":"_3rKup","fi-pr":"_18qkQ","fi-ps":"_2QUjB","fi-pt":"_3XlFj","fi-pw":"_2-I7x","fi-py":"_2VRS9","fi-qa":"_XL4IN","fi-re":"_1Heg1","fi-ro":"_9Ds_F","fi-rs":"_2NBRF","fi-ru":"_27vE7","fi-rw":"_15XW2","fi-sa":"_2FNqc","fi-sb":"_nZ0tS","fi-sc":"_2c7r2","fi-sd":"_31SMO","fi-se":"_2g80W","fi-sg":"_1fXM6","fi-sh":"_3jXVn","fi-si":"_1dCS9","fi-sj":"_Fw6EH","fi-sk":"_3ZIrQ","fi-sl":"_2CXXP","fi-sm":"_9Z6OF","fi-sn":"_27QPB","fi-so":"_3u0ej","fi-sr":"_aWap6","fi-ss":"_jgut9","fi-st":"_1ZG6d","fi-sv":"_1LyCh","fi-sx":"_29HpR","fi-sy":"_36XMC","fi-sz":"_uhQEf","fi-ta":"_1VKa_","fi-tc":"_1zZqn","fi-td":"_zPDQp","fi-tg":"_1uL0e","fi-th":"_2hgJx","fi-tj":"_3wIE0","fi-tk":"_2duh0","fi-tl":"_2KUDp","fi-tm":"_2CfPc","fi-tn":"_2P42O","fi-to":"_2WFbJ","fi-tr":"_3Az7i","fi-tt":"_1pNPS","fi-tv":"_1pgP-","fi-tw":"_2ctah","fi-tz":"_3LhmF","fi-ua":"_ySobg","fi-ug":"_L0cww","fi-us":"_1dJbI","fi-uy":"_1mu4a","fi-uz":"_2jO3C","fi-va":"_3Wjh-","fi-vc":"_2SLDw","fi-ve":"_33s_c","fi-vg":"_14DB7","fi-vi":"_yup8e","fi-vn":"_2mLwZ","fi-vu":"_32cC-","fi-wf":"_2a5ap","fi-ws":"_3wY8H","fi-xk":"_3X7px","fi-ye":"_16y86","fi-yt":"_4eJM-","fi-za":"_3c6fy","fi-zm":"_21Ocp","fi-zw":"_2GLu6"};
 
@@ -10827,15 +10844,15 @@ var CountrySelector = function CountrySelector(_ref) {
     hasError = _ref.hasError,
     disabled = _ref.disabled;
   return React__default.createElement("div", {
-    className: classnames(styles$15['country-selector'], (_classNames = {}, _classNames[styles$15['country-selector--with-error']] = hasError, _classNames[styles$15['country-selector--disabled']] = disabled, _classNames))
+    className: classnames(styles$16['country-selector'], (_classNames = {}, _classNames[styles$16['country-selector--with-error']] = hasError, _classNames[styles$16['country-selector--disabled']] = disabled, _classNames))
   }, React__default.createElement(Dropdown, {
     trigger: React__default.createElement("div", {
-      className: classnames(styles$15['country-selector__trigger'], (_classNames2 = {}, _classNames2[styles$15['country-selector__trigger--with-error']] = hasError, _classNames2[styles$15['country-selector__trigger--disabled']] = disabled, _classNames2))
+      className: classnames(styles$16['country-selector__trigger'], (_classNames2 = {}, _classNames2[styles$16['country-selector__trigger--with-error']] = hasError, _classNames2[styles$16['country-selector__trigger--disabled']] = disabled, _classNames2))
     }, React__default.createElement(Inline, {
       space: 8,
       alignItems: "center"
     }, React__default.createElement("span", {
-      className: classnames(flagIcons['fi'], flagIcons["fi-" + country.toLocaleLowerCase()], styles$15['country-selector__trigger-flag'])
+      className: classnames(flagIcons['fi'], flagIcons["fi-" + country.toLocaleLowerCase()], styles$16['country-selector__trigger-flag'])
     }), React__default.createElement(IconChevronDown, {
       color: "grey-400",
       size: "medium"
@@ -10852,7 +10869,7 @@ var CountrySelector = function CountrySelector(_ref) {
       alignItems: "center",
       space: 12
     }, React__default.createElement("span", {
-      className: classnames(flagIcons['fi'], flagIcons["fi-" + countryCode.toLocaleLowerCase()], styles$15['country-selector__flag'])
+      className: classnames(flagIcons['fi'], flagIcons["fi-" + countryCode.toLocaleLowerCase()], styles$16['country-selector__flag'])
     }), React__default.createElement(Text, null, COUNTRIES[countryCode].countryName)));
   }))));
 };
@@ -10924,7 +10941,7 @@ var PhoneField = function PhoneField(_ref) {
     }
   }, [fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.internationalPhone]);
   return React__default.createElement(Field, _extends({}, fieldProps), React__default.createElement("div", {
-    className: styles$14['phone-field']
+    className: styles$15['phone-field']
   }, !disabledCountry && React__default.createElement(CountrySelector, {
     country: selectedCountry,
     onChange: handleCountryChange,
@@ -10935,17 +10952,17 @@ var PhoneField = function PhoneField(_ref) {
       space: 4,
       alignItems: "center"
     }, React__default.createElement("span", {
-      className: classnames(flagIcons['fi'], flagIcons["fi-" + selectedCountry.toLocaleLowerCase()], styles$14['country-selector__flag'])
+      className: classnames(flagIcons['fi'], flagIcons["fi-" + selectedCountry.toLocaleLowerCase()], styles$15['country-selector__flag'])
     }), React__default.createElement("span", null, "+", libphonenumberJs.getCountryCallingCode(selectedCountry))) : "+" + libphonenumberJs.getCountryCallingCode(selectedCountry)
   }, React__default.createElement("input", _extends({}, inputProps, {
     type: "tel",
-    className: classnames(inputProps.className, (_classNames = {}, _classNames[styles$14['phone-field__input--with-square-borders']] = !disabledCountry, _classNames)),
+    className: classnames(inputProps.className, (_classNames = {}, _classNames[styles$15['phone-field__input--with-square-borders']] = !disabledCountry, _classNames)),
     onChange: handlePhoneChange,
     onBlur: handlePhoneBlur
   })))));
 };
 
-var styles$16 = {"badge":"_1QLaK","badge--warning":"_qsFWw","badge--danger":"_359Cc","badge--success":"_2AOEK","badge--info":"_1mLjf"};
+var styles$17 = {"badge":"_1QLaK","badge--warning":"_qsFWw","badge--danger":"_359Cc","badge--success":"_2AOEK","badge--info":"_1mLjf"};
 
 var _excluded$2G = ["children", "theme", "title", "testId"];
 var Badge = function Badge(_ref, forwardedRef) {
@@ -10966,16 +10983,16 @@ var Badge = function Badge(_ref, forwardedRef) {
     overlay: title,
     ref: ref
   }, React__default.createElement("div", _extends({
-    className: classnames(styles$16['badge'], (_classnames = {}, _classnames[styles$16['badge--success']] = theme === 'success', _classnames[styles$16['badge--danger']] = theme === 'danger', _classnames[styles$16['badge--info']] = theme === 'info', _classnames[styles$16['badge--warning']] = theme === 'warning', _classnames)),
+    className: classnames(styles$17['badge'], (_classnames = {}, _classnames[styles$17['badge--success']] = theme === 'success', _classnames[styles$17['badge--danger']] = theme === 'danger', _classnames[styles$17['badge--info']] = theme === 'info', _classnames[styles$17['badge--warning']] = theme === 'warning', _classnames)),
     ref: ref,
     "data-testid": testId
   }, otherProps), children));
 };
 var Badge$1 = React.forwardRef(Badge);
 
-var styles$17 = {"avatar":"_1X7La","avatar--small":"_o5x6S","avatar__badge":"_NN8-D","avatar--medium":"_VxW5y","avatar--large":"_ec7jQ","avatar--extra-large":"_3VS00"};
+var styles$18 = {"avatar":"_1X7La","avatar--small":"_o5x6S","avatar__badge":"_NN8-D","avatar--medium":"_VxW5y","avatar--large":"_ec7jQ","avatar--extra-large":"_3VS00"};
 
-var styles$18 = {"avatar-image":"_bbI2F"};
+var styles$19 = {"avatar-image":"_bbI2F"};
 
 var AvatarImage = function AvatarImage(_ref) {
   var url = _ref.url,
@@ -10997,7 +11014,7 @@ var AvatarImage = function AvatarImage(_ref) {
     });
   }
   return React__default.createElement("div", {
-    className: styles$18['avatar-image']
+    className: styles$19['avatar-image']
   }, React__default.createElement(IconUserSolid, {
     size: "flexible",
     color: color
@@ -11062,7 +11079,7 @@ var Avatar = function Avatar(_ref) {
     defaultProfilePictureColors = _useState2[0];
   var backgroundColor = url ? COLORS['grey-200'] : getColor(color);
   return React__default.createElement("div", {
-    className: classnames(styles$17['avatar'], (_classnames = {}, _classnames[styles$17['avatar--small']] = size === 'small', _classnames[styles$17['avatar--medium']] = size === 'medium', _classnames[styles$17['avatar--large']] = size === 'large', _classnames[styles$17['avatar--extra-large']] = size === 'extra-large', _classnames)),
+    className: classnames(styles$18['avatar'], (_classnames = {}, _classnames[styles$18['avatar--small']] = size === 'small', _classnames[styles$18['avatar--medium']] = size === 'medium', _classnames[styles$18['avatar--large']] = size === 'large', _classnames[styles$18['avatar--extra-large']] = size === 'extra-large', _classnames)),
     style: {
       backgroundColor: children || url && !showIconInsteadOfImage ? backgroundColor : defaultProfilePictureColors.backgroundColor
     },
@@ -11075,7 +11092,7 @@ var Avatar = function Avatar(_ref) {
       return setShowIconInsteadOfImage(true);
     }
   }), badge && size !== 'small' && React__default.createElement("div", {
-    className: styles$17['avatar__badge']
+    className: styles$18['avatar__badge']
   }, badge));
 };
 
@@ -11088,7 +11105,7 @@ var CHIP_THEME = {
   DANGER: 'danger'
 };
 
-var styles$19 = {"chip":"_3e7Of","chip--marketing":"_2ZlMr","chip--success":"_g3pvh","chip--upsell":"_3GeNC","chip--warning":"_2jbr_","chip--info":"_1rrIw","chip--danger":"_1fKe8"};
+var styles$1a = {"chip":"_3e7Of","chip--marketing":"_2ZlMr","chip--success":"_g3pvh","chip--upsell":"_3GeNC","chip--warning":"_2jbr_","chip--info":"_1rrIw","chip--danger":"_1fKe8"};
 
 var Chip = function Chip(_ref) {
   var _classnames;
@@ -11098,11 +11115,11 @@ var Chip = function Chip(_ref) {
     testId = _ref.testId;
   return React__default.createElement("div", {
     "data-testid": testId,
-    className: classnames(styles$19['chip'], (_classnames = {}, _classnames[styles$19['chip--marketing']] = theme === CHIP_THEME.MARKETING, _classnames[styles$19['chip--success']] = theme === CHIP_THEME.SUCCESS, _classnames[styles$19['chip--upsell']] = theme === CHIP_THEME.UPSELL, _classnames[styles$19['chip--warning']] = theme === CHIP_THEME.WARNING, _classnames[styles$19['chip--info']] = theme === CHIP_THEME.INFO, _classnames[styles$19['chip--danger']] = theme === CHIP_THEME.DANGER, _classnames))
+    className: classnames(styles$1a['chip'], (_classnames = {}, _classnames[styles$1a['chip--marketing']] = theme === CHIP_THEME.MARKETING, _classnames[styles$1a['chip--success']] = theme === CHIP_THEME.SUCCESS, _classnames[styles$1a['chip--upsell']] = theme === CHIP_THEME.UPSELL, _classnames[styles$1a['chip--warning']] = theme === CHIP_THEME.WARNING, _classnames[styles$1a['chip--info']] = theme === CHIP_THEME.INFO, _classnames[styles$1a['chip--danger']] = theme === CHIP_THEME.DANGER, _classnames))
   }, children);
 };
 
-var styles$1a = {"pill":"_1vA9B","pill--default":"_2mTVo","pill--success":"_3CYqE","pill--danger":"_1WFdK","pill--warning":"_1Mp_n","pill--info":"_10zFn"};
+var styles$1b = {"pill":"_1vA9B","pill--default":"_2mTVo","pill--success":"_3CYqE","pill--danger":"_1WFdK","pill--warning":"_1Mp_n","pill--info":"_10zFn"};
 
 var PILL_THEME = {
   INFO: 'info',
@@ -11120,7 +11137,7 @@ var Pill = function Pill(_ref) {
     testId = _ref.testId;
   return React__default.createElement("div", {
     "data-testid": testId,
-    className: classnames(styles$1a['pill'], (_classnames = {}, _classnames[styles$1a['pill--default']] = theme === PILL_THEME.DEFAULT, _classnames[styles$1a['pill--warning']] = theme === PILL_THEME.WARNING, _classnames[styles$1a['pill--success']] = theme === PILL_THEME.SUCCESS, _classnames[styles$1a['pill--danger']] = theme === PILL_THEME.DANGER, _classnames[styles$1a['pill--info']] = theme === PILL_THEME.INFO, _classnames))
+    className: classnames(styles$1b['pill'], (_classnames = {}, _classnames[styles$1b['pill--default']] = theme === PILL_THEME.DEFAULT, _classnames[styles$1b['pill--warning']] = theme === PILL_THEME.WARNING, _classnames[styles$1b['pill--success']] = theme === PILL_THEME.SUCCESS, _classnames[styles$1b['pill--danger']] = theme === PILL_THEME.DANGER, _classnames[styles$1b['pill--info']] = theme === PILL_THEME.INFO, _classnames))
   }, children);
 };
 
@@ -11130,9 +11147,9 @@ var EMPTY_STATE_SIZE = {
   LARGE: 'large'
 };
 
-var styles$1b = {"empty-state-container-stack":"_11ygA","empty-state-container-stack__content":"_6o4Ut","empty-state-container-stack__content--full-page":"_1bs2I","empty-state-container-stack__content--inline-horizontal":"_WwD-g","empty-state-container-stack__body":"_1b3C0"};
+var styles$1c = {"empty-state-container-stack":"_11ygA","empty-state-container-stack__content":"_6o4Ut","empty-state-container-stack__content--full-page":"_1bs2I","empty-state-container-stack__content--inline-horizontal":"_WwD-g","empty-state-container-stack__body":"_1b3C0"};
 
-var styles$1c = {"empty-state-container-cta":"_3q5OJ","empty-state-container-cta--inside-modal":"_3DOZC"};
+var styles$1d = {"empty-state-container-cta":"_3q5OJ","empty-state-container-cta--inside-modal":"_3DOZC"};
 
 var EmptyStateContainerCTA = function EmptyStateContainerCTA(_ref) {
   var _actions$primary, _actions$secondary, _classNames;
@@ -11149,7 +11166,7 @@ var EmptyStateContainerCTA = function EmptyStateContainerCTA(_ref) {
     size: BUTTON_SIZES.MIN_WIDTH_100
   });
   return React__default.createElement("div", {
-    className: classnames(styles$1c['empty-state-container-cta'], (_classNames = {}, _classNames[styles$1c['empty-state-container-cta--inside-modal']] = isInsideModal, _classNames))
+    className: classnames(styles$1d['empty-state-container-cta'], (_classNames = {}, _classNames[styles$1d['empty-state-container-cta--inside-modal']] = isInsideModal, _classNames))
   }, primaryButton, secondaryButton);
 };
 
@@ -11164,7 +11181,7 @@ var EmptyStateContainerStack = function EmptyStateContainerStack(_ref) {
     isPaywall = _ref$isPaywall === void 0 ? false : _ref$isPaywall,
     testId = _ref.testId;
   return React__default.createElement("div", {
-    className: styles$1b['empty-state-container-stack'],
+    className: styles$1c['empty-state-container-stack'],
     "data-testid": testId
   }, React__default.createElement("img", {
     src: mediaUrl,
@@ -11180,7 +11197,7 @@ var EmptyStateContainerStack = function EmptyStateContainerStack(_ref) {
     emphasis: "bold",
     as: "body"
   }, title), React__default.createElement("div", {
-    className: styles$1b['empty-state-container-stack__body']
+    className: styles$1c['empty-state-container-stack__body']
   }, children)), React__default.createElement(Stack, {
     space: 8,
     alignItems: "center"
@@ -11192,7 +11209,7 @@ var EmptyStateContainerStack = function EmptyStateContainerStack(_ref) {
   }, caption)));
 };
 
-var styles$1d = {"empty-state-container-inline":"_1AdW7","empty-state-container-inline--inside-modal":"_Y1L-A","empty-state-container-inline__content":"_1E308","empty-state-container-inline__content--full-page":"_P5jRb","empty-state-container-inline__content--inline-horizontal":"_vkAs2","empty-state-container-inline__body":"_1o2PF","empty-state-container-inline__image":"_mfMlg"};
+var styles$1e = {"empty-state-container-inline":"_1AdW7","empty-state-container-inline--inside-modal":"_Y1L-A","empty-state-container-inline__content":"_1E308","empty-state-container-inline__content--full-page":"_P5jRb","empty-state-container-inline__content--inline-horizontal":"_vkAs2","empty-state-container-inline__body":"_1o2PF","empty-state-container-inline__image":"_mfMlg"};
 
 var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
   var _classNames, _classnames;
@@ -11210,10 +11227,10 @@ var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
   var _useModalContext = useModalContext(),
     isInsideModal = _useModalContext.isModalMounted;
   return React__default.createElement("div", {
-    className: classnames(styles$1d['empty-state-container-inline'], (_classNames = {}, _classNames[styles$1d['empty-state-container-inline--inside-modal']] = isInsideModal, _classNames)),
+    className: classnames(styles$1e['empty-state-container-inline'], (_classNames = {}, _classNames[styles$1e['empty-state-container-inline--inside-modal']] = isInsideModal, _classNames)),
     "data-testid": testId
   }, React__default.createElement("div", {
-    className: classnames(styles$1d['empty-state-container-inline__content'], (_classnames = {}, _classnames[styles$1d['empty-state-container__content--full-page']] = size === EMPTY_STATE_SIZE.LARGE, _classnames[styles$1d['empty-state-container__content--inline-horizontal']] = size === EMPTY_STATE_SIZE.MEDIUM, _classnames))
+    className: classnames(styles$1e['empty-state-container-inline__content'], (_classnames = {}, _classnames[styles$1e['empty-state-container__content--full-page']] = size === EMPTY_STATE_SIZE.LARGE, _classnames[styles$1e['empty-state-container__content--inline-horizontal']] = size === EMPTY_STATE_SIZE.MEDIUM, _classnames))
   }, React__default.createElement(Stack, {
     space: 8
   }, header && React__default.createElement(Text, {
@@ -11222,7 +11239,7 @@ var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
   }, header), React__default.createElement(Text, {
     as: "h1"
   }, title)), React__default.createElement("div", {
-    className: styles$1d['empty-state-container-inline__body']
+    className: styles$1e['empty-state-container-inline__body']
   }, children), React__default.createElement(Stack, {
     space: 8,
     marginTop: 12
@@ -11233,7 +11250,7 @@ var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
   }), caption && React__default.createElement(Text, {
     as: "caption"
   }, caption))), React__default.createElement("div", {
-    className: styles$1d['empty-state-container-inline__image']
+    className: styles$1e['empty-state-container-inline__image']
   }, React__default.createElement("img", {
     src: mediaUrl,
     alt: String(title),