@economic/taco 1.15.0 → 1.16.0

package/dist/esm/packages/taco/src/components/Provider/Provider.js

@@ -1,117 +1,17 @@
-import { useMemo, createElement, useContext, createContext } from 'react';
+import { createElement } from 'react';
 import { Provider as Provider$1 } from '@radix-ui/react-tooltip';
+import { LocalizationProvider } from './Localization.js';
 import { ToastProvider } from '../Toast/Toaster.js';
 
-const defaultLocalisationTexts = {
-  calendar: {
-    months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
-    weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
-    actions: {
-      previousMonth: 'Previous month',
-      nextMonth: 'Next month',
-      previousYear: 'Previous year',
-      nextYear: 'Next year',
-      today: 'Today'
-    }
-  },
-  combobox: {
-    tooltip: 'Search in list'
-  },
-  datepicker: {
-    calendar: 'Calendar',
-    clear: 'Clear',
-    expand: 'Show calendar',
-    shortcuts: 'Shortcuts'
-  },
-  hanger: {
-    close: 'Close'
-  },
-  listbox: {
-    loading: 'Loading results...',
-    empty: 'No results found',
-    allOption: 'All'
-  },
-  dialog: {
-    close: 'Close',
-    drag: 'Drag'
-  },
-  pagination: {
-    label: 'Pagination',
-    pageSize: 'Items per page',
-    showingXofYofTotal: 'Showing [X] - [Y] of [total]',
-    actions: {
-      firstPage: 'Goto first page',
-      firstPageWithShortcut: 'Goto first page (Home)',
-      previousPage: 'Goto previous page',
-      previousPageWithShortcut: 'Goto previous page (Page Up)',
-      nextPage: 'Goto next page',
-      nextPageWithShortcut: 'Goto next page (Page Down)',
-      lastPage: 'Goto last page',
-      lastPageWithShortcut: 'Goto last page (End)',
-      pageX: 'Goto page [X]'
-    }
-  },
-  table: {
-    actions: 'Other actions',
-    edit: 'Edit (e)',
-    copy: 'Copy (c)',
-    del: 'Delete (del)',
-    newSubRow: 'New row (shift + n)',
-    loading: 'Loading...'
-  },
-  select: {
-    allOptionsSelected: 'All'
-  },
-  select2: {
-    allSelect: 'Select all',
-    allDeselect: 'Deselect all',
-    cancel: 'Cancel',
-    chooseColor: 'Pick a color',
-    create: 'Create',
-    delete: 'Delete',
-    save: 'Save',
-    search: 'Search...',
-    searchOrCreate: 'Search or create...'
-  },
-  toasts: {
-    dismiss: 'Dismiss'
-  },
-  tour: {
-    back: 'Back',
-    close: 'Close',
-    skip: 'Close and complete',
-    last: 'Done',
-    next: 'Next',
-    open: 'Open'
-  },
-  searchInput: {
-    inputLabel: 'Search...'
-  }
-};
-const defaultLocalizationContext = {
-  locale: 'en-GB',
-  texts: defaultLocalisationTexts,
-  formatting: {
-    date: 'dd.mm.yy'
-  }
-};
-const Context = /*#__PURE__*/createContext({
-  localization: defaultLocalizationContext
-});
 const Provider = props => {
   const {
     children,
-    localization = defaultLocalizationContext
-  } = props;
-  const value = useMemo(() => ({
     localization
-  }), [localization]);
-  return /*#__PURE__*/createElement(Context.Provider, {
-    value: value
+  } = props;
+  return /*#__PURE__*/createElement(LocalizationProvider, {
+    localization: localization
   }, /*#__PURE__*/createElement(Provider$1, null, /*#__PURE__*/createElement(ToastProvider, null, children)));
 };
-const useTaco = () => useContext(Context);
-const useLocalization = () => useTaco().localization;
 
-export { Provider, defaultLocalisationTexts, useLocalization, useTaco };
+export { Provider };
 //# sourceMappingURL=Provider.js.map

package/dist/esm/packages/taco/src/components/Provider/Provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sources":["../../../../../../../src/components/Provider/Provider.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as Tooltip from '@radix-ui/react-tooltip';\nimport { Locale } from '../../types';\nimport { CalendarTexts } from '../Calendar/Calendar';\nimport { ComboboxTexts } from '../Combobox/Combobox';\nimport { DialogTexts } from '../Dialog/Dialog';\nimport { PaginationTexts } from '../Pagination/Pagination';\nimport { ListboxTexts } from '../Listbox/Listbox';\nimport { ToastsTexts } from '../Toast/Toast';\nimport { DatepickerTexts } from '../Datepicker/Datepicker';\nimport { HangerTexts } from '../Hanger/Hanger';\nimport { SelectTexts } from '../Select/Select';\nimport { TourTexts } from '../Tour/Tour';\nimport { TableTexts } from '../Table/Table';\nimport { SearchInputTexts } from '../SearchInput/SearchInput';\nimport { ToastProvider } from '../Toast/Toaster';\nimport { Select2Texts } from '../Select2/Select2';\n\nexport type LocalizationTexts = {\n    /** Localized texts and aria-labels for [Calendar](component:calendar) component */\n    calendar: CalendarTexts;\n    /** Localized texts and aria-labels for [Combobox](component:combobox) component */\n    combobox: ComboboxTexts;\n    /** Localized texts and aria-labels for [DatePicker](component:datepicker) component */\n    datepicker: DatepickerTexts;\n    /** Localized texts and aria-labels for [Hanger](component:hanger) component */\n    hanger: HangerTexts;\n    /** Localized texts and aria-labels for [Listbox](component:listbox) component */\n    listbox: ListboxTexts;\n    /** Localized texts and aria-labels for [Dialog](component:dialog) component */\n    dialog: DialogTexts;\n    /** Localized texts and aria-labels for [Pagination](component:pagination) component */\n    pagination: PaginationTexts;\n    /** Localized texts and aria-labels for [Table](component:table) component */\n    table: TableTexts;\n    /** Localized texts and aria-labels for [Select](component:select) component */\n    select: SelectTexts;\n    /** Localized texts and aria-labels for [Select2](component:select2) component */\n    select2: Select2Texts;\n    /** Localized texts and aria-labels for [Toast](component:toast) component */\n    toasts: ToastsTexts;\n    /** Localized texts and aria-labels for [Tour](component:tour) component */\n    tour: TourTexts;\n    /** Localized texts and aria-labels for [SearchInput](component:searchinput) component */\n    searchInput: SearchInputTexts;\n};\n\nexport type Localization = {\n    /**\n     * Provide the language code used in application.\n     * Default value is `en-GB`\n     */\n    locale: Locale;\n    /** Provide the texts and aria-labels for components used within the provider */\n    texts: LocalizationTexts;\n    /** Provide the formatting */\n    formatting: {\n        /** Default value is `dd.mm.yy` */\n        date: string;\n    };\n};\nexport type Taco = {\n    /** Define localized texts and formatted data in your application */\n    localization: Localization;\n};\n\nexport const defaultLocalisationTexts = {\n    calendar: {\n        months: [\n            'January',\n            'February',\n            'March',\n            'April',\n            'May',\n            'June',\n            'July',\n            'August',\n            'September',\n            'October',\n            'November',\n            'December',\n        ],\n        weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],\n        actions: {\n            previousMonth: 'Previous month',\n            nextMonth: 'Next month',\n            previousYear: 'Previous year',\n            nextYear: 'Next year',\n            today: 'Today',\n        },\n    },\n    combobox: {\n        tooltip: 'Search in list',\n    },\n    datepicker: {\n        calendar: 'Calendar',\n        clear: 'Clear',\n        expand: 'Show calendar',\n        shortcuts: 'Shortcuts',\n    },\n    hanger: {\n        close: 'Close',\n    },\n    listbox: {\n        loading: 'Loading results...',\n        empty: 'No results found',\n        allOption: 'All',\n    },\n    dialog: {\n        close: 'Close',\n        drag: 'Drag',\n    },\n    pagination: {\n        label: 'Pagination',\n        pageSize: 'Items per page',\n        showingXofYofTotal: 'Showing [X] - [Y] of [total]',\n        actions: {\n            firstPage: 'Goto first page',\n            firstPageWithShortcut: 'Goto first page (Home)',\n            previousPage: 'Goto previous page',\n            previousPageWithShortcut: 'Goto previous page (Page Up)',\n            nextPage: 'Goto next page',\n            nextPageWithShortcut: 'Goto next page (Page Down)',\n            lastPage: 'Goto last page',\n            lastPageWithShortcut: 'Goto last page (End)',\n            pageX: 'Goto page [X]',\n        },\n    },\n    table: {\n        actions: 'Other actions',\n        edit: 'Edit (e)',\n        copy: 'Copy (c)',\n        del: 'Delete (del)',\n        newSubRow: 'New row (shift + n)',\n        loading: 'Loading...',\n    },\n    select: {\n        allOptionsSelected: 'All',\n    },\n    select2: {\n        allSelect: 'Select all',\n        allDeselect: 'Deselect all',\n        cancel: 'Cancel',\n        chooseColor: 'Pick a color',\n        create: 'Create',\n        delete: 'Delete',\n        save: 'Save',\n        search: 'Search...',\n        searchOrCreate: 'Search or create...',\n    },\n    toasts: {\n        dismiss: 'Dismiss',\n    },\n    tour: {\n        back: 'Back',\n        close: 'Close',\n        skip: 'Close and complete',\n        last: 'Done',\n        next: 'Next',\n        open: 'Open',\n    },\n    searchInput: {\n        inputLabel: 'Search...',\n    },\n};\n\nconst defaultLocalizationContext: Localization = {\n    locale: 'en-GB',\n    texts: defaultLocalisationTexts,\n    formatting: {\n        date: 'dd.mm.yy',\n    },\n};\n\nconst Context = React.createContext<Taco>({\n    localization: defaultLocalizationContext,\n});\n\nexport type ProviderProps = {\n    /** Content would be your application */\n    children?: any;\n    /** Define localized texts and formatted data in your application */\n    localization?: Localization;\n};\n\nexport const Provider = (props: ProviderProps): JSX.Element => {\n    const { children, localization = defaultLocalizationContext } = props;\n    const value = React.useMemo(() => ({ localization }), [localization]);\n\n    return (\n        <Context.Provider value={value}>\n            <Tooltip.Provider>\n                <ToastProvider>{children}</ToastProvider>\n            </Tooltip.Provider>\n        </Context.Provider>\n    );\n};\n\nexport const useTaco = (): Taco => React.useContext(Context);\nexport const useLocalization = (): Localization => useTaco().localization;\n"],"names":["defaultLocalisationTexts","calendar","months","weekdaysShort","actions","previousMonth","nextMonth","previousYear","nextYear","today","combobox","tooltip","datepicker","clear","expand","shortcuts","hanger","close","listbox","loading","empty","allOption","dialog","drag","pagination","label","pageSize","showingXofYofTotal","firstPage","firstPageWithShortcut","previousPage","previousPageWithShortcut","nextPage","nextPageWithShortcut","lastPage","lastPageWithShortcut","pageX","table","edit","copy","del","newSubRow","select","allOptionsSelected","select2","allSelect","allDeselect","cancel","chooseColor","create","delete","save","search","searchOrCreate","toasts","dismiss","tour","back","skip","last","next","open","searchInput","inputLabel","defaultLocalizationContext","locale","texts","formatting","date","Context","React","localization","Provider","props","children","value","Tooltip","ToastProvider","useTaco","useLocalization"],"mappings":"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"}
+{"version":3,"file":"Provider.js","sources":["../../../../../../../src/components/Provider/Provider.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as Tooltip from '@radix-ui/react-tooltip';\nimport { ToastProvider } from '../Toast/Toaster';\nimport { Localization, LocalizationProvider } from './Localization';\n\nexport type ProviderProps = {\n    /** Content would be your application */\n    children?: any;\n    /** Define localized texts and formatted data in your application */\n    localization?: Localization;\n};\n\nexport const Provider = (props: ProviderProps): JSX.Element => {\n    const { children, localization } = props;\n\n    return (\n        <LocalizationProvider localization={localization}>\n            <Tooltip.Provider>\n                <ToastProvider>{children}</ToastProvider>\n            </Tooltip.Provider>\n        </LocalizationProvider>\n    );\n};\n"],"names":["Provider","props","children","localization","React","LocalizationProvider","Tooltip","ToastProvider"],"mappings":";;;;;MAYaA,QAAQ,GAAIC,KAAoB;EACzC,MAAM;IAAEC,QAAQ;IAAEC;GAAc,GAAGF,KAAK;EAExC,oBACIG,cAACC,oBAAoB;IAACF,YAAY,EAAEA;kBAChCC,cAACE,UAAgB,qBACbF,cAACG,aAAa,QAAEL,QAAQ,CAAiB,CAC1B,CACA;AAE/B;;;;"}

