@economic/taco 1.1.3 → 1.1.5-alpha.1

package/dist/esm/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 keycode from 'keycode';\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.keyCode === keycode('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","ref","onSearch","props","useLocalization","texts","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","onKeyDown","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;EAGf,uBAAkBC,eAAe,EAAjC;MAAQC,KAAR,oBAAQA,KAAR;;EAEA,IAAMC,WAAW,GAAG,SAAdA,WAAc;IAChB,IAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;MACjBL,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;;GAFR;;EAMA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;;;IAClB,IAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;IAEA,IAAIF,iBAAJ,EAAuB;MACnBL,WAAW;;;IAGf,oBAAAH,KAAK,CAACW,SAAN,2EAAAX,KAAK,EAAaO,KAAb,CAAL;GAPJ;;EAUA,OACIV,aAAA,CAACe,KAAD;kBACgBV,KAAK,CAACW,WAAN,CAAkBC;KAC1Bd;IACJe,MAAM,EACFlB,aAAA,CAACmB,UAAD;MACIC,IAAI,EAAC;MACLC,SAAS,EAAC;MACVd,QAAQ,EAAEJ,KAAK,CAACI;MAChBe,OAAO,EAAEhB;KAJb;IAOJQ,SAAS,EAAEL;IACXR,GAAG,EAAEA;IACLsB,IAAI,EAAC;IAbT,CADJ;AAiBH,CAvC0B;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../../../src/components/SearchInput/SearchInput.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport { Input, InputProps, useLocalization, IconButton } from '../..';\r\n\r\nexport type SearchInputTexts = {\r\n    /**\r\n     * aria-label text for input\r\n     */\r\n    inputLabel: string;\r\n};\r\n\r\nexport type SearchInputProps = Omit<InputProps, 'icon'> & {\r\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 */\r\n    onSearch?: (value: string | number | readonly string[] | undefined) => void;\r\n};\r\n\r\nexport const SearchInput = React.forwardRef(function SearchInput(\r\n    { onSearch, ...props }: SearchInputProps,\r\n    ref: React.Ref<HTMLInputElement>\r\n) {\r\n    const { texts } = useLocalization();\r\n\r\n    const handleClick = (): void => {\r\n        if (!props.disabled) {\r\n            onSearch?.(props.value);\r\n        }\r\n    };\r\n\r\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>): void => {\r\n        const isEnterKeyPressed = event.keyCode === keycode('enter');\r\n\r\n        if (isEnterKeyPressed) {\r\n            handleClick();\r\n        }\r\n\r\n        props.onKeyDown?.(event);\r\n    };\r\n\r\n    return (\r\n        <Input\r\n            aria-label={texts.searchInput.inputLabel}\r\n            {...props}\r\n            button={\r\n                <IconButton\r\n                    icon=\"search\"\r\n                    className=\"!border-transparent !bg-transparent focus:!border-transparent peer-focus:!border-transparent peer-focus:peer-active:!border-transparent\"\r\n                    disabled={props.disabled}\r\n                    onClick={handleClick}\r\n                />\r\n            }\r\n            onKeyDown={handleKeyDown}\r\n            ref={ref}\r\n            type=\"search\"\r\n        />\r\n    );\r\n});\r\n"],"names":["SearchInput","React","onSearch","props","ref","texts","useLocalization","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","onKeyDown","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,CACxC;EAAEE,QAAF;EAAY,GAAGC;AAAf,CADwC,EAExCC,GAFwC;EAIxC,MAAM;IAAEC;MAAUC,eAAe,EAAjC;;EAEA,MAAMC,WAAW,GAAG;IAChB,IAAI,CAACJ,KAAK,CAACK,QAAX,EAAqB;MACjBN,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACM,KAAT,CAAR;;GAFR;;EAMA,MAAMC,aAAa,GAAIC,KAAD;;;IAClB,MAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;IAEA,IAAIF,iBAAJ,EAAuB;MACnBL,WAAW;;;IAGf,oBAAAJ,KAAK,CAACY,SAAN,2EAAAZ,KAAK,EAAaQ,KAAb,CAAL;GAPJ;;EAUA,OACIV,aAAA,CAACe,KAAD;kBACgBX,KAAK,CAACY,WAAN,CAAkBC;KAC1Bf;IACJgB,MAAM,EACFlB,aAAA,CAACmB,UAAD;MACIC,IAAI,EAAC;MACLC,SAAS,EAAC;MACVd,QAAQ,EAAEL,KAAK,CAACK;MAChBe,OAAO,EAAEhB;KAJb;IAOJQ,SAAS,EAAEL;IACXN,GAAG,EAAEA;IACLoB,IAAI,EAAC;IAbT,CADJ;AAiBH,CAvC0B;;;;"}

package/dist/esm/components/Select/Select.js

@@ -1,4 +1,3 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement, useRef, useEffect, Fragment } from 'react';
 import cn from 'classnames';
 import { Icon } from '../Icon/Icon.js';
@@ -10,54 +9,52 @@ import { Combobox } from '../Combobox/Combobox.js';
 import { MultiListbox, Listbox } from '../Listbox/Listbox.js';
 import { useSelect } from './useSelect.js';
 
-var _excluded = ["autoFocus", "className", "highlighted", "style"],
-    _excluded2 = ["editable"];
-var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
-  var autoFocus = props.autoFocus,
-      externalClassName = props.className,
-      style = props.style,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-
-  var _useSelect = useSelect(otherProps, ref),
-      button = _useSelect.button,
-      listbox = _useSelect.listbox,
-      popover = _useSelect.popover,
-      input = _useSelect.input,
-      text = _useSelect.text,
-      _useSelect$more = _useSelect.more,
-      more = _useSelect$more === void 0 ? 0 : _useSelect$more;
-
-  var internalRef = useRef(null);
-  var selectDimensions = useBoundingClientRectListener(internalRef);
-  var className = cn('inline-flex relative w-full', {
+const BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
+  const {
+    autoFocus,
+    className: externalClassName,
+    highlighted,
+    style,
+    ...otherProps
+  } = props;
+  const {
+    button,
+    listbox,
+    popover,
+    input,
+    text,
+    more = 0
+  } = useSelect(otherProps, ref);
+  const internalRef = useRef(null);
+  const selectDimensions = useBoundingClientRectListener(internalRef);
+  const className = cn('inline-flex relative w-full', {
     'yt-select--readonly': props.readOnly
   }, externalClassName);
-  var inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {
+  const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {
     'border-blue': popover.open
   });
-  useEffect(function () {
+  useEffect(() => {
     if (autoFocus && internalRef.current) {
       internalRef.current.focus();
     }
   }, []);
 
-  var renderMultiSelection = function renderMultiSelection() {
+  const renderMultiSelection = () => {
     return createElement(Fragment, null, createElement("span", {
       className: "flex-grow truncate text-left"
     }, text), more > 0 && createElement(Badge, {
       className: "ml-2"
-    }, "+" + more));
+    }, `+${more}`));
   };
 
-  var commonListboxProps = _extends({}, listbox, {
+  const commonListboxProps = { ...listbox,
     className: 'w-auto',
     invalid: undefined,
     style: {
       minWidth: selectDimensions === null || selectDimensions === void 0 ? void 0 : selectDimensions.width
     },
     tabIndex: popover.open ? 0 : -1
-  });
-
+  };
   return createElement("span", {
     className: className,
     "data-taco": "select",
@@ -80,9 +77,11 @@ var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
     type: "text"
   }))));
 });
