@economic/taco 0.0.12-alpha.0 → 0.0.15-alpha.0

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

@@ -1 +1 @@
-{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { State } from '../../types';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\nimport { getButtonStateClasses, getInputClasses } from './util';\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n    /** Shows a button within the input field */\n    button?: React.ReactElement;\n    /** Shows an icon within the input field  */\n    icon?: IconName | JSX.Element;\n    /** Draws attention to the input by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** State will change the style of the input **/\n    state?: State;\n};\n\nexport const Input = React.forwardRef(function Input(props: InputProps, ref: React.Ref<HTMLInputElement>) {\n    const { button, icon, highlighted, state, autoFocus, ...otherProps } = props;\n    const inputRef = useProxiedRef<HTMLInputElement>(ref);\n    const hasContainer = button || icon;\n    const className = cn(\n        getInputClasses(props),\n        'min-h-[theme(spacing.8)] pointer-events-all',\n        {\n            'pr-8': !!hasContainer,\n        },\n        !hasContainer && otherProps.className\n    );\n\n    React.useEffect(() => {\n        if (autoFocus && inputRef.current) {\n            inputRef.current.focus();\n        }\n    }, []);\n\n    const input = <input {...otherProps} className={className} data-taco=\"input\" ref={inputRef} />;\n\n    if (hasContainer) {\n        let extra: any;\n\n        if (button) {\n            const disabled = button.props.disabled ?? otherProps.disabled;\n            const buttonClassName = cn(\n                'items-center flex justify-center border absolute rounded-l-none rounded-r right-0 h-full focus:rounded focus:outline-none',\n                {\n                    [getButtonStateClasses(state)]: !props.disabled,\n                },\n                button.props.className\n            );\n            extra = React.cloneElement(button, {\n                className: buttonClassName,\n                disabled,\n            });\n        } else if (icon) {\n            const iconClassName = cn(\n                'items-center flex justify-center absolute pointer-events-none mr-1 p-px right-0 w-5 top-1/2 -translate-y-1/2',\n                {\n                    'text-grey-dark': props.disabled,\n                    'text-grey-darkest': !props.disabled,\n                }\n            );\n            extra =\n                typeof icon === 'string' ? (\n                    <Icon className={iconClassName} name={icon} />\n                ) : (\n                    React.cloneElement(icon, { className: cn(iconClassName, icon.props.className) })\n                );\n        }\n\n        const containerClassName = cn('bg-white inline-flex relative rounded w-full', otherProps.className);\n\n        return (\n            <div className={containerClassName} data-taco=\"input-container\">\n                {input}\n                {extra}\n            </div>\n        );\n    }\n\n    return input;\n});\n"],"names":["Input","React","props","ref","button","icon","state","autoFocus","otherProps","inputRef","useProxiedRef","hasContainer","className","cn","getInputClasses","current","focus","input","extra","disabled","buttonClassName","getButtonStateClasses","iconClassName","Icon","name","containerClassName"],"mappings":";;;;;;;;IAkBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASD,KAAT,CAAeE,KAAf,EAAkCC,GAAlC;AAClC,MAAQC,MAAR,GAAuEF,KAAvE,CAAQE,MAAR;AAAA,MAAgBC,IAAhB,GAAuEH,KAAvE,CAAgBG,IAAhB;AAAA,MAAmCC,KAAnC,GAAuEJ,KAAvE,CAAmCI,KAAnC;AAAA,MAA0CC,SAA1C,GAAuEL,KAAvE,CAA0CK,SAA1C;AAAA,MAAwDC,UAAxD,iCAAuEN,KAAvE;;AACA,MAAMO,QAAQ,GAAGC,aAAa,CAAmBP,GAAnB,CAA9B;AACA,MAAMQ,YAAY,GAAGP,MAAM,IAAIC,IAA/B;AACA,MAAMO,SAAS,GAAGC,EAAE,CAChBC,eAAe,CAACZ,KAAD,CADC,EAEhB,6CAFgB,EAGhB;AACI,YAAQ,CAAC,CAACS;AADd,GAHgB,EAMhB,CAACA,YAAD,IAAiBH,UAAU,CAACI,SANZ,CAApB;AASAX,EAAAA,SAAA,CAAgB;AACZ,QAAIM,SAAS,IAAIE,QAAQ,CAACM,OAA1B,EAAmC;AAC/BN,MAAAA,QAAQ,CAACM,OAAT,CAAiBC,KAAjB;AACH;AACJ,GAJD,EAIG,EAJH;AAMA,MAAMC,KAAK,GAAGhB,aAAA,QAAA,oBAAWO;AAAYI,IAAAA,SAAS,EAAEA;iBAAqB;AAAQT,IAAAA,GAAG,EAAEM;IAApE,CAAd;;AAEA,MAAIE,YAAJ,EAAkB;AACd,QAAIO,KAAJ;;AAEA,QAAId,MAAJ,EAAY;AAAA;;AACR,UAAMe,QAAQ,4BAAGf,MAAM,CAACF,KAAP,CAAaiB,QAAhB,yEAA4BX,UAAU,CAACW,QAArD;AACA,UAAMC,eAAe,GAAGP,EAAE,CACtB,2HADsB,iBAGjBQ,qBAAqB,CAACf,KAAD,CAHJ,IAGc,CAACJ,KAAK,CAACiB,QAHrB,QAKtBf,MAAM,CAACF,KAAP,CAAaU,SALS,CAA1B;AAOAM,MAAAA,KAAK,GAAGjB,YAAA,CAAmBG,MAAnB,EAA2B;AAC/BQ,QAAAA,SAAS,EAAEQ,eADoB;AAE/BD,QAAAA,QAAQ,EAARA;AAF+B,OAA3B,CAAR;AAIH,KAbD,MAaO,IAAId,IAAJ,EAAU;AACb,UAAMiB,aAAa,GAAGT,EAAE,CACpB,8GADoB,EAEpB;AACI,0BAAkBX,KAAK,CAACiB,QAD5B;AAEI,6BAAqB,CAACjB,KAAK,CAACiB;AAFhC,OAFoB,CAAxB;AAOAD,MAAAA,KAAK,GACD,OAAOb,IAAP,KAAgB,QAAhB,GACIJ,aAAA,CAACsB,IAAD;AAAMX,QAAAA,SAAS,EAAEU;AAAeE,QAAAA,IAAI,EAAEnB;OAAtC,CADJ,GAGIJ,YAAA,CAAmBI,IAAnB,EAAyB;AAAEO,QAAAA,SAAS,EAAEC,EAAE,CAACS,aAAD,EAAgBjB,IAAI,CAACH,KAAL,CAAWU,SAA3B;AAAf,OAAzB,CAJR;AAMH;;AAED,QAAMa,kBAAkB,GAAGZ,EAAE,CAAC,8CAAD,EAAiDL,UAAU,CAACI,SAA5D,CAA7B;AAEA,WACIX,aAAA,MAAA;AAAKW,MAAAA,SAAS,EAAEa;mBAA8B;KAA9C,EACKR,KADL,EAEKC,KAFL,CADJ;AAMH;;AAED,SAAOD,KAAP;AACH,CAhEoB;;;;"}
+{"version":3,"file":"Input.js","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { State } from '../../types';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\nimport { getButtonStateClasses, getInputClasses } from './util';\n\nexport type InputProps = React.InputHTMLAttributes<HTMLInputElement> & {\n    /** Shows a button within the input field */\n    button?: React.ReactElement;\n    /** Shows an icon within the input field  */\n    icon?: IconName | JSX.Element;\n    /** Draws attention to the input by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** State will change the style of the input **/\n    state?: State;\n};\n\nexport const Input = React.forwardRef(function Input(props: InputProps, ref: React.Ref<HTMLInputElement>) {\n    const { button, icon, highlighted, onKeyDown, state, autoFocus, ...otherProps } = props;\n    const inputRef = useProxiedRef<HTMLInputElement>(ref);\n    const hasContainer = button || icon;\n    const className = cn(\n        getInputClasses(props),\n        'min-h-[theme(spacing.8)] pointer-events-all',\n        {\n            'pr-8': !!hasContainer,\n        },\n        !hasContainer && otherProps.className\n    );\n\n    React.useEffect(() => {\n        if (autoFocus && inputRef.current) {\n            inputRef.current.focus();\n        }\n    }, []);\n\n    // home and end keys only navigate to the start/end of input value if the input container does not scroll\n    // if it has scroll height then the browser reverts to native scrolling behaviour only\n    // so we manually override it to ensure _our_ desired behaviour remains intact\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {\n        if (event.key === 'Home' || event.key === 'End') {\n            event.preventDefault();\n            const position = event.key === 'End' ? event.currentTarget.value.length : 0;\n            event.currentTarget.setSelectionRange(position, position);\n        }\n\n        if (onKeyDown) {\n            onKeyDown(event);\n        }\n    };\n\n    const input = <input {...otherProps} className={className} data-taco=\"input\" onKeyDown={handleKeyDown} ref={inputRef} />;\n\n    if (hasContainer) {\n        let extra: any;\n\n        if (button) {\n            const disabled = button.props.disabled ?? otherProps.disabled;\n            const buttonClassName = cn(\n                'items-center flex justify-center border absolute rounded-l-none rounded-r right-0 h-full focus:rounded focus:outline-none',\n                {\n                    [getButtonStateClasses(state)]: !props.disabled,\n                },\n                button.props.className\n            );\n            extra = React.cloneElement(button, {\n                className: buttonClassName,\n                disabled,\n            });\n        } else if (icon) {\n            const iconClassName = cn(\n                'items-center flex justify-center absolute pointer-events-none mr-1 p-px right-0 w-5 top-1/2 -translate-y-1/2',\n                {\n                    'text-grey-dark': props.disabled,\n                    'text-grey-darkest': !props.disabled,\n                }\n            );\n            extra =\n                typeof icon === 'string' ? (\n                    <Icon className={iconClassName} name={icon} />\n                ) : (\n                    React.cloneElement(icon, { className: cn(iconClassName, icon.props.className) })\n                );\n        }\n\n        const containerClassName = cn('bg-white inline-flex relative rounded w-full', otherProps.className);\n\n        return (\n            <div className={containerClassName} data-taco=\"input-container\">\n                {input}\n                {extra}\n            </div>\n        );\n    }\n\n    return input;\n});\n"],"names":["Input","React","props","ref","button","icon","onKeyDown","state","autoFocus","otherProps","inputRef","useProxiedRef","hasContainer","className","cn","getInputClasses","current","focus","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","input","extra","disabled","buttonClassName","getButtonStateClasses","iconClassName","Icon","name","containerClassName"],"mappings":"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"}

