@economic/taco 1.40.3 → 2.0.0-alpha.173

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

@@ -1 +1 @@
-{"version":3,"file":"Tabs.js","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\nimport { Orientation } from '../../types';\nimport { getButtonClasses } from '../Button/util';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n    /**\n     * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n     */\n    id?: string;\n    /**\n     * Set which tab is selected on mount.\n     * This has to be one of the existing ids provided for tabs\n     */\n    defaultId?: string;\n    /**\n     * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n     * followed by one or an array of `Tabs.Content`.\n     * *Note* that there can also be tabs that are rendered conditionally.\n     */\n    children: React.ReactNode;\n    /**\n     * Define orientation of tabs.\n     * @defaultValue horizontal\n     */\n    orientation?: Orientation;\n    /**\n     * Callback that is called when tab is changed.\n     */\n    onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    /**\n     * A unique value that associates the trigger with a content.\n     */\n    id: string;\n    /**\n     * When true, prevents the user from interacting with the tab.\n     */\n    disabled?: boolean;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n    /**\n     * A unique value that associates the content with a trigger.\n     */\n    id: string;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n    /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n    List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n    /** Tab trigger component rendered in a `Tabs.List` component */\n    Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n    /** Tab content component rendered in a `Tabs` group component */\n    Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n    const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n    const className = cn(\n        {\n            'flex w-full': orientation === 'vertical',\n        },\n        props.className\n    );\n\n    return (\n        <TabsPrimitive.Root\n            {...otherProps}\n            className={className}\n            data-taco=\"tabs\"\n            defaultValue={defaultId}\n            dir=\"ltr\"\n            onValueChange={onChange}\n            orientation={orientation}\n            ref={ref}\n            value={id}>\n            {children}\n        </TabsPrimitive.Root>\n    );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn(\n        'border-grey-300 flex flex-row m-0 mb-4',\n        'aria-orientation-horizontal:border-b',\n        'aria-orientation-vertical:border-r aria-orientation-vertical:m-0 aria-orientation-vertical:mr-4 aria-orientation-vertical:flex-col ',\n        props.className\n    );\n\n    return <TabsPrimitive.List {...props} className={className} ref={ref} />;\n});\n\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const { children, id, disabled, ...otherProps } = props;\n\n    const triggerClassName = cn(\n        'group relative p-0.5 outline-none disabled:cursor-not-allowed disabled:text-black/50',\n        // horizontal\n        '[[aria-orientation=\"horizontal\"]_&]:pb-1',\n        // horizontal\n        '[[aria-orientation=\"vertical\"]_&]:pr-1'\n    );\n    const buttonClassName = cn(\n        getButtonClasses(),\n        'group-focus-visible:yt-focus-inset group-enabled:group-hover:wcag-grey-200 pointer-events-none rounded px-3'\n    );\n    const activeClassName = cn(\n        'pointer-events-none absolute hidden bg-blue-500 group-aria-selected:flex',\n        // horizontal\n        '[[aria-orientation=\"horizontal\"]_&]:rounded-t-sm [[aria-orientation=\"horizontal\"]_&]:bottom-0 [[aria-orientation=\"horizontal\"]_&]:left-0 [[aria-orientation=\"horizontal\"]_&]:right-0 [[aria-orientation=\"horizontal\"]_&]:-mb-px [[aria-orientation=\"horizontal\"]_&]:h-0.5',\n        // vertical\n        '[[aria-orientation=\"vertical\"]_&]:rounded-l-sm [[aria-orientation=\"vertical\"]_&]:right-0 [[aria-orientation=\"vertical\"]_&]:top-0 [[aria-orientation=\"vertical\"]_&]:bottom-0 [[aria-orientation=\"vertical\"]_&]:-mr-px [[aria-orientation=\"vertical\"]_&]:w-0.5'\n    );\n\n    return (\n        <TabsPrimitive.Trigger {...otherProps} className={triggerClassName} disabled={disabled} ref={ref} value={id}>\n            <span className={buttonClassName}>{children}</span>\n            <span className={activeClassName} />\n        </TabsPrimitive.Trigger>\n    );\n});\n\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { id, ...otherProps } = props;\n    const className = cn('[&[data-orientation=\"vertical\"]]:grow outline-none', props.className);\n\n    return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\n});\n\nTabs.List = TabList;\nTabs.Trigger = TabTrigger;\nTabs.Content = TabContent;\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","triggerClassName","buttonClassName","getButtonClasses","activeClassName","TabContent","List","Trigger","Content"],"mappings":";;;;;MA8DaA,IAAI,gBAAGC,UAAgB,CAAC,SAASD,IAAI,CAACE,KAAgB,EAAEC,GAA8B;EAC/F,MAAM;IAAEC,EAAE;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,WAAW,GAAG,YAAY;IAAE,GAAGC;GAAY,GAAGP,KAAK;EAC9F,MAAMQ,SAAS,GAAGC,EAAE,CAChB;IACI,aAAa,EAAEH,WAAW,KAAK;GAClC,EACDN,KAAK,CAACQ,SAAS,CAClB;EAED,oBACIT,cAACW,IAAkB,oBACXH,UAAU;IACdC,SAAS,EAAEA,SAAS;iBACV,MAAM;IAChBG,YAAY,EAAER,SAAS;IACvBS,GAAG,EAAC,KAAK;IACTC,aAAa,EAAER,QAAQ;IACvBC,WAAW,EAAEA,WAAW;IACxBL,GAAG,EAAEA,GAAG;IACRa,KAAK,EAAEZ;MACNE,QAAQ,CACQ;AAE7B,CAAC;AAED,MAAMW,OAAO,gBAAGhB,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAmB,EAAEC,GAA8B;EAC7F,MAAMO,SAAS,GAAGC,EAAE,CAChB,wCAAwC,EACxC,sCAAsC,EACtC,qIAAqI,EACrIT,KAAK,CAACQ,SAAS,CAClB;EAED,oBAAOT,cAACW,IAAkB,oBAAKV,KAAK;IAAEQ,SAAS,EAAEA,SAAS;IAAEP,GAAG,EAAEA;KAAO;AAC5E,CAAC,CAAC;AAEF,MAAMgB,UAAU,gBAAGlB,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAsB,EAAEC,GAAiC;EACtG,MAAM;IAAEG,QAAQ;IAAEF,EAAE;IAAEgB,QAAQ;IAAE,GAAGX;GAAY,GAAGP,KAAK;EAEvD,MAAMmB,gBAAgB,GAAGV,EAAE,CACvB,sFAAsF;;EAEtF,0CAA0C;;EAE1C,wCAAwC,CAC3C;EACD,MAAMW,eAAe,GAAGX,EAAE,CACtBY,gBAAgB,EAAE,EAClB,6GAA6G,CAChH;EACD,MAAMC,eAAe,GAAGb,EAAE,CACtB,0EAA0E;;EAE1E,2QAA2Q;;EAE3Q,8PAA8P,CACjQ;EAED,oBACIV,cAACW,OAAqB,oBAAKH,UAAU;IAAEC,SAAS,EAAEW,gBAAgB;IAAED,QAAQ,EAAEA,QAAQ;IAAEjB,GAAG,EAAEA,GAAG;IAAEa,KAAK,EAAEZ;mBACrGH;IAAMS,SAAS,EAAEY;KAAkBhB,QAAQ,CAAQ,eACnDL;IAAMS,SAAS,EAAEc;IAAmB,CAChB;AAEhC,CAAC,CAAC;AAEF,MAAMC,UAAU,gBAAGxB,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAsB,EAAEC,GAA8B;EACnG,MAAM;IAAEC,EAAE;IAAE,GAAGK;GAAY,GAAGP,KAAK;EACnC,MAAMQ,SAAS,GAAGC,EAAE,CAAC,oDAAoD,EAAET,KAAK,CAACQ,SAAS,CAAC;EAE3F,oBAAOT,cAACW,OAAqB,oBAAKH,UAAU;IAAEC,SAAS,EAAEA,SAAS;IAAEP,GAAG,EAAEA,GAAG;IAAEa,KAAK,EAAEZ;KAAM;AAC/F,CAAC,CAAC;AAEFJ,IAAI,CAAC0B,IAAI,GAAGT,OAAO;AACnBjB,IAAI,CAAC2B,OAAO,GAAGR,UAAU;AACzBnB,IAAI,CAAC4B,OAAO,GAAGH,UAAU;;;;"}
+{"version":3,"file":"Tabs.js","sources":["../../../../../../../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as TabsPrimitive from '@radix-ui/react-tabs';\nimport { Orientation } from '../../types';\nimport { getButtonClasses } from '../Button/util';\nimport { Tooltip } from '../Tooltip/Tooltip';\n\nexport type TabsProps = React.HTMLAttributes<HTMLDivElement> & {\n    /**\n     * The controlled value of the tab to activate. Should be used in conjunction with `onChange`.\n     */\n    id?: string;\n    /**\n     * Set which tab is selected on mount.\n     * This has to be one of the existing ids provided for tabs\n     */\n    defaultId?: string;\n    /**\n     * Content should be one or an array of `Tabs.Trigger` components inside `Tabs.List` and then\n     * followed by one or an array of `Tabs.Content`.\n     * *Note* that there can also be tabs that are rendered conditionally.\n     */\n    children: React.ReactNode;\n    /**\n     * Define orientation of tabs.\n     * @defaultValue horizontal\n     */\n    orientation?: Orientation;\n    /**\n     * Callback that is called when tab is changed.\n     */\n    onChange?: (id: string) => void;\n};\n\nexport type TabListProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type TabTriggerProps = React.HTMLAttributes<HTMLButtonElement> & {\n    /**\n     * A unique value that associates the trigger with a content.\n     */\n    id: string;\n    /**\n     * When true, prevents the user from interacting with the tab.\n     */\n    disabled?: boolean;\n    /** A tooltip to show when hovering over the trigger */\n    tooltip?: string | JSX.Element;\n};\n\nexport type TabContentProps = React.HTMLAttributes<HTMLDivElement> & {\n    /**\n     * A unique value that associates the content with a trigger.\n     */\n    id: string;\n};\n\nexport type ForwardedTabsWithStatics = React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>> & {\n    /** Tab list component containing all tab triggers, rendered in a `Tabs` group component */\n    List: React.ForwardRefExoticComponent<TabListProps & React.RefAttributes<HTMLDivElement>>;\n    /** Tab trigger component rendered in a `Tabs.List` component */\n    Trigger: React.ForwardRefExoticComponent<TabTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n    /** Tab content component rendered in a `Tabs` group component */\n    Content: React.ForwardRefExoticComponent<TabContentProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Tabs = React.forwardRef(function Tabs(props: TabsProps, ref: React.Ref<HTMLDivElement>) {\n    const { id, defaultId, children, onChange, orientation = 'horizontal', ...otherProps } = props;\n    const className = cn(\n        {\n            'flex w-full': orientation === 'vertical',\n        },\n        props.className\n    );\n\n    return (\n        <TabsPrimitive.Root\n            {...otherProps}\n            className={className}\n            data-taco=\"tabs\"\n            defaultValue={defaultId}\n            dir=\"ltr\"\n            onValueChange={onChange}\n            orientation={orientation}\n            ref={ref}\n            value={id}>\n            {children}\n        </TabsPrimitive.Root>\n    );\n}) as ForwardedTabsWithStatics;\n\nconst TabList = React.forwardRef(function Tab(props: TabListProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn(\n        'border-grey-300 flex flex-row m-0 mb-4',\n        'aria-orientation-horizontal:border-b',\n        'aria-orientation-vertical:border-r aria-orientation-vertical:m-0 aria-orientation-vertical:mr-4 aria-orientation-vertical:flex-col ',\n        props.className\n    );\n\n    return <TabsPrimitive.List {...props} className={className} ref={ref} />;\n});\n\nconst TabTrigger = React.forwardRef(function Tab(props: TabTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const { children, id, disabled, tooltip, ...otherProps } = props;\n\n    const triggerClassName = cn(\n        'group relative p-0.5 outline-none disabled:cursor-not-allowed disabled:text-black/50',\n        // horizontal\n        '[[aria-orientation=\"horizontal\"]_&]:pb-1',\n        // horizontal\n        '[[aria-orientation=\"vertical\"]_&]:pr-1'\n    );\n    const buttonClassName = cn(\n        getButtonClasses(),\n        'group-focus-visible:yt-focus-inset group-enabled:group-hover:wcag-grey-200 pointer-events-none rounded px-3'\n    );\n    const activeClassName = cn(\n        'pointer-events-none absolute hidden bg-blue-500 group-aria-selected:flex',\n        // horizontal\n        '[[aria-orientation=\"horizontal\"]_&]:rounded-t-sm [[aria-orientation=\"horizontal\"]_&]:bottom-0 [[aria-orientation=\"horizontal\"]_&]:left-0 [[aria-orientation=\"horizontal\"]_&]:right-0 [[aria-orientation=\"horizontal\"]_&]:-mb-px [[aria-orientation=\"horizontal\"]_&]:h-0.5',\n        // vertical\n        '[[aria-orientation=\"vertical\"]_&]:rounded-l-sm [[aria-orientation=\"vertical\"]_&]:right-0 [[aria-orientation=\"vertical\"]_&]:top-0 [[aria-orientation=\"vertical\"]_&]:bottom-0 [[aria-orientation=\"vertical\"]_&]:-mr-px [[aria-orientation=\"vertical\"]_&]:w-0.5'\n    );\n\n    const trigger = (\n        <TabsPrimitive.Trigger {...otherProps} className={triggerClassName} disabled={disabled} ref={ref} value={id}>\n            <span className={buttonClassName}>{children}</span>\n            <span className={activeClassName} />\n        </TabsPrimitive.Trigger>\n    );\n\n    if (tooltip) {\n        return <Tooltip title={tooltip}>{trigger}</Tooltip>;\n    }\n\n    return trigger;\n});\n\nconst TabContent = React.forwardRef(function Tab(props: TabContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { id, ...otherProps } = props;\n    const className = cn('[&[data-orientation=\"vertical\"]]:grow outline-none', props.className);\n\n    return <TabsPrimitive.Content {...otherProps} className={className} ref={ref} value={id} />;\n});\n\nTabs.List = TabList;\nTabs.Trigger = TabTrigger;\nTabs.Content = TabContent;\n"],"names":["Tabs","React","props","ref","id","defaultId","children","onChange","orientation","otherProps","className","cn","TabsPrimitive","defaultValue","dir","onValueChange","value","TabList","Tab","TabTrigger","disabled","tooltip","triggerClassName","buttonClassName","getButtonClasses","activeClassName","trigger","Tooltip","title","TabContent","List","Trigger","Content"],"mappings":";;;;;;MAiEaA,IAAI,gBAAGC,UAAgB,CAAC,SAASD,IAAI,CAACE,KAAgB,EAAEC,GAA8B;EAC/F,MAAM;IAAEC,EAAE;IAAEC,SAAS;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,WAAW,GAAG,YAAY;IAAE,GAAGC;GAAY,GAAGP,KAAK;EAC9F,MAAMQ,SAAS,GAAGC,EAAE,CAChB;IACI,aAAa,EAAEH,WAAW,KAAK;GAClC,EACDN,KAAK,CAACQ,SAAS,CAClB;EAED,oBACIT,cAACW,IAAkB,oBACXH,UAAU;IACdC,SAAS,EAAEA,SAAS;iBACV,MAAM;IAChBG,YAAY,EAAER,SAAS;IACvBS,GAAG,EAAC,KAAK;IACTC,aAAa,EAAER,QAAQ;IACvBC,WAAW,EAAEA,WAAW;IACxBL,GAAG,EAAEA,GAAG;IACRa,KAAK,EAAEZ;MACNE,QAAQ,CACQ;AAE7B,CAAC;AAED,MAAMW,OAAO,gBAAGhB,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAmB,EAAEC,GAA8B;EAC7F,MAAMO,SAAS,GAAGC,EAAE,CAChB,wCAAwC,EACxC,sCAAsC,EACtC,qIAAqI,EACrIT,KAAK,CAACQ,SAAS,CAClB;EAED,oBAAOT,cAACW,IAAkB,oBAAKV,KAAK;IAAEQ,SAAS,EAAEA,SAAS;IAAEP,GAAG,EAAEA;KAAO;AAC5E,CAAC,CAAC;AAEF,MAAMgB,UAAU,gBAAGlB,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAsB,EAAEC,GAAiC;EACtG,MAAM;IAAEG,QAAQ;IAAEF,EAAE;IAAEgB,QAAQ;IAAEC,OAAO;IAAE,GAAGZ;GAAY,GAAGP,KAAK;EAEhE,MAAMoB,gBAAgB,GAAGX,EAAE,CACvB,sFAAsF;;EAEtF,0CAA0C;;EAE1C,wCAAwC,CAC3C;EACD,MAAMY,eAAe,GAAGZ,EAAE,CACtBa,gBAAgB,EAAE,EAClB,6GAA6G,CAChH;EACD,MAAMC,eAAe,GAAGd,EAAE,CACtB,0EAA0E;;EAE1E,2QAA2Q;;EAE3Q,8PAA8P,CACjQ;EAED,MAAMe,OAAO,gBACTzB,cAACW,OAAqB,oBAAKH,UAAU;IAAEC,SAAS,EAAEY,gBAAgB;IAAEF,QAAQ,EAAEA,QAAQ;IAAEjB,GAAG,EAAEA,GAAG;IAAEa,KAAK,EAAEZ;mBACrGH;IAAMS,SAAS,EAAEa;KAAkBjB,QAAQ,CAAQ,eACnDL;IAAMS,SAAS,EAAEe;IAAmB,CAE3C;EAED,IAAIJ,OAAO,EAAE;IACT,oBAAOpB,cAAC0B,OAAO;MAACC,KAAK,EAAEP;OAAUK,OAAO,CAAW;;EAGvD,OAAOA,OAAO;AAClB,CAAC,CAAC;AAEF,MAAMG,UAAU,gBAAG5B,UAAgB,CAAC,SAASiB,GAAG,CAAChB,KAAsB,EAAEC,GAA8B;EACnG,MAAM;IAAEC,EAAE;IAAE,GAAGK;GAAY,GAAGP,KAAK;EACnC,MAAMQ,SAAS,GAAGC,EAAE,CAAC,oDAAoD,EAAET,KAAK,CAACQ,SAAS,CAAC;EAE3F,oBAAOT,cAACW,OAAqB,oBAAKH,UAAU;IAAEC,SAAS,EAAEA,SAAS;IAAEP,GAAG,EAAEA,GAAG;IAAEa,KAAK,EAAEZ;KAAM;AAC/F,CAAC,CAAC;AAEFJ,IAAI,CAAC8B,IAAI,GAAGb,OAAO;AACnBjB,IAAI,CAAC+B,OAAO,GAAGZ,UAAU;AACzBnB,IAAI,CAACgC,OAAO,GAAGH,UAAU;;;;"}

