@7shifts/sous-chef 3.6.0 → 3.7.0

package/dist/index.modern.js

@@ -4497,7 +4497,7 @@ var DataTableRowComponent = function DataTableRowComponent(_ref, ref) {
     "data-testid": testId && testId + "-row",
     role: "row",
     ref: ref
-  }), React__default.Children.map(children, function (child, index) {
+  }), React__default.Children.toArray(children).filter(Boolean).map(function (child, index) {
     return renderColumn(child, index);
   }), showActionMenu && React__default.createElement(ActionsCell, {
     actions: actions
@@ -4512,6 +4512,7 @@ var WHITE = '#ffffff';
 var EGGPLANT200 = '#d3dbf4';
 var EGGPLANT300 = '#a7b7ea';
 var EGGPLANT400 = '#6d87dd';
+var EGGPLANT500 = '#6179c6';
 var EGGPLANT600 = '#415184';
 var RADISH400 = '#e76767';
 var GREY100 = '#F3F3F3';
@@ -4833,6 +4834,18 @@ var ModalBody = function ModalBody(_ref) {
 
 var styles$g = {"modal-footer":"_LKOr5","tertiary-container":"_Qktd-"};
 
+var updateButtonProps = function updateButtonProps(button, newProps) {
+  if (!button) {
+    return null;
+  }
+
+  if (button.type !== Button$1) {
+    return button;
+  }
+
+  return React__default.cloneElement(button, _extends({}, newProps));
+};
+
 var ModalFooter = function ModalFooter(_ref) {
   var children = _ref.children,
       actions = _ref.actions,
@@ -4842,13 +4855,16 @@ var ModalFooter = function ModalFooter(_ref) {
     var _actions$primary, _actions$secondary, _actions$tertiary, _classnames;
 
     var primaryButton = updateButtonProps(actions.primary, {
-      theme: (actions === null || actions === void 0 ? void 0 : (_actions$primary = actions.primary) === null || _actions$primary === void 0 ? void 0 : _actions$primary.props.theme) || 'primary'
+      theme: (actions === null || actions === void 0 ? void 0 : (_actions$primary = actions.primary) === null || _actions$primary === void 0 ? void 0 : _actions$primary.props.theme) || 'primary',
+      size: BUTTON_SIZES.MIN_WIDTH_100
     });
     var secondaryButton = updateButtonProps(actions.secondary, {
-      theme: (actions === null || actions === void 0 ? void 0 : (_actions$secondary = actions.secondary) === null || _actions$secondary === void 0 ? void 0 : _actions$secondary.props.theme) || 'default'
+      theme: (actions === null || actions === void 0 ? void 0 : (_actions$secondary = actions.secondary) === null || _actions$secondary === void 0 ? void 0 : _actions$secondary.props.theme) || 'default',
+      size: BUTTON_SIZES.MIN_WIDTH_100
     });
     var tertiaryButton = updateButtonProps(actions.tertiary, {
-      theme: (actions === null || actions === void 0 ? void 0 : (_actions$tertiary = actions.tertiary) === null || _actions$tertiary === void 0 ? void 0 : _actions$tertiary.props.theme) || 'link-primary'
+      theme: (actions === null || actions === void 0 ? void 0 : (_actions$tertiary = actions.tertiary) === null || _actions$tertiary === void 0 ? void 0 : _actions$tertiary.props.theme) || 'link-primary',
+      size: BUTTON_SIZES.MIN_WIDTH_100
     });
     return React__default.createElement(FooterContainer, {
       testId: testId
@@ -4864,20 +4880,6 @@ var ModalFooter = function ModalFooter(_ref) {
   return React__default.createElement(FooterContainer, null, children);
 };
 
-var updateButtonProps = function updateButtonProps(button, newProps) {
-  if (!button) {
-    return null;
-  }
-
-  if (button.type !== Button$1) {
-    return button;
-  }
-
-  return React__default.cloneElement(button, _extends({
-    size: BUTTON_SIZES.MIN_WIDTH_100
-  }, newProps));
-};
-
 var FooterContainer = function FooterContainer(_ref2) {
   var children = _ref2.children,
       testId = _ref2.testId;
@@ -8445,11 +8447,13 @@ var TimeFieldElement = function TimeFieldElement(_ref, ref) {
 
 var TimeField = forwardRef(TimeFieldElement);
 
-var _excluded$2p = ["currencySymbol"];
+var _excluded$2p = ["currencySymbol", "step"];
 
 var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
   var _ref$currencySymbol = _ref.currencySymbol,
-      currencySymbol = _ref$currencySymbol === void 0 ? "$" : _ref$currencySymbol,
+      currencySymbol = _ref$currencySymbol === void 0 ? '$' : _ref$currencySymbol,
+      _ref$step = _ref.step,
+      step = _ref$step === void 0 ? 0.01 : _ref$step,
       allOtherProps = _objectWithoutPropertiesLoose(_ref, _excluded$2p);
 
   var _useTextField = useTextField(_extends({}, allOtherProps, {
@@ -8458,15 +8462,18 @@ var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
       inputProps = _useTextField.inputProps,
       fieldProps = _useTextField.fieldProps;
 
+  var isWholeNumber = Number.isInteger(step);
   return React__default.createElement(Field, Object.assign({}, fieldProps), React__default.createElement(AffixContainer, {
     prefix: currencySymbol
   }, React__default.createElement("input", Object.assign({}, inputProps, {
-    type: 'number',
-    inputMode: 'decimal',
-    step: '0.01',
+    type: "number",
+    inputMode: "decimal",
+    step: step,
     min: 0,
     onKeyDown: function onKeyDown(e) {
-      if (e.key === 'e' || e.key === '-') {
+      var isAddingDecimalsOnWholeNumber = isWholeNumber && (e.key === '.' || e.key === ',');
+
+      if (e.key === 'e' || e.key === '-' || isAddingDecimalsOnWholeNumber) {
         e.preventDefault();
         return;
       }
@@ -8474,7 +8481,7 @@ var CurrencyFieldElement = function CurrencyFieldElement(_ref, ref) {
       inputProps.onKeyDown(e);
     },
     onBlur: function onBlur(e) {
-      e.currentTarget.value = parseFloat(e.currentTarget.value).toFixed(2);
+      e.currentTarget.value = parseFloat(e.currentTarget.value).toFixed(isWholeNumber ? 0 : 2);
       inputProps.onChange(e);
       inputProps.onBlur(e);
     }
@@ -9121,5 +9128,182 @@ var Italic = function Italic(_ref) {
   }, children);
 };
 
-export { AsyncSelectField, Avatar, Badge$1 as Badge, Bold, BreadcrumbItem, Breadcrumbs, Button$1 as Button, Calendar, Card, CheckboxField, Chip, CircularProgress, CurrencyField, DataTable, DataTableCell, DataTableEditableCell, DataTableRow, DateField, DateFilter, DateRangeField, Form, FormFeedback, FormFooter, FormRow, FormSection, IconAnalytics, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowToTop, IconArrowTurnDownRight, IconArrowUp, IconAward, IconAwful, IconAwfulMonochromatic, IconBad, IconBadMonochromatic, IconBalanceScale, IconBalanceScaleLeft, IconBan, IconBarsH, IconBarsV, IconBell, IconBirthdayCake, IconBold, IconBolt, IconBook, IconBriefcase, IconBullseyeArrow, IconCalculator, IconCalendar, IconCalendarAlt, IconCalendarCheck, IconCalendarDay, IconCalendarExclamation, IconCalendarStar, IconCalendarTomorrow, IconCamera, IconCameraSlash, IconCashRegister, IconChartBar, IconCheck, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClipboardList, IconClock, IconCog, IconComment, IconCommentLines, IconCopy, IconCreditCard, IconCreditCardPlus, IconDecent, IconDecentMonochromatic, IconDownload, IconEdit, IconEllipsisV, IconEnvelope, IconExclaimation, IconExclaimationTriangle, IconExpand, IconExternalLink, IconEye, IconEyeSlash, IconFile, IconFilePdf, IconFlag, IconFourDotsCircle, IconFourSquares, IconGavel, IconGif, IconGift, IconGood, IconGoodMonochromatic, IconGreat, IconGreatMonochromatic, IconGrinBeam, IconGripVertical, IconHandshake, IconImage, IconInfoCircle, IconIslandTropical, IconItalic, IconLaptopSearch, IconLink, IconList, IconListOI as IconListOi, IconLock, IconMagicSolid, IconMapMarker, IconMegaphone, IconMessages, IconMinus, IconMinusCircle, IconMoneyBill, IconMugSaucerSolid, IconNotesMedical, IconOvertime, IconPaperPlane, IconPaperPlaneClock, IconPaperclip, IconPencil, IconPercentage, IconPhone, IconPlug, IconPlus, IconPrint, IconQuestionCircle, IconRepeat, IconReply, IconSearch, IconSignOut, IconSitemap, IconSlidersH, IconSort, IconStar, IconStarSolid, IconStickyNoteLines, IconStopwatch, IconStrikethrough, IconSync, IconSyncExclaimation, IconTachometer, IconTimes, IconTimesOctagon, IconTrash, IconUnderline, IconUndo, IconUniversity, IconUserComputer, IconUserFriends, IconUserLight, IconUserPlus, IconUserSearch, IconUserSlash, IconUserSolid, IconUserTag, IconUserTie, IconUsers, IconVideo, IconVolume, IconVolumeMute, IconWrench, Inline, InlineBanner, Italic, Link, Modal, ModalBody, ModalFooter, MultiSelectField, Page, PaginationControls, PasswordField, PercentageField, PersistentBanner, Pill, PillSelectField, ProgressBar, RadioGroupBoxOption, RadioGroupField, RadioGroupOption, SIZE_25_PERCENT, SIZE_33_PERCENT, SIZE_50_PERCENT, SIZE_66_PERCENT, SIZE_75_PERCENT, SegmentedControl, SelectField, SousChefProvider, Spinner, Stack, Text, TextAreaField, TextField, TimeField, Toggle, ToolbarSelect, Tooltip$1 as Tooltip, Underline, WeekField, toast };
+var EMPTY_STATE_SIZE = {
+  SMALL: 'small',
+  MEDIUM: 'medium',
+  LARGE: 'large'
+};
+
+var styles$X = {"empty-state-container-stack":"_2B8Vd","empty-state-container-stack__content":"_NBTDp","empty-state-container-stack__content--full-page":"_1UWbP","empty-state-container-stack__content--inline-horizontal":"_2BVOy","empty-state-container-stack__body":"_1LuiZ"};
+
+var styles$Y = {"empty-state-container-cta":"_1Cx9N"};
+
+var EmptyStateContainerCTA = function EmptyStateContainerCTA(_ref) {
+  var _actions$primary, _actions$secondary;
+
+  var isPaywall = _ref.isPaywall,
+      actions = _ref.actions;
+  var primaryButton = updateButtonProps(actions.primary, {
+    theme: actions !== null && actions !== void 0 && (_actions$primary = actions.primary) !== null && _actions$primary !== void 0 && _actions$primary.props.theme || isPaywall ? 'upsell' : 'primary',
+    size: BUTTON_SIZES.MIN_WIDTH_100
+  });
+  var secondaryButton = updateButtonProps(actions.secondary, {
+    theme: (actions === null || actions === void 0 ? void 0 : (_actions$secondary = actions.secondary) === null || _actions$secondary === void 0 ? void 0 : _actions$secondary.props.theme) || 'default',
+    size: BUTTON_SIZES.MIN_WIDTH_100
+  });
+  return React__default.createElement("div", {
+    className: styles$Y['empty-state-container-cta']
+  }, primaryButton, secondaryButton);
+};
+
+var EmptyStateContainerStack = function EmptyStateContainerStack(_ref) {
+  var header = _ref.header,
+      title = _ref.title,
+      children = _ref.children,
+      mediaUrl = _ref.mediaUrl,
+      actions = _ref.actions,
+      caption = _ref.caption,
+      _ref$isPaywall = _ref.isPaywall,
+      isPaywall = _ref$isPaywall === void 0 ? false : _ref$isPaywall,
+      testId = _ref.testId;
+  return React__default.createElement("div", {
+    className: styles$X['empty-state-container-stack'],
+    "data-testid": testId
+  }, React__default.createElement("img", {
+    src: mediaUrl,
+    alt: String(title),
+    width: "200px"
+  }), React__default.createElement(Stack, {
+    space: 8,
+    alignItems: "center"
+  }, header && React__default.createElement(Text, {
+    as: "h4",
+    color: isPaywall && EGGPLANT500
+  }, header), React__default.createElement(Text, {
+    emphasis: "bold",
+    as: "body"
+  }, title), React__default.createElement("div", {
+    className: styles$X['empty-state-container-stack__body']
+  }, children)), React__default.createElement(Stack, {
+    space: 8,
+    alignItems: "center"
+  }, actions && React__default.createElement(EmptyStateContainerCTA, {
+    actions: actions,
+    isPaywall: isPaywall
+  }), caption && React__default.createElement(Text, {
+    as: "caption"
+  }, caption)));
+};
+
+var styles$Z = {"empty-state-container-inline":"_eMr1V","empty-state-container-inline__content":"_2jreb","empty-state-container-inline__content--full-page":"_3RLfH","empty-state-container-inline__content--inline-horizontal":"_3BMpx","empty-state-container-inline__body":"_2J5vn"};
+
+var EmptyStateContainerInline = function EmptyStateContainerInline(_ref) {
+  var _classnames;
+
+  var header = _ref.header,
+      title = _ref.title,
+      children = _ref.children,
+      mediaUrl = _ref.mediaUrl,
+      actions = _ref.actions,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? EMPTY_STATE_SIZE.LARGE : _ref$size,
+      caption = _ref.caption,
+      _ref$isPaywall = _ref.isPaywall,
+      isPaywall = _ref$isPaywall === void 0 ? false : _ref$isPaywall,
+      testId = _ref.testId;
+  return React__default.createElement("div", {
+    className: styles$Z['empty-state-container-inline'],
+    "data-testid": testId
+  }, React__default.createElement("div", {
+    className: classnames(styles$Z['empty-state-container-inline__content'], (_classnames = {}, _classnames[styles$Z['empty-state-container__content--full-page']] = size === EMPTY_STATE_SIZE.LARGE, _classnames[styles$Z['empty-state-container__content--inline-horizontal']] = size === EMPTY_STATE_SIZE.MEDIUM, _classnames))
+  }, React__default.createElement(Stack, {
+    space: 8
+  }, header && React__default.createElement(Text, {
+    as: "h4",
+    color: isPaywall && EGGPLANT500
+  }, header), React__default.createElement(Text, {
+    as: "h1"
+  }, title)), React__default.createElement("div", {
+    className: styles$Z['empty-state-container-inline__body']
+  }, children), React__default.createElement(Stack, {
+    space: 8
+  }, actions && React__default.createElement(EmptyStateContainerCTA, {
+    actions: actions,
+    isPaywall: isPaywall
+  }), caption && React__default.createElement(Text, {
+    as: "caption"
+  }, caption))), React__default.createElement("img", {
+    src: mediaUrl,
+    alt: String(title),
+    width: size === EMPTY_STATE_SIZE.LARGE ? '500px' : '333px'
+  }));
+};
+
+var EmptyStateContainer = function EmptyStateContainer(_ref) {
+  var header = _ref.header,
+      title = _ref.title,
+      children = _ref.children,
+      mediaUrl = _ref.mediaUrl,
+      actions = _ref.actions,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? EMPTY_STATE_SIZE.LARGE : _ref$size,
+      caption = _ref.caption,
+      _ref$isPaywall = _ref.isPaywall,
+      isPaywall = _ref$isPaywall === void 0 ? false : _ref$isPaywall,
+      testId = _ref.testId;
+  var isSmallSpot = size === EMPTY_STATE_SIZE.SMALL;
+  var EmptyStateComponent = isSmallSpot ? EmptyStateContainerStack : EmptyStateContainerInline;
+  return React__default.createElement(EmptyStateComponent, {
+    header: header,
+    title: title,
+    children: children,
+    mediaUrl: mediaUrl,
+    actions: actions,
+    size: size,
+    caption: caption,
+    isPaywall: isPaywall,
+    testId: testId
+  });
+};
+
+var Paywall = function Paywall(_ref) {
+  var header = _ref.header,
+      title = _ref.title,
+      children = _ref.children,
+      mediaUrl = _ref.mediaUrl,
+      actions = _ref.actions,
+      size = _ref.size,
+      caption = _ref.caption,
+      testId = _ref.testId;
+  return React__default.createElement(EmptyStateContainer, {
+    header: header,
+    title: title,
+    mediaUrl: mediaUrl,
+    actions: actions,
+    size: size,
+    caption: caption,
+    isPaywall: true,
+    testId: testId
+  }, children);
+};
+
+var EmptyState = function EmptyState(_ref) {
+  var title = _ref.title,
+      children = _ref.children,
+      mediaUrl = _ref.mediaUrl,
+      actions = _ref.actions,
+      caption = _ref.caption,
+      size = _ref.size,
+      testId = _ref.testId;
+  return React__default.createElement(EmptyStateContainer, {
+    title: title,
+    mediaUrl: mediaUrl,
+    actions: actions,
+    caption: caption,
+    size: size,
+    testId: testId
+  }, children);
+};
+
+export { AsyncSelectField, Avatar, Badge$1 as Badge, Bold, BreadcrumbItem, Breadcrumbs, Button$1 as Button, Calendar, Card, CheckboxField, Chip, CircularProgress, CurrencyField, DataTable, DataTableCell, DataTableEditableCell, DataTableRow, DateField, DateFilter, DateRangeField, EmptyState, Form, FormFeedback, FormFooter, FormRow, FormSection, IconAnalytics, IconArrowDown, IconArrowLeft, IconArrowRight, IconArrowToTop, IconArrowTurnDownRight, IconArrowUp, IconAward, IconAwful, IconAwfulMonochromatic, IconBad, IconBadMonochromatic, IconBalanceScale, IconBalanceScaleLeft, IconBan, IconBarsH, IconBarsV, IconBell, IconBirthdayCake, IconBold, IconBolt, IconBook, IconBriefcase, IconBullseyeArrow, IconCalculator, IconCalendar, IconCalendarAlt, IconCalendarCheck, IconCalendarDay, IconCalendarExclamation, IconCalendarStar, IconCalendarTomorrow, IconCamera, IconCameraSlash, IconCashRegister, IconChartBar, IconCheck, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconClipboardList, IconClock, IconCog, IconComment, IconCommentLines, IconCopy, IconCreditCard, IconCreditCardPlus, IconDecent, IconDecentMonochromatic, IconDownload, IconEdit, IconEllipsisV, IconEnvelope, IconExclaimation, IconExclaimationTriangle, IconExpand, IconExternalLink, IconEye, IconEyeSlash, IconFile, IconFilePdf, IconFlag, IconFourDotsCircle, IconFourSquares, IconGavel, IconGif, IconGift, IconGood, IconGoodMonochromatic, IconGreat, IconGreatMonochromatic, IconGrinBeam, IconGripVertical, IconHandshake, IconImage, IconInfoCircle, IconIslandTropical, IconItalic, IconLaptopSearch, IconLink, IconList, IconListOI as IconListOi, IconLock, IconMagicSolid, IconMapMarker, IconMegaphone, IconMessages, IconMinus, IconMinusCircle, IconMoneyBill, IconMugSaucerSolid, IconNotesMedical, IconOvertime, IconPaperPlane, IconPaperPlaneClock, IconPaperclip, IconPencil, IconPercentage, IconPhone, IconPlug, IconPlus, IconPrint, IconQuestionCircle, IconRepeat, IconReply, IconSearch, IconSignOut, IconSitemap, IconSlidersH, IconSort, IconStar, IconStarSolid, IconStickyNoteLines, IconStopwatch, IconStrikethrough, IconSync, IconSyncExclaimation, IconTachometer, IconTimes, IconTimesOctagon, IconTrash, IconUnderline, IconUndo, IconUniversity, IconUserComputer, IconUserFriends, IconUserLight, IconUserPlus, IconUserSearch, IconUserSlash, IconUserSolid, IconUserTag, IconUserTie, IconUsers, IconVideo, IconVolume, IconVolumeMute, IconWrench, Inline, InlineBanner, Italic, Link, Modal, ModalBody, ModalFooter, MultiSelectField, Page, PaginationControls, PasswordField, Paywall, PercentageField, PersistentBanner, Pill, PillSelectField, ProgressBar, RadioGroupBoxOption, RadioGroupField, RadioGroupOption, SIZE_25_PERCENT, SIZE_33_PERCENT, SIZE_50_PERCENT, SIZE_66_PERCENT, SIZE_75_PERCENT, SegmentedControl, SelectField, SousChefProvider, Spinner, Stack, Text, TextAreaField, TextField, TimeField, Toggle, ToolbarSelect, Tooltip$1 as Tooltip, Underline, WeekField, toast };
 //# sourceMappingURL=index.modern.js.map