package/dist/esm/components/Menu/components/Item.js.map

@@ -1 +1 @@
-{"version":3,"file":"Item.js","sources":["../../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { useCurrentMenu } from '../Context';\nimport { Appearance } from '../../../types';\nimport { DialogProps } from '../../Dialog/Dialog';\n\nexport const Icon = ({ name }) => (\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nconst getAppearanceClasses = (appearance: Appearance | undefined) => {\n    switch (appearance) {\n        case 'primary':\n            return 'wcag-blue aria-disabled:text-blue-dark focus:wcag-blue-light';\n\n        case 'danger':\n            return 'wcag-red aria-disabled:text-red-dark focus:wcag-red-light';\n\n        case 'ghost':\n            return 'text-blue aria-disabled:text-grey focus:wcag-blue';\n\n        case 'discrete':\n            return 'text-black aria-disabled:text-grey focus:wcag-blue-lightest';\n\n        case 'default':\n        default:\n            return 'wcag-grey-light aria-disabled:text-grey-darker focus:wcag-grey-dark';\n    }\n};\n\nexport const useItemStyling = ({ disabled, indented, className }) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'flex items-center justify-start h-7 pr-1.5 relative rounded w-full focus:outline-none group',\n        getAppearanceClasses(menu?.appearance),\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            'cursor-pointer': !disabled,\n            'cursor-not-allowed': disabled,\n        },\n        className\n    );\n};\n\nexport const Shortcut = props => {\n    const menu = useCurrentMenu();\n    let appearance;\n\n    switch (menu?.appearance) {\n        case 'primary':\n            appearance = 'text-blue-lightest group-focus:text-black';\n            break;\n\n        case 'danger':\n            appearance = 'text-red-lightest group-focus:text-white';\n            break;\n\n        case 'ghost':\n            appearance = 'text-blue-light group-focus:text-blue-lightest';\n            break;\n\n        case 'discrete':\n            appearance = 'text-grey-darker group-focus:text-blue-light';\n            break;\n\n        case 'default':\n        default:\n            appearance = 'text-grey-darkest';\n            break;\n    }\n\n    const className = cn('ml-auto pl-3', appearance);\n\n    return <span {...props} className={className} />;\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, ...otherProps } = props;\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    let disabled = props.disabled ?? props['aria-disabled'];\n\n    let handleClick;\n\n    // radix has a bug that does not disable clicks when disabled is set on items\n    if (disabled) {\n        handleClick = event => {\n            event.preventDefault();\n            event.stopPropagation();\n        };\n    }\n\n    let handleSelect = event => {\n        if (onClick) {\n            onClick(event);\n        }\n\n        if (props['aria-haspopup'] || typeof dialog === 'function') {\n            event.preventDefault();\n        }\n    };\n\n    let button = (\n        <DropdownMenuPrimitive.Item {...otherProps} className={className} onClick={handleClick} onSelect={handleSelect} ref={ref}>\n            {icon && <Icon name={icon} />}\n            {props.children}\n            {shortcut && <Shortcut>{shortcut}</Shortcut>}\n        </DropdownMenuPrimitive.Item>\n    );\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button });\n    }\n\n    return button;\n});\n"],"names":["Icon","name","React","className","IconPrimitive","getAppearanceClasses","appearance","useItemStyling","disabled","indented","menu","useCurrentMenu","registerIndentation","cn","Shortcut","props","Item","MenuItem","ref","dialog","icon","onClick","shortcut","otherProps","handleClick","event","preventDefault","stopPropagation","handleSelect","button","DropdownMenuPrimitive","onSelect","children","trigger"],"mappings":"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"}
+{"version":3,"file":"Item.js","sources":["../../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport cn from 'classnames';\nimport { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { useCurrentMenu } from '../Context';\nimport { Appearance } from '../../../types';\nimport { DialogProps } from '../../Dialog/Dialog';\n\nexport const Icon = ({ name }) => (\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nconst getAppearanceClasses = (appearance: Appearance | undefined) => {\n    switch (appearance) {\n        case 'primary':\n            return 'wcag-blue aria-disabled:text-blue-dark focus:wcag-blue-light';\n\n        case 'danger':\n            return 'wcag-red aria-disabled:text-red-dark focus:wcag-red-light';\n\n        case 'ghost':\n            return 'text-blue aria-disabled:text-grey focus:wcag-blue';\n\n        case 'discrete':\n            return 'text-black aria-disabled:text-grey focus:wcag-blue-lightest';\n\n        case 'default':\n        default:\n            return 'wcag-grey-light aria-disabled:text-grey-darker focus:wcag-grey-dark';\n    }\n};\n\nexport const useItemStyling = ({ disabled, indented, className }) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'flex items-center justify-start h-7 pr-1.5 relative rounded w-full focus:outline-none group',\n        getAppearanceClasses(menu?.appearance),\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            'cursor-pointer': !disabled,\n            'cursor-not-allowed': disabled,\n        },\n        className\n    );\n};\n\nexport const Shortcut = props => {\n    const menu = useCurrentMenu();\n    let appearance;\n\n    switch (menu?.appearance) {\n        case 'primary':\n            appearance = 'text-blue-lightest group-focus:text-black';\n            break;\n\n        case 'danger':\n            appearance = 'text-red-lightest group-focus:text-white';\n            break;\n\n        case 'ghost':\n            appearance = 'text-blue-light group-focus:text-blue-lightest';\n            break;\n\n        case 'discrete':\n            appearance = 'text-grey-darker group-focus:text-blue-light';\n            break;\n\n        case 'default':\n        default:\n            appearance = 'text-grey-darkest';\n            break;\n    }\n\n    const className = cn('ml-auto pl-3', appearance);\n\n    return <span {...props} className={className} />;\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, ...otherProps } = props;\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = props.disabled ?? props['aria-disabled'];\n\n    let handleClick;\n\n    // radix has a bug that does not disable clicks when disabled is set on items\n    if (disabled) {\n        handleClick = event => {\n            event.preventDefault();\n            event.stopPropagation();\n        };\n    }\n\n    const handleSelect = event => {\n        if (onClick) {\n            onClick(event);\n        }\n\n        if (props['aria-haspopup'] || typeof dialog === 'function') {\n            event.preventDefault();\n        }\n    };\n\n    let button = (\n        <DropdownMenuPrimitive.Item {...otherProps} className={className} onClick={handleClick} onSelect={handleSelect} ref={ref}>\n            {icon && <Icon name={icon} />}\n            {props.children}\n            {shortcut && <Shortcut>{shortcut}</Shortcut>}\n        </DropdownMenuPrimitive.Item>\n    );\n\n    if (typeof dialog === 'function') {\n        button = dialog({ trigger: button });\n    }\n\n    return button;\n});\n"],"names":["Icon","name","React","className","IconPrimitive","getAppearanceClasses","appearance","useItemStyling","disabled","indented","menu","useCurrentMenu","registerIndentation","cn","Shortcut","props","Item","MenuItem","ref","dialog","icon","onClick","shortcut","otherProps","handleClick","event","preventDefault","stopPropagation","handleSelect","button","DropdownMenuPrimitive","onSelect","children","trigger"],"mappings":"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"}