package/dist/esm/packages/taco/src/hooks/useGlobalKeyDown.js

@@ -1,14 +1,19 @@
 import React__default from 'react';
 import { createShortcutKeyDownHandler } from '../utils/keyboard.js';
 
-const useGlobalKeyDown = (key, handler) => {
+const useGlobalKeyDown = (shortcut, handler) => {
   React__default.useEffect(() => {
-    const handleKeyDown = createShortcutKeyDownHandler(key, handler);
-    document.addEventListener('keydown', handleKeyDown);
+    let handleKeyDown;
+    if (shortcut) {
+      handleKeyDown = createShortcutKeyDownHandler(shortcut, handler);
+      document.addEventListener('keydown', handleKeyDown);
+    }
     return () => {
-      document.removeEventListener('keydown', handleKeyDown);
+      if (handleKeyDown) {
+        document.removeEventListener('keydown', handleKeyDown);
+      }
     };
-  }, [handler]);
+  }, [shortcut]);
 };
 
 export { useGlobalKeyDown };

package/dist/esm/packages/taco/src/hooks/useGlobalKeyDown.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGlobalKeyDown.js","sources":["../../../../../../src/hooks/useGlobalKeyDown.ts"],"sourcesContent":["import React from 'react';\nimport { createShortcutKeyDownHandler, KeyDownHandlerOptions } from '../utils/keyboard';\n\nexport const useGlobalKeyDown = (key: string | KeyDownHandlerOptions, handler: (event: KeyboardEvent) => void) => {\n    React.useEffect(() => {\n        const handleKeyDown = createShortcutKeyDownHandler(key, handler as (event: KeyboardEvent | React.KeyboardEvent) => void);\n        document.addEventListener('keydown', handleKeyDown);\n\n        return () => {\n            document.removeEventListener('keydown', handleKeyDown);\n        };\n    }, [handler]);\n};\n"],"names":["useGlobalKeyDown","key","handler","React","useEffect","handleKeyDown","createShortcutKeyDownHandler","document","addEventListener","removeEventListener"],"mappings":";;;MAGaA,gBAAgB,GAAG,CAACC,GAAmC,EAAEC,OAAuC;EACzGC,cAAK,CAACC,SAAS,CAAC;IACZ,MAAMC,aAAa,GAAGC,4BAA4B,CAACL,GAAG,EAAEC,OAA+D,CAAC;IACxHK,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEH,aAAa,CAAC;IAEnD,OAAO;MACHE,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEJ,aAAa,CAAC;KACzD;GACJ,EAAE,CAACH,OAAO,CAAC,CAAC;AACjB;;;;"}
+{"version":3,"file":"useGlobalKeyDown.js","sources":["../../../../../../src/hooks/useGlobalKeyDown.ts"],"sourcesContent":["import React from 'react';\nimport { createShortcutKeyDownHandler, KeyDownHandlerOptions } from '../utils/keyboard';\n\nexport const useGlobalKeyDown = (\n    shortcut: string | KeyDownHandlerOptions | undefined,\n    handler: (event: KeyboardEvent) => void\n) => {\n    React.useEffect(() => {\n        let handleKeyDown;\n\n        if (shortcut) {\n            handleKeyDown = createShortcutKeyDownHandler(\n                shortcut,\n                handler as (event: KeyboardEvent | React.KeyboardEvent) => void\n            );\n\n            document.addEventListener('keydown', handleKeyDown);\n        }\n\n        return () => {\n            if (handleKeyDown) {\n                document.removeEventListener('keydown', handleKeyDown);\n            }\n        };\n    }, [shortcut]);\n};\n"],"names":["useGlobalKeyDown","shortcut","handler","React","useEffect","handleKeyDown","createShortcutKeyDownHandler","document","addEventListener","removeEventListener"],"mappings":";;;MAGaA,gBAAgB,GAAG,CAC5BC,QAAoD,EACpDC,OAAuC;EAEvCC,cAAK,CAACC,SAAS,CAAC;IACZ,IAAIC,aAAa;IAEjB,IAAIJ,QAAQ,EAAE;MACVI,aAAa,GAAGC,4BAA4B,CACxCL,QAAQ,EACRC,OAA+D,CAClE;MAEDK,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEH,aAAa,CAAC;;IAGvD,OAAO;MACH,IAAIA,aAAa,EAAE;QACfE,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEJ,aAAa,CAAC;;KAE7D;GACJ,EAAE,CAACJ,QAAQ,CAAC,CAAC;AAClB;;;;"}

