@7shifts/sous-chef 3.10.3 → 3.11.0

package/dist/empty_states/EmptyStateContainer/EmptyStateContainerCTA/EmptyStateContainerCTA.d.ts

@@ -1,10 +1,11 @@
 import React from 'react';
 declare type Props = {
     isPaywall: Boolean;
+    isInsideModal?: Boolean;
     actions: {
         primary?: React.ReactElement;
         secondary?: React.ReactElement;
     };
 };
-declare const EmptyStateContainerCTA: ({ isPaywall, actions }: Props) => JSX.Element;
+declare const EmptyStateContainerCTA: ({ isPaywall, isInsideModal, actions }: Props) => JSX.Element;
 export default EmptyStateContainerCTA;

package/dist/forms/TimeField/TimeField.d.ts

@@ -5,5 +5,11 @@ import type { Props as TextFieldProps } from '../TextField/TextField';
  *
  * At the end, it is just a string formatted nicely. **You are in charge of validating the value and parsing it back to a value that you can use on your application**.
  */
-declare const TimeField: React.ForwardRefExoticComponent<Pick<TextFieldProps, "disabled" | "onBlur" | "onFocus" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onChange" | "error" | "placeholder" | "value" | "defaultValue" | "autoComplete" | "autoFocus" | "maxLength"> & React.RefAttributes<HTMLInputElement>>;
+declare const TimeField: React.ForwardRefExoticComponent<Pick<TextFieldProps, "disabled" | "onBlur" | "onFocus" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onChange" | "error" | "placeholder" | "value" | "defaultValue" | "autoComplete" | "autoFocus" | "maxLength"> & {
+    onClick?: (() => void) | undefined;
+    onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
+    onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
+    interval?: 15 | 30 | undefined;
+    startTime?: string | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
 export default TimeField;

package/dist/forms/TimeField/TimeFieldDropdown/TimeFieldDropdown.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { TimeInterval } from '../../../utils/date';
+declare type TimeFieldDropdownProps = {
+    trigger: React.ReactElement;
+    interval: TimeInterval;
+    startTime?: 'now' | string;
+    onOptionClick: (option: any) => void;
+    inputValue?: string;
+    width?: number;
+};
+declare const TimeFieldDropdown: ({ trigger, interval, startTime, onOptionClick, inputValue, width }: TimeFieldDropdownProps) => JSX.Element;
+export default TimeFieldDropdown;

package/dist/forms/TimeField/TimeFieldDropdown/index.d.ts

@@ -0,0 +1 @@
+export { default } from './TimeFieldDropdown';

package/dist/forms/TimeField/TimeFieldDropdownTrigger/TimeFieldDropdownTrigger.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { Props as TextFieldProps } from '../../TextField/TextField';
+declare const TimeFieldDropdownTrigger: React.ForwardRefExoticComponent<Pick<TextFieldProps, "disabled" | "onBlur" | "onFocus" | "onKeyDown" | "id" | "testId" | "caption" | "label" | "name" | "onChange" | "error" | "placeholder" | "value" | "defaultValue" | "autoComplete" | "autoFocus" | "maxLength"> & {
+    onClick?: (() => void) | undefined;
+    onMouseEnter?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
+    onMouseLeave?: ((event: React.MouseEvent<Element, MouseEvent>) => void) | undefined;
+    onInputChange?: ((e: string) => void) | undefined;
+} & React.RefAttributes<HTMLInputElement>>;
+export default TimeFieldDropdownTrigger;

package/dist/forms/TimeField/TimeFieldDropdownTrigger/index.d.ts

@@ -0,0 +1 @@
+export { default } from './TimeFieldDropdownTrigger';

package/dist/forms/TimeField/TimeFieldInput/TimeFieldInput.d.ts

@@ -0,0 +1,7 @@
+declare type Props = {
+    inputProps: any;
+    allOtherProps: any;
+    onInputChange?: (e: string) => void;
+};
+declare const TimeFieldInput: ({ inputProps, allOtherProps }: Props) => JSX.Element;
+export default TimeFieldInput;

package/dist/forms/TimeField/TimeFieldInput/index.d.ts

@@ -0,0 +1 @@
+export { default } from './TimeFieldInput';

package/dist/forms/TimeField/domain.d.ts

@@ -0,0 +1 @@
+export declare const getTimeOptions: (interval: number, startTime?: Date) => string[];

package/dist/forms/hooks/useRangeFieldControllers.d.ts

@@ -1,19 +1,18 @@
 /// <reference types="react" />