package/dist/esm/components/Provider/Provider.js

@@ -65,7 +65,7 @@ var defaultLocalisationTexts = {
     back: 'Back',
     close: 'Close',
     skip: 'Close and complete',
-    last: 'Last',
+    last: 'Done',
     next: 'Next',
     open: 'Open'
   },

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

@@ -1 +1 @@
-{"version":3,"file":"Provider.js","sources":["../../../../src/components/Provider/Provider.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Locale } from '../../types';\nimport { CalendarTexts } from '../Calendar/Calendar';\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';\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 [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 [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    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    toasts: {\n        dismiss: 'Dismiss',\n    },\n    tour: {\n        back: 'Back',\n        close: 'Close',\n        skip: 'Close and complete',\n        last: 'Last',\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            <ToastProvider>{children}</ToastProvider>\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","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","toasts","dismiss","tour","back","skip","last","next","open","searchInput","inputLabel","defaultLocalizationContext","locale","texts","formatting","date","Context","React","localization","Provider","props","children","value","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';\n\nimport { Locale } from '../../types';\nimport { CalendarTexts } from '../Calendar/Calendar';\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';\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 [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 [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    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    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            <ToastProvider>{children}</ToastProvider>\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","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","toasts","dismiss","tour","back","skip","last","next","open","searchInput","inputLabel","defaultLocalizationContext","locale","texts","formatting","date","Context","React","localization","Provider","props","children","value","ToastProvider","useTaco","useLocalization"],"mappings":"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"}