package/dist/esm/packages/taco/src/hooks/useLazyEffect.js

@@ -0,0 +1,16 @@
+import React__default from 'react';
+
+// augments useEffect to not run on the initial mount
+function useLazyEffect(effect, deps) {
+  const readyRef = React__default.useRef(false);
+  React__default.useEffect(() => {
+    if (readyRef.current) {
+      effect();
+    } else {
+      readyRef.current = true;
+    }
+  }, deps);
+}
+
+export { useLazyEffect };
+//# sourceMappingURL=useLazyEffect.js.map

package/dist/esm/packages/taco/src/hooks/useLazyEffect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLazyEffect.js","sources":["../../../../../../src/hooks/useLazyEffect.ts"],"sourcesContent":["import React from 'react';\n\n// augments useEffect to not run on the initial mount\nexport function useLazyEffect(effect: React.EffectCallback, deps?: React.DependencyList | undefined) {\n    const readyRef = React.useRef(false);\n\n    React.useEffect(() => {\n        if (readyRef.current) {\n            effect();\n        } else {\n            readyRef.current = true;\n        }\n    }, deps);\n}\n"],"names":["useLazyEffect","effect","deps","readyRef","React","useRef","useEffect","current"],"mappings":";;AAEA;SACgBA,aAAa,CAACC,MAA4B,EAAEC,IAAuC;EAC/F,MAAMC,QAAQ,GAAGC,cAAK,CAACC,MAAM,CAAC,KAAK,CAAC;EAEpCD,cAAK,CAACE,SAAS,CAAC;IACZ,IAAIH,QAAQ,CAACI,OAAO,EAAE;MAClBN,MAAM,EAAE;KACX,MAAM;MACHE,QAAQ,CAACI,OAAO,GAAG,IAAI;;GAE9B,EAAEL,IAAI,CAAC;AACZ;;;;"}