-var Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
-  var editable = props.editable,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded2);
+const Select = /*#__PURE__*/forwardRef(function Select(props, ref) {
+  const {
+    editable,
+    ...otherProps
+  } = props;
 
   if (editable) {
     return createElement(Combobox, Object.assign({}, otherProps, {

package/dist/esm/components/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Icon } from '../Icon/Icon';\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\nimport { useBoundingClientRectListener } from '../../utils/hooks/useBoundingClientRectListener';\nimport { useSelect } from './useSelect';\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\nimport { Badge } from '../Badge/Badge';\nimport { getInputClasses } from '../Input/util';\n\nexport type SelectTexts = {\n    /**\n     * The text displayed when all options are selected when multiselect mode in on.\n     */\n    allOptionsSelected: string;\n};\n\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\n    Omit<ComboboxProps, 'inline'> & {\n        /**\n         * Allows to select multiple values.\n         * All the selected values will be combined in a comma-seperated string as the value of the input.\n         */\n        multiselect?: boolean;\n    };\n\nexport type SelectProps = BaseSelectProps & {\n    /**\n     * Creates an editable select.\n     * Setting this will render a inline Combobox which will display the provided data on click/focus,\n     * even if there is no value in the input.\n     * After user starts typing, matching data will be displayed.\n     */\n    editable?: boolean;\n};\n\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\n    const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\n    const internalRef = React.useRef<HTMLButtonElement>(null);\n    const selectDimensions = useBoundingClientRectListener(internalRef);\n    const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\n    const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {\n        'border-blue': popover.open,\n    });\n\n    React.useEffect(() => {\n        if (autoFocus && internalRef.current) {\n            internalRef.current.focus();\n        }\n    }, []);\n\n    const renderMultiSelection = (): React.ReactNode => {\n        return (\n            <>\n                <span className=\"flex-grow truncate text-left\">{text}</span>\n                {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\n            </>\n        );\n    };\n\n    const commonListboxProps: ListboxProps = {\n        ...listbox,\n        className: 'w-auto',\n        invalid: undefined,\n        style: { minWidth: selectDimensions?.width },\n        tabIndex: popover.open ? 0 : -1,\n    };\n\n    return (\n        <span className={className} data-taco=\"select\" style={style}>\n            <PopoverPrimitive.Root {...popover}>\n                <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\n                    {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\n                    <span className=\"flex h-8 w-8 items-center justify-center\">\n                        <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\n                    </span>\n                </PopoverPrimitive.Trigger>\n                <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\n                    {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\n                </PopoverPrimitive.Content>\n                <input {...input} className=\"hidden\" type=\"text\" />\n            </PopoverPrimitive.Root>\n        </span>\n    );\n});\n\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\n    const { editable, ...otherProps } = props;\n\n    if (editable) {\n        return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\n    }\n\n    return <BaseSelect {...otherProps} ref={ref} />;\n});\n"],"names":["BaseSelect","React","props","ref","autoFocus","externalClassName","className","style","otherProps","useSelect","button","listbox","popover","input","text","more","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","Combobox","dialog","inline"],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../../src/components/Select/Select.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { Icon } from '../Icon/Icon';\r\nimport { Listbox, MultiListbox, ListboxProps } from '../Listbox/Listbox';\r\nimport { useBoundingClientRectListener } from '../../utils/hooks/useBoundingClientRectListener';\r\nimport { useSelect } from './useSelect';\r\nimport { Combobox, ComboboxProps } from '../Combobox/Combobox';\r\nimport { Badge } from '../Badge/Badge';\r\nimport { getInputClasses } from '../Input/util';\r\n\r\nexport type SelectTexts = {\r\n    /**\r\n     * The text displayed when all options are selected when multiselect mode in on.\r\n     */\r\n    allOptionsSelected: string;\r\n};\r\n\r\nexport type BaseSelectProps = Omit<ListboxProps, 'dialog'> &\r\n    Omit<ComboboxProps, 'inline'> & {\r\n        /**\r\n         * Allows to select multiple values.\r\n         * All the selected values will be combined in a comma-seperated string as the value of the input.\r\n         */\r\n        multiselect?: boolean;\r\n    };\r\n\r\nexport type SelectProps = BaseSelectProps & {\r\n    /**\r\n     * Creates an editable select.\r\n     * Setting this will render a inline Combobox which will display the provided data on click/focus,\r\n     * even if there is no value in the input.\r\n     * After user starts typing, matching data will be displayed.\r\n     */\r\n    editable?: boolean;\r\n};\r\n\r\nconst BaseSelect = React.forwardRef(function BaseSelect(props: BaseSelectProps, ref: React.Ref<HTMLInputElement>) {\r\n    const { autoFocus, className: externalClassName, highlighted, style, ...otherProps } = props;\r\n    const { button, listbox, popover, input, text, more = 0 } = useSelect(otherProps, ref);\r\n    const internalRef = React.useRef<HTMLButtonElement>(null);\r\n    const selectDimensions = useBoundingClientRectListener(internalRef);\r\n    const className = cn('inline-flex relative w-full', { 'yt-select--readonly': props.readOnly }, externalClassName);\r\n    const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {\r\n        'border-blue': popover.open,\r\n    });\r\n\r\n    React.useEffect(() => {\r\n        if (autoFocus && internalRef.current) {\r\n            internalRef.current.focus();\r\n        }\r\n    }, []);\r\n\r\n    const renderMultiSelection = (): React.ReactNode => {\r\n        return (\r\n            <>\r\n                <span className=\"flex-grow truncate text-left\">{text}</span>\r\n                {more > 0 && <Badge className=\"ml-2\">{`+${more}`}</Badge>}\r\n            </>\r\n        );\r\n    };\r\n\r\n    const commonListboxProps: ListboxProps = {\r\n        ...listbox,\r\n        className: 'w-auto',\r\n        invalid: undefined,\r\n        style: { minWidth: selectDimensions?.width },\r\n        tabIndex: popover.open ? 0 : -1,\r\n    };\r\n\r\n    return (\r\n        <span className={className} data-taco=\"select\" style={style}>\r\n            <PopoverPrimitive.Root {...popover}>\r\n                <PopoverPrimitive.Trigger {...button} className={inputClassname} ref={internalRef}>\r\n                    {props.multiselect ? renderMultiSelection() : <span className=\"flex-grow truncate text-left\">{text}</span>}\r\n                    <span className=\"flex h-8 w-8 items-center justify-center\">\r\n                        <Icon className=\"pointer-events-none\" name={popover.open ? 'chevron-up' : 'chevron-down'} />\r\n                    </span>\r\n                </PopoverPrimitive.Trigger>\r\n                <PopoverPrimitive.Content align=\"start\" sideOffset={4}>\r\n                    {props.multiselect ? <MultiListbox {...commonListboxProps} /> : <Listbox {...commonListboxProps} />}\r\n                </PopoverPrimitive.Content>\r\n                <input {...input} className=\"hidden\" type=\"text\" />\r\n            </PopoverPrimitive.Root>\r\n        </span>\r\n    );\r\n});\r\n\r\nexport const Select = React.forwardRef(function Select(props: SelectProps, ref: React.Ref<HTMLInputElement>) {\r\n    const { editable, ...otherProps } = props;\r\n\r\n    if (editable) {\r\n        return <Combobox {...otherProps} dialog={undefined} inline ref={ref} />;\r\n    }\r\n\r\n    return <BaseSelect {...otherProps} ref={ref} />;\r\n});\r\n"],"names":["BaseSelect","React","props","ref","autoFocus","className","externalClassName","highlighted","style","otherProps","button","listbox","popover","input","text","more","useSelect","internalRef","selectDimensions","useBoundingClientRectListener","cn","readOnly","inputClassname","getInputClasses","open","current","focus","renderMultiSelection","Badge","commonListboxProps","invalid","undefined","minWidth","width","tabIndex","PopoverPrimitive","multiselect","Icon","name","align","sideOffset","MultiListbox","Listbox","type","Select","editable","Combobox","dialog","inline"],"mappings":"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"}

package/dist/esm/components/Select/useSelect.js

@@ -1,4 +1,3 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { useState, useMemo, useRef, useEffect, createElement, Fragment, cloneElement } from 'react';
 import cn from 'classnames';
 import { v4 } from 'uuid';
@@ -8,47 +7,37 @@ import keycode from 'keycode';
 import { createCustomEvent } from '../../utils/input.js';
 import { useFlattenedData, findByValue, setInputValueByRef, sanitizeItem } from '../Listbox/util.js';
 
-var _excluded = ["aria-label", "aria-labelledby", "data", "defaultValue", "disabled", "emptyValue", "id", "multiselect", "onBlur", "onClick", "onChange", "readOnly", "value"];
-var useSelect = function useSelect(_ref, ref) {
-  var ariaLabel = _ref['aria-label'],
-      ariaLabelledBy = _ref['aria-labelledby'],
-      _ref$data = _ref.data,
-      data = _ref$data === void 0 ? [] : _ref$data,
-      defaultValue = _ref.defaultValue,
-      disabled = _ref.disabled,
-      emptyValue = _ref.emptyValue,
-      nativeId = _ref.id,
-      multiselect = _ref.multiselect,
-      onBlur = _ref.onBlur,
-      onChange = _ref.onChange,
-      readOnly = _ref.readOnly,
-      value = _ref.value,
-      otherProps = _objectWithoutPropertiesLoose(_ref, _excluded);
-
-  var _useLocalization = useLocalization(),
-      texts = _useLocalization.texts;
-
-  var flattenedData = useFlattenedData(data);
-  var listboxInputRef = useProxiedRef(ref);
-
-  var _React$useState = useState(false),
-      open = _React$useState[0],
-      setOpen = _React$useState[1];
-
-  var id = useMemo(function () {
-    return nativeId || "select_" + v4();
-  }, [nativeId]);
-  var inputRef = useRef(null);
-  var buttonId = id + "-button"; // support 'escape' resetting to the value that was set when the listbox opened
-
-  var _React$useState2 = useState(value),
-      lastValue = _React$useState2[0],
-      setLastValue = _React$useState2[1];
-
-  useEffect(function () {
+const useSelect = ({
+  'aria-label': ariaLabel,
+  'aria-labelledby': ariaLabelledBy,
+  data = [],
+  defaultValue,
+  disabled,
+  emptyValue,
+  id: nativeId,
+  multiselect,
+  onBlur,
+  onClick,
+  onChange,
+  readOnly,
+  value,
+  ...otherProps
+}, ref) => {
+  const {
+    texts
+  } = useLocalization();
+  const flattenedData = useFlattenedData(data);
+  const listboxInputRef = useProxiedRef(ref);
+  const [open, setOpen] = useState(false);
+  const id = useMemo(() => nativeId || `select_${v4()}`, [nativeId]);
+  const inputRef = useRef(null);
+  const buttonId = `${id}-button`; // support 'escape' resetting to the value that was set when the listbox opened
+
+  const [lastValue, setLastValue] = useState(value);
+  useEffect(() => {
     setLastValue(value);
   }, [open]);
-  useEffect(function () {
+  useEffect(() => {
     if (value === undefined) {
       if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {
         setInputValueByRef(inputRef.current, defaultValue);
@@ -70,14 +59,14 @@ var useSelect = function useSelect(_ref, ref) {
     }
   }, []); // event handlers
 
-  var handleButtonKeyDown = function handleButtonKeyDown(event) {
+  const handleButtonKeyDown = event => {
     if (event.keyCode === keycode('up') || event.keyCode === keycode('down')) {
       event.preventDefault();
       setOpen(true);
     }
   };
 
-  var handleListboxKeyDown = function handleListboxKeyDown(event) {
+  const handleListboxKeyDown = event => {
     switch (event.keyCode) {
       case keycode('escape'):
         {
@@ -108,7 +97,7 @@ var useSelect = function useSelect(_ref, ref) {
     }
   };
 
-  var handleListboxClick = function handleListboxClick(event) {
+  const handleListboxClick = event => {
     event.preventDefault();
 
     if (!multiselect) {
@@ -120,16 +109,14 @@ var useSelect = function useSelect(_ref, ref) {
     }
   };
 
-  var text = '';
-  var more = 0;
+  let text = '';
+  let more = 0;
 
   if (value !== undefined) {
     if (multiselect) {
-      var selectedValues = (value === null || value === void 0 ? void 0 : value.toString().split(',')) || [];
+      const selectedValues = (value === null || value === void 0 ? void 0 : value.toString().split(',')) || [];
 
-      if (selectedValues.length === flattenedData.filter(function (item) {
-        return !item.disabled;
-      }).length) {
+      if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {
         text = texts.select.allOptionsSelected;
       } else {
         var _findByValue$text, _findByValue;
@@ -138,7 +125,7 @@ var useSelect = function useSelect(_ref, ref) {
         more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;
       }
     } else {
-      var item = findByValue(flattenedData, value);
+      const item = findByValue(flattenedData, value);
 
       if (item) {
         text = item.icon ? createElement(Fragment, null, cloneElement(item.icon, {
@@ -148,27 +135,24 @@ var useSelect = function useSelect(_ref, ref) {
     }
   }
 
-  var handleInputChange = function handleInputChange(event) {
+  const handleInputChange = event => {
     event.persist();
 
     if (onChange) {
       var _item$path$split, _item$path;
 
-      var _item = findByValue(flattenedData, event.target.value);
-
-      event.detail = sanitizeItem(_item);
-      var indexes = (_item$path$split = _item === null || _item === void 0 ? void 0 : (_item$path = _item.path) === null || _item$path === void 0 ? void 0 : _item$path.split('.')) !== null && _item$path$split !== void 0 ? _item$path$split : [];
+      const item = findByValue(flattenedData, event.target.value);
+      event.detail = sanitizeItem(item);
+      const indexes = (_item$path$split = item === null || item === void 0 ? void 0 : (_item$path = item.path) === null || _item$path === void 0 ? void 0 : _item$path.split('.')) !== null && _item$path$split !== void 0 ? _item$path$split : [];
 
       if (indexes.length > 1) {
         // we don't want to map the current item
         indexes.pop(); // we need to rebuild the path as we map
 
-        var lastPath;
-        event.detail.parents = indexes.map(function (i) {
+        let lastPath;
+        event.detail.parents = indexes.map(i => {
           lastPath = lastPath ? [lastPath, i].join('.') : i;
-          return sanitizeItem(flattenedData.find(function (i) {
-            return i.path === lastPath;
-          }));
+          return sanitizeItem(flattenedData.find(i => i.path === lastPath));
         });
       }
 
@@ -176,44 +160,42 @@ var useSelect = function useSelect(_ref, ref) {
     }
   };
 
-  var button = {
+  const button = {
     'aria-haspopup': 'listbox',
-    'aria-label': ariaLabel ? ariaLabel + " " + text : undefined,
-    'aria-labelledby': ariaLabelledBy ? ariaLabelledBy + " " + buttonId : undefined,
+    'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,
+    'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,
     disabled: disabled || readOnly,
     id: buttonId,
     onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,
     type: 'button'
   };
-
-  var listbox = _extends({}, otherProps, {
+  const listbox = { ...otherProps,
     'aria-label': ariaLabel,
     'aria-labelledby': ariaLabelledBy,
-    data: data,
-    disabled: disabled,
-    emptyValue: emptyValue,
-    onBlur: onBlur,
+    data,
+    disabled,
+    emptyValue,
+    onBlur,
     onClick: handleListboxClick,
-    onChange: function onChange(event) {
+    onChange: event => {
       setInputValueByRef(inputRef.current, event.target.value);
     },
     onKeyDown: handleListboxKeyDown,
     ref: listboxInputRef,
-    value: value
-  });
-
-  var input = {
+    value
+  };
+  const input = {
     onChange: handleInputChange,
     ref: inputRef,
     value: String(value !== null && value !== void 0 ? value : '')
   };
   return {
-    button: button,
-    listbox: listbox,
-    input: input,
+    button,
+    listbox,
+    input,
     popover: {
-      open: open,
-      onOpenChange: function onOpenChange(open) {
+      open,
+      onOpenChange: open => {
         if (!open && onBlur) {
           onBlur(createCustomEvent('blur'));
         }
@@ -221,8 +203,8 @@ var useSelect = function useSelect(_ref, ref) {
         setOpen(open);
       }
     },
-    text: text,
-    more: more
+    text,
+    more
   };
 };
 

package/dist/esm/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 keycode from 'keycode';\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 { useProxiedRef } from '../../utils/hooks/useProxiedRef';\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 = useProxiedRef<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.keyCode === keycode('up') || event.keyCode === keycode('down')) {\n            event.preventDefault();\n            setOpen(true);\n        }\n    };\n\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        switch (event.keyCode) {\n            case keycode('escape'): {\n                event.preventDefault();\n                if (lastValue !== undefined) {\n                    setInputValueByRef(listboxInputRef.current, lastValue);\n                }\n\n                setOpen(false);\n                break;\n            }\n\n            case keycode('tab'):\n            case keycode('enter'): {\n                if (event.keyCode !== keycode('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","ref","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","nativeId","id","multiselect","onBlur","onChange","readOnly","value","otherProps","useLocalization","texts","flattenedData","useFlattenedData","listboxInputRef","useProxiedRef","React","open","setOpen","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","keyCode","keycode","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","onClick","input","String","popover","onOpenChange"],"mappings":"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"}
+{"version":3,"file":"useSelect.js","sources":["../../../../src/components/Select/useSelect.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport keycode from 'keycode';\r\nimport cn from 'classnames';\r\nimport { v4 as uuid } from 'uuid';\r\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\r\nimport { useLocalization } from '../Provider/Provider';\r\nimport { SelectProps } from './Select';\r\nimport { ListboxProps } from '../Listbox/Listbox';\r\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\r\nimport { setInputValueByRef, findByValue, useFlattenedData, sanitizeItem } from '../Listbox/util';\r\nimport { ScrollableListItemValue } from '../Listbox/ScrollableList';\r\nimport { createCustomEvent } from '../../utils/input';\r\n\r\ntype InternalButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement>;\r\ntype InternalListboxProps = ListboxProps & { ref: React.ForwardedRef<HTMLInputElement> };\r\ntype InternalInputProps = React.InputHTMLAttributes<HTMLInputElement> & { ref: React.ForwardedRef<HTMLInputElement> };\r\n\r\ntype useSelect = React.HtmlHTMLAttributes<HTMLDivElement> & {\r\n    button: InternalButtonProps;\r\n    listbox: InternalListboxProps;\r\n    input: InternalInputProps;\r\n    popover: Pick<PopoverPrimitive.PopoverProps, 'onOpenChange' | 'open'>;\r\n    text: string | JSX.Element;\r\n    more?: number;\r\n};\r\n\r\nexport const useSelect = (\r\n    {\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        data = [],\r\n        defaultValue,\r\n        disabled,\r\n        emptyValue,\r\n        id: nativeId,\r\n        multiselect,\r\n        onBlur,\r\n        onClick,\r\n        onChange,\r\n        readOnly,\r\n        value,\r\n        ...otherProps\r\n    }: SelectProps,\r\n    ref: React.Ref<HTMLInputElement>\r\n): useSelect => {\r\n    const { texts } = useLocalization();\r\n    const flattenedData = useFlattenedData(data);\r\n    const listboxInputRef = useProxiedRef<HTMLInputElement>(ref);\r\n    const [open, setOpen] = React.useState(false);\r\n    const id = React.useMemo(() => nativeId || `select_${uuid()}`, [nativeId]);\r\n    const inputRef = React.useRef<HTMLInputElement>(null);\r\n    const buttonId = `${id}-button`;\r\n    // support 'escape' resetting to the value that was set when the listbox opened\r\n    const [lastValue, setLastValue] = React.useState<ScrollableListItemValue | undefined>(value);\r\n\r\n    React.useEffect(() => {\r\n        setLastValue(value);\r\n    }, [open]);\r\n\r\n    React.useEffect(() => {\r\n        if (value === undefined) {\r\n            if (defaultValue !== undefined && findByValue(flattenedData, defaultValue)) {\r\n                setInputValueByRef(inputRef.current, defaultValue);\r\n            } else {\r\n                if (emptyValue !== undefined) {\r\n                    setInputValueByRef(inputRef.current, emptyValue);\r\n                } else if (data.length > 0) {\r\n                    setInputValueByRef(inputRef.current, data[0].value);\r\n                }\r\n            }\r\n        } else {\r\n            if (!multiselect && !findByValue(flattenedData, value)) {\r\n                if (emptyValue !== undefined) {\r\n                    setInputValueByRef(inputRef.current, emptyValue);\r\n                } else if (data.length > 0) {\r\n                    setInputValueByRef(inputRef.current, data[0].value);\r\n                }\r\n            }\r\n        }\r\n    }, []);\r\n\r\n    // event handlers\r\n    const handleButtonKeyDown = (event: React.KeyboardEvent<HTMLButtonElement>): void => {\r\n        if (event.keyCode === keycode('up') || event.keyCode === keycode('down')) {\r\n            event.preventDefault();\r\n            setOpen(true);\r\n        }\r\n    };\r\n\r\n    const handleListboxKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\r\n        switch (event.keyCode) {\r\n            case keycode('escape'): {\r\n                event.preventDefault();\r\n                if (lastValue !== undefined) {\r\n                    setInputValueByRef(listboxInputRef.current, lastValue);\r\n                }\r\n\r\n                setOpen(false);\r\n                break;\r\n            }\r\n\r\n            case keycode('tab'):\r\n            case keycode('enter'): {\r\n                if (event.keyCode !== keycode('tab')) {\r\n                    event.preventDefault();\r\n                }\r\n                setOpen(false);\r\n                break;\r\n            }\r\n\r\n            default:\r\n        }\r\n\r\n        if (otherProps.onKeyDown) {\r\n            otherProps.onKeyDown(event);\r\n        }\r\n    };\r\n\r\n    const handleListboxClick = (event: React.MouseEvent<HTMLLIElement>): void => {\r\n        event.preventDefault();\r\n        if (!multiselect) {\r\n            setOpen(false);\r\n            if (onBlur) {\r\n                onBlur(createCustomEvent('blur'));\r\n            }\r\n        }\r\n    };\r\n\r\n    let text: string | JSX.Element = '';\r\n    let more = 0;\r\n\r\n    if (value !== undefined) {\r\n        if (multiselect) {\r\n            const selectedValues = value?.toString().split(',') || [];\r\n\r\n            if (selectedValues.length === flattenedData.filter(item => !item.disabled).length) {\r\n                text = texts.select.allOptionsSelected;\r\n            } else {\r\n                text = findByValue(flattenedData, selectedValues[0])?.text ?? '';\r\n                more = selectedValues.length > 1 ? selectedValues.length - 1 : 0;\r\n            }\r\n        } else {\r\n            const item = findByValue(flattenedData, value);\r\n\r\n            if (item) {\r\n                text = item.icon ? (\r\n                    <>\r\n                        {React.cloneElement(item.icon, {\r\n                            className: cn(item.icon.props.className, 'mr-1 -mt-px'),\r\n                        })}\r\n                        {item.text}\r\n                    </>\r\n                ) : (\r\n                    item.text\r\n                );\r\n            }\r\n        }\r\n    }\r\n\r\n    const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>): void => {\r\n        event.persist();\r\n\r\n        if (onChange) {\r\n            const item = findByValue(flattenedData, event.target.value);\r\n            (event as any).detail = sanitizeItem(item);\r\n\r\n            const indexes = item?.path?.split('.') ?? [];\r\n\r\n            if (indexes.length > 1) {\r\n                // we don't want to map the current item\r\n                indexes.pop();\r\n                // we need to rebuild the path as we map\r\n                let lastPath: string;\r\n\r\n                (event as any).detail.parents = indexes.map(i => {\r\n                    lastPath = lastPath ? [lastPath, i].join('.') : i;\r\n                    return sanitizeItem(flattenedData.find(i => i.path === lastPath));\r\n                });\r\n            }\r\n\r\n            onChange(event);\r\n        }\r\n    };\r\n\r\n    const button: InternalButtonProps = {\r\n        'aria-haspopup': 'listbox' as const,\r\n        'aria-label': ariaLabel ? `${ariaLabel} ${text}` : undefined,\r\n        'aria-labelledby': ariaLabelledBy ? `${ariaLabelledBy} ${buttonId}` : undefined,\r\n        disabled: disabled || readOnly,\r\n        id: buttonId,\r\n        onKeyDown: !disabled && !readOnly ? handleButtonKeyDown : undefined,\r\n        type: 'button',\r\n    };\r\n\r\n    const listbox: InternalListboxProps = {\r\n        ...otherProps,\r\n        'aria-label': ariaLabel,\r\n        'aria-labelledby': ariaLabelledBy,\r\n        data,\r\n        disabled,\r\n        emptyValue,\r\n        onBlur,\r\n        onClick: handleListboxClick,\r\n        onChange: event => {\r\n            setInputValueByRef(inputRef.current, event.target.value);\r\n        },\r\n        onKeyDown: handleListboxKeyDown,\r\n        ref: listboxInputRef,\r\n        value,\r\n    };\r\n\r\n    const input: InternalInputProps = {\r\n        onChange: handleInputChange,\r\n        ref: inputRef,\r\n        value: String(value ?? ''),\r\n    };\r\n\r\n    return {\r\n        button,\r\n        listbox,\r\n        input,\r\n        popover: {\r\n            open,\r\n            onOpenChange: open => {\r\n                if (!open && onBlur) {\r\n                    onBlur(createCustomEvent('blur'));\r\n                }\r\n                setOpen(open);\r\n            },\r\n        },\r\n        text,\r\n        more,\r\n    };\r\n};\r\n"],"names":["useSelect","ariaLabel","ariaLabelledBy","data","defaultValue","disabled","emptyValue","id","nativeId","multiselect","onBlur","onClick","onChange","readOnly","value","otherProps","ref","texts","useLocalization","flattenedData","useFlattenedData","listboxInputRef","useProxiedRef","open","setOpen","React","uuid","inputRef","buttonId","lastValue","setLastValue","undefined","findByValue","setInputValueByRef","current","length","handleButtonKeyDown","event","keyCode","keycode","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/components/Spinner/Spinner.js

@@ -1,28 +1,21 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import React__default from 'react';
 import cn from 'classnames';
 
-var _excluded = ["delay", "label"];
-var Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref) {
-  var _props$delay = props.delay,
-      delay = _props$delay === void 0 ? 500 : _props$delay,
-      label = props.label,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-
-  var _React$useState = React__default.useState(!delay),
-      visible = _React$useState[0],
-      setVisibility = _React$useState[1];
-
-  React__default.useEffect(function () {
-    var timeout;
+const Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref) {
+  const {
+    delay = 500,
+    label,
+    ...otherProps
+  } = props;
+  const [visible, setVisibility] = React__default.useState(!delay);
+  React__default.useEffect(() => {
+    let timeout;
 
     if (delay) {
-      timeout = window.setTimeout(function () {
-        return setVisibility(true);
-      }, delay);
+      timeout = window.setTimeout(() => setVisibility(true), delay);
     }
 
-    return function () {
+    return () => {
       if (timeout) {
         clearTimeout(timeout);
       }
@@ -33,7 +26,7 @@ var Spinner = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref
     return null;
   }
 
-  var className = cn('inline-flex flex-col relative items-center', otherProps.className);
+  const className = cn('inline-flex flex-col relative items-center', otherProps.className);
   return React__default.createElement("div", Object.assign({}, otherProps, {
     className: className,
     "data-taco": "spinner",

package/dist/esm/components/Spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport './Spinner.css';\n\nexport type SpinnerProps = React.HTMLAttributes<HTMLDivElement> & {\n    /**\n     * Define a delay in milliseconds after which the spinner is shown.\n     * Default value is `500`ms\n     */\n    delay?: number;\n    /** Define a text that will be displayed below spinner */\n    label?: string;\n};\n\nexport const Spinner = React.forwardRef(function Spinner(props: SpinnerProps, ref: React.Ref<HTMLDivElement>) {\n    const { delay = 500, label, ...otherProps } = props;\n    const [visible, setVisibility] = React.useState(!delay);\n\n    React.useEffect(() => {\n        let timeout: number;\n\n        if (delay) {\n            timeout = window.setTimeout(() => setVisibility(true), delay);\n        }\n\n        return () => {\n            if (timeout) {\n                clearTimeout(timeout);\n            }\n        };\n    }, [delay]);\n\n    if (!visible) {\n        return null;\n    }\n\n    const className = cn('inline-flex flex-col relative items-center', otherProps.className);\n\n    return (\n        <div {...otherProps} className={className} data-taco=\"spinner\" ref={ref}>\n            <svg\n                className=\"h-10 w-10 animate-[spinnerRotation_2s_linear_infinite]\"\n                viewBox=\"0 0 100 100\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n            >\n                <circle cx=\"50\" cy=\"50\" r=\"45\"></circle>\n            </svg>\n            {label && <span className=\"mt-4\">{label}</span>}\n        </div>\n    );\n});\n"],"names":["Spinner","React","forwardRef","props","ref","delay","label","otherProps","useState","visible","setVisibility","useEffect","timeout","window","setTimeout","clearTimeout","className","cn","viewBox","xmlns","cx","cy","r"],"mappings":";;;;;IAcaA,OAAO,gBAAGC,cAAK,CAACC,UAAN,CAAiB,SAASF,OAAT,CAAiBG,KAAjB,EAAsCC,GAAtC;EACpC,mBAA8CD,KAA9C,CAAQE,KAAR;MAAQA,KAAR,6BAAgB,GAAhB;MAAqBC,KAArB,GAA8CH,KAA9C,CAAqBG,KAArB;MAA+BC,UAA/B,iCAA8CJ,KAA9C;;EACA,sBAAiCF,cAAK,CAACO,QAAN,CAAe,CAACH,KAAhB,CAAjC;MAAOI,OAAP;MAAgBC,aAAhB;;EAEAT,cAAK,CAACU,SAAN,CAAgB;IACZ,IAAIC,OAAJ;;IAEA,IAAIP,KAAJ,EAAW;MACPO,OAAO,GAAGC,MAAM,CAACC,UAAP,CAAkB;QAAA,OAAMJ,aAAa,CAAC,IAAD,CAAnB;OAAlB,EAA6CL,KAA7C,CAAV;;;IAGJ,OAAO;MACH,IAAIO,OAAJ,EAAa;QACTG,YAAY,CAACH,OAAD,CAAZ;;KAFR;GAPJ,EAYG,CAACP,KAAD,CAZH;;EAcA,IAAI,CAACI,OAAL,EAAc;IACV,OAAO,IAAP;;;EAGJ,IAAMO,SAAS,GAAGC,EAAE,CAAC,4CAAD,EAA+CV,UAAU,CAACS,SAA1D,CAApB;EAEA,OACIf,4BAAA,MAAA,oBAASM;IAAYS,SAAS,EAAEA;iBAAqB;IAAUZ,GAAG,EAAEA;IAApE,EACIH,4BAAA,MAAA;IACIe,SAAS,EAAC;IACVE,OAAO,EAAC;IACRC,KAAK,EAAC;GAHV,EAKIlB,4BAAA,SAAA;IAAQmB,EAAE,EAAC;IAAKC,EAAE,EAAC;IAAKC,CAAC,EAAC;GAA1B,CALJ,CADJ,EAQKhB,KAAK,IAAIL,4BAAA,OAAA;IAAMe,SAAS,EAAC;GAAhB,EAAwBV,KAAxB,CARd,CADJ;AAYH,CApCsB;;;;"}
+{"version":3,"file":"Spinner.js","sources":["../../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import React from 'react';\r\nimport cn from 'classnames';\r\nimport './Spinner.css';\r\n\r\nexport type SpinnerProps = React.HTMLAttributes<HTMLDivElement> & {\r\n    /**\r\n     * Define a delay in milliseconds after which the spinner is shown.\r\n     * Default value is `500`ms\r\n     */\r\n    delay?: number;\r\n    /** Define a text that will be displayed below spinner */\r\n    label?: string;\r\n};\r\n\r\nexport const Spinner = React.forwardRef(function Spinner(props: SpinnerProps, ref: React.Ref<HTMLDivElement>) {\r\n    const { delay = 500, label, ...otherProps } = props;\r\n    const [visible, setVisibility] = React.useState(!delay);\r\n\r\n    React.useEffect(() => {\r\n        let timeout: number;\r\n\r\n        if (delay) {\r\n            timeout = window.setTimeout(() => setVisibility(true), delay);\r\n        }\r\n\r\n        return () => {\r\n            if (timeout) {\r\n                clearTimeout(timeout);\r\n            }\r\n        };\r\n    }, [delay]);\r\n\r\n    if (!visible) {\r\n        return null;\r\n    }\r\n\r\n    const className = cn('inline-flex flex-col relative items-center', otherProps.className);\r\n\r\n    return (\r\n        <div {...otherProps} className={className} data-taco=\"spinner\" ref={ref}>\r\n            <svg\r\n                className=\"h-10 w-10 animate-[spinnerRotation_2s_linear_infinite]\"\r\n                viewBox=\"0 0 100 100\"\r\n                xmlns=\"http://www.w3.org/2000/svg\"\r\n            >\r\n                <circle cx=\"50\" cy=\"50\" r=\"45\"></circle>\r\n            </svg>\r\n            {label && <span className=\"mt-4\">{label}</span>}\r\n        </div>\r\n    );\r\n});\r\n"],"names":["Spinner","React","forwardRef","props","ref","delay","label","otherProps","visible","setVisibility","useState","useEffect","timeout","window","setTimeout","clearTimeout","className","cn","viewBox","xmlns","cx","cy","r"],"mappings":";;;MAcaA,OAAO,gBAAGC,cAAK,CAACC,UAAN,CAAiB,SAASF,OAAT,CAAiBG,KAAjB,EAAsCC,GAAtC;EACpC,MAAM;IAAEC,KAAK,GAAG,GAAV;IAAeC,KAAf;IAAsB,GAAGC;MAAeJ,KAA9C;EACA,MAAM,CAACK,OAAD,EAAUC,aAAV,IAA2BR,cAAK,CAACS,QAAN,CAAe,CAACL,KAAhB,CAAjC;EAEAJ,cAAK,CAACU,SAAN,CAAgB;IACZ,IAAIC,OAAJ;;IAEA,IAAIP,KAAJ,EAAW;MACPO,OAAO,GAAGC,MAAM,CAACC,UAAP,CAAkB,MAAML,aAAa,CAAC,IAAD,CAArC,EAA6CJ,KAA7C,CAAV;;;IAGJ,OAAO;MACH,IAAIO,OAAJ,EAAa;QACTG,YAAY,CAACH,OAAD,CAAZ;;KAFR;GAPJ,EAYG,CAACP,KAAD,CAZH;;EAcA,IAAI,CAACG,OAAL,EAAc;IACV,OAAO,IAAP;;;EAGJ,MAAMQ,SAAS,GAAGC,EAAE,CAAC,4CAAD,EAA+CV,UAAU,CAACS,SAA1D,CAApB;EAEA,OACIf,4BAAA,MAAA,oBAASM;IAAYS,SAAS,EAAEA;iBAAqB;IAAUZ,GAAG,EAAEA;IAApE,EACIH,4BAAA,MAAA;IACIe,SAAS,EAAC;IACVE,OAAO,EAAC;IACRC,KAAK,EAAC;GAHV,EAKIlB,4BAAA,SAAA;IAAQmB,EAAE,EAAC;IAAKC,EAAE,EAAC;IAAKC,CAAC,EAAC;GAA1B,CALJ,CADJ,EAQKhB,KAAK,IAAIL,4BAAA,OAAA;IAAMe,SAAS,EAAC;GAAhB,EAAwBV,KAAxB,CARd,CADJ;AAYH,CApCsB;;;;"}

package/dist/esm/components/Switch/Switch.js

@@ -1,20 +1,19 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { Root, Thumb } from '@radix-ui/react-switch';
 
-var _excluded = ["label", "onChange"];
-var Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
-  var label = props.label,
-      onChange = props.onChange,
-      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
-
-  var className = cn('group h-5 w-9 flex rounded-full inline-flex', {
+const Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
+  const {
+    label,
+    onChange,
+    ...otherProps
+  } = props;
+  const className = cn('group h-5 w-9 flex rounded-full inline-flex', {
     'mr-2': !!label,
     'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus': !props.disabled,
     'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled
   }, props.className);
-  var element = createElement(Root, Object.assign({}, otherProps, {
+  const element = createElement(Root, Object.assign({}, otherProps, {
     className: className,
     onCheckedChange: onChange,
     ref: ref
@@ -23,7 +22,7 @@ var Switch = /*#__PURE__*/forwardRef(function Switch(props, ref) {
   }));
 
   if (label) {
-    var labelClassName = cn('flex items-center cursor-pointer', {
+    const labelClassName = cn('flex items-center cursor-pointer', {
       'cursor-not-allowed text-grey-dark': props.disabled
     });
     return createElement("label", {

package/dist/esm/components/Switch/Switch.js.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\n\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\n    /** Label for the switch */\n    label?: React.ReactNode;\n    /* Whether user input is required */\n    required?: boolean;\n};\n\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\n    checked?: never;\n    onChange?: never;\n    /* The default checked state (uncontrolled) */\n    defaultChecked?: boolean;\n}\n\ninterface ControlledSwitchProps extends SwitchBaseProps {\n    defaultChecked?: never;\n    /* The current checked state (controlled) */\n    checked: boolean;\n    /* Handler called when the checked state changes */\n    onChange: (checked: boolean) => void;\n}\n\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\n\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\n    const { label, onChange, ...otherProps } = props;\n\n    const className = cn(\n        'group h-5 w-9 flex rounded-full inline-flex',\n        {\n            'mr-2': !!label,\n            'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus':\n                !props.disabled,\n            'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\n        },\n        props.className\n    );\n\n    const element = (\n        <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\n            <PrimitiveSwitch.Thumb className=\"'will-change-transform group-aria-checked:translate-x-[1.1rem] mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50\" />\n        </PrimitiveSwitch.Root>\n    );\n\n    if (label) {\n        const labelClassName = cn('flex items-center cursor-pointer', {\n            'cursor-not-allowed text-grey-dark': props.disabled,\n        });\n\n        return (\n            <label className={labelClassName}>\n                {element}\n                {label}\n            </label>\n        );\n    }\n\n    return element;\n});\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;;;IA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;EACnC,IAAQC,KAAR,GAA2CF,KAA3C,CAAQE,KAAR;MAAeC,QAAf,GAA2CH,KAA3C,CAAeG,QAAf;MAA4BC,UAA5B,iCAA2CJ,KAA3C;;EAEA,IAAMK,SAAS,GAAGC,EAAE,CAChB,6CADgB,EAEhB;IACI,QAAQ,CAAC,CAACJ,KADd;IAEI,0GACI,CAACF,KAAK,CAACO,QAHf;IAII,+DAA+DP,KAAK,CAACO;GANzD,EAQhBP,KAAK,CAACK,SARU,CAApB;EAWA,IAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;IAAYC,SAAS,EAAEA;IAAWK,eAAe,EAAEP;IAAUF,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;IAAuBJ,SAAS,EAAC;GAAjC,CADJ,CADJ;;EAMA,IAAIH,KAAJ,EAAW;IACP,IAAMS,cAAc,GAAGL,EAAE,CAAC,kCAAD,EAAqC;MAC1D,qCAAqCN,KAAK,CAACO;KADtB,CAAzB;IAIA,OACIR,aAAA,QAAA;MAAOM,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;;;EAQJ,OAAOM,OAAP;AACH,CAlCqB;;;;"}
+{"version":3,"file":"Switch.js","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport cn from 'classnames';\r\nimport * as PrimitiveSwitch from '@radix-ui/react-switch';\r\n\r\ntype SwitchBaseProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children' | 'onChange'> & {\r\n    /** Label for the switch */\r\n    label?: React.ReactNode;\r\n    /* Whether user input is required */\r\n    required?: boolean;\r\n};\r\n\r\ninterface UncontrolledSwitchProps extends SwitchBaseProps {\r\n    checked?: never;\r\n    onChange?: never;\r\n    /* The default checked state (uncontrolled) */\r\n    defaultChecked?: boolean;\r\n}\r\n\r\ninterface ControlledSwitchProps extends SwitchBaseProps {\r\n    defaultChecked?: never;\r\n    /* The current checked state (controlled) */\r\n    checked: boolean;\r\n    /* Handler called when the checked state changes */\r\n    onChange: (checked: boolean) => void;\r\n}\r\n\r\nexport type SwitchProps = UncontrolledSwitchProps | ControlledSwitchProps;\r\n\r\nexport const Switch = React.forwardRef(function Switch(props: SwitchProps, ref: React.Ref<HTMLButtonElement>) {\r\n    const { label, onChange, ...otherProps } = props;\r\n\r\n    const className = cn(\r\n        'group h-5 w-9 flex rounded-full inline-flex',\r\n        {\r\n            'mr-2': !!label,\r\n            'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus':\r\n                !props.disabled,\r\n            'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled,\r\n        },\r\n        props.className\r\n    );\r\n\r\n    const element = (\r\n        <PrimitiveSwitch.Root {...otherProps} className={className} onCheckedChange={onChange} ref={ref}>\r\n            <PrimitiveSwitch.Thumb className=\"'will-change-transform group-aria-checked:translate-x-[1.1rem] mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50\" />\r\n        </PrimitiveSwitch.Root>\r\n    );\r\n\r\n    if (label) {\r\n        const labelClassName = cn('flex items-center cursor-pointer', {\r\n            'cursor-not-allowed text-grey-dark': props.disabled,\r\n        });\r\n\r\n        return (\r\n            <label className={labelClassName}>\r\n                {element}\r\n                {label}\r\n            </label>\r\n        );\r\n    }\r\n\r\n    return element;\r\n});\r\n"],"names":["Switch","React","props","ref","label","onChange","otherProps","className","cn","disabled","element","PrimitiveSwitch","onCheckedChange","labelClassName"],"mappings":";;;;MA4BaA,MAAM,gBAAGC,UAAA,CAAiB,SAASD,MAAT,CAAgBE,KAAhB,EAAoCC,GAApC;EACnC,MAAM;IAAEC,KAAF;IAASC,QAAT;IAAmB,GAAGC;MAAeJ,KAA3C;EAEA,MAAMK,SAAS,GAAGC,EAAE,CAChB,6CADgB,EAEhB;IACI,QAAQ,CAAC,CAACJ,KADd;IAEI,0GACI,CAACF,KAAK,CAACO,QAHf;IAII,+DAA+DP,KAAK,CAACO;GANzD,EAQhBP,KAAK,CAACK,SARU,CAApB;EAWA,MAAMG,OAAO,GACTT,aAAA,CAACU,IAAD,oBAA0BL;IAAYC,SAAS,EAAEA;IAAWK,eAAe,EAAEP;IAAUF,GAAG,EAAEA;IAA5F,EACIF,aAAA,CAACU,KAAD;IAAuBJ,SAAS,EAAC;GAAjC,CADJ,CADJ;;EAMA,IAAIH,KAAJ,EAAW;IACP,MAAMS,cAAc,GAAGL,EAAE,CAAC,kCAAD,EAAqC;MAC1D,qCAAqCN,KAAK,CAACO;KADtB,CAAzB;IAIA,OACIR,aAAA,QAAA;MAAOM,SAAS,EAAEM;KAAlB,EACKH,OADL,EAEKN,KAFL,CADJ;;;EAQJ,OAAOM,OAAP;AACH,CAlCqB;;;;"}