package/dist/esm/packages/taco/src/components/SearchInput/SearchInput.js

@@ -1,59 +1,7 @@
 import { forwardRef, createElement } from 'react';
-import '../../utils/mergeRefs.js';
-import '../Backdrop/Backdrop.js';
-import '../AlertDialog/AlertDialog.js';
-import '../Icon/components/index.js';
-import '../Icon/Icon.js';
-import '../Accordion/Accordion.js';
-import '../VisuallyHidden/VisuallyHidden.js';
-import '../Badge/Badge.js';
-import '../Tooltip/Tooltip.js';
 import { IconButton } from '../IconButton/IconButton.js';
-import '../Banner/Banner.js';
-import '../Button/Button.js';
-import '../Spinner/Spinner.js';
-import '../Toast/Toaster.js';
-import { useLocalization } from '../Provider/Provider.js';
-import '../Calendar/Calendar.js';
-import '../Card/Card.js';
-import '../Checkbox/Checkbox.js';
-import '../../hooks/useMergedRef.js';
+import { useLocalization } from '../Provider/Localization.js';
 import { Input } from '../Input/Input.js';
-import '../../utils/hooks/useListKeyboardNavigation.js';
-import '../../utils/hooks/useListScrollTo.js';
-import '../../hooks/useBoundingClientRectListener.js';
-import '../Combobox/Combobox.js';
-import '../../utils/date.js';
-import '../Popover/Popover.js';
-import '../Datepicker/Datepicker.js';
-import '../Dialog/Dialog.js';
-import '../Field/Field.js';
-import '../Form/Form.js';
-import '../Group/Group.js';
-import '../Hanger/Hanger.js';
-import '../HoverCard/HoverCard.js';
-import '../Listbox/Listbox.js';
-import '../RadioGroup/RadioGroup.js';
-import '../Menu/Menu.js';
-import '../Treeview/Treeview.js';
-import '../../utils/hooks/useDropTarget.js';
-import '../Navigation/Navigation.js';
-import '../Select/Select.js';
-import '../Pagination/usePagination.js';
-import '../Pagination/Pagination.js';
-import '../Progress/Progress.js';
-import '../Tag/Tag.js';
-import '../Select2/Select2.js';
-import '../Table/components/Table.js';
-import '../Table/components/PaginatedTable.js';
-import '../Table/components/WindowedTable.js';
-import '../Table/util/rowIndexPath.js';
-import '../Table/hooks/useRowCreation.js';
-import '../Tabs/Tabs.js';
-import '../Textarea/Textarea.js';
-import '../Switch/Switch.js';
-import '../Tour/Tour.js';
-import '../../utils/hooks/useOnClickOutside.js';
 
 const SearchInput = /*#__PURE__*/forwardRef(function SearchInput({
   onSearch,
@@ -79,6 +27,7 @@ const SearchInput = /*#__PURE__*/forwardRef(function SearchInput({
     "aria-label": texts.searchInput.inputLabel
   }, props, {
     button: /*#__PURE__*/createElement(IconButton, {
+      "aria-label": texts.searchInput.buttonLabel,
       icon: "search",
       className: "!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent",
       disabled: props.disabled,

package/dist/esm/packages/taco/src/components/SearchInput/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sources":["../../../../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\n\nexport type SearchInputTexts = {\n    /**\n     * aria-label text for input\n     */\n    inputLabel: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\n    /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\n    onSearch?: (value: string | number | readonly string[] | undefined) => void;\n};\n\nexport const SearchInput = React.forwardRef(function SearchInput(\n    { onSearch, ...props }: SearchInputProps,\n    ref: React.Ref<HTMLInputElement>\n) {\n    const { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        if (!props.disabled) {\n            onSearch?.(props.value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        const isEnterKeyPressed = event.key === 'Enter';\n\n        if (isEnterKeyPressed) {\n            handleClick();\n        }\n\n        props.onKeyDown?.(event);\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.inputLabel}\n            {...props}\n            button={\n                <IconButton\n                    icon=\"search\"\n                    className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\n                    disabled={props.disabled}\n                    onClick={handleClick}\n                />\n            }\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","onSearch","props","ref","texts","useLocalization","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","key","onKeyDown","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAeaA,WAAW,gBAAGC,UAAgB,CAAC,SAASD,WAAW,CAC5D;EAAEE,QAAQ;EAAE,GAAGC;CAAyB,EACxCC,GAAgC;EAEhC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,WAAW,GAAG;IAChB,IAAI,CAACJ,KAAK,CAACK,QAAQ,EAAE;MACjBN,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGC,KAAK,CAACM,KAAK,CAAC;;GAE9B;EAED,MAAMC,aAAa,GAAIC,KAA4C;;IAC/D,MAAMC,iBAAiB,GAAGD,KAAK,CAACE,GAAG,KAAK,OAAO;IAE/C,IAAID,iBAAiB,EAAE;MACnBL,WAAW,EAAE;;IAGjB,oBAAAJ,KAAK,CAACW,SAAS,qDAAf,sBAAAX,KAAK,EAAaQ,KAAK,CAAC;GAC3B;EAED,oBACIV,cAACc,KAAK;kBACUV,KAAK,CAACW,WAAW,CAACC;KAC1Bd,KAAK;IACTe,MAAM,eACFjB,cAACkB,UAAU;MACPC,IAAI,EAAC,QAAQ;MACbC,SAAS,EAAC,yIAAyI;MACnJb,QAAQ,EAAEL,KAAK,CAACK,QAAQ;MACxBc,OAAO,EAAEf;MACX;IAENO,SAAS,EAAEJ,aAAa;IACxBN,GAAG,EAAEA,GAAG;IACRmB,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../../../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Input, InputProps } from '../Input/Input';\nimport { useLocalization } from '../Provider/Localization';\nimport { IconButton } from '../IconButton/IconButton';\n\nexport type SearchInputTexts = {\n    /**\n     * aria-label text for input\n     */\n    inputLabel: string;\n    /**\n     * aria-label text for the search button\n     */\n    buttonLabel: string;\n};\n\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\n    /** Current input value will be passed to the method. In order to get the value, the component must be controlled otherwise value will always be undefined */\n    onSearch?: (value: string | number | readonly string[] | undefined) => void;\n};\n\nexport const SearchInput = React.forwardRef(function SearchInput(\n    { onSearch, ...props }: SearchInputProps,\n    ref: React.Ref<HTMLInputElement>\n) {\n    const { texts } = useLocalization();\n\n    const handleClick = (): void => {\n        if (!props.disabled) {\n            onSearch?.(props.value);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\n        const isEnterKeyPressed = event.key === 'Enter';\n\n        if (isEnterKeyPressed) {\n            handleClick();\n        }\n\n        props.onKeyDown?.(event);\n    };\n\n    return (\n        <Input\n            aria-label={texts.searchInput.inputLabel}\n            {...props}\n            button={\n                <IconButton\n                    aria-label={texts.searchInput.buttonLabel}\n                    icon=\"search\"\n                    className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\n                    disabled={props.disabled}\n                    onClick={handleClick}\n                />\n            }\n            onKeyDown={handleKeyDown}\n            ref={ref}\n            type=\"search\"\n        />\n    );\n});\n"],"names":["SearchInput","React","onSearch","props","ref","texts","useLocalization","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","key","onKeyDown","Input","searchInput","inputLabel","button","IconButton","buttonLabel","icon","className","onClick","type"],"mappings":";;;;;MAqBaA,WAAW,gBAAGC,UAAgB,CAAC,SAASD,WAAW,CAC5D;EAAEE,QAAQ;EAAE,GAAGC;CAAyB,EACxCC,GAAgC;EAEhC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,WAAW,GAAG;IAChB,IAAI,CAACJ,KAAK,CAACK,QAAQ,EAAE;MACjBN,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGC,KAAK,CAACM,KAAK,CAAC;;GAE9B;EAED,MAAMC,aAAa,GAAIC,KAA4C;;IAC/D,MAAMC,iBAAiB,GAAGD,KAAK,CAACE,GAAG,KAAK,OAAO;IAE/C,IAAID,iBAAiB,EAAE;MACnBL,WAAW,EAAE;;IAGjB,oBAAAJ,KAAK,CAACW,SAAS,qDAAf,sBAAAX,KAAK,EAAaQ,KAAK,CAAC;GAC3B;EAED,oBACIV,cAACc,KAAK;kBACUV,KAAK,CAACW,WAAW,CAACC;KAC1Bd,KAAK;IACTe,MAAM,eACFjB,cAACkB,UAAU;oBACKd,KAAK,CAACW,WAAW,CAACI,WAAW;MACzCC,IAAI,EAAC,QAAQ;MACbC,SAAS,EAAC,yIAAyI;MACnJd,QAAQ,EAAEL,KAAK,CAACK,QAAQ;MACxBe,OAAO,EAAEhB;MACX;IAENO,SAAS,EAAEJ,aAAa;IACxBN,GAAG,EAAEA,GAAG;IACRoB,IAAI,EAAC;KACP;AAEV,CAAC;;;;"}

package/dist/esm/packages/taco/src/components/Select/useSelect.js

@@ -1,7 +1,7 @@
 import { useState, useMemo, useRef, useEffect, createElement, Fragment, cloneElement } from 'react';
 import cn from 'classnames';
+import { useLocalization } from '../Provider/Localization.js';
 import { v4 } from 'uuid';
-import { useLocalization } from '../Provider/Provider.js';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { createCustomEvent } from '../../utils/input.js';
 import { useFlattenedData, findByValue, setInputValueByRef, sanitizeItem } from '../Listbox/util.js';

package/dist/esm/packages/taco/src/components/Select/useSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSelect.js","sources":["../../../../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { useLocalization } from '../Provider/Provider';\nimport { SelectProps } from './Select';\nimport { ListboxProps } from '../Listbox/Listbox';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\nimport { createCustomEvent } from '../../utils/input';\n\ntype InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\ntype InternalListboxProps = ListboxProps & { ref: React.ForwardedRef<HTMLInputElement> };\ntype InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & { ref: React.ForwardedRef<HTMLInputElement> };\n\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\n    button: InternalButtonProps;\n    listbox: InternalListboxProps;\n    input: InternalInputProps;\n    popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;\n    text: string | JSX.Element;\n    more?: number;\n};\n\nexport const useSelect = (\n    {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data = [],\n        defaultValue,\n        disabled,\n        emptyValue,\n        id: nativeId,\n        multiselect,\n        onBlur,\n        onClick,\n        onChange,\n        readOnly,\n        value,\n        ...otherProps\n    }: SelectProps,\n    ref: React.Ref<HTMLInputElement>\n): useSelect => {\n    const { texts } = useLocalization();\n    const flattenedData = useFlattenedData(data);\n    const listboxInputRef = useMergedRef<HTMLInputElement>(ref);\n    const [open, setOpen] = React.useState(false);\n    const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const buttonId = `${id}-button`;\n    // support 'escape' resetting to the value that was set when the listbox opened\n    const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\n\n    React.useEffect(() => {\n        setLastValue(value);\n    }, [open]);\n\n    React.useEffect(() => {\n        if (value === undefined) {\n            if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {\n                setInputValueByRef(inputRef.current, defaultValue);\n            } else {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        } else {\n            if (!multiselect && !findByValue(flattenedData, value)) {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        }\n    }, []);\n\n    // event handlers\n    const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\n        if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n            event.preventDefault();\n            setOpen(true);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        switch (event.key) {\n            case 'Escape': {\n                event.preventDefault();\n                if (lastValue !== undefined) {\n                    setInputValueByRef(listboxInputRef.current, lastValue);\n                }\n\n                setOpen(false);\n                break;\n            }\n\n            case 'Tab':\n            case 'Enter': {\n                if (event.key !== 'Tab') {\n                    event.preventDefault();\n                }\n                setOpen(false);\n                break;\n            }\n\n            default:\n        }\n\n        if (otherProps.onKeyDown) {\n            otherProps.onKeyDown(event);\n        }\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        event.preventDefault();\n        if (!multiselect) {\n            setOpen(false);\n            if (onBlur) {\n                onBlur(createCustomEvent('blur'));\n            }\n        }\n    };\n\n    let text: string | JSX.Element = '';\n    let more = 0;\n\n    if (value !== undefined) {\n        if (multiselect) {\n            const selectedValues = value?.toString().split(',') || [];\n\n            if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {\n                text = texts.select.allOptionsSelected;\n            } else {\n                text = findByValue(flattenedData, selectedValues[0])?.text ?? '';\n                more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\n            }\n        } else {\n            const item = findByValue(flattenedData, value);\n\n            if (item) {\n                text = item.icon ? (\n                    <>\n                        {React.cloneElement(item.icon, {\n                            className: cn(item.icon.props.className, 'mr-1 -mt-px'),\n                        })}\n                        {item.text}\n                    </>\n                ) : (\n                    item.text\n                );\n            }\n        }\n    }\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        if (onChange) {\n            const item = findByValue(flattenedData, event.target.value);\n            (event as any).detail = sanitizeItem(item);\n\n            const indexes = item?.path?.split('.') ?? [];\n\n            if (indexes.length > 1) {\n                // we don't want to map the current item\n                indexes.pop();\n                // we need to rebuild the path as we map\n                let lastPath: string;\n\n                (event as any).detail.parents = indexes.map(i => {\n                    lastPath = lastPath ? [lastPath, i].join('.') : i;\n                    return sanitizeItem(flattenedData.find(i => i.path === lastPath));\n                });\n            }\n\n            onChange(event);\n        }\n    };\n\n    const button: InternalButtonProps = {\n        'aria-haspopup': 'listbox' as const,\n        'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\n        'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\n        disabled: disabled || readOnly,\n        id: buttonId,\n        onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\n        type: 'button',\n    };\n\n    const listbox: InternalListboxProps = {\n        ...otherProps,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        emptyValue,\n        onBlur,\n        onClick: handleListboxClick,\n        onChange: event => {\n            setInputValueByRef(inputRef.current, event.target.value);\n        },\n        onKeyDown: handleListboxKeyDown,\n        ref: listboxInputRef,\n        value,\n    };\n\n    const input: InternalInputProps = {\n        onChange: handleInputChange,\n        ref: inputRef,\n        value: String(value ?? ''),\n    };\n\n    return {\n        button,\n        listbox,\n        input,\n        popover: {\n            open,\n            onOpenChange: open => {\n                if (!open && onBlur) {\n                    onBlur(createCustomEvent('blur'));\n                }\n                setOpen(open);\n            },\n        },\n        text,\n        more,\n    };\n};\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onBlur","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","flattenedData","useFlattenedData","listboxInputRef","useMergedRef","open","setOpen","React","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","key","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","createCustomEvent","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","String","popover","onOpenChange"],"mappings":";;;;;;;;MAyBaA,SAAS,GAAG,CACrB;EACI,YAAY,EAAEC,SAAS;EACvB,iBAAiB,EAAEC,cAAc;EACjCC,IAAI,GAAG,EAAE;EACTC,YAAY;EACZC,QAAQ;EACRC,UAAU;EACVC,EAAE,EAAEC,QAAQ;EACZC,WAAW;EACXC,MAAM;EACNC,OAAO;EACPC,QAAQ;EACRC,QAAQ;EACRC,KAAK;EACL,GAAGC;CACO,EACdC,GAAgC;EAEhC,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAMC,aAAa,GAAGC,gBAAgB,CAACjB,IAAI,CAAC;EAC5C,MAAMkB,eAAe,GAAGC,YAAY,CAAmBN,GAAG,CAAC;EAC3D,MAAM,CAACO,IAAI,EAAEC,OAAO,CAAC,GAAGC,QAAc,CAAC,KAAK,CAAC;EAC7C,MAAMlB,EAAE,GAAGkB,OAAa,CAAC,MAAMjB,QAAQ,cAAckB,EAAI,IAAI,EAAE,CAAClB,QAAQ,CAAC,CAAC;EAC1E,MAAMmB,QAAQ,GAAGF,MAAY,CAAmB,IAAI,CAAC;EACrD,MAAMG,QAAQ,MAAMrB,WAAW;;EAE/B,MAAM,CAACsB,SAAS,EAAEC,YAAY,CAAC,GAAGL,QAAc,CAAsCX,KAAK,CAAC;EAE5FW,SAAe,CAAC;IACZK,YAAY,CAAChB,KAAK,CAAC;GACtB,EAAE,CAACS,IAAI,CAAC,CAAC;EAEVE,SAAe,CAAC;IACZ,IAAIX,KAAK,KAAKiB,SAAS,EAAE;MACrB,IAAI3B,YAAY,KAAK2B,SAAS,IAAIC,WAAW,CAACb,aAAa,EAAEf,YAAY,CAAC,EAAE;QACxE6B,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE9B,YAAY,CAAC;OACrD,MAAM;QACH,IAAIE,UAAU,KAAKyB,SAAS,EAAE;UAC1BE,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE5B,UAAU,CAAC;SACnD,MAAM,IAAIH,IAAI,CAACgC,MAAM,GAAG,CAAC,EAAE;UACxBF,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE/B,IAAI,CAAC,CAAC,CAAC,CAACW,KAAK,CAAC;;;KAG9D,MAAM;MACH,IAAI,CAACL,WAAW,IAAI,CAACuB,WAAW,CAACb,aAAa,EAAEL,KAAK,CAAC,EAAE;QACpD,IAAIR,UAAU,KAAKyB,SAAS,EAAE;UAC1BE,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE5B,UAAU,CAAC;SACnD,MAAM,IAAIH,IAAI,CAACgC,MAAM,GAAG,CAAC,EAAE;UACxBF,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAE/B,IAAI,CAAC,CAAC,CAAC,CAACW,KAAK,CAAC;;;;GAIlE,EAAE,EAAE,CAAC;;EAGN,MAAMsB,mBAAmB,GAAIC,KAA6C;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,SAAS,IAAID,KAAK,CAACC,GAAG,KAAK,WAAW,EAAE;MACtDD,KAAK,CAACE,cAAc,EAAE;MACtBf,OAAO,CAAC,IAAI,CAAC;;GAEpB;EAED,MAAMgB,oBAAoB,GAAIH,KAAuC;IACjE,QAAQA,KAAK,CAACC,GAAG;MACb,KAAK,QAAQ;QAAE;UACXD,KAAK,CAACE,cAAc,EAAE;UACtB,IAAIV,SAAS,KAAKE,SAAS,EAAE;YACzBE,kBAAkB,CAACZ,eAAe,CAACa,OAAO,EAAEL,SAAS,CAAC;;UAG1DL,OAAO,CAAC,KAAK,CAAC;UACd;;MAGJ,KAAK,KAAK;MACV,KAAK,OAAO;QAAE;UACV,IAAIa,KAAK,CAACC,GAAG,KAAK,KAAK,EAAE;YACrBD,KAAK,CAACE,cAAc,EAAE;;UAE1Bf,OAAO,CAAC,KAAK,CAAC;UACd;;;IAMR,IAAIT,UAAU,CAAC0B,SAAS,EAAE;MACtB1B,UAAU,CAAC0B,SAAS,CAACJ,KAAK,CAAC;;GAElC;EAED,MAAMK,kBAAkB,GAAIL,KAAsC;IAC9DA,KAAK,CAACE,cAAc,EAAE;IACtB,IAAI,CAAC9B,WAAW,EAAE;MACde,OAAO,CAAC,KAAK,CAAC;MACd,IAAId,MAAM,EAAE;QACRA,MAAM,CAACiC,iBAAiB,CAAC,MAAM,CAAC,CAAC;;;GAG5C;EAED,IAAIC,IAAI,GAAyB,EAAE;EACnC,IAAIC,IAAI,GAAG,CAAC;EAEZ,IAAI/B,KAAK,KAAKiB,SAAS,EAAE;IACrB,IAAItB,WAAW,EAAE;MACb,MAAMqC,cAAc,GAAG,CAAAhC,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEiC,QAAQ,EAAE,CAACC,KAAK,CAAC,GAAG,CAAC,KAAI,EAAE;MAEzD,IAAIF,cAAc,CAACX,MAAM,KAAKhB,aAAa,CAAC8B,MAAM,CAACC,IAAI,IAAI,CAACA,IAAI,CAAC7C,QAAQ,CAAC,CAAC8B,MAAM,EAAE;QAC/ES,IAAI,GAAG3B,KAAK,CAACkC,MAAM,CAACC,kBAAkB;OACzC,MAAM;QAAA;QACHR,IAAI,wCAAGZ,WAAW,CAACb,aAAa,EAAE2B,cAAc,CAAC,CAAC,CAAC,CAAC,iDAA7C,aAA+CF,IAAI,iEAAI,EAAE;QAChEC,IAAI,GAAGC,cAAc,CAACX,MAAM,GAAG,CAAC,GAAGW,cAAc,CAACX,MAAM,GAAG,CAAC,GAAG,CAAC;;KAEvE,MAAM;MACH,MAAMe,IAAI,GAAGlB,WAAW,CAACb,aAAa,EAAEL,KAAK,CAAC;MAE9C,IAAIoC,IAAI,EAAE;QACNN,IAAI,GAAGM,IAAI,CAACG,IAAI,gBACZ5B,2CACKA,YAAkB,CAACyB,IAAI,CAACG,IAAI,EAAE;UAC3BC,SAAS,EAAEC,EAAE,CAACL,IAAI,CAACG,IAAI,CAACG,KAAK,CAACF,SAAS,EAAE,aAAa;SACzD,CAAC,EACDJ,IAAI,CAACN,IAAI,CACX,GAEHM,IAAI,CAACN,IACR;;;;EAKb,MAAMa,iBAAiB,GAAIpB,KAA0C;IACjEA,KAAK,CAACqB,OAAO,EAAE;IAEf,IAAI9C,QAAQ,EAAE;MAAA;MACV,MAAMsC,IAAI,GAAGlB,WAAW,CAACb,aAAa,EAAEkB,KAAK,CAACsB,MAAM,CAAC7C,KAAK,CAAC;MAC1DuB,KAAa,CAACuB,MAAM,GAAGC,YAAY,CAACX,IAAI,CAAC;MAE1C,MAAMY,OAAO,uBAAGZ,IAAI,aAAJA,IAAI,qCAAJA,IAAI,CAAEa,IAAI,+CAAV,WAAYf,KAAK,CAAC,GAAG,CAAC,+DAAI,EAAE;MAE5C,IAAIc,OAAO,CAAC3B,MAAM,GAAG,CAAC,EAAE;;QAEpB2B,OAAO,CAACE,GAAG,EAAE;;QAEb,IAAIC,QAAgB;QAEnB5B,KAAa,CAACuB,MAAM,CAACM,OAAO,GAAGJ,OAAO,CAACK,GAAG,CAACC,CAAC;UACzCH,QAAQ,GAAGA,QAAQ,GAAG,CAACA,QAAQ,EAAEG,CAAC,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,GAAGD,CAAC;UACjD,OAAOP,YAAY,CAAC1C,aAAa,CAACmD,IAAI,CAACF,CAAC,IAAIA,CAAC,CAACL,IAAI,KAAKE,QAAQ,CAAC,CAAC;SACpE,CAAC;;MAGNrD,QAAQ,CAACyB,KAAK,CAAC;;GAEtB;EAED,MAAMkC,MAAM,GAAwB;IAChC,eAAe,EAAE,SAAkB;IACnC,YAAY,EAAEtE,SAAS,MAAMA,aAAa2C,MAAM,GAAGb,SAAS;IAC5D,iBAAiB,EAAE7B,cAAc,MAAMA,kBAAkB0B,UAAU,GAAGG,SAAS;IAC/E1B,QAAQ,EAAEA,QAAQ,IAAIQ,QAAQ;IAC9BN,EAAE,EAAEqB,QAAQ;IACZa,SAAS,EAAE,CAACpC,QAAQ,IAAI,CAACQ,QAAQ,GAAGuB,mBAAmB,GAAGL,SAAS;IACnEyC,IAAI,EAAE;GACT;EAED,MAAMC,OAAO,GAAyB;IAClC,GAAG1D,UAAU;IACb,YAAY,EAAEd,SAAS;IACvB,iBAAiB,EAAEC,cAAc;IACjCC,IAAI;IACJE,QAAQ;IACRC,UAAU;IACVI,MAAM;IACNC,OAAO,EAAE+B,kBAAkB;IAC3B9B,QAAQ,EAAEyB,KAAK;MACXJ,kBAAkB,CAACN,QAAQ,CAACO,OAAO,EAAEG,KAAK,CAACsB,MAAM,CAAC7C,KAAK,CAAC;KAC3D;IACD2B,SAAS,EAAED,oBAAoB;IAC/BxB,GAAG,EAAEK,eAAe;IACpBP;GACH;EAED,MAAM4D,KAAK,GAAuB;IAC9B9D,QAAQ,EAAE6C,iBAAiB;IAC3BzC,GAAG,EAAEW,QAAQ;IACbb,KAAK,EAAE6D,MAAM,CAAC7D,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE;GAC5B;EAED,OAAO;IACHyD,MAAM;IACNE,OAAO;IACPC,KAAK;IACLE,OAAO,EAAE;MACLrD,IAAI;MACJsD,YAAY,EAAEtD,IAAI;QACd,IAAI,CAACA,IAAI,IAAIb,MAAM,EAAE;UACjBA,MAAM,CAACiC,iBAAiB,CAAC,MAAM,CAAC,CAAC;;QAErCnB,OAAO,CAACD,IAAI,CAAC;;KAEpB;IACDqB,IAAI;IACJC;GACH;AACL;;;;"}
+{"version":3,"file":"useSelect.js","sources":["../../../../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { v4 as uuid } from 'uuid';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { useLocalization } from '../Provider/Localization';\nimport { SelectProps } from './Select';\nimport { ListboxProps } from '../Listbox/Listbox';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\nimport { createCustomEvent } from '../../utils/input';\n\ntype InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\ntype InternalListboxProps = ListboxProps & { ref: React.ForwardedRef<HTMLInputElement> };\ntype InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & { ref: React.ForwardedRef<HTMLInputElement> };\n\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\n    button: InternalButtonProps;\n    listbox: InternalListboxProps;\n    input: InternalInputProps;\n    popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;\n    text: string | JSX.Element;\n    more?: number;\n};\n\nexport const useSelect = (\n    {\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data = [],\n        defaultValue,\n        disabled,\n        emptyValue,\n        id: nativeId,\n        multiselect,\n        onBlur,\n        onClick,\n        onChange,\n        readOnly,\n        value,\n        ...otherProps\n    }: SelectProps,\n    ref: React.Ref<HTMLInputElement>\n): useSelect => {\n    const { texts } = useLocalization();\n    const flattenedData = useFlattenedData(data);\n    const listboxInputRef = useMergedRef<HTMLInputElement>(ref);\n    const [open, setOpen] = React.useState(false);\n    const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\n    const inputRef = React.useRef<HTMLInputElement>(null);\n    const buttonId = `${id}-button`;\n    // support 'escape' resetting to the value that was set when the listbox opened\n    const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\n\n    React.useEffect(() => {\n        setLastValue(value);\n    }, [open]);\n\n    React.useEffect(() => {\n        if (value === undefined) {\n            if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {\n                setInputValueByRef(inputRef.current, defaultValue);\n            } else {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        } else {\n            if (!multiselect && !findByValue(flattenedData, value)) {\n                if (emptyValue !== undefined) {\n                    setInputValueByRef(inputRef.current, emptyValue);\n                } else if (data.length > 0) {\n                    setInputValueByRef(inputRef.current, data[0].value);\n                }\n            }\n        }\n    }, []);\n\n    // event handlers\n    const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\n        if (event.key === 'ArrowUp' || event.key === 'ArrowDown') {\n            event.preventDefault();\n            setOpen(true);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        switch (event.key) {\n            case 'Escape': {\n                event.preventDefault();\n                if (lastValue !== undefined) {\n                    setInputValueByRef(listboxInputRef.current, lastValue);\n                }\n\n                setOpen(false);\n                break;\n            }\n\n            case 'Tab':\n            case 'Enter': {\n                if (event.key !== 'Tab') {\n                    event.preventDefault();\n                }\n                setOpen(false);\n                break;\n            }\n\n            default:\n        }\n\n        if (otherProps.onKeyDown) {\n            otherProps.onKeyDown(event);\n        }\n    };\n\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\n        event.preventDefault();\n        if (!multiselect) {\n            setOpen(false);\n            if (onBlur) {\n                onBlur(createCustomEvent('blur'));\n            }\n        }\n    };\n\n    let text: string | JSX.Element = '';\n    let more = 0;\n\n    if (value !== undefined) {\n        if (multiselect) {\n            const selectedValues = value?.toString().split(',') || [];\n\n            if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {\n                text = texts.select.allOptionsSelected;\n            } else {\n                text = findByValue(flattenedData, selectedValues[0])?.text ?? '';\n                more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\n            }\n        } else {\n            const item = findByValue(flattenedData, value);\n\n            if (item) {\n                text = item.icon ? (\n                    <>\n                        {React.cloneElement(item.icon, {\n                            className: cn(item.icon.props.className, 'mr-1 -mt-px'),\n                        })}\n                        {item.text}\n                    </>\n                ) : (\n                    item.text\n                );\n            }\n        }\n    }\n\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\n        event.persist();\n\n        if (onChange) {\n            const item = findByValue(flattenedData, event.target.value);\n            (event as any).detail = sanitizeItem(item);\n\n            const indexes = item?.path?.split('.') ?? [];\n\n            if (indexes.length > 1) {\n                // we don't want to map the current item\n                indexes.pop();\n                // we need to rebuild the path as we map\n                let lastPath: string;\n\n                (event as any).detail.parents = indexes.map(i => {\n                    lastPath = lastPath ? [lastPath, i].join('.') : i;\n                    return sanitizeItem(flattenedData.find(i => i.path === lastPath));\n                });\n            }\n\n            onChange(event);\n        }\n    };\n\n    const button: InternalButtonProps = {\n        'aria-haspopup': 'listbox' as const,\n        'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\n        'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\n        disabled: disabled || readOnly,\n        id: buttonId,\n        onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\n        type: 'button',\n    };\n\n    const listbox: InternalListboxProps = {\n        ...otherProps,\n        'aria-label': ariaLabel,\n        'aria-labelledby': ariaLabelledBy,\n        data,\n        disabled,\n        emptyValue,\n        onBlur,\n        onClick: handleListboxClick,\n        onChange: event => {\n            setInputValueByRef(inputRef.current, event.target.value);\n        },\n        onKeyDown: handleListboxKeyDown,\n        ref: listboxInputRef,\n        value,\n    };\n\n    const input: InternalInputProps = {\n        onChange: handleInputChange,\n        ref: inputRef,\n        value: String(value ?? ''),\n    };\n\n    return {\n        button,\n        listbox,\n        input,\n        popover: {\n            open,\n            onOpenChange: open => {\n                if (!open && onBlur) {\n                    onBlur(createCustomEvent('blur'));\n                }\n                setOpen(open);\n            },\n        },\n        text,\n        more,\n    };\n};\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onBlur","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","flattenedData","useFlattenedData","listboxInputRef","useMergedRef","open","setOpen","React","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","key","preventDefault","handleListboxKeyDown","onKeyDown","handleListboxClick","createCustomEvent","text","more","selectedValues","toString","split","filter","item","select","allOptionsSelected","icon","className","cn","props","handleInputChange","persist","target","detail","sanitizeItem","indexes","path","pop","lastPath","parents","map","i","join","find","button","type","listbox","input","String","popover","onOpenChange"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Select2/Select2.js

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import cn from 'classnames';
-import { useLocalization } from '../Provider/Provider.js';
+import { useLocalization } from '../Provider/Localization.js';
 import { Root, Trigger, Portal, Content } from '@radix-ui/react-popover';
 import { useMergedRef } from '../../hooks/useMergedRef.js';
 import { createCustomKeyboardEvent } from '../../utils/input.js';
@@ -127,8 +127,7 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
     value: value
   }), /*#__PURE__*/React__default.createElement(Trigger, {
     asChild: true,
-    "data-taco": "Select2",
-    type: undefined
+    "data-taco": "Select2"
   }, /*#__PURE__*/React__default.createElement(Trigger$1, Object.assign({}, otherProps, {
     "aria-haspopup": "listbox",
     children: allChildren,
@@ -156,10 +155,13 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
     style: {
       minWidth: dimensions !== null && dimensions !== void 0 && dimensions.width ? `${dimensions.width}px` : undefined
     }
-  }, !disableSearch ? /*#__PURE__*/React__default.createElement(Search, {
+  }, !disableSearch && (allChildren.length > 0 || onCreate) ? /*#__PURE__*/React__default.createElement(Search, {
     placeholder: onCreate ? texts.select2.searchOrCreate : texts.select2.search,
     ref: searchRef
-  }) : null, /*#__PURE__*/React__default.createElement(Root$1, {
+  }) : null, allChildren.length <= 0 ? /*#__PURE__*/React__default.createElement("div", {
+    className: "text-grey-darkest -mt-0.5 flex h-8 items-center px-2",
+    role: "presentation"
+  }, "No results found...") : /*#__PURE__*/React__default.createElement(Root$1, {
     className: "flex flex-col gap-0.5",
     customSelector: ":scope > button",
     disabled: disabled,

package/dist/esm/packages/taco/src/components/Select2/Select2.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport { Select2OptionValue, Select2Value } from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { useChildren } from './hooks/useChildren';\nimport { Color } from '../../utils/colors';\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Provider';\n//import { All } from './components/All';\n\nexport type Select2Texts = {\n    allSelect: string;\n    allDeselect: string;\n    cancel: string;\n    chooseColor: string;\n    create: string;\n    delete: string;\n    save: string;\n    search: string;\n    searchOrCreate: string;\n};\n\nexport type Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    defaultValue?: Select2Value;\n    emptyValue?: Select2OptionValue;\n    disabled?: boolean;\n    disableSearch?: boolean;\n    highlighted?: boolean;\n    invalid?: boolean;\n    multiple?: boolean;\n    name?: string;\n    onChange?: (value: Select2Value) => void;\n    onCreate?: (name: string, color: Color | undefined) => Promise<Select2OptionProps>;\n    onDelete?: (value: Select2OptionValue) => Promise<void>;\n    onEdit?: (value: Select2OptionValue, text: string, color: Color | undefined) => Promise<void>;\n    readOnly?: boolean;\n    tags?: boolean;\n    value?: Select2Value;\n};\nexport type Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n    Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n    Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n    Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nexport const Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n    const {\n        children: initialChildren,\n        defaultValue: defaultProp,\n        disabled = false,\n        disableSearch = false,\n        emptyValue = undefined,\n        highlighted = false,\n        invalid = false,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\n        readOnly = false,\n        tabIndex = 0,\n        tags = false,\n        value: prop,\n        ...otherProps\n    } = props;\n\n    // refs\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\n    const listboxRef = React.useRef<CollectionRef>(null);\n    const searchRef = React.useRef<HTMLInputElement>(null);\n    const { texts } = useLocalization();\n    // align the listbox min width with the width of the input - it should never be smaller\n    const dimensions = useBoundingClientRectListener(internalRef);\n\n    // state\n    const [open, setOpen] = React.useState(false);\n    const [value, _setValue] = useControllableState<Select2Value>({\n        // uncontrolled\n        defaultProp,\n        // controlled\n        onChange,\n        prop,\n    });\n    const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const { allChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n        children: initialChildren,\n        emptyValue,\n        open,\n        setValue,\n        value,\n    });\n\n    // context\n    const context = {\n        disabled,\n        highlighted,\n        invalid,\n        listboxRef,\n        multiple,\n        onCreate,\n        onDelete,\n        onEdit,\n        open,\n        readOnly,\n        ref: internalRef,\n        searchQuery,\n        searchRef,\n        setOpen,\n        setSearchQuery,\n        setValidationError,\n        setValue,\n        tags,\n        validationError,\n        value,\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\n        } else {\n            if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n                setOpen(true);\n            }\n        }\n\n        // the focus should always remain on the input, so we forward events on to the listbox\n        listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n    };\n\n    const className = cn('border-grey-dark rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n                <ControlledHiddenField\n                    emptyValue={emptyValue}\n                    multiple={multiple || tags}\n                    name={name}\n                    options={allChildren.map(child => child.props.value)}\n                    parentRef={internalRef}\n                    setValue={setValue}\n                    value={value}\n                />\n                <PopoverPrimitive.Trigger asChild data-taco=\"Select2\" type={undefined}>\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        children={allChildren}\n                        onKeyDown={handleKeyDown}\n                        ref={internalRef}\n                    />\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content\n                        asChild\n                        align=\"start\"\n                        onOpenAutoFocus={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                            internalRef.current?.focus();\n                        }}\n                        onCloseAutoFocus={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                            internalRef.current?.focus();\n                        }}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {!disableSearch ? (\n                                <Search\n                                    placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                    ref={searchRef}\n                                />\n                            ) : null}\n                            <ListboxPrimitive.Root\n                                className=\"flex flex-col gap-0.5\"\n                                customSelector=\":scope > button\"\n                                disabled={disabled}\n                                multiple={multiple}\n                                readOnly={readOnly}\n                                ref={listboxRef}\n                                setValue={setValue}\n                                tabIndex={-1}\n                                value={value}>\n                                {/*multiple && !searchQuery && Array.isArray(value) ? (\n                                    <All\n                                        children={allChildren}\n                                        onToggle={_setValue}\n                                        selected={value.length === allChildren.length}\n                                    />\n                                ) : null*/}\n                                <Collection>{filteredChildren}</Collection>\n                                {onCreate ? <Create onCreate={onCreate} options={allChildren} /> : null}\n                            </ListboxPrimitive.Root>\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </Select2Context.Provider>\n    );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n    const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n    const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n    let bubbleValue;\n\n    if (isFormControl) {\n        if (value !== undefined) {\n            if (multiple) {\n                bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n            } else {\n                bubbleValue = value === null ? '' : String(value);\n            }\n        }\n\n        return (\n            <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n                {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n                {options.map(option => (\n                    <option key={String(option)} value={String(option)} />\n                ))}\n            </BubbleSelect>\n        );\n    }\n\n    return null;\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initialChildren","defaultValue","defaultProp","disabled","disableSearch","emptyValue","undefined","highlighted","invalid","multiple","name","onChange","onCreate","onDelete","onEdit","readOnly","tabIndex","tags","value","prop","otherProps","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","open","setOpen","useState","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","allChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","key","current","dispatchEvent","createCustomKeyboardEvent","className","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","map","child","parentRef","asChild","type","Trigger","onKeyDown","align","onOpenAutoFocus","stopPropagation","focus","onCloseAutoFocus","sideOffset","style","minWidth","width","Search","placeholder","select2","searchOrCreate","search","customSelector","Collection","Create","Option","Group","Title","isFormControl","useIsFormControl","bubbleValue","Array","isArray","String","BubbleSelect","option"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;MA8DaA,OAAO,gBAAGC,cAAK,CAACC,UAAU,CAAkC,SAASF,OAAO,CAACG,KAAK,EAAEC,GAAG;EAChG,MAAM;IACFC,QAAQ,EAAEC,eAAe;IACzBC,YAAY,EAAEC,WAAW;IACzBC,QAAQ,GAAG,KAAK;IAChBC,aAAa,GAAG,KAAK;IACrBC,UAAU,GAAGC,SAAS;IACtBC,WAAW,GAAG,KAAK;IACnBC,OAAO,GAAG,KAAK;IACfC,QAAQ,GAAG,KAAK;IAChBC,IAAI;IACJC,QAAQ;IACRC,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNC,QAAQ,GAAG,KAAK;IAChBC,QAAQ,GAAG,CAAC;IACZC,IAAI,GAAG,KAAK;IACZC,KAAK,EAAEC,IAAI;IACX,GAAGC;GACN,GAAGvB,KAAK;;EAGT,MAAMwB,WAAW,GAAGC,YAAY,CAAoBxB,GAAG,CAAC;EACxD,MAAMyB,UAAU,GAAG5B,cAAK,CAAC6B,MAAM,CAAgB,IAAI,CAAC;EACpD,MAAMC,SAAS,GAAG9B,cAAK,CAAC6B,MAAM,CAAmB,IAAI,CAAC;EACtD,MAAM;IAAEE;GAAO,GAAGC,eAAe,EAAE;;EAEnC,MAAMC,UAAU,GAAGC,6BAA6B,CAACR,WAAW,CAAC;;EAG7D,MAAM,CAACS,IAAI,EAAEC,OAAO,CAAC,GAAGpC,cAAK,CAACqC,QAAQ,CAAC,KAAK,CAAC;EAC7C,MAAM,CAACd,KAAK,EAAEe,SAAS,CAAC,GAAGC,oBAAoB,CAAe;;IAE1DhC,WAAW;;IAEXS,QAAQ;IACRQ;GACH,CAAC;EACF,MAAMgB,QAAQ,GAAGC,wBAAyC,CAAC3B,QAAQ,EAAEwB,SAAS,CAAC;EAC/E,MAAM,CAACI,eAAe,EAAEC,kBAAkB,CAAC,GAAG3C,cAAK,CAACqC,QAAQ,EAAqB;EAEjF,MAAM;IAAEO,WAAW;IAAEC,gBAAgB;IAAEC,WAAW;IAAEC;GAAgB,GAAGC,WAAW,CAAC;IAC/E5C,QAAQ,EAAEC,eAAe;IACzBK,UAAU;IACVyB,IAAI;IACJK,QAAQ;IACRjB;GACH,CAAC;;EAGF,MAAM0B,OAAO,GAAG;IACZzC,QAAQ;IACRI,WAAW;IACXC,OAAO;IACPe,UAAU;IACVd,QAAQ;IACRG,QAAQ;IACRC,QAAQ;IACRC,MAAM;IACNgB,IAAI;IACJf,QAAQ;IACRjB,GAAG,EAAEuB,WAAW;IAChBoB,WAAW;IACXhB,SAAS;IACTM,OAAO;IACPW,cAAc;IACdJ,kBAAkB;IAClBH,QAAQ;IACRlB,IAAI;IACJoB,eAAe;IACfnB;GACH;EAED,MAAM2B,aAAa,GAAIC,KAAuC;;IAC1D,IAAIhB,IAAI,EAAE;MACNgB,KAAK,CAACC,cAAc,EAAE;KACzB,MAAM;MACH,IAAID,KAAK,CAACE,GAAG,KAAK,WAAW,IAAIF,KAAK,CAACE,GAAG,KAAK,SAAS,EAAE;QACtDjB,OAAO,CAAC,IAAI,CAAC;;;;IAKrB,uBAAAR,UAAU,CAAC0B,OAAO,wDAAlB,oBAAoBC,aAAa,CAACC,yBAAyB,CAACL,KAA8C,CAAC,CAAC;GAC/G;EAED,MAAMM,SAAS,GAAGC,EAAE,CAAC,wEAAwE,EAAEC,yBAAyB,EAAE,CAAC;EAE3H,oBACI3D,6BAAC4D,cAAc,CAACC,QAAQ;IAACtC,KAAK,EAAE0B;kBAC5BjD,6BAAC8D,IAAqB;IAAC3B,IAAI,EAAEA,IAAI;IAAE4B,YAAY,EAAE3B;kBAC7CpC,6BAACgE,qBAAqB;IAClBtD,UAAU,EAAEA,UAAU;IACtBI,QAAQ,EAAEA,QAAQ,IAAIQ,IAAI;IAC1BP,IAAI,EAAEA,IAAI;IACVkD,OAAO,EAAErB,WAAW,CAACsB,GAAG,CAACC,KAAK,IAAIA,KAAK,CAACjE,KAAK,CAACqB,KAAK,CAAC;IACpD6C,SAAS,EAAE1C,WAAW;IACtBc,QAAQ,EAAEA,QAAQ;IAClBjB,KAAK,EAAEA;IACT,eACFvB,6BAAC8D,OAAwB;IAACO,OAAO;iBAAW,SAAS;IAACC,IAAI,EAAE3D;kBACxDX,6BAACuE,SAAO,oBACA9C,UAAU;qBACA,SAAS;IACvBrB,QAAQ,EAAEwC,WAAW;IACrB4B,SAAS,EAAEtB,aAAa;IACxB/C,GAAG,EAAEuB;KACP,CACqB,eAC3B1B,6BAAC8D,MAAuB,qBACpB9D,6BAAC8D,OAAwB;IACrBO,OAAO;IACPI,KAAK,EAAC,OAAO;IACbC,eAAe,EAAEvB,KAAK;;MAClBA,KAAK,CAACC,cAAc,EAAE;MACtBD,KAAK,CAACwB,eAAe,EAAE;MACvB,wBAAAjD,WAAW,CAAC4B,OAAO,yDAAnB,qBAAqBsB,KAAK,EAAE;KAC/B;IACDC,gBAAgB,EAAE1B,KAAK;;MACnBA,KAAK,CAACC,cAAc,EAAE;MACtBD,KAAK,CAACwB,eAAe,EAAE;MACvB,yBAAAjD,WAAW,CAAC4B,OAAO,0DAAnB,sBAAqBsB,KAAK,EAAE;KAC/B;IACDE,UAAU,EAAE,CAAC;IACbzD,QAAQ,EAAE,CAAC;kBACXrB;IAAKyD,SAAS,EAAEA,SAAS;IAAEsB,KAAK,EAAE;MAAEC,QAAQ,EAAE/C,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEgD,KAAK,MAAMhD,UAAU,CAACgD,SAAS,GAAGtE;;KACvF,CAACF,aAAa,gBACXT,6BAACkF,MAAM;IACHC,WAAW,EAAElE,QAAQ,GAAGc,KAAK,CAACqD,OAAO,CAACC,cAAc,GAAGtD,KAAK,CAACqD,OAAO,CAACE,MAAM;IAC3EnF,GAAG,EAAE2B;IACP,GACF,IAAI,eACR9B,6BAACyC,MAAqB;IAClBgB,SAAS,EAAC,uBAAuB;IACjC8B,cAAc,EAAC,iBAAiB;IAChC/E,QAAQ,EAAEA,QAAQ;IAClBM,QAAQ,EAAEA,QAAQ;IAClBM,QAAQ,EAAEA,QAAQ;IAClBjB,GAAG,EAAEyB,UAAU;IACfY,QAAQ,EAAEA,QAAQ;IAClBnB,QAAQ,EAAE,CAAC,CAAC;IACZE,KAAK,EAAEA;kBAQPvB,6BAACwF,UAAU,QAAE3C,gBAAgB,CAAc,EAC1C5B,QAAQ,gBAAGjB,6BAACyF,MAAM;IAACxE,QAAQ,EAAEA,QAAQ;IAAEgD,OAAO,EAAErB;IAAe,GAAG,IAAI,CACnD,CACtB,CACiB,CACL,CACN,CACF;AAElC,CAAC;AACD7C,OAAO,CAAC2F,MAAM,GAAGA,MAAM;AACvB3F,OAAO,CAAC4F,KAAK,GAAGA,KAAK;AACrB5F,OAAO,CAAC6F,KAAK,GAAGA,KAAK;AAErB,MAAM5B,qBAAqB,GAAG9D,KAAK;EAC/B,MAAM;IAAEQ,UAAU;IAAEI,QAAQ;IAAEC,IAAI;IAAEkD,OAAO;IAAEG,SAAS;IAAE7C,KAAK;IAAEiB;GAAU,GAAGtC,KAAK;EACjF,MAAM2F,aAAa,GAAGC,gBAAgB,CAAC1B,SAAS,EAAE,MAAM5B,QAAQ,CAAC1B,QAAQ,GAAG,EAAE,GAAGH,SAAS,CAAC,CAAC;EAE5F,IAAIoF,WAAW;EAEf,IAAIF,aAAa,EAAE;IACf,IAAItE,KAAK,KAAKZ,SAAS,EAAE;MACrB,IAAIG,QAAQ,EAAE;QACViF,WAAW,GAAGC,KAAK,CAACC,OAAO,CAAC1E,KAAK,CAAC,GAAGA,KAAK,CAAC2C,GAAG,CAACgC,MAAM,CAAC,GAAG,CAAC3E,KAAK,KAAK,IAAI,GAAG,EAAE,GAAG2E,MAAM,CAAC3E,KAAK,CAAC,CAAC;OACjG,MAAM;QACHwE,WAAW,GAAGxE,KAAK,KAAK,IAAI,GAAG,EAAE,GAAG2E,MAAM,CAAC3E,KAAK,CAAC;;;IAIzD,oBACIvB,6BAACmG,YAAY;;MAAa9C,GAAG,EAAE6C,MAAM,CAACH,WAAW,CAAC;MAAEjF,QAAQ,EAAEA,QAAQ;MAAEC,IAAI,EAAEA,IAAI;MAAEQ,KAAK,EAAEwE;OACtFrF,UAAU,KAAKC,SAAS,gBAAGX;MAAQuB,KAAK,EAAEb;MAAc,GAAG,IAAI,EAC/DuD,OAAO,CAACC,GAAG,CAACkC,MAAM,iBACfpG;MAAQqD,GAAG,EAAE6C,MAAM,CAACE,MAAM,CAAC;MAAE7E,KAAK,EAAE2E,MAAM,CAACE,MAAM;MACpD,CAAC,CACS;;EAIvB,OAAO,IAAI;AACf,CAAC;;;;"}
+{"version":3,"file":"Select2.js","sources":["../../../../../../../src/components/Select2/Select2.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { useControllableState } from '@radix-ui/react-use-controllable-state';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport * as ListboxPrimitive from '../../primitives/Listbox2/Listbox2';\nimport { Select2OptionValue, Select2Value } from './types';\nimport { Option, Select2OptionProps } from './components/Option';\nimport { Group, Select2GroupProps } from './components/Group';\nimport { Select2TitleProps, Title } from './components/Title';\nimport { Select2Context } from './components/Context';\nimport { createCollectionClassName } from './utilities';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useBoundingClientRectListener } from '../../hooks/useBoundingClientRectListener';\nimport { createCustomKeyboardEvent } from '../../utils/input';\nimport { Trigger } from './components/Trigger';\nimport { useIsFormControl } from '../../hooks/useIsFormControl';\nimport { BubbleSelect } from '../../primitives/BubbleSelect';\nimport { Search } from './components/Search';\nimport { useChildren } from './hooks/useChildren';\nimport { Color } from '../../utils/colors';\nimport { Create } from './components/Create';\nimport { Collection } from './components/Collection';\nimport { CollectionRef } from '../../primitives/Collection/Collection';\nimport { useLocalization } from '../Provider/Localization';\n//import { All } from './components/All';\n\ntype Select2Texts = {\n    allSelect: string;\n    allDeselect: string;\n    cancel: string;\n    chooseColor: string;\n    create: string;\n    delete: string;\n    save: string;\n    search: string;\n    searchOrCreate: string;\n};\n\ntype Select2Props = Omit<React.HTMLAttributes<HTMLButtonElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    children: React.ReactElement<Select2OptionProps>[];\n    defaultValue?: Select2Value;\n    emptyValue?: Select2OptionValue;\n    disabled?: boolean;\n    disableSearch?: boolean;\n    highlighted?: boolean;\n    invalid?: boolean;\n    multiple?: boolean;\n    name?: string;\n    onChange?: (value: Select2Value) => void;\n    onCreate?: (name: string, color: Color | undefined) => Promise<Select2OptionProps>;\n    onDelete?: (value: Select2OptionValue) => Promise<void>;\n    onEdit?: (value: Select2OptionValue, text: string, color: Color | undefined) => Promise<void>;\n    readOnly?: boolean;\n    tags?: boolean;\n    value?: Select2Value;\n};\ntype Select2PropsWithStatics = React.ForwardRefExoticComponent<Select2Props & React.RefAttributes<HTMLButtonElement>> & {\n    Option: React.ForwardRefExoticComponent<Select2OptionProps>;\n    Group: React.ForwardRefExoticComponent<Select2GroupProps>;\n    Title: React.ForwardRefExoticComponent<Select2TitleProps>;\n};\n\nconst Select2 = React.forwardRef<HTMLButtonElement, Select2Props>(function Select2(props, ref) {\n    const {\n        children: initialChildren,\n        defaultValue: defaultProp,\n        disabled = false,\n        disableSearch = false,\n        emptyValue = undefined,\n        highlighted = false,\n        invalid = false,\n        multiple = false,\n        name,\n        onChange,\n        onCreate,\n        onDelete,\n        onEdit,\n        readOnly = false,\n        tabIndex = 0,\n        tags = false,\n        value: prop,\n        ...otherProps\n    } = props;\n\n    // refs\n    const internalRef = useMergedRef<HTMLButtonElement>(ref);\n    const listboxRef = React.useRef<CollectionRef>(null);\n    const searchRef = React.useRef<HTMLInputElement>(null);\n    const { texts } = useLocalization();\n    // align the listbox min width with the width of the input - it should never be smaller\n    const dimensions = useBoundingClientRectListener(internalRef);\n\n    // state\n    const [open, setOpen] = React.useState(false);\n    const [value, _setValue] = useControllableState<Select2Value>({\n        // uncontrolled\n        defaultProp,\n        // controlled\n        onChange,\n        prop,\n    });\n    const setValue = ListboxPrimitive.createListboxValueSetter(multiple, _setValue);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const { allChildren, filteredChildren, searchQuery, setSearchQuery } = useChildren({\n        children: initialChildren,\n        emptyValue,\n        open,\n        setValue,\n        value,\n    });\n\n    // context\n    const context = {\n        disabled,\n        highlighted,\n        invalid,\n        listboxRef,\n        multiple,\n        onCreate,\n        onDelete,\n        onEdit,\n        open,\n        readOnly,\n        ref: internalRef,\n        searchQuery,\n        searchRef,\n        setOpen,\n        setSearchQuery,\n        setValidationError,\n        setValue,\n        tags,\n        validationError,\n        value,\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n        if (open) {\n            event.preventDefault();\n        } else {\n            if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n                setOpen(true);\n            }\n        }\n\n        // the focus should always remain on the input, so we forward events on to the listbox\n        listboxRef.current?.dispatchEvent(createCustomKeyboardEvent(event as React.KeyboardEvent<HTMLInputElement>));\n    };\n\n    const className = cn('border-grey-dark rounded border bg-white py-1.5 shadow-md outline-none', createCollectionClassName());\n\n    return (\n        <Select2Context.Provider value={context}>\n            <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n                <ControlledHiddenField\n                    emptyValue={emptyValue}\n                    multiple={multiple || tags}\n                    name={name}\n                    options={allChildren.map(child => child.props.value)}\n                    parentRef={internalRef}\n                    setValue={setValue}\n                    value={value}\n                />\n                <PopoverPrimitive.Trigger asChild data-taco=\"Select2\">\n                    <Trigger\n                        {...otherProps}\n                        aria-haspopup=\"listbox\"\n                        children={allChildren}\n                        onKeyDown={handleKeyDown}\n                        ref={internalRef}\n                    />\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Portal>\n                    <PopoverPrimitive.Content\n                        asChild\n                        align=\"start\"\n                        onOpenAutoFocus={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                            internalRef.current?.focus();\n                        }}\n                        onCloseAutoFocus={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                            internalRef.current?.focus();\n                        }}\n                        sideOffset={4}\n                        tabIndex={-1}>\n                        <div className={className} style={{ minWidth: dimensions?.width ? `${dimensions.width}px` : undefined }}>\n                            {!disableSearch && (allChildren.length > 0 || onCreate) ? (\n                                <Search\n                                    placeholder={onCreate ? texts.select2.searchOrCreate : texts.select2.search}\n                                    ref={searchRef}\n                                />\n                            ) : null}\n                            {allChildren.length <= 0 ? (\n                                <div className=\"text-grey-darkest -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n                                    No results found...\n                                </div>\n                            ) : (\n                                <ListboxPrimitive.Root\n                                    className=\"flex flex-col gap-0.5\"\n                                    customSelector=\":scope > button\"\n                                    disabled={disabled}\n                                    multiple={multiple}\n                                    readOnly={readOnly}\n                                    ref={listboxRef}\n                                    setValue={setValue}\n                                    tabIndex={-1}\n                                    value={value}>\n                                    {/*multiple && !searchQuery && Array.isArray(value) ? (\n                                    <All\n                                        children={allChildren}\n                                        onToggle={_setValue}\n                                        selected={value.length === allChildren.length}\n                                    />\n                                ) : null*/}\n                                    <Collection>{filteredChildren}</Collection>\n                                    {onCreate ? <Create onCreate={onCreate} options={allChildren} /> : null}\n                                </ListboxPrimitive.Root>\n                            )}\n                        </div>\n                    </PopoverPrimitive.Content>\n                </PopoverPrimitive.Portal>\n            </PopoverPrimitive.Root>\n        </Select2Context.Provider>\n    );\n}) as Select2PropsWithStatics;\nSelect2.Option = Option;\nSelect2.Group = Group;\nSelect2.Title = Title;\n\nconst ControlledHiddenField = props => {\n    const { emptyValue, multiple, name, options, parentRef, value, setValue } = props;\n    const isFormControl = useIsFormControl(parentRef, () => setValue(multiple ? [] : undefined));\n\n    let bubbleValue;\n\n    if (isFormControl) {\n        if (value !== undefined) {\n            if (multiple) {\n                bubbleValue = Array.isArray(value) ? value.map(String) : [value === null ? '' : String(value)];\n            } else {\n                bubbleValue = value === null ? '' : String(value);\n            }\n        }\n\n        return (\n            <BubbleSelect aria-hidden key={String(bubbleValue)} multiple={multiple} name={name} value={bubbleValue}>\n                {emptyValue !== undefined ? <option value={emptyValue} /> : null}\n                {options.map(option => (\n                    <option key={String(option)} value={String(option)} />\n                ))}\n            </BubbleSelect>\n        );\n    }\n\n    return null;\n};\n\nexport { Select2 };\n\nexport type {\n    Select2Texts,\n    Select2GroupProps,\n    Select2OptionProps,\n    Select2OptionValue,\n    Select2Value,\n    Select2Props,\n    Select2TitleProps,\n};\n"],"names":["Select2","React","forwardRef","props","ref","children","initialChildren","defaultValue","defaultProp","disabled","disableSearch","emptyValue","undefined","highlighted","invalid","multiple","name","onChange","onCreate","onDelete","onEdit","readOnly","tabIndex","tags","value","prop","otherProps","internalRef","useMergedRef","listboxRef","useRef","searchRef","texts","useLocalization","dimensions","useBoundingClientRectListener","open","setOpen","useState","_setValue","useControllableState","setValue","ListboxPrimitive","validationError","setValidationError","allChildren","filteredChildren","searchQuery","setSearchQuery","useChildren","context","handleKeyDown","event","preventDefault","key","current","dispatchEvent","createCustomKeyboardEvent","className","cn","createCollectionClassName","Select2Context","Provider","PopoverPrimitive","onOpenChange","ControlledHiddenField","options","map","child","parentRef","asChild","Trigger","onKeyDown","align","onOpenAutoFocus","stopPropagation","focus","onCloseAutoFocus","sideOffset","style","minWidth","width","length","Search","placeholder","select2","searchOrCreate","search","role","customSelector","Collection","Create","Option","Group","Title","isFormControl","useIsFormControl","bubbleValue","Array","isArray","String","BubbleSelect","option"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Select2/components/Collection.js

@@ -5,12 +5,6 @@ const Collection = props => {
   const {
     children
   } = props;
-  if (!children.length) {
-    return /*#__PURE__*/React__default.createElement("div", {
-      className: "text-grey-darkest -mt-0.5 flex h-8 items-center px-2",
-      role: "presentation"
-    }, "No results found...");
-  }
   return /*#__PURE__*/React__default.createElement(ScrollArea, {
     className: "flex max-h-[10.25rem] w-full flex-col gap-y-0.5 px-1.5"
   }, children);

package/dist/esm/packages/taco/src/components/Select2/components/Collection.js.map

@@ -1 +1 @@
-{"version":3,"file":"Collection.js","sources":["../../../../../../../../src/components/Select2/components/Collection.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { Select2OptionProps } from './Option';\n\nexport type Select2CollectionProps = {\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const Collection = (props: Select2CollectionProps) => {\n    const { children } = props;\n\n    if (!children.length) {\n        return (\n            <div className=\"text-grey-darkest -mt-0.5 flex h-8 items-center px-2\" role=\"presentation\">\n                No results found...\n            </div>\n        );\n    }\n\n    return <ScrollArea className=\"flex max-h-[10.25rem] w-full flex-col gap-y-0.5 px-1.5\">{children}</ScrollArea>;\n};\n"],"names":["Collection","props","children","length","React","className","role","ScrollArea"],"mappings":";;;MAQaA,UAAU,GAAIC,KAA6B;EACpD,MAAM;IAAEC;GAAU,GAAGD,KAAK;EAE1B,IAAI,CAACC,QAAQ,CAACC,MAAM,EAAE;IAClB,oBACIC;MAAKC,SAAS,EAAC,sDAAsD;MAACC,IAAI,EAAC;6BAErE;;EAId,oBAAOF,6BAACG,UAAU;IAACF,SAAS,EAAC;KAA0DH,QAAQ,CAAc;AACjH;;;;"}
+{"version":3,"file":"Collection.js","sources":["../../../../../../../../src/components/Select2/components/Collection.tsx"],"sourcesContent":["import React from 'react';\nimport { ScrollArea } from '../../ScrollArea/ScrollArea';\nimport { Select2OptionProps } from './Option';\n\nexport type Select2CollectionProps = {\n    children: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const Collection = (props: Select2CollectionProps) => {\n    const { children } = props;\n\n    return <ScrollArea className=\"flex max-h-[10.25rem] w-full flex-col gap-y-0.5 px-1.5\">{children}</ScrollArea>;\n};\n"],"names":["Collection","props","children","React","ScrollArea","className"],"mappings":";;;MAQaA,UAAU,GAAIC,KAA6B;EACpD,MAAM;IAAEC;GAAU,GAAGD,KAAK;EAE1B,oBAAOE,6BAACC,UAAU;IAACC,SAAS,EAAC;KAA0DH,QAAQ,CAAc;AACjH;;;;"}

package/dist/esm/packages/taco/src/components/Select2/components/Create.js

@@ -1,6 +1,6 @@
 import React__default from 'react';
 import cn from 'classnames';
-import { useLocalization } from '../../Provider/Provider.js';
+import { useLocalization } from '../../Provider/Localization.js';
 import { isAriaSelectionKey } from '../../../utils/aria.js';
 import { Tag } from '../../Tag/Tag.js';
 import { createOptionClassName } from '../utilities.js';

package/dist/esm/packages/taco/src/components/Select2/components/Create.js.map

@@ -1 +1 @@
-{"version":3,"file":"Create.js","sources":["../../../../../../../../src/components/Select2/components/Create.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Color } from '../../../utils/colors';\nimport { Tag } from '../../Tag/Tag';\nimport { createOptionClassName } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { useLocalization } from '../../Provider/Provider';\n\nexport type CreateProps = {\n    onCreate: (name: string, color: Color | undefined) => Promise<Select2OptionProps>;\n    options: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const getNextColor = (options: React.ReactElement<Select2OptionProps>[]): Color | undefined => {\n    const occurences = options.reduce((occurences, option) => {\n        if (option.props.color) {\n            occurences[option.props.color] = occurences[option.props.color] ? occurences[option.props.color] + 1 : 1;\n        }\n        return occurences;\n    }, {});\n\n    const colors = Object.keys(occurences);\n\n    if (colors.length) {\n        return colors.sort((a, b) => occurences[b] - occurences[a])[0] as Color;\n    }\n\n    return undefined;\n};\n\nexport const Create = (props: CreateProps) => {\n    const { onCreate: handleCreate, options } = props;\n    const { multiple, searchQuery, setOpen, setSearchQuery, setValidationError, setValue } = useSelect2Context();\n    const { texts } = useLocalization();\n\n    // determine what the next color tag should be based on color occurences\n    const nextColor = React.useMemo(() => getNextColor(options), [options]);\n\n    if (!searchQuery) {\n        return null;\n    }\n\n    const handleClick = async () => {\n        try {\n            const item = await handleCreate(searchQuery, nextColor);\n            setValue(item.value);\n\n            if (multiple) {\n                setSearchQuery('');\n            } else {\n                setOpen(false);\n            }\n        } catch (error) {\n            setValidationError(error);\n        }\n    };\n\n    const handleKeyDown = event => {\n        if (isAriaSelectionKey(event)) {\n            event.currentTarget.click();\n        }\n    };\n\n    const className = cn('!w-[calc(100%_-_theme(spacing.3))] ml-1.5', createOptionClassName());\n    return (\n        <button className={className} onClick={handleClick} onKeyDown={handleKeyDown}>\n            <span className=\"flex items-center gap-1.5\">\n                {texts.select2.create}\n                <Tag color={nextColor} className=\"cursor-pointer\">\n                    {searchQuery}\n                </Tag>\n            </span>\n        </button>\n    );\n};\n"],"names":["getNextColor","options","occurences","reduce","option","props","color","colors","Object","keys","length","sort","a","b","undefined","Create","onCreate","handleCreate","multiple","searchQuery","setOpen","setSearchQuery","setValidationError","setValue","useSelect2Context","texts","useLocalization","nextColor","React","useMemo","handleClick","item","value","error","handleKeyDown","event","isAriaSelectionKey","currentTarget","click","className","cn","createOptionClassName","onClick","onKeyDown","select2","create","Tag"],"mappings":";;;;;;;;;MAeaA,YAAY,GAAIC,OAAiD;EAC1E,MAAMC,UAAU,GAAGD,OAAO,CAACE,MAAM,CAAC,CAACD,UAAU,EAAEE,MAAM;IACjD,IAAIA,MAAM,CAACC,KAAK,CAACC,KAAK,EAAE;MACpBJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAGJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAGJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC;;IAE5G,OAAOJ,UAAU;GACpB,EAAE,EAAE,CAAC;EAEN,MAAMK,MAAM,GAAGC,MAAM,CAACC,IAAI,CAACP,UAAU,CAAC;EAEtC,IAAIK,MAAM,CAACG,MAAM,EAAE;IACf,OAAOH,MAAM,CAACI,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKX,UAAU,CAACW,CAAC,CAAC,GAAGX,UAAU,CAACU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAU;;EAG3E,OAAOE,SAAS;AACpB;MAEaC,MAAM,GAAIV,KAAkB;EACrC,MAAM;IAAEW,QAAQ,EAAEC,YAAY;IAAEhB;GAAS,GAAGI,KAAK;EACjD,MAAM;IAAEa,QAAQ;IAAEC,WAAW;IAAEC,OAAO;IAAEC,cAAc;IAAEC,kBAAkB;IAAEC;GAAU,GAAGC,iBAAiB,EAAE;EAC5G,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;;EAGnC,MAAMC,SAAS,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAM7B,YAAY,CAACC,OAAO,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEvE,IAAI,CAACkB,WAAW,EAAE;IACd,OAAO,IAAI;;EAGf,MAAMW,WAAW;IAAA;uCACT;QAAA,uBACmBb,YAAY,CAACE,WAAW,EAAEQ,SAAS,CAAC,iBAAjDI,IAAI;UACVR,QAAQ,CAACQ,IAAI,CAACC,KAAK,CAAC;UAAC,IAEjBd,QAAQ;YACRG,cAAc,CAAC,EAAE,CAAC;;YAElBD,OAAO,CAAC,KAAK,CAAC;;;OAErB,YAAQa,KAAK,EAAE;QACZX,kBAAkB,CAACW,KAAK,CAAC;OAC5B;MAAA;KACJ;MAAA;;;EAED,MAAMC,aAAa,GAAGC,KAAK;IACvB,IAAIC,kBAAkB,CAACD,KAAK,CAAC,EAAE;MAC3BA,KAAK,CAACE,aAAa,CAACC,KAAK,EAAE;;GAElC;EAED,MAAMC,SAAS,GAAGC,EAAE,CAAC,2CAA2C,EAAEC,qBAAqB,EAAE,CAAC;EAC1F,oBACIb;IAAQW,SAAS,EAAEA,SAAS;IAAEG,OAAO,EAAEZ,WAAW;IAAEa,SAAS,EAAET;kBAC3DN;IAAMW,SAAS,EAAC;KACXd,KAAK,CAACmB,OAAO,CAACC,MAAM,eACrBjB,6BAACkB,GAAG;IAACxC,KAAK,EAAEqB,SAAS;IAAEY,SAAS,EAAC;KAC5BpB,WAAW,CACV,CACH,CACF;AAEjB;;;;"}
+{"version":3,"file":"Create.js","sources":["../../../../../../../../src/components/Select2/components/Create.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { isAriaSelectionKey } from '../../../utils/aria';\nimport { Color } from '../../../utils/colors';\nimport { Tag } from '../../Tag/Tag';\nimport { createOptionClassName } from '../utilities';\nimport { useSelect2Context } from './Context';\nimport { Select2OptionProps } from './Option';\nimport { useLocalization } from '../../Provider/Localization';\n\nexport type CreateProps = {\n    onCreate: (name: string, color: Color | undefined) => Promise<Select2OptionProps>;\n    options: React.ReactElement<Select2OptionProps>[];\n};\n\nexport const getNextColor = (options: React.ReactElement<Select2OptionProps>[]): Color | undefined => {\n    const occurences = options.reduce((occurences, option) => {\n        if (option.props.color) {\n            occurences[option.props.color] = occurences[option.props.color] ? occurences[option.props.color] + 1 : 1;\n        }\n        return occurences;\n    }, {});\n\n    const colors = Object.keys(occurences);\n\n    if (colors.length) {\n        return colors.sort((a, b) => occurences[b] - occurences[a])[0] as Color;\n    }\n\n    return undefined;\n};\n\nexport const Create = (props: CreateProps) => {\n    const { onCreate: handleCreate, options } = props;\n    const { multiple, searchQuery, setOpen, setSearchQuery, setValidationError, setValue } = useSelect2Context();\n    const { texts } = useLocalization();\n\n    // determine what the next color tag should be based on color occurences\n    const nextColor = React.useMemo(() => getNextColor(options), [options]);\n\n    if (!searchQuery) {\n        return null;\n    }\n\n    const handleClick = async () => {\n        try {\n            const item = await handleCreate(searchQuery, nextColor);\n            setValue(item.value);\n\n            if (multiple) {\n                setSearchQuery('');\n            } else {\n                setOpen(false);\n            }\n        } catch (error) {\n            setValidationError(error as Error);\n        }\n    };\n\n    const handleKeyDown = event => {\n        if (isAriaSelectionKey(event)) {\n            event.currentTarget.click();\n        }\n    };\n\n    const className = cn('!w-[calc(100%_-_theme(spacing.3))] ml-1.5', createOptionClassName());\n    return (\n        <button className={className} onClick={handleClick} onKeyDown={handleKeyDown}>\n            <span className=\"flex items-center gap-1.5\">\n                {texts.select2.create}\n                <Tag color={nextColor} className=\"cursor-pointer\">\n                    {searchQuery}\n                </Tag>\n            </span>\n        </button>\n    );\n};\n"],"names":["getNextColor","options","occurences","reduce","option","props","color","colors","Object","keys","length","sort","a","b","undefined","Create","onCreate","handleCreate","multiple","searchQuery","setOpen","setSearchQuery","setValidationError","setValue","useSelect2Context","texts","useLocalization","nextColor","React","useMemo","handleClick","item","value","error","handleKeyDown","event","isAriaSelectionKey","currentTarget","click","className","cn","createOptionClassName","onClick","onKeyDown","select2","create","Tag"],"mappings":";;;;;;;;;MAeaA,YAAY,GAAIC,OAAiD;EAC1E,MAAMC,UAAU,GAAGD,OAAO,CAACE,MAAM,CAAC,CAACD,UAAU,EAAEE,MAAM;IACjD,IAAIA,MAAM,CAACC,KAAK,CAACC,KAAK,EAAE;MACpBJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAGJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAGJ,UAAU,CAACE,MAAM,CAACC,KAAK,CAACC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC;;IAE5G,OAAOJ,UAAU;GACpB,EAAE,EAAE,CAAC;EAEN,MAAMK,MAAM,GAAGC,MAAM,CAACC,IAAI,CAACP,UAAU,CAAC;EAEtC,IAAIK,MAAM,CAACG,MAAM,EAAE;IACf,OAAOH,MAAM,CAACI,IAAI,CAAC,CAACC,CAAC,EAAEC,CAAC,KAAKX,UAAU,CAACW,CAAC,CAAC,GAAGX,UAAU,CAACU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAU;;EAG3E,OAAOE,SAAS;AACpB;MAEaC,MAAM,GAAIV,KAAkB;EACrC,MAAM;IAAEW,QAAQ,EAAEC,YAAY;IAAEhB;GAAS,GAAGI,KAAK;EACjD,MAAM;IAAEa,QAAQ;IAAEC,WAAW;IAAEC,OAAO;IAAEC,cAAc;IAAEC,kBAAkB;IAAEC;GAAU,GAAGC,iBAAiB,EAAE;EAC5G,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;;EAGnC,MAAMC,SAAS,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAM7B,YAAY,CAACC,OAAO,CAAC,EAAE,CAACA,OAAO,CAAC,CAAC;EAEvE,IAAI,CAACkB,WAAW,EAAE;IACd,OAAO,IAAI;;EAGf,MAAMW,WAAW;IAAA;uCACT;QAAA,uBACmBb,YAAY,CAACE,WAAW,EAAEQ,SAAS,CAAC,iBAAjDI,IAAI;UACVR,QAAQ,CAACQ,IAAI,CAACC,KAAK,CAAC;UAAC,IAEjBd,QAAQ;YACRG,cAAc,CAAC,EAAE,CAAC;;YAElBD,OAAO,CAAC,KAAK,CAAC;;;OAErB,YAAQa,KAAK,EAAE;QACZX,kBAAkB,CAACW,KAAc,CAAC;OACrC;MAAA;KACJ;MAAA;;;EAED,MAAMC,aAAa,GAAGC,KAAK;IACvB,IAAIC,kBAAkB,CAACD,KAAK,CAAC,EAAE;MAC3BA,KAAK,CAACE,aAAa,CAACC,KAAK,EAAE;;GAElC;EAED,MAAMC,SAAS,GAAGC,EAAE,CAAC,2CAA2C,EAAEC,qBAAqB,EAAE,CAAC;EAC1F,oBACIb;IAAQW,SAAS,EAAEA,SAAS;IAAEG,OAAO,EAAEZ,WAAW;IAAEa,SAAS,EAAET;kBAC3DN;IAAMW,SAAS,EAAC;KACXd,KAAK,CAACmB,OAAO,CAACC,MAAM,eACrBjB,6BAACkB,GAAG;IAACxC,KAAK,EAAEqB,SAAS;IAAEY,SAAS,EAAC;KAC5BpB,WAAW,CACV,CACH,CACF;AAEjB;;;;"}

package/dist/esm/packages/taco/src/components/Select2/components/Edit.js

@@ -1,8 +1,8 @@
 import React__default from 'react';
 import cn from 'classnames';
 import { Icon } from '../../Icon/Icon.js';
+import { useLocalization } from '../../Provider/Localization.js';
 import { Button } from '../../Button/Button.js';
-import { useLocalization } from '../../Provider/Provider.js';
 import { Input } from '../../Input/Input.js';
 import { Popover } from '../../Popover/Popover.js';
 import { Field } from '../../Field/Field.js';

package/dist/esm/packages/taco/src/components/Select2/components/Edit.js.map

@@ -1 +1 @@
-{"version":3,"file":"Edit.js","sources":["../../../../../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport * as RadioGroup from '@radix-ui/react-radio-group';\nimport { Color, colors } from '../../../utils/colors';\nimport { Button } from '../../Button/Button';\nimport { Input } from '../../Input/Input';\nimport { Popover, PopoverProps } from '../../Popover/Popover';\nimport { Icon } from '../../Icon/Icon';\nimport { Select2OptionValue } from '../types';\nimport { useSelect2Context } from './Context';\nimport { Field } from '../../Field/Field';\nimport { Group } from '../../Group/Group';\nimport { useLocalization } from '../../Provider/Provider';\n\nconst AVAILABLE_COLORS = Object.keys(colors);\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = event => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = close => async event => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            handleSave(close)(event);\n        }\n    };\n\n    const handleDelete = close => async event => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave = close => async event => {\n        if (onEdit && (name !== initialName || color !== initialColor)) {\n            try {\n                await onEdit(value, name, color);\n                close();\n            } catch (error) {\n                event.preventDefault();\n                event.stopPropagation();\n                setValidationError(error);\n                ref.current?.focus();\n            }\n        } else {\n            close();\n        }\n    };\n\n    const handleCloseAutoFocus = event => {\n        event.preventDefault();\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const handleInteractOutside = () => {\n        setName(initialName);\n        setColor(initialColor);\n    };\n\n    const preventKeyDownPropagation = event => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal>\n            <Popover.Content\n                onCloseAutoFocus={handleCloseAutoFocus}\n                onInteractOutside={handleInteractOutside}\n                onClick={event => event.stopPropagation()}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Group>\n                                        <Button onClick={close}>{texts.select2.cancel}</Button>\n                                        <Button appearance=\"primary\" onClick={handleSave(close)}>\n                                            {texts.select2.save}\n                                        </Button>\n                                    </Group>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"hover:text-grey-darkest flex items-center justify-start gap-1\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\nconst Colours = props => {\n    const { color, onChangeColor, onClick, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    return (\n        <RadioGroup.Root\n            aria-label={texts.select2.chooseColor}\n            className=\"grid grid-cols-4 gap-2 focus:outline-none\"\n            onClick={onClick}\n            onKeyDown={onKeyDown}\n            onValueChange={color => onChangeColor(color)}\n            value={color}>\n            {AVAILABLE_COLORS.map((availableColor: string) => (\n                <RadioGroup.Item\n                    aria-label={color}\n                    className={cn('flex h-6 w-6 cursor-pointer items-center justify-center rounded', colors[availableColor])}\n                    key={availableColor}\n                    onFocus={() => onChangeColor(availableColor)}\n                    value={availableColor}>\n                    <RadioGroup.Indicator asChild>\n                        <Icon name=\"tick\" className=\"!h-5 !w-5\" />\n                    </RadioGroup.Indicator>\n                </RadioGroup.Item>\n            ))}\n        </RadioGroup.Root>\n    );\n};\n"],"names":["AVAILABLE_COLORS","Object","keys","colors","EditPopover","props","color","initialColor","text","initialName","value","popoverProps","ref","React","useRef","onDelete","onEdit","searchRef","selectRef","useSelect2Context","texts","useLocalization","name","setName","useState","setColor","validationError","setValidationError","handleInputChange","event","target","undefined","handleInputKeyDown","close","stopPropagation","key","handleSave","handleDelete","error","preventDefault","current","focus","handleCloseAutoFocus","handleInteractOutside","preventKeyDownPropagation","Popover","modal","Content","onCloseAutoFocus","onInteractOutside","onClick","placement","tabIndex","className","Field","cn","invalid","message","Input","onChange","onKeyDown","Colours","onChangeColor","Group","Button","select2","cancel","appearance","save","Icon","delete","RadioGroup","chooseColor","onValueChange","map","availableColor","onFocus","asChild"],"mappings":"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"}
+{"version":3,"file":"Edit.js","sources":["../../../../../../../../src/components/Select2/components/Edit.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport * as RadioGroup from '@radix-ui/react-radio-group';\nimport { Color, colors } from '../../../utils/colors';\nimport { Button } from '../../Button/Button';\nimport { Input } from '../../Input/Input';\nimport { Popover, PopoverProps } from '../../Popover/Popover';\nimport { Icon } from '../../Icon/Icon';\nimport { Select2OptionValue } from '../types';\nimport { useSelect2Context } from './Context';\nimport { Field } from '../../Field/Field';\nimport { Group } from '../../Group/Group';\nimport { useLocalization } from '../../Provider/Localization';\n\nconst AVAILABLE_COLORS = Object.keys(colors);\n\nexport type EditPopoverProps = PopoverProps & {\n    color?: Color;\n    text: string;\n    value: Select2OptionValue;\n};\n\nexport const EditPopover = (props: EditPopoverProps) => {\n    const { color: initialColor, text: initialName, value, ...popoverProps } = props;\n    const ref = React.useRef<HTMLInputElement>(null);\n    const { onDelete, onEdit, searchRef, ref: selectRef } = useSelect2Context();\n    const { texts } = useLocalization();\n    const [name, setName] = React.useState(initialName);\n    const [color, setColor] = React.useState(initialColor);\n    const [validationError, setValidationError] = React.useState<Error | undefined>();\n\n    const handleInputChange = event => {\n        setName(event.target.value);\n        setValidationError(undefined);\n    };\n\n    const handleInputKeyDown = close => async event => {\n        event.stopPropagation();\n\n        if (event.key === 'Escape') {\n            close();\n        } else if (event.key === 'Enter') {\n            handleSave(close)(event);\n        }\n    };\n\n    const handleDelete = close => async event => {\n        event.stopPropagation();\n        close();\n\n        if (onDelete) {\n            await onDelete(value);\n        }\n    };\n\n    const handleSave = close => async event => {\n        if (onEdit && (name !== initialName || color !== initialColor)) {\n            try {\n                await onEdit(value, name, color);\n                close();\n            } catch (error) {\n                event.preventDefault();\n                event.stopPropagation();\n                setValidationError(error);\n                ref.current?.focus();\n            }\n        } else {\n            close();\n        }\n    };\n\n    const handleCloseAutoFocus = event => {\n        event.preventDefault();\n        setName(initialName);\n        setColor(initialColor);\n        setValidationError(undefined);\n\n        if (searchRef?.current) {\n            searchRef.current?.focus();\n        } else {\n            selectRef.current?.focus();\n        }\n    };\n\n    const handleInteractOutside = () => {\n        setName(initialName);\n        setColor(initialColor);\n    };\n\n    const preventKeyDownPropagation = event => {\n        if (event.key !== 'Escape') {\n            event.stopPropagation();\n        }\n    };\n\n    return (\n        <Popover {...popoverProps} modal>\n            <Popover.Content\n                onCloseAutoFocus={handleCloseAutoFocus}\n                onInteractOutside={handleInteractOutside}\n                onClick={event => event.stopPropagation()}\n                placement=\"right\"\n                tabIndex={-1}\n                className=\"focus:!shadow-none\">\n                {({ close }) => (\n                    <>\n                        <div className=\"flex w-32 flex-col space-y-2\">\n                            {onEdit ? (\n                                <>\n                                    <Field\n                                        className={cn('!min-h-fit', { '!pb-0': !validationError })}\n                                        invalid={!!validationError}\n                                        message={validationError?.message}>\n                                        <Input\n                                            invalid={!!validationError}\n                                            onChange={handleInputChange}\n                                            onKeyDown={handleInputKeyDown(close)}\n                                            ref={ref}\n                                            value={name}\n                                        />\n                                    </Field>\n                                    {initialColor ? (\n                                        <>\n                                            <h5>Colours</h5>\n                                            <Colours\n                                                color={color}\n                                                onChangeColor={setColor}\n                                                onKeyDown={preventKeyDownPropagation}\n                                            />\n                                        </>\n                                    ) : null}\n                                    <Group>\n                                        <Button onClick={close}>{texts.select2.cancel}</Button>\n                                        <Button appearance=\"primary\" onClick={handleSave(close)}>\n                                            {texts.select2.save}\n                                        </Button>\n                                    </Group>\n                                </>\n                            ) : null}\n                            {onEdit && onDelete ? <hr /> : null}\n                            {onDelete ? (\n                                <button\n                                    className=\"hover:text-grey-darkest flex items-center justify-start gap-1\"\n                                    onClick={handleDelete(close)}\n                                    onKeyDown={preventKeyDownPropagation}>\n                                    <Icon className=\"!h-5 !w-5\" name=\"delete-permanently\" /> {texts.select2.delete}\n                                </button>\n                            ) : null}\n                        </div>\n                    </>\n                )}\n            </Popover.Content>\n        </Popover>\n    );\n};\n\nconst Colours = props => {\n    const { color, onChangeColor, onClick, onKeyDown } = props;\n    const { texts } = useLocalization();\n\n    return (\n        <RadioGroup.Root\n            aria-label={texts.select2.chooseColor}\n            className=\"grid grid-cols-4 gap-2 focus:outline-none\"\n            onClick={onClick}\n            onKeyDown={onKeyDown}\n            onValueChange={color => onChangeColor(color)}\n            value={color}>\n            {AVAILABLE_COLORS.map((availableColor: string) => (\n                <RadioGroup.Item\n                    aria-label={color}\n                    className={cn('flex h-6 w-6 cursor-pointer items-center justify-center rounded', colors[availableColor])}\n                    key={availableColor}\n                    onFocus={() => onChangeColor(availableColor)}\n                    value={availableColor}>\n                    <RadioGroup.Indicator asChild>\n                        <Icon name=\"tick\" className=\"!h-5 !w-5\" />\n                    </RadioGroup.Indicator>\n                </RadioGroup.Item>\n            ))}\n        </RadioGroup.Root>\n    );\n};\n"],"names":["AVAILABLE_COLORS","Object","keys","colors","EditPopover","props","color","initialColor","text","initialName","value","popoverProps","ref","React","useRef","onDelete","onEdit","searchRef","selectRef","useSelect2Context","texts","useLocalization","name","setName","useState","setColor","validationError","setValidationError","handleInputChange","event","target","undefined","handleInputKeyDown","close","stopPropagation","key","handleSave","handleDelete","error","preventDefault","current","focus","handleCloseAutoFocus","handleInteractOutside","preventKeyDownPropagation","Popover","modal","Content","onCloseAutoFocus","onInteractOutside","onClick","placement","tabIndex","className","Field","cn","invalid","message","Input","onChange","onKeyDown","Colours","onChangeColor","Group","Button","select2","cancel","appearance","save","Icon","delete","RadioGroup","chooseColor","onValueChange","map","availableColor","onFocus","asChild"],"mappings":"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"}