package/dist/esm/packages/taco/src/index.js

@@ -8,8 +8,8 @@ export { AlertDialog } from './components/AlertDialog/AlertDialog.js';
 export { Accordion } from './components/Accordion/Accordion.js';
 export { VisuallyHidden } from './components/VisuallyHidden/VisuallyHidden.js';
 export { Badge } from './components/Badge/Badge.js';
-export { createShortcutKeyDownHandler, isMacOs } from './utils/keyboard.js';
 export { useMergedRef } from './hooks/useMergedRef.js';
+export { createShortcutKeyDownHandler, isMacOs } from './utils/keyboard.js';
 export { Tooltip } from './components/Tooltip/Tooltip.js';
 export { Base, IconButton } from './components/IconButton/IconButton.js';
 export { LocalizationContext, LocalizationProvider, defaultLocalisationTexts, defaultLocalizationContext, useLocalization } from './components/Provider/Localization.js';
@@ -50,6 +50,7 @@ export { Progress } from './components/Progress/Progress.js';
 export { ToastProvider, useToast } from './components/Toast/Toaster.js';
 export { Provider } from './components/Provider/Provider.js';
 export { SearchInput } from './components/SearchInput/SearchInput.js';
+export { SearchInput2 } from './components/SearchInput2/SearchInput2.js';
 import * as Collection from './primitives/Collection/Collection.js';
 export { Collection as CollectionPrimitive };
 export { Tag } from './components/Tag/Tag.js';
@@ -60,8 +61,9 @@ export { PaginatedTable } from './components/Table/components/PaginatedTable.js'
 export { WindowedTable } from './components/Table/components/WindowedTable.js';
 export { convertRowIndexPathToNumberArray, getByRowIndexPath, getParentRowIndexPath, setByRowIndexPath } from './components/Table/util/rowIndexPath.js';
 export { insertChildTableRow, removeChildTableRow, useTableRowCreation } from './components/Table/hooks/useRowCreation.js';
-export { useBoundaryOverflowDetection } from './hooks/useBoundaryOverflowDetection.js';
-export { Table2 } from './components/Table2/Table2.js';
+export { useLazyEffect } from './hooks/useLazyEffect.js';
+export { useTableData } from './components/Table3/hooks/useTableData.js';
+export { Table3 } from './components/Table3/Table3.js';
 export { Tabs } from './components/Tabs/Tabs.js';
 export { Textarea } from './components/Textarea/Textarea.js';
 export { Tour, TourStep } from './components/Tour/Tour.js';
@@ -71,5 +73,6 @@ export { useIsLargeScreen } from './hooks/useIsLargeScreen.js';
 export { Layout } from './components/Layout/Layout.js';
 export { getNavigationLinkClasses } from './components/Navigation2/components/Link.js';
 export { Navigation2 } from './components/Navigation2/Navigation2.js';
+export { useBoundaryOverflowDetection } from './hooks/useBoundaryOverflowDetection.js';
 export { useOnClickOutside } from './utils/hooks/useOnClickOutside.js';
 //# sourceMappingURL=index.js.map

package/dist/esm/packages/taco/src/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/esm/packages/taco/src/primitives/Button.js

@@ -1,6 +1,6 @@
-import { forwardRef, useEffect, createElement, Children } from 'react';
-import { createShortcutKeyDownHandler } from '../utils/keyboard.js';
+import { forwardRef, createElement, Children } from 'react';
 import { useMergedRef } from '../hooks/useMergedRef.js';
