@7shifts/sous-chef 3.8.0 → 3.9.0

package/dist/forms/MultiSelectField/MultiSelectField.d.ts

@@ -22,7 +22,9 @@ declare type Props<T> = {
     /** When the user opens the menu, if this prop is `true`, it will scroll the page into to the menu view (if its content falls under a scroll). It is recomended to disable this behaviour when using the `MultiSelectField` inside a modal. */
     menuShouldScrollIntoView?: boolean;
     testId?: string;
+    /** This is to allow disable the seach functionality. Use it just in some edge-cases, for example in touch devices when the user clicks on the field it opens a virtual keyboard to search, sometimes that virtual keyboard taks much space then passing `isSearchable={false}` prevents opening it. */
+    isSearchable?: boolean;
 };
 /** Component to make possible choose from a predefined options. */
-declare const MultiSelectField: <T extends unknown>({ name, id: inputId, value, options, onChange, onBlur, CustomOption: UserCustomOption, label, caption, error, placeholder, noOptionsMessage, disabled, closeOnSelect, menuShouldScrollIntoView, testId }: Props<T>) => JSX.Element;
+declare const MultiSelectField: <T extends unknown>({ name, id: inputId, value, options, onChange, onBlur, CustomOption: UserCustomOption, label, caption, error, placeholder, noOptionsMessage, disabled, closeOnSelect, menuShouldScrollIntoView, testId, isSearchable }: Props<T>) => JSX.Element;
 export default MultiSelectField;

package/dist/forms/SelectField/SelectField.d.ts

@@ -30,6 +30,8 @@ export declare type Props<T> = {
     testId?: string;
     creatableButton?: React.ReactNode;
     onCreate?: (option: string) => void;
+    /** This is to allow disable the seach functionality. Use it just in some edge-cases, for example in touch devices when the user clicks on the field it opens a virtual keyboard to search, sometimes that virtual keyboard taks much space then passing `isSearchable={false}` prevents opening it. */
+    isSearchable?: boolean;
 };
 /** Component to make possible choose from a predefined options. */
 declare const SelectField: <T extends unknown>(props: Props<T>) => JSX.Element;

package/dist/forms/SelectField/useSelectField.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { Props } from './SelectField';
-export declare const useSelectField: <T extends unknown>({ asToolbarFilter, caption, disabled, error, id, isClearable, label, menuShouldScrollIntoView, name, noOptionsMessage, options, onBlur, onChange, placeholder, value, defaultValue, CustomOption: UserCustomOption, SelectedOptionPrefix, testId, creatableButton, onCreate }: Props<T>) => {
+export declare const useSelectField: <T extends unknown>({ asToolbarFilter, caption, disabled, error, id, isClearable, label, menuShouldScrollIntoView, name, noOptionsMessage, options, onBlur, onChange, placeholder, value, defaultValue, CustomOption: UserCustomOption, SelectedOptionPrefix, testId, creatableButton, onCreate, isSearchable }: Props<T>) => {
     selectProps: Pick<import("react-select").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>>, import("react").ReactText> & import("react-select/src/stateManager").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>> & import("react-select").Props<import("react-select").OptionTypeBase, boolean, import("react-select").GroupTypeBase<any>>;
     fieldProps: {
         caption: import("react").ReactNode;

package/dist/index.css

@@ -840,7 +840,10 @@ Just for future references:
   position: relative;
   border-bottom: 1px solid var(--color-grey-200);
   padding: 16px;
-  word-break: break-all;
+  word-break: break-word;
+  -webkit-hyphens: auto;
+      -ms-hyphens: auto;
+          hyphens: auto;
 }
 ._2Ybjx:first-of-type {
   border-left: 1px solid var(--color-grey-200);

package/dist/index.js

@@ -7401,7 +7401,9 @@ var MultiSelectField = function MultiSelectField(_ref) {
       closeOnSelect = _ref$closeOnSelect === void 0 ? false : _ref$closeOnSelect,
       _ref$menuShouldScroll = _ref.menuShouldScrollIntoView,
       menuShouldScrollIntoView = _ref$menuShouldScroll === void 0 ? true : _ref$menuShouldScroll,
-      testId = _ref.testId;
+      testId = _ref.testId,
+      _ref$isSearchable = _ref.isSearchable,
+      isSearchable = _ref$isSearchable === void 0 ? true : _ref$isSearchable;
   var controllers = useMultiSelectFieldControllers({
     name: name,
     id: inputId,
@@ -7454,7 +7456,8 @@ var MultiSelectField = function MultiSelectField(_ref) {
       }
 
       return !isScrollingTheSelectMenu(e.target);
-    }
+    },
+    isSearchable: isSearchable
   }));
 };
 
@@ -7615,7 +7618,9 @@ var useSelectField = function useSelectField(_ref) {
       SelectedOptionPrefix = _ref.SelectedOptionPrefix,
       testId = _ref.testId,
       creatableButton = _ref.creatableButton,
-      onCreate = _ref.onCreate;
+      onCreate = _ref.onCreate,
+      _ref$isSearchable = _ref.isSearchable,
+      isSearchable = _ref$isSearchable === void 0 ? true : _ref$isSearchable;
 
   var _useState = React.useState(false),
       isMenuInputFocus = _useState[0],
@@ -7678,7 +7683,8 @@ var useSelectField = function useSelectField(_ref) {
     }),
     value: controllers.value,
     defaultValue: defaultValue,
-    menuIsOpen: isMenuInputFocus || undefined
+    menuIsOpen: isMenuInputFocus || undefined,
+    isSearchable: isSearchable
   };
   var fieldProps = {
     caption: caption,