package/dist/esm/components/SearchInput/SearchInput.js

@@ -19,15 +19,16 @@ import { Input } from '../Input/Input.js';
 import keycode from 'keycode';
 import '../../utils/hooks/useListKeyboardNavigation.js';
 import '../../utils/hooks/useListScrollTo.js';
+import '../../utils/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 '../Label/Label.js';
 import '../Listbox/Listbox.js';
 import '../RadioGroup/RadioGroup.js';
 import '../Menu/Menu.js';
@@ -75,12 +76,13 @@ var SearchInput = /*#__PURE__*/forwardRef(function SearchInput(_ref, ref) {
   }, props, {
     button: createElement(IconButton, {
       icon: "search",
-      className: "!bg-transparent !border-transparent",
+      className: "!border-transparent !bg-transparent",
       disabled: props.disabled,
       onClick: handleClick
     }),
     onKeyDown: handleKeyDown,
-    ref: ref
+    ref: ref,
+    type: "search"
   }));
 });
 

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\n    return (\n        <Input\n            aria-label={texts.searchInput.inputLabel}\n            {...props}\n            button={\n                <IconButton\n                    icon=\"search\"\n                    className=\"!bg-transparent !border-transparent\"\n                    disabled={props.disabled}\n                    onClick={handleClick}\n                />\n            }\n            onKeyDown={handleKeyDown}\n            ref={ref}\n        />\n    );\n});\n"],"names":["SearchInput","React","ref","onSearch","props","useLocalization","texts","handleClick","disabled","value","handleKeyDown","event","isEnterKeyPressed","keyCode","keycode","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","onKeyDown"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;AAGf,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAChB,QAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;AACjBL,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;AACJ,GAND;;AAQA,SACIN,aAAA,CAACc,KAAD;kBACgBT,KAAK,CAACU,WAAN,CAAkBC;KAC1Bb;AACJc,IAAAA,MAAM,EACFjB,aAAA,CAACkB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVb,MAAAA,QAAQ,EAAEJ,KAAK,CAACI;AAChBc,MAAAA,OAAO,EAAEf;KAJb;AAOJgB,IAAAA,SAAS,EAAEb;AACXR,IAAAA,GAAG,EAAEA;IAZT,CADJ;AAgBH,CApC0B;;;;"}
+{"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\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\"\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","Input","searchInput","inputLabel","button","IconButton","icon","className","onClick","onKeyDown","type"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgBaA,WAAW,gBAAGC,UAAA,CAAiB,SAASD,WAAT,OAExCE,GAFwC;MACtCC,gBAAAA;MAAaC;;AAGf,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc;AAChB,QAAI,CAACH,KAAK,CAACI,QAAX,EAAqB;AACjBL,MAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CAAGC,KAAK,CAACK,KAAT,CAAR;AACH;AACJ,GAJD;;AAMA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAMC,iBAAiB,GAAGD,KAAK,CAACE,OAAN,KAAkBC,OAAO,CAAC,OAAD,CAAnD;;AAEA,QAAIF,iBAAJ,EAAuB;AACnBL,MAAAA,WAAW;AACd;AACJ,GAND;;AAQA,SACIN,aAAA,CAACc,KAAD;kBACgBT,KAAK,CAACU,WAAN,CAAkBC;KAC1Bb;AACJc,IAAAA,MAAM,EACFjB,aAAA,CAACkB,UAAD;AACIC,MAAAA,IAAI,EAAC;AACLC,MAAAA,SAAS,EAAC;AACVb,MAAAA,QAAQ,EAAEJ,KAAK,CAACI;AAChBc,MAAAA,OAAO,EAAEf;KAJb;AAOJgB,IAAAA,SAAS,EAAEb;AACXR,IAAAA,GAAG,EAAEA;AACLsB,IAAAA,IAAI,EAAC;IAbT,CADJ;AAiBH,CArC0B;;;;"}

package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js

@@ -11,9 +11,11 @@ var useTableKeyboardNavigation = function useTableKeyboardNavigation(props, rows
       setActiveIndex = _React$useState[1];
 
   var onKeyDown = function onKeyDown(event) {
+    var _document$activeEleme;
+
     var isModifierKeyPressed = event.metaKey || event.ctrlKey || event.altKey || event.shiftKey;
 
-    if (useGlobalKeyboardNavigation && !(document.activeElement === ref.current || document.activeElement === document.body)) {
+    if (useGlobalKeyboardNavigation && document.activeElement !== ref.current && ((_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.getAttribute('type')) !== 'search' && document.activeElement !== document.body) {
       return;
     } // abort key handling if other elements inside table are focused and we don't use global keyboard navigation
 

package/dist/esm/components/Table/hooks/useTableKeyboardNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useTableKeyboardNavigation.js","sources":["../../../../../src/components/Table/hooks/useTableKeyboardNavigation.ts"],"sourcesContent":["import React from 'react';\nimport keycode from 'keycode';\nimport { getNextIndexFromKeycode } from '../../../utils/hooks/useListKeyboardNavigation';\nimport { sanitizeRowProps } from '../util';\nimport { TableProps } from '../types';\n\nexport const useTableKeyboardNavigation = <T extends {}>(\n    props: TableProps<T>,\n    rows: any[],\n    rowProps: any,\n    ref: React.RefObject<HTMLDivElement>\n): [\n    number | undefined,\n    (index: number) => void,\n    (event: React.KeyboardEvent<HTMLElement>) => void,\n    (event: React.FocusEvent<HTMLElement>) => void\n] => {\n    const useGlobalKeyboardNavigation = props.dangerouslyHijackGlobalKeyboardNavigation;\n    const [activeIndex, setActiveIndex] = React.useState<number | undefined>(useGlobalKeyboardNavigation ? 0 : undefined);\n\n    const onKeyDown = (event: KeyboardEvent): void => {\n        const isModifierKeyPressed = event.metaKey || event.ctrlKey || event.altKey || event.shiftKey;\n\n        if (\n            useGlobalKeyboardNavigation &&\n            !(document.activeElement === ref.current || document.activeElement === document.body)\n        ) {\n            return;\n        }\n        // abort key handling if other elements inside table are focused and we don't use global keyboard navigation\n        if (!useGlobalKeyboardNavigation && document.activeElement !== ref.current) {\n            return;\n        }\n\n        if (activeIndex !== undefined) {\n            const currentRow = rows[activeIndex];\n\n            if (currentRow) {\n                const sanitizedRow = sanitizeRowProps(currentRow, rowProps.rowExpansionRenderer);\n\n                if (rowProps.onRowClick && event.keyCode === keycode('enter')) {\n                    event.preventDefault();\n                    rowProps.onRowClick(sanitizedRow);\n                    return;\n                }\n\n                if (currentRow.toggleRowSelected && event.keyCode === keycode('space')) {\n                    event.preventDefault();\n                    currentRow.toggleRowSelected();\n                    return;\n                }\n\n                if (currentRow.toggleRowExpanded) {\n                    if (currentRow.isExpanded && event.keyCode === keycode('left')) {\n                        event.preventDefault();\n                        currentRow.toggleRowExpanded();\n                        return;\n                    } else if (!currentRow.isExpanded && event.keyCode === keycode('right')) {\n                        event.preventDefault();\n                        currentRow.toggleRowExpanded();\n                        return;\n                    }\n                }\n\n                // inline editing\n                if (currentRow.toggleRowEditing) {\n                    if (currentRow.canEdit && !currentRow.isEditing) {\n                        if (rowProps.onRowCreate && event.shiftKey && event.keyCode === keycode('n')) {\n                            event.preventDefault();\n\n                            if (!currentRow.isExpanded) {\n                                currentRow.toggleRowExpanded();\n                            }\n\n                            rowProps.onRowCreate(sanitizedRow, event);\n                            return;\n                        }\n\n                        if (event.keyCode === keycode('e')) {\n                            event.preventDefault();\n                            currentRow.toggleRowEditing();\n                            return;\n                        }\n                    }\n                }\n\n                if (rowProps.onRowEdit && event.keyCode === keycode('e') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowEdit(sanitizedRow, event);\n                    return;\n                }\n\n                if (rowProps.onRowCopy && event.keyCode === keycode('c') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowCopy(sanitizedRow, event);\n                    return;\n                }\n\n                if (rowProps.onRowDelete && event.keyCode === keycode('delete') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowDelete(sanitizedRow, event);\n                    return;\n                }\n            }\n        }\n\n        const nextIndex = getNextIndexFromKeycode(event.keyCode, rows.length, activeIndex);\n\n        if (nextIndex !== undefined) {\n            event.preventDefault();\n            setActiveIndex(nextIndex);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        if (!useGlobalKeyboardNavigation) {\n            onKeyDown(event.nativeEvent);\n        }\n    };\n\n    React.useEffect(() => {\n        if (useGlobalKeyboardNavigation) {\n            window.addEventListener('keydown', onKeyDown);\n        }\n\n        return () => {\n            if (useGlobalKeyboardNavigation) {\n                window.removeEventListener('keydown', onKeyDown);\n            }\n        };\n    }, [onKeyDown]);\n\n    const handleFocus = (): void => {\n        if (activeIndex === undefined && rows.length) {\n            setActiveIndex(0);\n        }\n    };\n\n    return [activeIndex, setActiveIndex, handleKeyDown, handleFocus];\n};\n"],"names":["useTableKeyboardNavigation","props","rows","rowProps","ref","useGlobalKeyboardNavigation","dangerouslyHijackGlobalKeyboardNavigation","React","useState","undefined","activeIndex","setActiveIndex","onKeyDown","event","isModifierKeyPressed","metaKey","ctrlKey","altKey","shiftKey","document","activeElement","current","body","currentRow","sanitizedRow","sanitizeRowProps","rowExpansionRenderer","onRowClick","keyCode","keycode","preventDefault","toggleRowSelected","toggleRowExpanded","isExpanded","toggleRowEditing","canEdit","isEditing","onRowCreate","onRowEdit","onRowCopy","onRowDelete","nextIndex","getNextIndexFromKeycode","length","handleKeyDown","nativeEvent","useEffect","window","addEventListener","removeEventListener","handleFocus"],"mappings":"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"}
+{"version":3,"file":"useTableKeyboardNavigation.js","sources":["../../../../../src/components/Table/hooks/useTableKeyboardNavigation.ts"],"sourcesContent":["import React from 'react';\nimport keycode from 'keycode';\nimport { getNextIndexFromKeycode } from '../../../utils/hooks/useListKeyboardNavigation';\nimport { sanitizeRowProps } from '../util';\nimport { TableProps } from '../types';\n\nexport const useTableKeyboardNavigation = <T extends {}>(\n    props: TableProps<T>,\n    rows: any[],\n    rowProps: any,\n    ref: React.RefObject<HTMLDivElement>\n): [\n    number | undefined,\n    (index: number) => void,\n    (event: React.KeyboardEvent<HTMLElement>) => void,\n    (event: React.FocusEvent<HTMLElement>) => void\n] => {\n    const useGlobalKeyboardNavigation = props.dangerouslyHijackGlobalKeyboardNavigation;\n    const [activeIndex, setActiveIndex] = React.useState<number | undefined>(useGlobalKeyboardNavigation ? 0 : undefined);\n\n    const onKeyDown = (event: KeyboardEvent): void => {\n        const isModifierKeyPressed = event.metaKey || event.ctrlKey || event.altKey || event.shiftKey;\n\n        if (\n            useGlobalKeyboardNavigation &&\n            document.activeElement !== ref.current &&\n            document.activeElement?.getAttribute('type') !== 'search' &&\n            document.activeElement !== document.body\n        ) {\n            return;\n        }\n        // abort key handling if other elements inside table are focused and we don't use global keyboard navigation\n        if (!useGlobalKeyboardNavigation && document.activeElement !== ref.current) {\n            return;\n        }\n\n        if (activeIndex !== undefined) {\n            const currentRow = rows[activeIndex];\n\n            if (currentRow) {\n                const sanitizedRow = sanitizeRowProps(currentRow, rowProps.rowExpansionRenderer);\n\n                if (rowProps.onRowClick && event.keyCode === keycode('enter')) {\n                    event.preventDefault();\n                    rowProps.onRowClick(sanitizedRow);\n                    return;\n                }\n\n                if (currentRow.toggleRowSelected && event.keyCode === keycode('space')) {\n                    event.preventDefault();\n                    currentRow.toggleRowSelected();\n                    return;\n                }\n\n                if (currentRow.toggleRowExpanded) {\n                    if (currentRow.isExpanded && event.keyCode === keycode('left')) {\n                        event.preventDefault();\n                        currentRow.toggleRowExpanded();\n                        return;\n                    } else if (!currentRow.isExpanded && event.keyCode === keycode('right')) {\n                        event.preventDefault();\n                        currentRow.toggleRowExpanded();\n                        return;\n                    }\n                }\n\n                // inline editing\n                if (currentRow.toggleRowEditing) {\n                    if (currentRow.canEdit && !currentRow.isEditing) {\n                        if (rowProps.onRowCreate && event.shiftKey && event.keyCode === keycode('n')) {\n                            event.preventDefault();\n\n                            if (!currentRow.isExpanded) {\n                                currentRow.toggleRowExpanded();\n                            }\n\n                            rowProps.onRowCreate(sanitizedRow, event);\n                            return;\n                        }\n\n                        if (event.keyCode === keycode('e')) {\n                            event.preventDefault();\n                            currentRow.toggleRowEditing();\n                            return;\n                        }\n                    }\n                }\n\n                if (rowProps.onRowEdit && event.keyCode === keycode('e') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowEdit(sanitizedRow, event);\n                    return;\n                }\n\n                if (rowProps.onRowCopy && event.keyCode === keycode('c') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowCopy(sanitizedRow, event);\n                    return;\n                }\n\n                if (rowProps.onRowDelete && event.keyCode === keycode('delete') && !isModifierKeyPressed) {\n                    event.preventDefault();\n                    rowProps.onRowDelete(sanitizedRow, event);\n                    return;\n                }\n            }\n        }\n\n        const nextIndex = getNextIndexFromKeycode(event.keyCode, rows.length, activeIndex);\n\n        if (nextIndex !== undefined) {\n            event.preventDefault();\n            setActiveIndex(nextIndex);\n        }\n    };\n\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>): void => {\n        if (!useGlobalKeyboardNavigation) {\n            onKeyDown(event.nativeEvent);\n        }\n    };\n\n    React.useEffect(() => {\n        if (useGlobalKeyboardNavigation) {\n            window.addEventListener('keydown', onKeyDown);\n        }\n\n        return () => {\n            if (useGlobalKeyboardNavigation) {\n                window.removeEventListener('keydown', onKeyDown);\n            }\n        };\n    }, [onKeyDown]);\n\n    const handleFocus = (): void => {\n        if (activeIndex === undefined && rows.length) {\n            setActiveIndex(0);\n        }\n    };\n\n    return [activeIndex, setActiveIndex, handleKeyDown, handleFocus];\n};\n"],"names":["useTableKeyboardNavigation","props","rows","rowProps","ref","useGlobalKeyboardNavigation","dangerouslyHijackGlobalKeyboardNavigation","React","useState","undefined","activeIndex","setActiveIndex","onKeyDown","event","isModifierKeyPressed","metaKey","ctrlKey","altKey","shiftKey","document","activeElement","current","getAttribute","body","currentRow","sanitizedRow","sanitizeRowProps","rowExpansionRenderer","onRowClick","keyCode","keycode","preventDefault","toggleRowSelected","toggleRowExpanded","isExpanded","toggleRowEditing","canEdit","isEditing","onRowCreate","onRowEdit","onRowCopy","onRowDelete","nextIndex","getNextIndexFromKeycode","length","handleKeyDown","nativeEvent","useEffect","window","addEventListener","removeEventListener","handleFocus"],"mappings":"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"}

package/dist/esm/components/Textarea/Textarea.js

@@ -3,13 +3,31 @@ import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { getInputClasses } from '../Input/util.js';
 
-var _excluded = ["defaultValue", "highlighted", "state"];
+var _excluded = ["defaultValue", "highlighted", "onKeyDown", "state"];
 var Textarea = /*#__PURE__*/forwardRef(function Textarea(props, ref) {
-  var otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+  var onKeyDown = props.onKeyDown,
+      otherProps = _objectWithoutPropertiesLoose(props, _excluded);
+
+  var classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className); // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll
+  // if it has scroll height then the browser reverts to native scrolling behaviour only
+  // so we manually override it to ensure _our_ desired behaviour remains intact
+
+  var handleKeyDown = function handleKeyDown(event) {
+    if (event.key === 'Home' || event.key === 'End') {
+      event.preventDefault();
+      var position = event.key === 'End' ? event.currentTarget.value.length : 0;
+      event.currentTarget.setSelectionRange(position, position);
+      event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;
+    }
+
+    if (onKeyDown) {
+      onKeyDown(event);
+    }
+  };
 
-  var classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);
   return createElement("textarea", Object.assign({}, otherProps, {
     className: classNames,
+    onKeyDown: handleKeyDown,
     ref: ref
   }));
 });

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

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { State } from '../../types';\nimport { getInputClasses } from '../Input/util';\n\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n    /** Draws attention to the textarea by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** State will change the style of the textarea **/\n    state?: State;\n    /** Value of the textarea */\n    value?: string;\n};\n\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\n    const { defaultValue: _, highlighted, state, ...otherProps } = props;\n    const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\n\n    return <textarea {...otherProps} className={classNames} ref={ref} />;\n});\n"],"names":["Textarea","React","props","ref","otherProps","classNames","cn","getInputClasses","className"],"mappings":";;;;;;IAcaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,MAAgDC,UAAhD,iCAA+DF,KAA/D;;AACA,MAAMG,UAAU,GAAGC,EAAE,CAACC,eAAe,CAACL,KAAD,CAAhB,EAAyB,wCAAzB,EAAmEA,KAAK,CAACM,SAAzE,CAArB;AAEA,SAAOP,aAAA,WAAA,oBAAcG;AAAYI,IAAAA,SAAS,EAAEH;AAAYF,IAAAA,GAAG,EAAEA;IAAtD,CAAP;AACH,CALuB;;;;"}
+{"version":3,"file":"Textarea.js","sources":["../../../../src/components/Textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport { State } from '../../types';\nimport { getInputClasses } from '../Input/util';\n\nexport type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement> & {\n    /** Draws attention to the textarea by changing its style and making it visually prominent */\n    highlighted?: boolean;\n    /** State will change the style of the textarea **/\n    state?: State;\n    /** Value of the textarea */\n    value?: string;\n};\n\nexport const Textarea = React.forwardRef(function Textarea(props: TextareaProps, ref: React.Ref<HTMLTextAreaElement>) {\n    const { defaultValue: _, highlighted, onKeyDown, state, ...otherProps } = props;\n    const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className);\n\n    // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll\n    // if it has scroll height then the browser reverts to native scrolling behaviour only\n    // so we manually override it to ensure _our_ desired behaviour remains intact\n    const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n        if (event.key === 'Home' || event.key === 'End') {\n            event.preventDefault();\n            const position = event.key === 'End' ? event.currentTarget.value.length : 0;\n            event.currentTarget.setSelectionRange(position, position);\n            event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;\n        }\n\n        if (onKeyDown) {\n            onKeyDown(event);\n        }\n    };\n\n    return <textarea {...otherProps} className={classNames} onKeyDown={handleKeyDown} ref={ref} />;\n});\n"],"names":["Textarea","React","props","ref","onKeyDown","otherProps","classNames","cn","getInputClasses","className","handleKeyDown","event","key","preventDefault","position","currentTarget","value","length","setSelectionRange","scrollTop","scrollHeight"],"mappings":";;;;;;IAcaA,QAAQ,gBAAGC,UAAA,CAAiB,SAASD,QAAT,CAAkBE,KAAlB,EAAwCC,GAAxC;AACrC,MAAsCC,SAAtC,GAA0EF,KAA1E,CAAsCE,SAAtC;AAAA,MAA2DC,UAA3D,iCAA0EH,KAA1E;;AACA,MAAMI,UAAU,GAAGC,EAAE,CAACC,eAAe,CAACN,KAAD,CAAhB,EAAyB,wCAAzB,EAAmEA,KAAK,CAACO,SAAzE,CAArB;AAGA;AACA;;AACA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,KAAD;AAClB,QAAIA,KAAK,CAACC,GAAN,KAAc,MAAd,IAAwBD,KAAK,CAACC,GAAN,KAAc,KAA1C,EAAiD;AAC7CD,MAAAA,KAAK,CAACE,cAAN;AACA,UAAMC,QAAQ,GAAGH,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBC,KAApB,CAA0BC,MAAhD,GAAyD,CAA1E;AACAN,MAAAA,KAAK,CAACI,aAAN,CAAoBG,iBAApB,CAAsCJ,QAAtC,EAAgDA,QAAhD;AACAH,MAAAA,KAAK,CAACI,aAAN,CAAoBI,SAApB,GAAgCR,KAAK,CAACC,GAAN,KAAc,KAAd,GAAsBD,KAAK,CAACI,aAAN,CAAoBK,YAA1C,GAAyD,CAAzF;AACH;;AAED,QAAIhB,SAAJ,EAAe;AACXA,MAAAA,SAAS,CAACO,KAAD,CAAT;AACH;AACJ,GAXD;;AAaA,SAAOV,aAAA,WAAA,oBAAcI;AAAYI,IAAAA,SAAS,EAAEH;AAAYF,IAAAA,SAAS,EAAEM;AAAeP,IAAAA,GAAG,EAAEA;IAAhF,CAAP;AACH,CArBuB;;;;"}

package/dist/esm/index.css

@@ -129,8 +129,11 @@
         @apply border-none;
     }
 
-    [data-radix-portal][aria-hidden] {
-        display: none;
+    input[type='search']::-webkit-search-decoration,
+    input[type='search']::-webkit-search-cancel-button,
+    input[type='search']::-webkit-search-results-button,
+    input[type='search']::-webkit-search-results-decoration {
+        -webkit-appearance: none;
     }
 
     @keyframes fade-in {
@@ -393,8 +396,9 @@
     bottom: 3px;
 }
 
-[data-taco='dialog'] *:last-child {
-    @apply mb-0;
+/* label inside label is invalid html, but the client is littered with it */
+[data-taco='label'] [data-taco='label'] {
+    min-height: 0;
 }
 
 .yt-form > [data-taco='button'] {
@@ -429,11 +433,6 @@
     @apply mb-0;
 }
 
-/* label inside label is invalid html, but the client is littered with it */
-[data-taco='label'] [data-taco='label'] {
-    min-height: 0;
-}
-
 .yt-navigation__item a,
 .yt-navigation__item .yt-navigation__item__postfix {
     @apply text-black;

package/dist/esm/index.js

@@ -16,16 +16,17 @@ export { Checkbox } from './components/Checkbox/Checkbox.js';
 export { Input } from './components/Input/Input.js';
 export { getNextIndexFromKeycode, useListKeyboardNavigation } from './utils/hooks/useListKeyboardNavigation.js';
 export { useListScrollTo } from './utils/hooks/useListScrollTo.js';
+export { useBoundingClientRectListener } from './utils/hooks/useBoundingClientRectListener.js';
 export { Combobox } from './components/Combobox/Combobox.js';
 export { format, parseFromCustomString, parseFromISOString } from './utils/date.js';
 export { Popover } from './components/Popover/Popover.js';
 export { Datepicker } from './components/Datepicker/Datepicker.js';
 export { Dialog } from './components/Dialog/Dialog.js';
+export { Field } from './components/Field/Field.js';
 export { Form } from './components/Form/Form.js';
 export { Group } from './components/Group/Group.js';
 export { Hanger } from './components/Hanger/Hanger.js';
 export { SearchInput } from './components/SearchInput/SearchInput.js';
-export { Label } from './components/Label/Label.js';
 export { Listbox, MultiListbox } from './components/Listbox/Listbox.js';
 export { RadioGroup, findByValue, getRadioGroupItemValueAsString, useRadioGroup } from './components/RadioGroup/RadioGroup.js';
 export { Menu } from './components/Menu/Menu.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.css

@@ -129,8 +129,11 @@
         @apply border-none;
     }
 
-    [data-radix-portal][aria-hidden] {
-        display: none;
+    input[type='search']::-webkit-search-decoration,
+    input[type='search']::-webkit-search-cancel-button,
+    input[type='search']::-webkit-search-results-button,
+    input[type='search']::-webkit-search-results-decoration {
+        -webkit-appearance: none;
     }
 
     @keyframes fade-in {
@@ -393,8 +396,9 @@
     bottom: 3px;
 }
 
-[data-taco='dialog'] *:last-child {
-    @apply mb-0;
+/* label inside label is invalid html, but the client is littered with it */
+[data-taco='label'] [data-taco='label'] {
+    min-height: 0;
 }
 
 .yt-form > [data-taco='button'] {
@@ -429,11 +433,6 @@
     @apply mb-0;
 }
 
-/* label inside label is invalid html, but the client is littered with it */
-[data-taco='label'] [data-taco='label'] {
-    min-height: 0;
-}
-
 .yt-navigation__item a,
 .yt-navigation__item .yt-navigation__item__postfix {
     @apply text-black;

package/dist/index.d.ts

@@ -9,6 +9,7 @@ export * from './components/Checkbox/Checkbox';
 export * from './components/Combobox/Combobox';
 export * from './components/Datepicker/Datepicker';
 export * from './components/Dialog/Dialog';
+export * from './components/Field/Field';
 export * from './components/Form/Form';
 export * from './components/Group/Group';
 export * from './components/Hanger/Hanger';
@@ -16,7 +17,6 @@ export * from './components/Icon/Icon';
 export * from './components/IconButton/IconButton';
 export * from './components/Input/Input';
 export * from './components/SearchInput/SearchInput';
-export * from './components/Label/Label';
 export * from './components/Listbox/Listbox';
 export * from './components/Menu/Menu';
 export * from './components/Navigation/Navigation';
@@ -37,6 +37,7 @@ export * from './components/Tour/Tour';
 export * from './components/Treeview/Treeview';
 export * from './components/VisuallyHidden/VisuallyHidden';
 export * from './utils/date';
+export * from './utils/hooks/useBoundingClientRectListener';
 export * from './utils/hooks/useListKeyboardNavigation';
 export * from './utils/hooks/useOnClickOutside';
 export * from './utils/hooks/useListScrollTo';