+import { useGlobalKeyDown } from '../hooks/useGlobalKeyDown.js';
 
 const Button = /*#__PURE__*/forwardRef(function Button(props, ref) {
   const {
@@ -11,21 +11,10 @@ const Button = /*#__PURE__*/forwardRef(function Button(props, ref) {
     ...otherProps
   } = props;
   const internalRef = useMergedRef(ref);
-  useEffect(() => {
-    let handleKeyDown;
-    if (shortcut) {
-      handleKeyDown = createShortcutKeyDownHandler(shortcut, () => {
-        var _internalRef$current;
-        (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.click();
-      });
-      document.addEventListener('keydown', handleKeyDown);
-    }
-    return () => {
-      if (handleKeyDown) {
-        document.removeEventListener('keydown', handleKeyDown);
-      }
-    };
-  }, [shortcut]);
+  useGlobalKeyDown(shortcut, () => {
+    var _internalRef$current;
+    (_internalRef$current = internalRef.current) === null || _internalRef$current === void 0 ? void 0 : _internalRef$current.click();
+  });
   const Tag = props.href ? 'a' : 'button';
   return /*#__PURE__*/createElement(Tag, Object.assign({}, otherProps, {
     "aria-disabled": disabled ? 'true' : undefined,

package/dist/esm/packages/taco/src/primitives/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","sources":["../../../../../../src/primitives/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { KeyDownHandlerOptions, createShortcutKeyDownHandler } from '../utils/keyboard';\nimport { useMergedRef } from '../hooks/useMergedRef';\n\ntype ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> & {\n    /** Content should be a text */\n    children: React.ReactNode;\n    /** Provides url for buttons being used as a link */\n    href?: string;\n    shortcut?: string | KeyDownHandlerOptions;\n    /** Provides target for buttons being used as a link */\n    target?: '_self' | '_blank' | '_parent' | '_top';\n};\n\nconst Button = React.forwardRef(function Button(props: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) {\n    const { disabled, shortcut, target, type = 'button', ...otherProps } = props;\n    const internalRef = useMergedRef<HTMLButtonElement | HTMLAnchorElement>(ref);\n\n    React.useEffect(() => {\n        let handleKeyDown;\n\n        if (shortcut) {\n            handleKeyDown = createShortcutKeyDownHandler(shortcut, () => {\n                internalRef.current?.click();\n            });\n\n            document.addEventListener('keydown', handleKeyDown);\n        }\n\n        return () => {\n            if (handleKeyDown) {\n                document.removeEventListener('keydown', handleKeyDown);\n            }\n        };\n    }, [shortcut]);\n\n    const Tag = props.href ? 'a' : 'button';\n\n    return (\n        <Tag\n            {...otherProps}\n            aria-disabled={disabled ? 'true' : undefined}\n            disabled={disabled}\n            target={Tag === 'a' ? target : undefined}\n            type={Tag !== 'a' ? type : undefined}\n            ref={internalRef as any}>\n            {React.Children.count(props.children) > 1\n                ? React.Children.map(props.children, child => (typeof child === 'string' ? <span>{child}</span> : child))\n                : props.children}\n        </Tag>\n    );\n});\n\nexport { Button };\nexport type { ButtonProps };\n"],"names":["Button","React","props","ref","disabled","shortcut","target","type","otherProps","internalRef","useMergedRef","handleKeyDown","createShortcutKeyDownHandler","current","click","document","addEventListener","removeEventListener","Tag","href","undefined","count","children","map","child"],"mappings":";;;;MAcMA,MAAM,gBAAGC,UAAgB,CAAC,SAASD,MAAM,CAACE,KAAkB,EAAEC,GAAqD;EACrH,MAAM;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,IAAI,GAAG,QAAQ;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAC5E,MAAMO,WAAW,GAAGC,YAAY,CAAwCP,GAAG,CAAC;EAE5EF,SAAe,CAAC;IACZ,IAAIU,aAAa;IAEjB,IAAIN,QAAQ,EAAE;MACVM,aAAa,GAAGC,4BAA4B,CAACP,QAAQ,EAAE;;QACnD,wBAAAI,WAAW,CAACI,OAAO,yDAAnB,qBAAqBC,KAAK,EAAE;OAC/B,CAAC;MAEFC,QAAQ,CAACC,gBAAgB,CAAC,SAAS,EAAEL,aAAa,CAAC;;IAGvD,OAAO;MACH,IAAIA,aAAa,EAAE;QACfI,QAAQ,CAACE,mBAAmB,CAAC,SAAS,EAAEN,aAAa,CAAC;;KAE7D;GACJ,EAAE,CAACN,QAAQ,CAAC,CAAC;EAEd,MAAMa,GAAG,GAAGhB,KAAK,CAACiB,IAAI,GAAG,GAAG,GAAG,QAAQ;EAEvC,oBACIlB,cAACiB,GAAG,oBACIV,UAAU;qBACCJ,QAAQ,GAAG,MAAM,GAAGgB,SAAS;IAC5ChB,QAAQ,EAAEA,QAAQ;IAClBE,MAAM,EAAEY,GAAG,KAAK,GAAG,GAAGZ,MAAM,GAAGc,SAAS;IACxCb,IAAI,EAAEW,GAAG,KAAK,GAAG,GAAGX,IAAI,GAAGa,SAAS;IACpCjB,GAAG,EAAEM;MACJR,QAAc,CAACoB,KAAK,CAACnB,KAAK,CAACoB,QAAQ,CAAC,GAAG,CAAC,GACnCrB,QAAc,CAACsB,GAAG,CAACrB,KAAK,CAACoB,QAAQ,EAAEE,KAAK,IAAK,OAAOA,KAAK,KAAK,QAAQ,gBAAGvB,4BAAOuB,KAAK,CAAQ,GAAGA,KAAM,CAAC,GACvGtB,KAAK,CAACoB,QAAQ,CAClB;AAEd,CAAC;;;;"}
+{"version":3,"file":"Button.js","sources":["../../../../../../src/primitives/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { KeyDownHandlerOptions } from '../utils/keyboard';\nimport { useMergedRef } from '../hooks/useMergedRef';\nimport { useGlobalKeyDown } from '../hooks/useGlobalKeyDown';\n\ntype ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement | HTMLAnchorElement> & {\n    /** Content should be a text */\n    children: React.ReactNode;\n    /** Provides url for buttons being used as a link */\n    href?: string;\n    shortcut?: string | KeyDownHandlerOptions;\n    /** Provides target for buttons being used as a link */\n    target?: '_self' | '_blank' | '_parent' | '_top';\n};\n\nconst Button = React.forwardRef(function Button(props: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) {\n    const { disabled, shortcut, target, type = 'button', ...otherProps } = props;\n    const internalRef = useMergedRef<HTMLButtonElement | HTMLAnchorElement>(ref);\n\n    useGlobalKeyDown(shortcut, () => {\n        internalRef.current?.click();\n    });\n\n    const Tag = props.href ? 'a' : 'button';\n\n    return (\n        <Tag\n            {...otherProps}\n            aria-disabled={disabled ? 'true' : undefined}\n            disabled={disabled}\n            target={Tag === 'a' ? target : undefined}\n            type={Tag !== 'a' ? type : undefined}\n            ref={internalRef as any}>\n            {React.Children.count(props.children) > 1\n                ? React.Children.map(props.children, child => (typeof child === 'string' ? <span>{child}</span> : child))\n                : props.children}\n        </Tag>\n    );\n});\n\nexport { Button };\nexport type { ButtonProps };\n"],"names":["Button","React","props","ref","disabled","shortcut","target","type","otherProps","internalRef","useMergedRef","useGlobalKeyDown","current","click","Tag","href","undefined","count","children","map","child"],"mappings":";;;;MAeMA,MAAM,gBAAGC,UAAgB,CAAC,SAASD,MAAM,CAACE,KAAkB,EAAEC,GAAqD;EACrH,MAAM;IAAEC,QAAQ;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,IAAI,GAAG,QAAQ;IAAE,GAAGC;GAAY,GAAGN,KAAK;EAC5E,MAAMO,WAAW,GAAGC,YAAY,CAAwCP,GAAG,CAAC;EAE5EQ,gBAAgB,CAACN,QAAQ,EAAE;;IACvB,wBAAAI,WAAW,CAACG,OAAO,yDAAnB,qBAAqBC,KAAK,EAAE;GAC/B,CAAC;EAEF,MAAMC,GAAG,GAAGZ,KAAK,CAACa,IAAI,GAAG,GAAG,GAAG,QAAQ;EAEvC,oBACId,cAACa,GAAG,oBACIN,UAAU;qBACCJ,QAAQ,GAAG,MAAM,GAAGY,SAAS;IAC5CZ,QAAQ,EAAEA,QAAQ;IAClBE,MAAM,EAAEQ,GAAG,KAAK,GAAG,GAAGR,MAAM,GAAGU,SAAS;IACxCT,IAAI,EAAEO,GAAG,KAAK,GAAG,GAAGP,IAAI,GAAGS,SAAS;IACpCb,GAAG,EAAEM;MACJR,QAAc,CAACgB,KAAK,CAACf,KAAK,CAACgB,QAAQ,CAAC,GAAG,CAAC,GACnCjB,QAAc,CAACkB,GAAG,CAACjB,KAAK,CAACgB,QAAQ,EAAEE,KAAK,IAAK,OAAOA,KAAK,KAAK,QAAQ,gBAAGnB,4BAAOmB,KAAK,CAAQ,GAAGA,KAAM,CAAC,GACvGlB,KAAK,CAACgB,QAAQ,CAClB;AAEd,CAAC;;;;"}

package/dist/esm/packages/taco/src/utils/dom.js

@@ -1,4 +1,3 @@
-const isOverflowing = element => element !== null ? element.scrollWidth > element.offsetWidth : false;
 const getIndexOfFirstChildOverflowingParent = (element, overscan = 0) => {
   let index = 0;
   let boundaryChildIndex = null;
@@ -15,5 +14,5 @@ const getIndexOfFirstChildOverflowingParent = (element, overscan = 0) => {
   return boundaryChildIndex;
 };
 
-export { getIndexOfFirstChildOverflowingParent, isOverflowing };
+export { getIndexOfFirstChildOverflowingParent };
 //# sourceMappingURL=dom.js.map

package/dist/esm/packages/taco/src/utils/dom.js.map

@@ -1 +1 @@
-{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["export const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n"],"names":["isOverflowing","element","scrollWidth","offsetWidth","getIndexOfFirstChildOverflowingParent","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width"],"mappings":"MAAaA,aAAa,GAAIC,OAA2B,IACrDA,OAAO,KAAK,IAAI,GAAGA,OAAO,CAACC,WAAW,GAAGD,OAAO,CAACE,WAAW,GAAG;MAEtDC,qCAAqC,GAAG,CAACH,OAAoB,EAAEI,QAAQ,GAAG,CAAC;EACpF,IAAIC,KAAK,GAAG,CAAC;EACb,IAAIC,kBAAkB,GAAkB,IAAI;EAC5C,MAAMC,UAAU,GAAGP,OAAO,CAACQ,qBAAqB,EAAE;EAElD,KAAK,MAAMC,KAAK,IAAIC,KAAK,CAACC,IAAI,CAACX,OAAO,CAACY,QAAQ,CAAC,EAAE;IAC9C,MAAMC,KAAK,GAAGJ,KAAK,CAACD,qBAAqB,EAAE,CAACK,KAAK,GAAGN,UAAU,CAACO,IAAI;IACnE,MAAMC,KAAK,GAAGR,UAAU,CAACQ,KAAK,GAAGX,QAAQ;IAEzC,IAAIS,KAAK,GAAGE,KAAK,EAAE;MACfT,kBAAkB,GAAGD,KAAK;MAC1B;;IAEJA,KAAK,EAAE;;EAGX,OAAOC,kBAAkB;AAC7B;;;;"}
+{"version":3,"file":"dom.js","sources":["../../../../../../src/utils/dom.ts"],"sourcesContent":["export const isOverflowing = (element: HTMLElement | null) =>\n    element !== null ? element.scrollWidth > element.offsetWidth : false;\n\nexport const getIndexOfFirstChildOverflowingParent = (element: HTMLElement, overscan = 0) => {\n    let index = 0;\n    let boundaryChildIndex: number | null = null;\n    const clientRect = element.getBoundingClientRect();\n\n    for (const child of Array.from(element.children)) {\n        const right = child.getBoundingClientRect().right - clientRect.left;\n        const width = clientRect.width - overscan;\n\n        if (right > width) {\n            boundaryChildIndex = index;\n            break;\n        }\n        index++;\n    }\n\n    return boundaryChildIndex;\n};\n"],"names":["getIndexOfFirstChildOverflowingParent","element","overscan","index","boundaryChildIndex","clientRect","getBoundingClientRect","child","Array","from","children","right","left","width"],"mappings":"MAGaA,qCAAqC,GAAG,CAACC,OAAoB,EAAEC,QAAQ,GAAG,CAAC;EACpF,IAAIC,KAAK,GAAG,CAAC;EACb,IAAIC,kBAAkB,GAAkB,IAAI;EAC5C,MAAMC,UAAU,GAAGJ,OAAO,CAACK,qBAAqB,EAAE;EAElD,KAAK,MAAMC,KAAK,IAAIC,KAAK,CAACC,IAAI,CAACR,OAAO,CAACS,QAAQ,CAAC,EAAE;IAC9C,MAAMC,KAAK,GAAGJ,KAAK,CAACD,qBAAqB,EAAE,CAACK,KAAK,GAAGN,UAAU,CAACO,IAAI;IACnE,MAAMC,KAAK,GAAGR,UAAU,CAACQ,KAAK,GAAGX,QAAQ;IAEzC,IAAIS,KAAK,GAAGE,KAAK,EAAE;MACfT,kBAAkB,GAAGD,KAAK;MAC1B;;IAEJA,KAAK,EAAE;;EAGX,OAAOC,kBAAkB;AAC7B;;;;"}

package/dist/esm/packages/taco/src/utils/input.js

@@ -37,6 +37,19 @@ const setInputValueByRef = (input, value, event = 'change') => {
   // 'change' instead of 'input', see https://github.com/facebook/react/issues/11488#issuecomment-381590324
   input.dispatchEvent(createCustomEvent(event));
 };
+const deselectInputValue = input => {
+  var _input$setSelectionRa, _input$value, _input$value2;
+  // input type="number" doesn't support "setSelectionRange",
+  // easiest way is to switch input type to text, deselect value, and switch it back to number.
+  const isNumber = input.type === 'number';
+  if (isNumber) {
+    input.type = 'text';
+  }
+  (_input$setSelectionRa = input.setSelectionRange) === null || _input$setSelectionRa === void 0 ? void 0 : _input$setSelectionRa.call(input, (_input$value = input.value) === null || _input$value === void 0 ? void 0 : _input$value.length, (_input$value2 = input.value) === null || _input$value2 === void 0 ? void 0 : _input$value2.length);
+  if (isNumber) {
+    input.type = 'number';
+  }
+};
 
-export { createCustomEvent, createCustomKeyboardEvent, setInputValueByRef };
+export { createCustomEvent, createCustomKeyboardEvent, deselectInputValue, setInputValueByRef };
 //# sourceMappingURL=input.js.map

package/dist/esm/packages/taco/src/utils/input.js.map

@@ -1 +1 @@
-{"version":3,"file":"input.js","sources":["../../../../../../src/utils/input.ts"],"sourcesContent":["// returns a custom event compatible with all browsers\nexport const createCustomEvent = (eventType: string) => {\n    let customEvent;\n\n    if (typeof Event === 'function') {\n        customEvent = new Event(eventType, { bubbles: true });\n    } else {\n        customEvent = document.createEvent('Event');\n        customEvent.initEvent(eventType, true, true);\n    }\n    return customEvent;\n};\n\n// returns a custom keyboard event compatible with all browsers\nexport const createCustomKeyboardEvent = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    let customKeyboardEvent;\n\n    if (typeof KeyboardEvent === 'function') {\n        customKeyboardEvent = new KeyboardEvent(event.type, event as any);\n    } else {\n        customKeyboardEvent = document.createEvent('Event') as any;\n        customKeyboardEvent.initEvent(event.type, true, true);\n        customKeyboardEvent.key = event.key;\n        customKeyboardEvent.charCode = event.charCode;\n    }\n\n    return customKeyboardEvent;\n};\n\nexport const setInputValueByRef = (input: HTMLInputElement | null, value: string | undefined, event = 'change'): void => {\n    if (!input) {\n        return;\n    }\n\n    const previousValue = input.value;\n    input.value = value || '';\n\n    const tracker = (input as any)._valueTracker;\n\n    if (tracker) {\n        tracker.setValue(previousValue);\n    }\n\n    // 'change' instead of 'input', see https://github.com/facebook/react/issues/11488#issuecomment-381590324\n    input.dispatchEvent(createCustomEvent(event));\n};\n"],"names":["createCustomEvent","eventType","customEvent","Event","bubbles","document","createEvent","initEvent","createCustomKeyboardEvent","event","customKeyboardEvent","KeyboardEvent","type","key","charCode","setInputValueByRef","input","value","previousValue","tracker","_valueTracker","setValue","dispatchEvent"],"mappings":"AAAA;MACaA,iBAAiB,GAAIC,SAAiB;EAC/C,IAAIC,WAAW;EAEf,IAAI,OAAOC,KAAK,KAAK,UAAU,EAAE;IAC7BD,WAAW,GAAG,IAAIC,KAAK,CAACF,SAAS,EAAE;MAAEG,OAAO,EAAE;KAAM,CAAC;GACxD,MAAM;IACHF,WAAW,GAAGG,QAAQ,CAACC,WAAW,CAAC,OAAO,CAAC;IAC3CJ,WAAW,CAACK,SAAS,CAACN,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC;;EAEhD,OAAOC,WAAW;AACtB;AAEA;MACaM,yBAAyB,GAAIC,KAA4C;EAClF,IAAIC,mBAAmB;EAEvB,IAAI,OAAOC,aAAa,KAAK,UAAU,EAAE;IACrCD,mBAAmB,GAAG,IAAIC,aAAa,CAACF,KAAK,CAACG,IAAI,EAAEH,KAAY,CAAC;GACpE,MAAM;IACHC,mBAAmB,GAAGL,QAAQ,CAACC,WAAW,CAAC,OAAO,CAAQ;IAC1DI,mBAAmB,CAACH,SAAS,CAACE,KAAK,CAACG,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;IACrDF,mBAAmB,CAACG,GAAG,GAAGJ,KAAK,CAACI,GAAG;IACnCH,mBAAmB,CAACI,QAAQ,GAAGL,KAAK,CAACK,QAAQ;;EAGjD,OAAOJ,mBAAmB;AAC9B;MAEaK,kBAAkB,GAAG,CAACC,KAA8B,EAAEC,KAAyB,EAAER,KAAK,GAAG,QAAQ;EAC1G,IAAI,CAACO,KAAK,EAAE;IACR;;EAGJ,MAAME,aAAa,GAAGF,KAAK,CAACC,KAAK;EACjCD,KAAK,CAACC,KAAK,GAAGA,KAAK,IAAI,EAAE;EAEzB,MAAME,OAAO,GAAIH,KAAa,CAACI,aAAa;EAE5C,IAAID,OAAO,EAAE;IACTA,OAAO,CAACE,QAAQ,CAACH,aAAa,CAAC;;;EAInCF,KAAK,CAACM,aAAa,CAACtB,iBAAiB,CAACS,KAAK,CAAC,CAAC;AACjD;;;;"}
+{"version":3,"file":"input.js","sources":["../../../../../../src/utils/input.ts"],"sourcesContent":["// returns a custom event compatible with all browsers\nexport const createCustomEvent = (eventType: string) => {\n    let customEvent;\n\n    if (typeof Event === 'function') {\n        customEvent = new Event(eventType, { bubbles: true });\n    } else {\n        customEvent = document.createEvent('Event');\n        customEvent.initEvent(eventType, true, true);\n    }\n    return customEvent;\n};\n\n// returns a custom keyboard event compatible with all browsers\nexport const createCustomKeyboardEvent = (event: React.KeyboardEvent<HTMLInputElement>) => {\n    let customKeyboardEvent;\n\n    if (typeof KeyboardEvent === 'function') {\n        customKeyboardEvent = new KeyboardEvent(event.type, event as any);\n    } else {\n        customKeyboardEvent = document.createEvent('Event') as any;\n        customKeyboardEvent.initEvent(event.type, true, true);\n        customKeyboardEvent.key = event.key;\n        customKeyboardEvent.charCode = event.charCode;\n    }\n\n    return customKeyboardEvent;\n};\n\nexport const setInputValueByRef = (input: HTMLInputElement | null, value: string | undefined, event = 'change'): void => {\n    if (!input) {\n        return;\n    }\n\n    const previousValue = input.value;\n    input.value = value || '';\n\n    const tracker = (input as any)._valueTracker;\n\n    if (tracker) {\n        tracker.setValue(previousValue);\n    }\n\n    // 'change' instead of 'input', see https://github.com/facebook/react/issues/11488#issuecomment-381590324\n    input.dispatchEvent(createCustomEvent(event));\n};\n\nexport const deselectInputValue = (input: HTMLInputElement) => {\n    // input type=\"number\" doesn't support \"setSelectionRange\",\n    // easiest way is to switch input type to text, deselect value, and switch it back to number.\n    const isNumber = input.type === 'number';\n    if (isNumber) {\n        input.type = 'text';\n    }\n    input.setSelectionRange?.(input.value?.length, input.value?.length);\n    if (isNumber) {\n        input.type = 'number';\n    }\n};\n"],"names":["createCustomEvent","eventType","customEvent","Event","bubbles","document","createEvent","initEvent","createCustomKeyboardEvent","event","customKeyboardEvent","KeyboardEvent","type","key","charCode","setInputValueByRef","input","value","previousValue","tracker","_valueTracker","setValue","dispatchEvent","deselectInputValue","isNumber","setSelectionRange","length"],"mappings":"AAAA;MACaA,iBAAiB,GAAIC,SAAiB;EAC/C,IAAIC,WAAW;EAEf,IAAI,OAAOC,KAAK,KAAK,UAAU,EAAE;IAC7BD,WAAW,GAAG,IAAIC,KAAK,CAACF,SAAS,EAAE;MAAEG,OAAO,EAAE;KAAM,CAAC;GACxD,MAAM;IACHF,WAAW,GAAGG,QAAQ,CAACC,WAAW,CAAC,OAAO,CAAC;IAC3CJ,WAAW,CAACK,SAAS,CAACN,SAAS,EAAE,IAAI,EAAE,IAAI,CAAC;;EAEhD,OAAOC,WAAW;AACtB;AAEA;MACaM,yBAAyB,GAAIC,KAA4C;EAClF,IAAIC,mBAAmB;EAEvB,IAAI,OAAOC,aAAa,KAAK,UAAU,EAAE;IACrCD,mBAAmB,GAAG,IAAIC,aAAa,CAACF,KAAK,CAACG,IAAI,EAAEH,KAAY,CAAC;GACpE,MAAM;IACHC,mBAAmB,GAAGL,QAAQ,CAACC,WAAW,CAAC,OAAO,CAAQ;IAC1DI,mBAAmB,CAACH,SAAS,CAACE,KAAK,CAACG,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC;IACrDF,mBAAmB,CAACG,GAAG,GAAGJ,KAAK,CAACI,GAAG;IACnCH,mBAAmB,CAACI,QAAQ,GAAGL,KAAK,CAACK,QAAQ;;EAGjD,OAAOJ,mBAAmB;AAC9B;MAEaK,kBAAkB,GAAG,CAACC,KAA8B,EAAEC,KAAyB,EAAER,KAAK,GAAG,QAAQ;EAC1G,IAAI,CAACO,KAAK,EAAE;IACR;;EAGJ,MAAME,aAAa,GAAGF,KAAK,CAACC,KAAK;EACjCD,KAAK,CAACC,KAAK,GAAGA,KAAK,IAAI,EAAE;EAEzB,MAAME,OAAO,GAAIH,KAAa,CAACI,aAAa;EAE5C,IAAID,OAAO,EAAE;IACTA,OAAO,CAACE,QAAQ,CAACH,aAAa,CAAC;;;EAInCF,KAAK,CAACM,aAAa,CAACtB,iBAAiB,CAACS,KAAK,CAAC,CAAC;AACjD;MAEac,kBAAkB,GAAIP,KAAuB;;;;EAGtD,MAAMQ,QAAQ,GAAGR,KAAK,CAACJ,IAAI,KAAK,QAAQ;EACxC,IAAIY,QAAQ,EAAE;IACVR,KAAK,CAACJ,IAAI,GAAG,MAAM;;EAEvB,yBAAAI,KAAK,CAACS,iBAAiB,0DAAvB,2BAAAT,KAAK,kBAAqBA,KAAK,CAACC,KAAK,iDAAX,aAAaS,MAAM,mBAAEV,KAAK,CAACC,KAAK,kDAAX,cAAaS,MAAM,CAAC;EACnE,IAAIF,QAAQ,EAAE;IACVR,KAAK,CAACJ,IAAI,GAAG,QAAQ;;AAE7B;;;;"}

package/dist/hooks/useGlobalKeyDown.d.ts

@@ -1,2 +1,2 @@
 import { KeyDownHandlerOptions } from '../utils/keyboard';
-export declare const useGlobalKeyDown: (key: string | KeyDownHandlerOptions, handler: (event: KeyboardEvent) => void) => void;
+export declare const useGlobalKeyDown: (shortcut: string | KeyDownHandlerOptions | undefined, handler: (event: KeyboardEvent) => void) => void;

package/dist/hooks/useLazyEffect.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare function useLazyEffect(effect: React.EffectCallback, deps?: React.DependencyList | undefined): void;

package/dist/index.css

@@ -147,7 +147,7 @@
         @apply focus:yt-focus flex flex-col focus:rounded-sm;
     }
     table.yt-table thead.yt-table__head tr.yt-table__row {
-        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-t-0 border-b-2 font-bold;
+        @apply border-grey-100 flex h-auto min-h-[2.5rem] w-full select-none border-b-2 border-t-0 font-bold;
     }
 
     table.yt-table thead.yt-table__head tr.yt-table__row th.yt-table__cell {
@@ -162,7 +162,6 @@
         @apply flex-1 truncate p-2 text-center align-middle;
     }
 
-    [aria-hidden] > [data-taco='menu'],
     [aria-hidden] > [data-taco='hanger'] {
         @apply invisible;
     }
@@ -638,3 +637,132 @@
 #yt-table__drag__placeholder {
     @apply flex w-3/12 rounded bg-blue-500 p-4 font-bold text-white;
 }
+
+/* cells */
+[role='cell'],
+[role='columnheader'] {
+    @apply border-grey-300 bg-white;
+}
+
+[role='cell']:not([data-highlighted='true']),
+[role='columnheader'] {
+    @apply flex px-4;
+}
+
+[role='cell'][data-align='left'],
+[role='columnheader'][data-align='left'] {
+    @apply justify-start text-left;
+}
+
+[role='cell'][data-align='center'],
+[role='columnheader'][data-align='center'] {
+    @apply justify-center text-center;
+}
+
+[role='cell'][data-align='right'],
+[role='columnheader'][data-align='right'] {
+    @apply justify-end text-right;
+}
+
+[role='row']:not(:last-child) [role='cell'] {
+    @apply border-b;
+}
+
+/* hovered row */
+[data-pause-hover='false'] [role='row']:hover [role='cell'] {
+    @apply bg-grey-100;
+}
+
+/* current row */
+[role='row'][data-current='true'] [role='cell'] {
+    @apply bg-grey-200;
+}
+
+/* selected row */
+[role='row'][data-selected='true']:not([aria-grabbed='true']) [role='cell'] {
+    @apply !bg-blue-100;
+}
+
+/* dragging row */
+[role='row'][aria-grabbed='true'] [role='cell'] {
+    @apply !wcag-blue-500;
+}
+
+/* error row */
+[role='row'][data-error='true'] [role='cell'] {
+    @apply !bg-red-100/30;
+}
+
+/* cell component overrides */
+
+/* small font size */
+[data-font-size='small'] [role='cell'] [data-taco='badge'],
+[data-font-size='small'] [role='cell'] [data-taco='badge-icon'],
+[data-font-size='small'] [role='cell'] [data-taco='icon'] {
+    @apply !-my-0.5 !text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='tag'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'],
+[data-font-size='small'] [role='cell'] [data-taco='input-container'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply !-my-1;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input'],
+[data-font-size='small'] [role='cell'] [data-taco='Select2'] {
+    @apply h-6 min-h-[theme(spacing.6)] px-1.5 text-xs;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)];
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-4 !w-4;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'],
+[data-font-size='small'] [role='cell'] [data-taco='switch'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='small'] [role='cell'] [data-taco='checkbox-container'] [data-taco='checkbox'],
+[data-font-size='small'] [role='cell'] [data-taco='switch-container'] [data-taco='switch'] {
+    @apply !my-0;
+}
+
+/* medium font size */
+[data-font-size='medium'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='medium'] [role='cell'] [data-taco='Select2'],
+[data-font-size='medium'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-1.5;
+}
+
+/* large font size */
+[data-font-size='large'] [role='cell'] [data-taco='tag'] {
+    @apply !-my-0.5;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='Select2'],
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] {
+    @apply !-my-2;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input'],
+[data-font-size='large'] [role='cell'] [data-taco='Select2'] {
+    @apply h-10 px-2.5 text-lg;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] button {
+    @apply !h-10 !w-10;
+}
+
+[data-font-size='large'] [role='cell'] [data-taco='input-container'] [data-affix-type='postfix'] [data-taco='icon'] {
+    @apply !h-6 !w-6;
+}

package/dist/index.d.ts

@@ -33,13 +33,14 @@ export * from './components/Provider/Provider';
 export * from './components/Provider/Localization';
 export * from './components/RadioGroup/RadioGroup';
 export * from './components/SearchInput/SearchInput';
+export * from './components/SearchInput2/SearchInput2';
 export * from './components/Select/Select';
 export * from './components/Select2/Select2';
 export * from './components/Shortcut/Shortcut';
 export * from './components/Spinner/Spinner';
 export * from './components/Switch/Switch';
 export * from './components/Table/Table';
-export * from './components/Table2/Table2';
+export * from './components/Table3/Table3';
 export * from './components/Tabs/Tabs';
 export * from './components/Tag/Tag';
 export * from './components/Textarea/Textarea';
@@ -59,6 +60,7 @@ export * from './hooks/useBoundaryOverflowDetection';
 export * from './hooks/useBoundingClientRectListener';
 export * from './hooks/useIntersectionObserver';
 export * from './hooks/useIsLargeScreen';
+export * from './hooks/useLazyEffect';
 export * from './hooks/useMatchMedia';
 export * from './hooks/useMergedRef';
 export * from './utils/hooks/useDropTarget';