-import { DateRange } from '../../utils/date';
-declare type FieldControls = {
+declare type FieldControls<T> = {
     id: string;
     error?: React.ReactNode;
-    value: DateRange;
-    onChange: (e: DateRange) => void;
+    value: any;
+    onChange: (e: T) => void;
     onBlur: () => void;
 };
-declare type Props = {
+declare type Props<T> = {
     name: string;
     id?: string;
-    value?: DateRange;
-    onChange?: (e: DateRange) => void;
+    value?: T;
+    onChange?: (e: T) => void;
     onBlur?: () => void;
     error?: React.ReactNode;
 };
-export declare const useRangeFieldControllers: ({ name, id: inputId, value, onChange, onBlur, error }: Props) => FieldControls;
+export declare const useRangeFieldControllers: <T extends unknown>({ name, id: inputId, value, onChange, onBlur, error }: Props<T>) => FieldControls<T>;
 export {};

package/dist/index.css

@@ -821,6 +821,7 @@ Just for future references:
   transform-origin: top right;
   min-width: 120px;
   padding: 20px;
+  box-sizing: border-box;
 }
 ._2rs8m {
   all: unset;
@@ -836,170 +837,6 @@ Just for future references:
 ._2rs8m:focus > * {
   box-shadow: 0 0 8px var(--color-eggplant-300);
 }
-._1v1df {
-  font-family: "Proxima Nova", sans-serif;
-  list-style: none;
-  margin: -20px;
-  padding: 0;
-}
-._eAjpa {
-  background-color: var(--color-grey-100);
-}
-._3x1F6 {
-  width: 100%;
-  height: 1px;
-  background-color: var(--color-grey-200);
-  margin: 4px 0;
-}
-._B3_I5 {
-  padding: 12px;
-  font-size: 14px;
-  line-height: 20px;
-  display: flex;
-  cursor: pointer;
-  white-space: nowrap;
-  color: var(--color-grey-400);
-  gap: 8px;
-  align-items: center;
-}
-._1mr1h {
-  background-color: var(--color-eggplant-100);
-}
-._1mr1h > ._2b7Fg {
-  color: var(--color-eggplant-500);
-}
-._2l0Cb {
-  cursor: auto;
-  color: var(--color-grey-500);
-}
-._2l0Cb > ._2b7Fg {
-  color: var(--color-grey-400);
-}
-._2b7Fg {
-  flex: 1;
-  color: var(--color-grey-500);
-}
-h1._3CIA3 {
-  font-size: 1.75rem;
-  line-height: 2rem;
-  font-weight: 600;
-}
-
-h2._3CIA3 {
-  font-size: 1.5rem;
-  line-height: 1.75rem;
-  font-weight: 600;
-}
-
-h3._3CIA3 {
-  font-size: 1.25rem;
-  line-height: 1.5rem;
-  font-weight: 600;
-}
-
-h4._3CIA3 {
-  font-size: 1.25rem;
-  line-height: 1.5rem;
-  font-weight: 400;
-  color: var(--color-grey-400);
-}
-
-h5._3CIA3 {
-  font-size: 1rem;
-  line-height: 1.25rem;
-  font-weight: 400;
-  color: var(--color-grey-400);
-}
-
-._3CIA3 {
-  font-family: "Proxima Nova", sans-serif;
-  color: var(--color-grey-500);
-  margin: 0;
-}
-._1nnj8 {
-  font-size: 0.875rem;
-  line-height: 1.125rem;
-  font-weight: 400;
-}
-._37K6o {
-  font-size: 0.75rem;
-  line-height: 1rem;
-  font-weight: 400;
-}
-._avqxy {
-  font-size: 2.5rem;
-  line-height: 2.75rem;
-  font-weight: 600;
-}
-._2TG6E {
-  font-weight: 600;
-}
-._2hlsn {
-  font-style: italic;
-}
-._1Pjo6 {
-  text-decoration: underline;
-}
-._eDdDI {
-  font-variant-numeric: tabular-nums;
-}
-._2gNwS {
-  text-align: left;
-}
-._ufv1W {
-  text-align: right;
-}
-._2WMN6 {
-  text-align: center;
-}
-._2iH-J {
-  text-align: justify;
-}
-._2Ybjx {
-  position: relative;
-  border-bottom: 1px solid var(--color-grey-200);
-  padding: 16px;
-  word-break: break-word;
-  -webkit-hyphens: auto;
-      -ms-hyphens: auto;
-          hyphens: auto;
-}
-._2Ybjx:first-of-type {
-  border-left: 1px solid var(--color-grey-200);
-}
-._2Ybjx:last-of-type {
-  border-right: 1px solid var(--color-grey-200);
-}
-._5KXHH {
-  padding: 0;
-}
-._2-I0j:not(:last-child) {
-  border-right: 1px solid var(--color-grey-200);
-}
-._D73Vx {
-  background: var(--color-radish-100);
-  color: var(--color-radish-400);
-}
-._3A9-M {
-  height: 100%;
-  display: flex;
-  align-items: center;
-}
-._17Km7 {
-  justify-content: flex-end;
-}
-._2c6KQ {
-  justify-content: space-between;
-}
-._2hIl3 {
-  width: 16px;
-}
-._8Uhyd {
-  margin-left: 4px;
-}
-._3X51R {
-  margin-right: 4px;
-}
 ._2puqJ {
   position: fixed;
   top: 0px;
@@ -1035,7 +872,7 @@ h5._3CIA3 {
 }
 
 ._wQQ_2 {
-  position: initial;
+  position: relative;
   border: 1px solid var(--color-grey-200);
   background: var(--color-white);
   overflow: auto;
@@ -1064,6 +901,12 @@ h5._3CIA3 {
   font-weight: 600;
   font-family: "Proxima Nova", sans-serif;
 }
+._2zYre {
+  display: flex;
+  justify-content: end;
+  margin-bottom: -20px;
+  z-index: 2;
+}
 
 ._2XwRD {
   font-size: 20px;
@@ -1078,7 +921,6 @@ h5._3CIA3 {
  */
 ._2J-ku {
   overflow: auto;
-  margin-top: 24px;
   font-family: "Proxima Nova", sans-serif;
   font-size: 14px;
   line-height: 16px;
@@ -1573,6 +1415,125 @@ h5._3CIA3 {
   border-top-right-radius: 50%;
   border-bottom-right-radius: 50%;
 }
+._1v1df {
+  font-family: "Proxima Nova", sans-serif;
+  list-style: none;
+  margin: -20px;
+  padding: 0;
+}
+._eAjpa {
+  background-color: var(--color-grey-100);
+}
+._3x1F6 {
+  width: 100%;
+  height: 1px;
+  background-color: var(--color-grey-200);
+  margin: 4px 0;
+}
+._B3_I5 {
+  padding: 12px;
+  font-size: 14px;
+  line-height: 20px;
+  display: flex;
+  cursor: pointer;
+  white-space: nowrap;
+  color: var(--color-grey-400);
+  gap: 8px;
+  align-items: center;
+}
+._1mr1h {
+  background-color: var(--color-eggplant-100);
+}
+._1mr1h > ._2b7Fg {
+  color: var(--color-eggplant-500);
+}
+._2l0Cb {
+  cursor: auto;
+  color: var(--color-grey-500);
+}
+._2l0Cb > ._2b7Fg {
+  color: var(--color-grey-400);
+}
+._2b7Fg {
+  flex: 1;
+  color: var(--color-grey-500);
+}
+h1._3CIA3 {
+  font-size: 1.75rem;
+  line-height: 2rem;
+  font-weight: 600;
+}
+
+h2._3CIA3 {
+  font-size: 1.5rem;
+  line-height: 1.75rem;
+  font-weight: 600;
+}
+
+h3._3CIA3 {
+  font-size: 1.25rem;
+  line-height: 1.5rem;
+  font-weight: 600;
+}
+
+h4._3CIA3 {
+  font-size: 1.25rem;
+  line-height: 1.5rem;
+  font-weight: 400;
+  color: var(--color-grey-400);
+}
+
+h5._3CIA3 {
+  font-size: 1rem;
+  line-height: 1.25rem;
+  font-weight: 400;
+  color: var(--color-grey-400);
+}
+
+._3CIA3 {
+  font-family: "Proxima Nova", sans-serif;
+  color: var(--color-grey-500);
+  margin: 0;
+}
+._1nnj8 {
+  font-size: 0.875rem;
+  line-height: 1.125rem;
+  font-weight: 400;
+}
+._37K6o {
+  font-size: 0.75rem;
+  line-height: 1rem;
+  font-weight: 400;
+}
+._avqxy {
+  font-size: 2.5rem;
+  line-height: 2.75rem;
+  font-weight: 600;
+}
+._2TG6E {
+  font-weight: 600;
+}
+._2hlsn {
+  font-style: italic;
+}
+._1Pjo6 {
+  text-decoration: underline;
+}
+._eDdDI {
+  font-variant-numeric: tabular-nums;
+}
+._2gNwS {
+  text-align: left;
+}
+._ufv1W {
+  text-align: right;
+}
+._2WMN6 {
+  text-align: center;
+}
+._2iH-J {
+  text-align: justify;
+}
 ._h724f {
   line-height: normal;
   padding: 0;
@@ -1603,6 +1564,90 @@ h5._3CIA3 {
   font-weight: 400;
   font-size: 12px;
 }
+._20YOA {
+  padding: 7px;
+  line-height: 22px;
+  border-radius: 4px;
+  font-size: 14px;
+  font-family: "Proxima Nova", sans-serif;
+  color: var(--color-grey-500);
+  box-shadow: none;
+  border: 1px solid var(--color-grey-200);
+  margin: 0;
+  flex: 1;
+  min-width: 90px;
+}
+._20YOA:focus {
+  border: 1px solid var(--color-eggplant-400);
+  box-shadow: 0 0 8px var(--color-eggplant-300);
+  outline: none;
+}
+._20YOA:disabled {
+  background-color: var(--color-grey-100);
+  color: var(--color-grey-400);
+}
+
+._3kUSh {
+  border-color: var(--color-radish-400) !important;
+}
+
+._3IU3Q {
+  border-left: 0 !important;
+  border-top-left-radius: 0 !important;
+  border-bottom-left-radius: 0 !important;
+  color: var(--color-grey-400);
+}
+
+._QXJOD {
+  border-right: 0 !important;
+  border-top-right-radius: 0 !important;
+  border-bottom-right-radius: 0 !important;
+}
+._2Ybjx {
+  position: relative;
+  border-bottom: 1px solid var(--color-grey-200);
+  padding: 16px;
+  word-break: break-word;
+  -webkit-hyphens: auto;
+      -ms-hyphens: auto;
+          hyphens: auto;
+}
+._2Ybjx:first-of-type {
+  border-left: 1px solid var(--color-grey-200);
+}
+._2Ybjx:last-of-type {
+  border-right: 1px solid var(--color-grey-200);
+}
+._5KXHH {
+  padding: 0;
+}
+._2-I0j:not(:last-child) {
+  border-right: 1px solid var(--color-grey-200);
+}
+._D73Vx {
+  background: var(--color-radish-100);
+  color: var(--color-radish-400);
+}
+._3A9-M {
+  height: 100%;
+  display: flex;
+  align-items: center;
+}
+._17Km7 {
+  justify-content: flex-end;
+}
+._2c6KQ {
+  justify-content: space-between;
+}
+._2hIl3 {
+  width: 16px;
+}
+._8Uhyd {
+  margin-left: 4px;
+}
+._3X51R {
+  margin-right: 4px;
+}
 ._ybKOk {
   position: relative;
   display: flex;
@@ -1953,45 +1998,6 @@ h5._3CIA3 {
 ._2F1jP {
   padding: 8px 4px 8px 4px;
 }
-._20YOA {
-  padding: 7px;
-  line-height: 22px;
-  border-radius: 4px;
-  font-size: 14px;
-  font-family: "Proxima Nova", sans-serif;
-  color: var(--color-grey-500);
-  box-shadow: none;
-  border: 1px solid var(--color-grey-200);
-  margin: 0;
-  flex: 1;
-  min-width: 90px;
-}
-._20YOA:focus {
-  border: 1px solid var(--color-eggplant-400);
-  box-shadow: 0 0 8px var(--color-eggplant-300);
-  outline: none;
-}
-._20YOA:disabled {
-  background-color: var(--color-grey-100);
-  color: var(--color-grey-400);
-}
-
-._3kUSh {
-  border-color: var(--color-radish-400) !important;
-}
-
-._3IU3Q {
-  border-left: 0 !important;
-  border-top-left-radius: 0 !important;
-  border-bottom-left-radius: 0 !important;
-  color: var(--color-grey-400);
-}
-
-._QXJOD {
-  border-right: 0 !important;
-  border-top-right-radius: 0 !important;
-  border-bottom-right-radius: 0 !important;
-}
 ._2X-yg {
   width: 272px;
 }
@@ -3440,7 +3446,7 @@ input:disabled + ._1tMq-::after {
 }
 
 @media screen and (max-width: 900px) {
-  ._1Cx9N {
+  ._1Cx9N:not(._WbcaM) {
     justify-content: center;
   }
 }
@@ -3450,6 +3456,11 @@ input:disabled + ._1tMq-::after {
   flex-direction: row;
   justify-content: space-between;
 }
+._2sweG {
+  flex-direction: row-reverse;
+  padding-top: 20px;
+  padding-bottom: 20px;
+}
 ._2jreb {
   display: flex;
   flex-direction: column;
@@ -3466,9 +3477,14 @@ input:disabled + ._1tMq-::after {
   color: var(--color-grey-500);
   font-size: 14px;
 }
+._G2VtA {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
 
 @media screen and (max-width: 900px) {
-  ._eMr1V {
+  ._eMr1V:not(._2sweG) {
     align-items: center;
     text-align: center;
     flex-direction: column-reverse;