@economic/taco 0.0.1-alpha.1543 → 0.0.1-alpha.2

package/dist/esm/src/components/Dialog/components/Content.js.map

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sources":["../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { useCurrentMenu } from '../../Menu/Context';\nimport { useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Provider';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { Group } from '../../Group/Group';\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: {\n        open: boolean;\n        toggle: () => void;\n    };\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    return <DialogPrimitive.Title {...props} className=\"text-center\" ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    return (\n        <div {...props} className=\"flex justify-end mt-8\" ref={ref}>\n            <Group>{props.children}</Group>\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n\n    return <DialogPrimitive.Close onClick={dialog.onClose} {...props} ref={ref} asChild />;\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible description to be announced when the dialog is opened */\n    'aria-describedby': string;\n    children: Omit<React.ReactNode, 'Function'> | ((props: DialogContentRenderProps) => JSX.Element);\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n    const dialog = useCurrentDialog();\n    const internalRef = useProxiedRef<HTMLDivElement>(ref);\n    const { position, handleProps: dragHandleProps } = useDraggable(internalRef);\n    const { texts } = useLocalization();\n\n    // if the dialog was opened by a menu, we need to close the menu when the dialog closes\n    // the menu is still open (and mounted) because it is the trigger for the dialog\n    const menu = useCurrentMenu();\n    let handleCloseAutoFocus;\n\n    if (menu) {\n        handleCloseAutoFocus = () => menu.close();\n    }\n\n    const className = cn('bg-white rounded fixed-center', {\n        'w-128 text-center justify-center': dialog.size === 'dialog',\n        'w-xs': dialog.size === 'xs',\n        'w-sm': dialog.size === 'sm',\n        'w-md': dialog.size === 'md',\n        'w-lg': dialog.size === 'lg',\n    });\n\n    const containerClassName = cn(\n        'yt-dialog bg-white p-6 rounded relative z-[999]',\n        'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    const overlayClassName = cn(\n        'fixed inset-0 cursor-default overflow-y-auto bg-[rgba(50,46,62,0.8)] animate-[fade-in_150ms] aria-hidden:hidden'\n    );\n\n    // the chosen behaviour in taco is that outside clicks do not close the dialog\n    const handleInteractOutside = event => event.preventDefault();\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = props.children({ drawer: dialog.drawer, close: dialog.close });\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <DialogPrimitive.Portal>\n            <DialogPrimitive.Overlay className={overlayClassName}>\n                <DialogPrimitive.Content\n                    {...props}\n                    className={className}\n                    data-taco=\"dialog\"\n                    onEscapeKeyDown={dialog.onClose}\n                    onInteractOutside={handleInteractOutside}\n                    onCloseAutoFocus={handleCloseAutoFocus}\n                    ref={ref}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `calc(50% + ${position.x}px)` : undefined,\n                        top: dialog.draggable ? `calc(50% + ${position.y}px)` : undefined,\n                    }}\n                >\n                    <div className={containerClassName}>\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x h-3 rounded bg-grey-light cursor-move text-center w-24 top-1.5\"\n                            />\n                        )}\n                        <DialogPrimitive.Close asChild onClick={dialog.onClose}>\n                            <IconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute top-0 right-0 mt-2 mr-2\"\n                                icon=\"close\"\n                            />\n                        </DialogPrimitive.Close>\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Content>\n            </DialogPrimitive.Overlay>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["Title","React","DialogTitle","props","ref","DialogPrimitive","className","Footer","DialogFooter","Group","children","Close","DialogClose","dialog","useCurrentDialog","onClick","onClose","asChild","Content","DialogContent","internalRef","useProxiedRef","useDraggable","position","dragHandleProps","handleProps","useLocalization","texts","menu","useCurrentMenu","handleCloseAutoFocus","close","cn","size","containerClassName","elements","extra","overlayClassName","handleInteractOutside","event","preventDefault","output","drawer","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus","style","left","draggable","x","undefined","top","y","drag","IconButton","appearance","icon"],"mappings":"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"}
+{"version":3,"file":"Content.js","sources":["../../../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useProxiedRef } from '../../../utils/hooks/useProxiedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { useCurrentMenu } from '../../Menu/Context';\nimport { useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Provider';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { Group } from '../../Group/Group';\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: {\n        open: boolean;\n        toggle: () => void;\n    };\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    return <DialogPrimitive.Title {...props} className=\"text-center\" ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    return (\n        <div {...props} className=\"mt-8 flex justify-end\" ref={ref}>\n            <Group>{props.children}</Group>\n        </div>\n    );\n});\n\nexport type DialogCloseProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n\n    return <DialogPrimitive.Close onClick={dialog.onClose} {...props} ref={ref} asChild />;\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible description to be announced when the dialog is opened */\n    'aria-describedby': string;\n    children: Omit<React.ReactNode, 'Function'> | ((props: DialogContentRenderProps) => JSX.Element);\n};\nexport const Content = React.forwardRef(function DialogContent(props: DialogContentProps, ref: React.Ref<HTMLDivElement>) {\n    const dialog = useCurrentDialog();\n    const internalRef = useProxiedRef<HTMLDivElement>(ref);\n    const { position, handleProps: dragHandleProps } = useDraggable(internalRef);\n    const { texts } = useLocalization();\n\n    // if the dialog was opened by a menu, we need to close the menu when the dialog closes\n    // the menu is still open (and mounted) because it is the trigger for the dialog\n    const menu = useCurrentMenu();\n    let handleCloseAutoFocus;\n\n    if (menu) {\n        handleCloseAutoFocus = () => menu.close();\n    }\n\n    const className = cn('bg-white rounded mt-16 mx-auto', {\n        'w-128 text-center justify-center': dialog.size === 'dialog',\n        'w-xs': dialog.size === 'xs',\n        'w-sm': dialog.size === 'sm',\n        'w-md': dialog.size === 'md',\n        'w-lg': dialog.size === 'lg',\n    });\n\n    const containerClassName = cn(\n        'yt-dialog bg-white p-6 rounded relative z-[999]',\n        'shadow-[0_6px_9px_0_rgba(89,85,98,0.3),0_0_1px_0_rgba(89,85,98,0.2)]',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    const overlayClassName = cn(\n        'fixed inset-0 cursor-default overflow-y-auto bg-[rgba(50,46,62,0.8)] animate-[fade-in_150ms] aria-hidden:hidden'\n    );\n\n    // the chosen behaviour in taco is that outside clicks do not close the dialog\n    const handleInteractOutside = event => event.preventDefault();\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = props.children({ drawer: dialog.drawer, close: dialog.close });\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <DialogPrimitive.Portal>\n            <DialogPrimitive.Overlay className={overlayClassName}>\n                <DialogPrimitive.Content\n                    {...props}\n                    className={className}\n                    data-taco=\"dialog\"\n                    onEscapeKeyDown={dialog.onClose}\n                    onInteractOutside={handleInteractOutside}\n                    onCloseAutoFocus={handleCloseAutoFocus}\n                    ref={ref}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `calc(50% + ${position.x}px)` : undefined,\n                        top: dialog.draggable ? `calc(50% + ${position.y}px)` : undefined,\n                    }}\n                >\n                    <div className={containerClassName}>\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x bg-grey-light top-1.5 h-3 w-24 cursor-move rounded text-center\"\n                            />\n                        )}\n                        <DialogPrimitive.Close asChild onClick={dialog.onClose}>\n                            <IconButton\n                                appearance=\"discrete\"\n                                aria-label={texts.dialog.close}\n                                className=\"absolute top-0 right-0 mt-2 mr-2\"\n                                icon=\"close\"\n                            />\n                        </DialogPrimitive.Close>\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Content>\n            </DialogPrimitive.Overlay>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["Title","React","DialogTitle","props","ref","DialogPrimitive","className","Footer","DialogFooter","Group","children","Close","DialogClose","dialog","useCurrentDialog","onClick","onClose","asChild","Content","DialogContent","internalRef","useProxiedRef","useDraggable","position","dragHandleProps","handleProps","useLocalization","texts","menu","useCurrentMenu","handleCloseAutoFocus","close","cn","size","containerClassName","elements","extra","overlayClassName","handleInteractOutside","event","preventDefault","output","drawer","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus","style","left","draggable","x","undefined","top","y","drag","IconButton","appearance","icon"],"mappings":";;;;;;;;;;;;IAoBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASC,WAAT,CAAqBC,KAArB,EAA8CC,GAA9C;AAClC,SAAOH,aAAA,CAACI,OAAD,oBAA2BF;AAAOG,IAAAA,SAAS,EAAC;AAAcF,IAAAA,GAAG,EAAEA;IAA/D,CAAP;AACH,CAFoB;IAKRG,MAAM,gBAAGN,UAAA,CAAiB,SAASO,YAAT,CAAsBL,KAAtB,EAAgDC,GAAhD;AACnC,SACIH,aAAA,MAAA,oBAASE;AAAOG,IAAAA,SAAS,EAAC;AAAwBF,IAAAA,GAAG,EAAEA;IAAvD,EACIH,aAAA,CAACQ,KAAD,MAAA,EAAQN,KAAK,CAACO,QAAd,CADJ,CADJ;AAKH,CANqB;IAUTC,KAAK,gBAAGV,UAAA,CAAiB,SAASW,WAAT,CAAqBT,KAArB,EAA8CC,GAA9C;AAClC,MAAMS,MAAM,GAAGC,gBAAgB,EAA/B;AAEA,SAAOb,aAAA,CAACI,OAAD;AAAuBU,IAAAA,OAAO,EAAEF,MAAM,CAACG;KAAab;AAAOC,IAAAA,GAAG,EAAEA;AAAKa,IAAAA,OAAO;IAA5E,CAAP;AACH,CAJoB;IAWRC,OAAO,gBAAGjB,UAAA,CAAiB,SAASkB,aAAT,CAAuBhB,KAAvB,EAAkDC,GAAlD;AACpC,MAAMS,MAAM,GAAGC,gBAAgB,EAA/B;AACA,MAAMM,WAAW,GAAGC,aAAa,CAAiBjB,GAAjB,CAAjC;;AACA,sBAAmDkB,YAAY,CAACF,WAAD,CAA/D;AAAA,MAAQG,QAAR,iBAAQA,QAAR;AAAA,MAA+BC,eAA/B,iBAAkBC,WAAlB;;AACA,yBAAkBC,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;AAGA;;;AACA,MAAMC,IAAI,GAAGC,cAAc,EAA3B;AACA,MAAIC,oBAAJ;;AAEA,MAAIF,IAAJ,EAAU;AACNE,IAAAA,oBAAoB,GAAG;AAAA,aAAMF,IAAI,CAACG,KAAL,EAAN;AAAA,KAAvB;AACH;;AAED,MAAMzB,SAAS,GAAG0B,EAAE,CAAC,gCAAD,EAAmC;AACnD,wCAAoCnB,MAAM,CAACoB,IAAP,KAAgB,QADD;AAEnD,YAAQpB,MAAM,CAACoB,IAAP,KAAgB,IAF2B;AAGnD,YAAQpB,MAAM,CAACoB,IAAP,KAAgB,IAH2B;AAInD,YAAQpB,MAAM,CAACoB,IAAP,KAAgB,IAJ2B;AAKnD,YAAQpB,MAAM,CAACoB,IAAP,KAAgB;AAL2B,GAAnC,CAApB;AAQA,MAAMC,kBAAkB,GAAGF,EAAE,CACzB,iDADyB,EAEzB,sEAFyB,EAGzB;AACI,sBAAkB,CAAC,CAACnB,MAAM,CAACsB,QAAP,CAAgBC;AADxC,GAHyB,EAMzBjC,KAAK,CAACG,SANmB,CAA7B;AASA,MAAM+B,gBAAgB,GAAGL,EAAE,CACvB,iHADuB,CAA3B;;AAKA,MAAMM,qBAAqB,GAAG,SAAxBA,qBAAwB,CAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,cAAN,EAAJ;AAAA,GAAnC;;AAEA,MAAIC,MAAJ;;AAEA,MAAI,OAAOtC,KAAK,CAACO,QAAb,KAA0B,UAA9B,EAA0C;AACtC+B,IAAAA,MAAM,GAAGtC,KAAK,CAACO,QAAN,CAAe;AAAEgC,MAAAA,MAAM,EAAE7B,MAAM,CAAC6B,MAAjB;AAAyBX,MAAAA,KAAK,EAAElB,MAAM,CAACkB;AAAvC,KAAf,CAAT;AACH,GAFD,MAEO;AACHU,IAAAA,MAAM,GAAGtC,KAAK,CAACO,QAAf;AACH;;AAED,SACIT,aAAA,CAACI,MAAD,MAAA,EACIJ,aAAA,CAACI,OAAD;AAAyBC,IAAAA,SAAS,EAAE+B;GAApC,EACIpC,aAAA,CAACI,SAAD,oBACQF;AACJG,IAAAA,SAAS,EAAEA;iBACD;AACVqC,IAAAA,eAAe,EAAE9B,MAAM,CAACG;AACxB4B,IAAAA,iBAAiB,EAAEN;AACnBO,IAAAA,gBAAgB,EAAEf;AAClB1B,IAAAA,GAAG,EAAEA;AACL0C,IAAAA,KAAK,eACE3C,KAAK,CAAC2C,KADR;AAEDC,MAAAA,IAAI,EAAElC,MAAM,CAACmC,SAAP,mBAAiCzB,QAAQ,CAAC0B,CAA1C,WAAmDC,SAFxD;AAGDC,MAAAA,GAAG,EAAEtC,MAAM,CAACmC,SAAP,mBAAiCzB,QAAQ,CAAC6B,CAA1C,WAAmDF;AAHvD;IART,EAcIjD,aAAA,MAAA;AAAKK,IAAAA,SAAS,EAAE4B;GAAhB,EACKO,MADL,EAEK5B,MAAM,CAACmC,SAAP,IACG/C,aAAA,MAAA,oBACQuB;kBACQG,KAAK,CAACd,MAAN,CAAawC;AACzB/C,IAAAA,SAAS,EAAC;IAHd,CAHR,EASIL,aAAA,CAACI,OAAD;AAAuBY,IAAAA,OAAO;AAACF,IAAAA,OAAO,EAAEF,MAAM,CAACG;GAA/C,EACIf,aAAA,CAACqD,UAAD;AACIC,IAAAA,UAAU,EAAC;kBACC5B,KAAK,CAACd,MAAN,CAAakB;AACzBzB,IAAAA,SAAS,EAAC;AACVkD,IAAAA,IAAI,EAAC;GAJT,CADJ,CATJ,CAdJ,EAgCK3C,MAAM,CAACsB,QAAP,CAAgBO,MAhCrB,EAiCK7B,MAAM,CAACsB,QAAP,CAAgBC,KAjCrB,CADJ,CADJ,CADJ;AAyCH,CAxFsB;;;;"}

package/dist/esm/src/components/Dialog/components/Trigger.js

@@ -1,11 +1,12 @@
 import { forwardRef, createElement } from 'react';
+import mergeRefs from '../../../utils/mergeRefs.js';
 import { Trigger as Trigger$1 } from '@radix-ui/react-dialog';
 import { useCurrentDialog } from '../Context.js';
 
 var Trigger = /*#__PURE__*/forwardRef(function DialogTrigger(props, ref) {
   var dialog = useCurrentDialog();
   return createElement(Trigger$1, Object.assign({}, dialog.props, props, {
-    ref: ref,
+    ref: mergeRefs([dialog.ref, ref]),
     asChild: true
   }));
 });

package/dist/esm/src/components/Dialog/components/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useCurrentDialog } from '../Context';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Trigger = React.forwardRef(function DialogTrigger(props: DialogTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    return <DialogPrimitive.Trigger {...dialog.props} {...props} ref={ref} asChild />;\n});\n"],"names":["Trigger","React","DialogTrigger","props","ref","dialog","useCurrentDialog","DialogPrimitive","asChild"],"mappings":";;;;IAMaA,OAAO,gBAAGC,UAAA,CAAiB,SAASC,aAAT,CAAuBC,KAAvB,EAAkDC,GAAlD;AACpC,MAAMC,MAAM,GAAGC,gBAAgB,EAA/B;AACA,SAAOL,aAAA,CAACM,SAAD,oBAA6BF,MAAM,CAACF,OAAWA;AAAOC,IAAAA,GAAG,EAAEA;AAAKI,IAAAA,OAAO;IAAvE,CAAP;AACH,CAHsB;;;;"}
+{"version":3,"file":"Trigger.js","sources":["../../../../../../src/components/Dialog/components/Trigger.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { useCurrentDialog } from '../Context';\nimport mergeRefs from '../../../utils/mergeRefs';\n\nexport type DialogTriggerProps = React.HTMLAttributes<HTMLButtonElement>;\n\nexport const Trigger = React.forwardRef(function DialogTrigger(props: DialogTriggerProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    return <DialogPrimitive.Trigger {...dialog.props} {...props} ref={mergeRefs([dialog.ref, ref])} asChild />;\n});\n"],"names":["Trigger","React","DialogTrigger","props","ref","dialog","useCurrentDialog","DialogPrimitive","mergeRefs","asChild"],"mappings":";;;;;IAOaA,OAAO,gBAAGC,UAAA,CAAiB,SAASC,aAAT,CAAuBC,KAAvB,EAAkDC,GAAlD;AACpC,MAAMC,MAAM,GAAGC,gBAAgB,EAA/B;AACA,SAAOL,aAAA,CAACM,SAAD,oBAA6BF,MAAM,CAACF,OAAWA;AAAOC,IAAAA,GAAG,EAAEI,SAAS,CAAC,CAACH,MAAM,CAACD,GAAR,EAAaA,GAAb,CAAD;AAAqBK,IAAAA,OAAO;IAAhG,CAAP;AACH,CAHsB;;;;"}

package/dist/esm/src/components/Hanger/Hanger.js

@@ -1,19 +1,21 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { useMemo, createElement, createContext, forwardRef, useContext } from 'react';
+import { forwardRef, useMemo, createElement, createContext, useContext } from 'react';
 import cn from 'classnames';
-import { IconButton } from '../IconButton/IconButton.js';
-import { useLocalization } from '../Provider/Provider.js';
 import { Root, Anchor as Anchor$1, Close } from '@radix-ui/react-popover';
 import { UnstyledContent, UnstyledArrow } from '../Popover/Primitives.js';
+import { useLocalization } from '../Provider/Provider.js';
+import mergeRefs from '../../utils/mergeRefs.js';
+import { IconButton } from '../IconButton/IconButton.js';
 
 var _excluded = ["children"];
 var HangerContext = /*#__PURE__*/createContext({
-  props: {}
+  props: {},
+  ref: null
 });
 var Anchor = /*#__PURE__*/forwardRef(function (props, ref) {
   var context = useContext(HangerContext);
   return createElement(Anchor$1, Object.assign({}, context.props, props, {
-    ref: ref,
+    ref: mergeRefs([context.ref, ref]),
     asChild: true
   }));
 });
@@ -40,18 +42,19 @@ var Content = /*#__PURE__*/forwardRef(function (props, ref) {
   }, createElement(IconButton, {
     appearance: "primary",
     "aria-label": texts.hanger.close,
-    className: "text-white ml-2 absolute top-0 right-0 mr-2 mt-2",
+    className: "absolute top-0 right-0 ml-2 mr-2 mt-2 text-white",
     icon: "close",
     onClick: props.onClose
   })));
 });
-var Hanger = function Hanger(props) {
+var Hanger = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
       otherProps = _objectWithoutPropertiesLoose(props, _excluded);
 
   var context = useMemo(function () {
     return {
-      props: otherProps
+      props: otherProps,
+      ref: ref
     };
   }, [otherProps]);
   return createElement(HangerContext.Provider, {
@@ -60,7 +63,7 @@ var Hanger = function Hanger(props) {
     children: children,
     defaultOpen: true
   }));
-};
+});
 Hanger.Anchor = Anchor;
 Hanger.Content = Content;
 

package/dist/esm/src/components/Hanger/Hanger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hanger.js","sources":["../../../../../src/components/Hanger/Hanger.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Placement } from '../..';\nimport { UnstyledArrow, UnstyledContent } from '../Popover/Primitives';\nimport { useLocalization } from '../Provider/Provider';\nimport './Hanger.css';\n\nconst HangerContext = React.createContext({\n    props: {},\n});\n\nexport type HangerTexts = {\n    /** Aria-label for the close icon button of hanger */\n    close: string;\n};\n\nexport type HangerAnchorProps = React.HTMLAttributes<HTMLDivElement>;\nconst Anchor = React.forwardRef((props: HangerAnchorProps, ref: React.Ref<HTMLDivElement>) => {\n    const context = React.useContext(HangerContext);\n    return <PopoverPrimitive.Anchor {...context.props} {...props} ref={ref} asChild />;\n});\n\nexport type CloseHandler = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | undefined;\nexport type HangerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** Handler called when user closes the hanger */\n    onClose?: CloseHandler;\n    /** Set the position of the Hanger relative to its achor. Default value is `bottom` */\n    placement?: Placement;\n};\n\nconst Content = React.forwardRef((props: HangerContentProps, ref: React.Ref<HTMLDivElement>) => {\n    const { texts } = useLocalization();\n    const className = cn(\n        'wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent',\n        props.className\n    );\n    const handleInteractOutside = (event: CustomEvent): void => {\n        event.preventDefault();\n    };\n\n    return (\n        <UnstyledContent\n            className={className}\n            data-taco=\"hanger\"\n            onInteractOutside={handleInteractOutside}\n            placement={props.placement}\n            ref={ref}\n        >\n            {props.children}\n            <UnstyledArrow className=\"text-blue\" />\n            <PopoverPrimitive.Close asChild>\n                <IconButton\n                    appearance=\"primary\"\n                    aria-label={texts.hanger.close}\n                    className=\"text-white ml-2 absolute top-0 right-0 mr-2 mt-2\"\n                    icon=\"close\"\n                    onClick={props.onClose}\n                />\n            </PopoverPrimitive.Close>\n        </UnstyledContent>\n    );\n});\n\nexport type HangerProps = React.PropsWithChildren<{}>;\nexport const Hanger = (props: HangerProps): JSX.Element => {\n    const { children, ...otherProps } = props;\n\n    const context = React.useMemo(() => ({ props: otherProps }), [otherProps]);\n\n    return (\n        <HangerContext.Provider value={context}>\n            <PopoverPrimitive.Root children={children} defaultOpen />\n        </HangerContext.Provider>\n    );\n};\nHanger.Anchor = Anchor;\nHanger.Content = Content;\n"],"names":["HangerContext","React","props","Anchor","ref","context","PopoverPrimitive","asChild","Content","useLocalization","texts","className","cn","handleInteractOutside","event","preventDefault","UnstyledContent","onInteractOutside","placement","children","UnstyledArrow","IconButton","appearance","hanger","close","icon","onClick","onClose","Hanger","otherProps","Provider","value","defaultOpen"],"mappings":";;;;;;;;;AASA,IAAMA,aAAa,gBAAGC,aAAA,CAAoB;AACtCC,EAAAA,KAAK,EAAE;AAD+B,CAApB,CAAtB;AAUA,IAAMC,MAAM,gBAAGF,UAAA,CAAiB,UAACC,KAAD,EAA2BE,GAA3B;AAC5B,MAAMC,OAAO,GAAGJ,UAAA,CAAiBD,aAAjB,CAAhB;AACA,SAAOC,aAAA,CAACK,QAAD,oBAA6BD,OAAO,CAACH,OAAWA;AAAOE,IAAAA,GAAG,EAAEA;AAAKG,IAAAA,OAAO;IAAxE,CAAP;AACH,CAHc,CAAf;AAaA,IAAMC,OAAO,gBAAGP,UAAA,CAAiB,UAACC,KAAD,EAA4BE,GAA5B;AAC7B,yBAAkBK,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AACA,MAAMC,SAAS,GAAGC,EAAE,CAChB,kGADgB,EAEhBV,KAAK,CAACS,SAFU,CAApB;;AAIA,MAAME,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,KAAD;AAC1BA,IAAAA,KAAK,CAACC,cAAN;AACH,GAFD;;AAIA,SACId,aAAA,CAACe,eAAD;AACIL,IAAAA,SAAS,EAAEA;iBACD;AACVM,IAAAA,iBAAiB,EAAEJ;AACnBK,IAAAA,SAAS,EAAEhB,KAAK,CAACgB;AACjBd,IAAAA,GAAG,EAAEA;GALT,EAOKF,KAAK,CAACiB,QAPX,EAQIlB,aAAA,CAACmB,aAAD;AAAeT,IAAAA,SAAS,EAAC;GAAzB,CARJ,EASIV,aAAA,CAACK,KAAD;AAAwBC,IAAAA,OAAO;GAA/B,EACIN,aAAA,CAACoB,UAAD;AACIC,IAAAA,UAAU,EAAC;kBACCZ,KAAK,CAACa,MAAN,CAAaC;AACzBb,IAAAA,SAAS,EAAC;AACVc,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAExB,KAAK,CAACyB;GALnB,CADJ,CATJ,CADJ;AAqBH,CA/Be,CAAhB;IAkCaC,MAAM,GAAG,SAATA,MAAS,CAAC1B,KAAD;AAClB,MAAQiB,QAAR,GAAoCjB,KAApC,CAAQiB,QAAR;AAAA,MAAqBU,UAArB,iCAAoC3B,KAApC;;AAEA,MAAMG,OAAO,GAAGJ,OAAA,CAAc;AAAA,WAAO;AAAEC,MAAAA,KAAK,EAAE2B;AAAT,KAAP;AAAA,GAAd,EAA6C,CAACA,UAAD,CAA7C,CAAhB;AAEA,SACI5B,aAAA,CAACD,aAAa,CAAC8B,QAAf;AAAwBC,IAAAA,KAAK,EAAE1B;GAA/B,EACIJ,aAAA,CAACK,IAAD;AAAuBa,IAAAA,QAAQ,EAAEA;AAAUa,IAAAA,WAAW;GAAtD,CADJ,CADJ;AAKH;AACDJ,MAAM,CAACzB,MAAP,GAAgBA,MAAhB;AACAyB,MAAM,CAACpB,OAAP,GAAiBA,OAAjB;;;;"}
+{"version":3,"file":"Hanger.js","sources":["../../../../../src/components/Hanger/Hanger.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { IconButton } from '../IconButton/IconButton';\nimport { Placement } from '../..';\nimport { UnstyledArrow, UnstyledContent } from '../Popover/Primitives';\nimport { useLocalization } from '../Provider/Provider';\nimport './Hanger.css';\nimport mergeRefs from '../../utils/mergeRefs';\n\ntype HangerContextValue = {\n    props: any;\n    ref: React.Ref<HTMLElement>;\n};\nconst HangerContext = React.createContext<HangerContextValue>({\n    props: {},\n    ref: null,\n});\n\nexport type HangerTexts = {\n    /** Aria-label for the close icon button of hanger */\n    close: string;\n};\n\nexport type HangerAnchorProps = React.HTMLAttributes<HTMLDivElement>;\nconst Anchor = React.forwardRef((props: HangerAnchorProps, ref: React.Ref<HTMLDivElement>) => {\n    const context = React.useContext(HangerContext);\n    return <PopoverPrimitive.Anchor {...context.props} {...props} ref={mergeRefs([context.ref, ref])} asChild />;\n});\n\nexport type CloseHandler = (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | undefined;\nexport type HangerContentProps = React.HTMLAttributes<HTMLDivElement> & {\n    /** Handler called when user closes the hanger */\n    onClose?: CloseHandler;\n    /** Set the position of the Hanger relative to its achor. Default value is `bottom` */\n    placement?: Placement;\n};\n\nconst Content = React.forwardRef((props: HangerContentProps, ref: React.Ref<HTMLDivElement>) => {\n    const { texts } = useLocalization();\n    const className = cn(\n        'wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent',\n        props.className\n    );\n    const handleInteractOutside = (event: CustomEvent): void => {\n        event.preventDefault();\n    };\n\n    return (\n        <UnstyledContent\n            className={className}\n            data-taco=\"hanger\"\n            onInteractOutside={handleInteractOutside}\n            placement={props.placement}\n            ref={ref}\n        >\n            {props.children}\n            <UnstyledArrow className=\"text-blue\" />\n            <PopoverPrimitive.Close asChild>\n                <IconButton\n                    appearance=\"primary\"\n                    aria-label={texts.hanger.close}\n                    className=\"absolute top-0 right-0 ml-2 mr-2 mt-2 text-white\"\n                    icon=\"close\"\n                    onClick={props.onClose}\n                />\n            </PopoverPrimitive.Close>\n        </UnstyledContent>\n    );\n});\n\nexport type HangerProps = React.PropsWithChildren<{}>;\n\nexport type ForwardedHangerWithStatics = React.ForwardRefExoticComponent<HangerProps & React.RefAttributes<HTMLElement>> & {\n    Anchor: React.ForwardRefExoticComponent<HangerAnchorProps>;\n    Content: React.ForwardRefExoticComponent<HangerContentProps>;\n};\n\nexport const Hanger = React.forwardRef((props: HangerProps, ref: React.Ref<HTMLElement>): JSX.Element => {\n    const { children, ...otherProps } = props;\n\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <HangerContext.Provider value={context}>\n            <PopoverPrimitive.Root children={children} defaultOpen />\n        </HangerContext.Provider>\n    );\n}) as ForwardedHangerWithStatics;\nHanger.Anchor = Anchor;\nHanger.Content = Content;\n"],"names":["HangerContext","React","props","ref","Anchor","context","PopoverPrimitive","mergeRefs","asChild","Content","useLocalization","texts","className","cn","handleInteractOutside","event","preventDefault","UnstyledContent","onInteractOutside","placement","children","UnstyledArrow","IconButton","appearance","hanger","close","icon","onClick","onClose","Hanger","otherProps","Provider","value","defaultOpen"],"mappings":";;;;;;;;;;AAcA,IAAMA,aAAa,gBAAGC,aAAA,CAAwC;AAC1DC,EAAAA,KAAK,EAAE,EADmD;AAE1DC,EAAAA,GAAG,EAAE;AAFqD,CAAxC,CAAtB;AAWA,IAAMC,MAAM,gBAAGH,UAAA,CAAiB,UAACC,KAAD,EAA2BC,GAA3B;AAC5B,MAAME,OAAO,GAAGJ,UAAA,CAAiBD,aAAjB,CAAhB;AACA,SAAOC,aAAA,CAACK,QAAD,oBAA6BD,OAAO,CAACH,OAAWA;AAAOC,IAAAA,GAAG,EAAEI,SAAS,CAAC,CAACF,OAAO,CAACF,GAAT,EAAcA,GAAd,CAAD;AAAsBK,IAAAA,OAAO;IAAlG,CAAP;AACH,CAHc,CAAf;AAaA,IAAMC,OAAO,gBAAGR,UAAA,CAAiB,UAACC,KAAD,EAA4BC,GAA5B;AAC7B,yBAAkBO,eAAe,EAAjC;AAAA,MAAQC,KAAR,oBAAQA,KAAR;;AACA,MAAMC,SAAS,GAAGC,EAAE,CAChB,kGADgB,EAEhBX,KAAK,CAACU,SAFU,CAApB;;AAIA,MAAME,qBAAqB,GAAG,SAAxBA,qBAAwB,CAACC,KAAD;AAC1BA,IAAAA,KAAK,CAACC,cAAN;AACH,GAFD;;AAIA,SACIf,aAAA,CAACgB,eAAD;AACIL,IAAAA,SAAS,EAAEA;iBACD;AACVM,IAAAA,iBAAiB,EAAEJ;AACnBK,IAAAA,SAAS,EAAEjB,KAAK,CAACiB;AACjBhB,IAAAA,GAAG,EAAEA;GALT,EAOKD,KAAK,CAACkB,QAPX,EAQInB,aAAA,CAACoB,aAAD;AAAeT,IAAAA,SAAS,EAAC;GAAzB,CARJ,EASIX,aAAA,CAACK,KAAD;AAAwBE,IAAAA,OAAO;GAA/B,EACIP,aAAA,CAACqB,UAAD;AACIC,IAAAA,UAAU,EAAC;kBACCZ,KAAK,CAACa,MAAN,CAAaC;AACzBb,IAAAA,SAAS,EAAC;AACVc,IAAAA,IAAI,EAAC;AACLC,IAAAA,OAAO,EAAEzB,KAAK,CAAC0B;GALnB,CADJ,CATJ,CADJ;AAqBH,CA/Be,CAAhB;IAwCaC,MAAM,gBAAG5B,UAAA,CAAiB,UAACC,KAAD,EAAqBC,GAArB;AACnC,MAAQiB,QAAR,GAAoClB,KAApC,CAAQkB,QAAR;AAAA,MAAqBU,UAArB,iCAAoC5B,KAApC;;AAEA,MAAMG,OAAO,GAAGJ,OAAA,CAAc;AAAA,WAAO;AAAEC,MAAAA,KAAK,EAAE4B,UAAT;AAAqB3B,MAAAA,GAAG,EAAHA;AAArB,KAAP;AAAA,GAAd,EAAkD,CAAC2B,UAAD,CAAlD,CAAhB;AAEA,SACI7B,aAAA,CAACD,aAAa,CAAC+B,QAAf;AAAwBC,IAAAA,KAAK,EAAE3B;GAA/B,EACIJ,aAAA,CAACK,IAAD;AAAuBc,IAAAA,QAAQ,EAAEA;AAAUa,IAAAA,WAAW;GAAtD,CADJ,CADJ;AAKH,CAVqB;AAWtBJ,MAAM,CAACzB,MAAP,GAAgBA,MAAhB;AACAyB,MAAM,CAACpB,OAAP,GAAiBA,OAAjB;;;;"}

package/dist/esm/src/components/IconButton/IconButton.js

@@ -1,9 +1,8 @@
-import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../_virtual/_rollupPluginBabelHelpers.js';
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose, extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { Icon } from '../Icon/Icon.js';
-import { Button } from '../../primitives/Button.js';
-import { getButtonClasses, getAppearanceClasses } from '../Button/util.js';
+import { getButtonClasses, getAppearanceClasses, createButton } from '../Button/util.js';
 
 var _excluded = ["appearance", "icon", "rounded"];
 var IconButton = /*#__PURE__*/forwardRef(function IconButton(props, ref) {
@@ -24,14 +23,13 @@ var IconButton = /*#__PURE__*/forwardRef(function IconButton(props, ref) {
     return null;
   }
 
-  return createElement(Button, Object.assign({}, otherProps, {
-    className: className,
-    "data-taco": "icon-button",
-    ref: ref
-  }), createElement(Icon, {
-    name: icon,
-    className: "m-0 p-0"
-  }));
+  return createButton(_extends({}, otherProps, {
+    children: createElement(Icon, {
+      name: icon,
+      className: "m-0 p-0"
+    }),
+    'data-taco': 'icon-button'
+  }), className, ref);
 });
 
 export { IconButton };

package/dist/esm/src/components/IconButton/IconButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconButton.js","sources":["../../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { getAppearanceClasses, getButtonClasses } from '../Button/util';\nimport { Appearance } from '../../types';\n\nexport type IconButtonProps = Omit<ButtonPrimitive.ButtonProps, 'children'> & {\n    /** Appearance will change the style of the button */\n    appearance?: Appearance;\n    /** Set which icon should be rendered within button */\n    icon: IconName; // this dynamic type causes the type extraction for props to fail\n    /**\n     * Set whether the button is rounded.\n     * Default value is `false`\n     */\n    rounded?: boolean;\n};\n\nexport const IconButton = React.forwardRef(function IconButton(props: IconButtonProps, ref: React.Ref<HTMLButtonElement>) {\n    const { appearance, icon, rounded = false, ...otherProps } = props;\n\n    const className = cn(\n        getButtonClasses(),\n        getAppearanceClasses(appearance, true),\n        {\n            'rounded-full': rounded,\n            rounded: !rounded,\n            'cursor-not-allowed opacity-50': props.disabled,\n            'focus:yt-focus active:focus:yt-focus': !props.disabled,\n        },\n        props.className\n    );\n\n    if (!icon) {\n        return null;\n    }\n\n    return (\n        <ButtonPrimitive.Button {...otherProps} className={className} data-taco=\"icon-button\" ref={ref}>\n            <Icon name={icon} className=\"m-0 p-0\" />\n        </ButtonPrimitive.Button>\n    );\n});\n"],"names":["IconButton","React","props","ref","appearance","icon","rounded","otherProps","className","cn","getButtonClasses","getAppearanceClasses","disabled","ButtonPrimitive","Icon","name"],"mappings":";;;;;;;;IAmBaA,UAAU,gBAAGC,UAAA,CAAiB,SAASD,UAAT,CAAoBE,KAApB,EAA4CC,GAA5C;AACvC,MAAQC,UAAR,GAA6DF,KAA7D,CAAQE,UAAR;AAAA,MAAoBC,IAApB,GAA6DH,KAA7D,CAAoBG,IAApB;AAAA,uBAA6DH,KAA7D,CAA0BI,OAA1B;AAAA,MAA0BA,OAA1B,+BAAoC,KAApC;AAAA,MAA8CC,UAA9C,iCAA6DL,KAA7D;;AAEA,MAAMM,SAAS,GAAGC,EAAE,CAChBC,gBAAgB,EADA,EAEhBC,oBAAoB,CAACP,UAAD,EAAa,IAAb,CAFJ,EAGhB;AACI,oBAAgBE,OADpB;AAEIA,IAAAA,OAAO,EAAE,CAACA,OAFd;AAGI,qCAAiCJ,KAAK,CAACU,QAH3C;AAII,4CAAwC,CAACV,KAAK,CAACU;AAJnD,GAHgB,EAShBV,KAAK,CAACM,SATU,CAApB;;AAYA,MAAI,CAACH,IAAL,EAAW;AACP,WAAO,IAAP;AACH;;AAED,SACIJ,aAAA,CAACY,MAAD,oBAA4BN;AAAYC,IAAAA,SAAS,EAAEA;iBAAqB;AAAcL,IAAAA,GAAG,EAAEA;IAA3F,EACIF,aAAA,CAACa,IAAD;AAAMC,IAAAA,IAAI,EAAEV;AAAMG,IAAAA,SAAS,EAAC;GAA5B,CADJ,CADJ;AAKH,CAxByB;;;;"}
+{"version":3,"file":"IconButton.js","sources":["../../../../../src/components/IconButton/IconButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as ButtonPrimitive from '../../primitives/Button';\nimport { Icon, IconName } from '../Icon/Icon';\nimport { getAppearanceClasses, getButtonClasses, createButton } from '../Button/util';\nimport { Appearance } from '../../types';\nimport { DialogProps, HangerProps, PopoverProps } from '../..';\n\nexport type IconButtonProps = Omit<ButtonPrimitive.ButtonProps, 'children'> & {\n    /** Appearance will change the style of the button */\n    appearance?: Appearance;\n    /**\n     * Dialog component associated with the button, clicking the button will open the dialog.\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\n     * the button should be only to open the associated dialog when clicked.\n     */\n    dialog?: React.ReactElement<DialogProps>;\n    /** Set which icon should be rendered within button */\n    icon: IconName; // this dynamic type causes the type extraction for props to fail\n    /** Hanger component associated with the button. */\n    hanger?: React.ReactElement<HangerProps>;\n    /**\n     * Popover component associated with the button, clicking the button will open the popover.\n     * *Note* that `onClick` event on button won't be handled, as in this case, the purpose of\n     * the button should be only to open the associated popover when clicked.\n     */\n    popover?: React.ReactElement<PopoverProps>;\n    /**\n     * Set whether the button is rounded.\n     * Default value is `false`\n     */\n    rounded?: boolean;\n    /** A tooltip to show when hovering over the button */\n    tooltip?: string;\n};\n\nexport const IconButton = React.forwardRef(function IconButton(props: IconButtonProps, ref: React.Ref<HTMLButtonElement>) {\n    const { appearance, icon, rounded = false, ...otherProps } = props;\n\n    const className = cn(\n        getButtonClasses(),\n        getAppearanceClasses(appearance, true),\n        {\n            'rounded-full': rounded,\n            rounded: !rounded,\n            'cursor-not-allowed opacity-50': props.disabled,\n            'focus:yt-focus active:focus:yt-focus': !props.disabled,\n        },\n        props.className\n    );\n\n    if (!icon) {\n        return null;\n    }\n\n    return createButton(\n        { ...otherProps, children: <Icon name={icon} className=\"m-0 p-0\" />, 'data-taco': 'icon-button' },\n        className,\n        ref\n    );\n});\n"],"names":["IconButton","React","props","ref","appearance","icon","rounded","otherProps","className","cn","getButtonClasses","getAppearanceClasses","disabled","createButton","children","Icon","name"],"mappings":";;;;;;;IAoCaA,UAAU,gBAAGC,UAAA,CAAiB,SAASD,UAAT,CAAoBE,KAApB,EAA4CC,GAA5C;AACvC,MAAQC,UAAR,GAA6DF,KAA7D,CAAQE,UAAR;AAAA,MAAoBC,IAApB,GAA6DH,KAA7D,CAAoBG,IAApB;AAAA,uBAA6DH,KAA7D,CAA0BI,OAA1B;AAAA,MAA0BA,OAA1B,+BAAoC,KAApC;AAAA,MAA8CC,UAA9C,iCAA6DL,KAA7D;;AAEA,MAAMM,SAAS,GAAGC,EAAE,CAChBC,gBAAgB,EADA,EAEhBC,oBAAoB,CAACP,UAAD,EAAa,IAAb,CAFJ,EAGhB;AACI,oBAAgBE,OADpB;AAEIA,IAAAA,OAAO,EAAE,CAACA,OAFd;AAGI,qCAAiCJ,KAAK,CAACU,QAH3C;AAII,4CAAwC,CAACV,KAAK,CAACU;AAJnD,GAHgB,EAShBV,KAAK,CAACM,SATU,CAApB;;AAYA,MAAI,CAACH,IAAL,EAAW;AACP,WAAO,IAAP;AACH;;AAED,SAAOQ,YAAY,cACVN,UADU;AACEO,IAAAA,QAAQ,EAAEb,aAAA,CAACc,IAAD;AAAMC,MAAAA,IAAI,EAAEX;AAAMG,MAAAA,SAAS,EAAC;KAA5B,CADZ;AACsD,iBAAa;AADnE,MAEfA,SAFe,EAGfL,GAHe,CAAnB;AAKH,CAxByB;;;;"}

package/dist/esm/src/components/Listbox/ScrollableList.js

@@ -3,8 +3,8 @@ import { forwardRef, useMemo, createRef, useEffect, createElement } from 'react'
 import cn from 'classnames';
 import { Spinner } from '../Spinner/Spinner.js';
 import { useLocalization } from '../Provider/Provider.js';
-import { Checkbox } from '../Checkbox/Checkbox.js';
 import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
+import { Checkbox } from '../Checkbox/Checkbox.js';
 import { getInputClasses } from '../Input/util.js';
 import { getNextIndexFromKeycode } from '../../utils/hooks/useListKeyboardNavigation.js';
 import { useListScrollTo } from '../../utils/hooks/useListScrollTo.js';

package/dist/esm/src/components/Navigation/Navigation.js

@@ -49,7 +49,7 @@ var Item = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
   }), prefix && React__default.createElement("span", {
     className: "yt-navigation__item__prefix flex items-center"
   }, prefix), React__default.createElement("a", Object.assign({}, otherProps, {
-    className: "flex-grow block truncate",
+    className: "block flex-grow truncate",
     ref: proxyRef
   }), children), postfix && React__default.createElement("span", {
     className: "yt-navigation__item__postfix ml-1"
@@ -57,7 +57,7 @@ var Item = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
 });
 var Panel = /*#__PURE__*/React__default.forwardRef(function Panel(props, ref) {
   return React__default.createElement("div", Object.assign({}, props, {
-    className: cn('bg-white p-3 w-full', props.className),
+    className: cn('w-full bg-white p-3', props.className),
     ref: ref
   }));
 });
@@ -105,11 +105,11 @@ var Menu = /*#__PURE__*/React__default.forwardRef(function Menu(props, ref) {
     return scrollableAreas;
   }, [props.children]);
   return React__default.createElement(Treeview, Object.assign({}, props, {
-    className: cn('flex flex-col flex-grow overflow-y-auto divide-y-2 divide-grey-light', props.className),
+    className: cn('divide-grey-light flex flex-grow flex-col divide-y-2 overflow-y-auto', props.className),
     ref: ref
   }), scrollableAreas.map(function (area, i) {
     return Array.isArray(area) ? React__default.createElement("div", {
-      className: "flex flex-col flex-auto flex-shrink-0 flex-grow overflow-y-auto divide-y-2 divide-grey-light h-0",
+      className: "divide-grey-light flex h-0 flex-auto flex-shrink-0 flex-grow flex-col divide-y-2 overflow-y-auto",
       key: i
     }, area) : area;
   }));

package/dist/esm/src/components/Navigation/Navigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"Navigation.js","sources":["../../../../../src/components/Navigation/Navigation.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { TreeviewProps, Treeview, TreeviewGroupProps, TreeviewItemProps } from '../Treeview/Treeview';\nimport { Icon } from '../Icon/Icon';\nimport { useDropTarget } from '../../utils/hooks/useDropTarget';\nimport './Navigation.css';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\n\n// Item\nexport type NavigationItemProps = Omit<TreeviewItemProps, 'prefix'> & {\n    /** Change the style to indicate the link is selected */\n    active?: boolean;\n    /** Handler to be used when dropping a dragged element over the navigation link */\n    onDrop?: React.DragEventHandler;\n    /**\n     * Small amount of information placed next to the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a relevant information of the link,\n     * for e.g. the number of unread notifications\n     */\n    postfix?: React.ReactNode;\n    /**\n     * Small amount of information placed before the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a feedback for user,\n     * for e.g. display some sort of visual informational state or a relevant icon.\n     */\n    prefix?: React.ReactNode;\n    /** Target of the link */\n    target?: string;\n};\n\nconst Item = React.forwardRef(function Item(props: NavigationItemProps, ref: React.Ref<HTMLAnchorElement>) {\n    const { active, children, onDrop, postfix, prefix, role, ...otherProps } = props;\n    const proxyRef = useProxiedRef<HTMLAnchorElement>(ref);\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n    const isTreeitem = role === 'treeitem';\n    const className = cn(\n        'yt-navigation__item cursor-pointer',\n        {\n            'w-full mb-px py-1 px-3 flex items-center hover:bg-grey-dark': isTreeitem,\n            'bg-white w-full h-10 px-3 flex-shrink-0 flex items-center justify-between cursor-pointer': !isTreeitem,\n            'yt-navigation__item--active': active && !isDraggedOver,\n            'bg-grey-dark': isTreeitem && active && !isDraggedOver,\n            'yt-navigation__item--dropping bg-blue': isDraggedOver,\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLSpanElement>): void => {\n        if (event.target instanceof HTMLAnchorElement || event.target instanceof HTMLButtonElement) {\n            return;\n        }\n\n        if (proxyRef.current) {\n            proxyRef.current.click();\n        }\n    };\n\n    return (\n        <span {...dropTargetProps} className={className} onClick={handleClick} role={role}>\n            {prefix && <span className=\"yt-navigation__item__prefix flex items-center\">{prefix}</span>}\n            <a {...otherProps} className=\"flex-grow block truncate\" ref={proxyRef}>\n                {children}\n            </a>\n            {postfix && <span className=\"yt-navigation__item__postfix ml-1\">{postfix}</span>}\n        </span>\n    );\n});\n\n// Panel\nexport type NavigationPanelProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Panel = React.forwardRef(function Panel(props: NavigationPanelProps, ref: React.Ref<HTMLDivElement>) {\n    return <div {...props} className={cn('bg-white p-3 w-full', props.className)} ref={ref} />;\n});\n\n// Group\nexport type NavigationMenuGroupProps = TreeviewGroupProps;\n\nconst MenuGroup = React.forwardRef(function MenuGroup(props: NavigationMenuGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn(\n        'flex-shrink-0 space-y-1 outline-none',\n        {\n            'bg-white pb-2': props.fixed,\n        },\n        props.className\n    );\n    const title = (expanded: boolean): JSX.Element => {\n        const className = cn('bg-white h-10 pl-3 pr-1 flex items-center justify-between w-full', {\n            'mb-1': expanded,\n            'cursor-pointer hover:text-blue': !props.fixed,\n        });\n\n        return (\n            <span className={className}>\n                {typeof props.title === 'function' ? props.title(expanded) : props.title}\n                {!props.fixed && <Icon name={expanded ? 'chevron-up' : 'chevron-down'} />}\n            </span>\n        );\n    };\n\n    return <Treeview.Group {...props} className={className} title={title} ref={ref} />;\n});\n\n// Menu\nexport type NavigationMenuProps = React.PropsWithChildren<TreeviewProps>;\n\nexport type FowardedNavigationMenuWithStatics = React.ForwardRefExoticComponent<\n    NavigationMenuProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Expandable region reprezenting a group of related links */\n    Group: React.ForwardRefExoticComponent<NavigationMenuGroupProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nconst Menu = React.forwardRef(function Menu(props: NavigationMenuProps, ref: React.Ref<HTMLDivElement>) {\n    const scrollableAreas = React.useMemo(() => {\n        const scrollableAreas: any[] = [];\n\n        React.Children.toArray(props.children)\n            .filter(child => !!child)\n            .map((child: React.ReactElement<NavigationMenuGroupProps>) => {\n                if (child.props.fixed) {\n                    scrollableAreas.push(child);\n                } else {\n                    const x = scrollableAreas[scrollableAreas.length - 1];\n                    if (Array.isArray(x)) {\n                        x.push(child);\n                    } else {\n                        scrollableAreas.push([child]);\n                    }\n                }\n            });\n\n        return scrollableAreas;\n    }, [props.children]);\n\n    return (\n        <Treeview\n            {...props}\n            className={cn('flex flex-col flex-grow overflow-y-auto divide-y-2 divide-grey-light', props.className)}\n            ref={ref}\n        >\n            {scrollableAreas.map((area, i) =>\n                Array.isArray(area) ? (\n                    <div\n                        className=\"flex flex-col flex-auto flex-shrink-0 flex-grow overflow-y-auto divide-y-2 divide-grey-light h-0\"\n                        key={i}\n                    >\n                        {area}\n                    </div>\n                ) : (\n                    area\n                )\n            )}\n        </Treeview>\n    );\n}) as FowardedNavigationMenuWithStatics;\n\nMenu.Group = MenuGroup;\n\n// Navigation\nexport type NavigationProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type FowardedNavigationWithStatics = React.ForwardRefExoticComponent<\n    NavigationProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Navigation link */\n    Item: React.ForwardRefExoticComponent<NavigationItemProps & React.RefAttributes<HTMLAnchorElement>>;\n    /**\n     * Container for the expandable groups that hold navigation links.\n     * Should be used as a direct child of Navigation component, e.g. `Navigation.Menu`.\n     * Should have the menu groups as a direct child, e.g. `Navigation.Menu.Group`\n     */\n    Menu: FowardedNavigationMenuWithStatics;\n    /**\n     * Isolated container within the Navigation.\n     * This can be used to create a region in the Navigation that is usually not scrollable, nor expandable,\n     * containing useful information for user and quick actions\n     */\n    Panel: React.ForwardRefExoticComponent<NavigationPanelProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Navigation = React.forwardRef(function Navigation(props: NavigationProps, ref: React.Ref<HTMLDivElement>) {\n    const { children, ...otherProps } = props;\n    const className = cn('h-full flex flex-col bg-grey-light divide-y-2 divide-grey-light', props.className);\n\n    return (\n        <div {...otherProps} className={className} ref={ref}>\n            {children}\n        </div>\n    );\n}) as FowardedNavigationWithStatics;\n\nNavigation.Menu = Menu;\nNavigation.Item = Item;\nNavigation.Panel = Panel;\n"],"names":["Item","React","forwardRef","props","ref","active","children","onDrop","postfix","prefix","role","otherProps","proxyRef","useProxiedRef","useDropTarget","isDraggedOver","dropTargetProps","isTreeitem","className","cn","handleClick","event","target","HTMLAnchorElement","HTMLButtonElement","current","click","onClick","Panel","MenuGroup","fixed","title","expanded","Icon","name","Treeview","Group","Menu","scrollableAreas","useMemo","Children","toArray","filter","child","map","push","x","length","Array","isArray","area","i","key","Navigation"],"mappings":"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"}
+{"version":3,"file":"Navigation.js","sources":["../../../../../src/components/Navigation/Navigation.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { TreeviewProps, Treeview, TreeviewGroupProps, TreeviewItemProps } from '../Treeview/Treeview';\nimport { Icon } from '../Icon/Icon';\nimport { useDropTarget } from '../../utils/hooks/useDropTarget';\nimport './Navigation.css';\nimport { useProxiedRef } from '../../utils/hooks/useProxiedRef';\n\n// Item\nexport type NavigationItemProps = Omit<TreeviewItemProps, 'prefix'> & {\n    /** Change the style to indicate the link is selected */\n    active?: boolean;\n    /** Handler to be used when dropping a dragged element over the navigation link */\n    onDrop?: React.DragEventHandler;\n    /**\n     * Small amount of information placed next to the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a relevant information of the link,\n     * for e.g. the number of unread notifications\n     */\n    postfix?: React.ReactNode;\n    /**\n     * Small amount of information placed before the text of the link.\n     * This can be any valid react element, for e.g. a `span`.\n     * Should be used to indicate a feedback for user,\n     * for e.g. display some sort of visual informational state or a relevant icon.\n     */\n    prefix?: React.ReactNode;\n    /** Target of the link */\n    target?: string;\n};\n\nconst Item = React.forwardRef(function Item(props: NavigationItemProps, ref: React.Ref<HTMLAnchorElement>) {\n    const { active, children, onDrop, postfix, prefix, role, ...otherProps } = props;\n    const proxyRef = useProxiedRef<HTMLAnchorElement>(ref);\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n    const isTreeitem = role === 'treeitem';\n    const className = cn(\n        'yt-navigation__item cursor-pointer',\n        {\n            'w-full mb-px py-1 px-3 flex items-center hover:bg-grey-dark': isTreeitem,\n            'bg-white w-full h-10 px-3 flex-shrink-0 flex items-center justify-between cursor-pointer': !isTreeitem,\n            'yt-navigation__item--active': active && !isDraggedOver,\n            'bg-grey-dark': isTreeitem && active && !isDraggedOver,\n            'yt-navigation__item--dropping bg-blue': isDraggedOver,\n        },\n        props.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLSpanElement>): void => {\n        if (event.target instanceof HTMLAnchorElement || event.target instanceof HTMLButtonElement) {\n            return;\n        }\n\n        if (proxyRef.current) {\n            proxyRef.current.click();\n        }\n    };\n\n    return (\n        <span {...dropTargetProps} className={className} onClick={handleClick} role={role}>\n            {prefix && <span className=\"yt-navigation__item__prefix flex items-center\">{prefix}</span>}\n            <a {...otherProps} className=\"block flex-grow truncate\" ref={proxyRef}>\n                {children}\n            </a>\n            {postfix && <span className=\"yt-navigation__item__postfix ml-1\">{postfix}</span>}\n        </span>\n    );\n});\n\n// Panel\nexport type NavigationPanelProps = React.HTMLAttributes<HTMLDivElement>;\n\nconst Panel = React.forwardRef(function Panel(props: NavigationPanelProps, ref: React.Ref<HTMLDivElement>) {\n    return <div {...props} className={cn('w-full bg-white p-3', props.className)} ref={ref} />;\n});\n\n// Group\nexport type NavigationMenuGroupProps = TreeviewGroupProps;\n\nconst MenuGroup = React.forwardRef(function MenuGroup(props: NavigationMenuGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn(\n        'flex-shrink-0 space-y-1 outline-none',\n        {\n            'bg-white pb-2': props.fixed,\n        },\n        props.className\n    );\n    const title = (expanded: boolean): JSX.Element => {\n        const className = cn('bg-white h-10 pl-3 pr-1 flex items-center justify-between w-full', {\n            'mb-1': expanded,\n            'cursor-pointer hover:text-blue': !props.fixed,\n        });\n\n        return (\n            <span className={className}>\n                {typeof props.title === 'function' ? props.title(expanded) : props.title}\n                {!props.fixed && <Icon name={expanded ? 'chevron-up' : 'chevron-down'} />}\n            </span>\n        );\n    };\n\n    return <Treeview.Group {...props} className={className} title={title} ref={ref} />;\n});\n\n// Menu\nexport type NavigationMenuProps = React.PropsWithChildren<TreeviewProps>;\n\nexport type ForwardedNavigationMenuWithStatics = React.ForwardRefExoticComponent<\n    NavigationMenuProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Expandable region reprezenting a group of related links */\n    Group: React.ForwardRefExoticComponent<NavigationMenuGroupProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nconst Menu = React.forwardRef(function Menu(props: NavigationMenuProps, ref: React.Ref<HTMLDivElement>) {\n    const scrollableAreas = React.useMemo(() => {\n        const scrollableAreas: any[] = [];\n\n        React.Children.toArray(props.children)\n            .filter(child => !!child)\n            .map((child: React.ReactElement<NavigationMenuGroupProps>) => {\n                if (child.props.fixed) {\n                    scrollableAreas.push(child);\n                } else {\n                    const x = scrollableAreas[scrollableAreas.length - 1];\n                    if (Array.isArray(x)) {\n                        x.push(child);\n                    } else {\n                        scrollableAreas.push([child]);\n                    }\n                }\n            });\n\n        return scrollableAreas;\n    }, [props.children]);\n\n    return (\n        <Treeview\n            {...props}\n            className={cn('divide-grey-light flex flex-grow flex-col divide-y-2 overflow-y-auto', props.className)}\n            ref={ref}\n        >\n            {scrollableAreas.map((area, i) =>\n                Array.isArray(area) ? (\n                    <div\n                        className=\"divide-grey-light flex h-0 flex-auto flex-shrink-0 flex-grow flex-col divide-y-2 overflow-y-auto\"\n                        key={i}\n                    >\n                        {area}\n                    </div>\n                ) : (\n                    area\n                )\n            )}\n        </Treeview>\n    );\n}) as ForwardedNavigationMenuWithStatics;\n\nMenu.Group = MenuGroup;\n\n// Navigation\nexport type NavigationProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport type ForwardedNavigationWithStatics = React.ForwardRefExoticComponent<\n    NavigationProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Navigation link */\n    Item: React.ForwardRefExoticComponent<NavigationItemProps & React.RefAttributes<HTMLAnchorElement>>;\n    /**\n     * Container for the expandable groups that hold navigation links.\n     * Should be used as a direct child of Navigation component, e.g. `Navigation.Menu`.\n     * Should have the menu groups as a direct child, e.g. `Navigation.Menu.Group`\n     */\n    Menu: ForwardedNavigationMenuWithStatics;\n    /**\n     * Isolated container within the Navigation.\n     * This can be used to create a region in the Navigation that is usually not scrollable, nor expandable,\n     * containing useful information for user and quick actions\n     */\n    Panel: React.ForwardRefExoticComponent<NavigationPanelProps & React.RefAttributes<HTMLDivElement>>;\n};\n\nexport const Navigation = React.forwardRef(function Navigation(props: NavigationProps, ref: React.Ref<HTMLDivElement>) {\n    const { children, ...otherProps } = props;\n    const className = cn('h-full flex flex-col bg-grey-light divide-y-2 divide-grey-light', props.className);\n\n    return (\n        <div {...otherProps} className={className} ref={ref}>\n            {children}\n        </div>\n    );\n}) as ForwardedNavigationWithStatics;\n\nNavigation.Menu = Menu;\nNavigation.Item = Item;\nNavigation.Panel = Panel;\n"],"names":["Item","React","forwardRef","props","ref","active","children","onDrop","postfix","prefix","role","otherProps","proxyRef","useProxiedRef","useDropTarget","isDraggedOver","dropTargetProps","isTreeitem","className","cn","handleClick","event","target","HTMLAnchorElement","HTMLButtonElement","current","click","onClick","Panel","MenuGroup","fixed","title","expanded","Icon","name","Treeview","Group","Menu","scrollableAreas","useMemo","Children","toArray","filter","child","map","push","x","length","Array","isArray","area","i","key","Navigation"],"mappings":"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"}

package/dist/esm/src/components/Pagination/PageNumbers.js

@@ -1,6 +1,6 @@
 import { createElement, Fragment } from 'react';
-import { Button } from '../Button/Button.js';
 import { useLocalization } from '../Provider/Provider.js';
+import { Button } from '../Button/Button.js';
 
 var createPageRange = function createPageRange(pageCount, pageNumber) {
   var lowerLimit = Math.min(pageNumber, pageCount);

package/dist/esm/src/components/Pagination/Pagination.js

@@ -1,9 +1,9 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
-import { IconButton } from '../IconButton/IconButton.js';
 import { useLocalization } from '../Provider/Provider.js';
 import { Group } from '../Group/Group.js';
+import { IconButton } from '../IconButton/IconButton.js';
 import { PageNumbers } from './PageNumbers.js';
 import { Select } from '../Select/Select.js';
 import { usePaginationShortcuts } from './usePaginationShortcuts.js';

package/dist/esm/src/components/Popover/Popover.js

@@ -1,17 +1,19 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../_virtual/_rollupPluginBabelHelpers.js';
-import { useMemo, createElement, createContext, forwardRef, useContext } from 'react';
+import { forwardRef, useMemo, createElement, createContext, useContext } from 'react';
 import cn from 'classnames';
 import { Root, Trigger as Trigger$1, Close as Close$1 } from '@radix-ui/react-popover';
 import { UnstyledContent, UnstyledArrow } from './Primitives.js';
+import mergeRefs from '../../utils/mergeRefs.js';
 
 var _excluded = ["children"];
 var PopoverContext = /*#__PURE__*/createContext({
-  props: {}
+  props: {},
+  ref: null
 });
 var Trigger = /*#__PURE__*/forwardRef(function (props, ref) {
   var context = useContext(PopoverContext);
   return createElement(Trigger$1, Object.assign({}, context.props, props, {
-    ref: ref,
+    ref: mergeRefs([context.ref, ref]),
     asChild: true
   }));
 });
@@ -54,13 +56,14 @@ var Close = /*#__PURE__*/forwardRef(function (props, ref) {
     asChild: true
   }));
 });
-var Popover = function Popover(props) {
+var Popover = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
       otherProps = _objectWithoutPropertiesLoose(props, _excluded);
 
   var context = useMemo(function () {
     return {
-      props: otherProps
+      props: otherProps,
+      ref: ref
     };
   }, [otherProps]);
   return createElement(PopoverContext.Provider, {
@@ -68,7 +71,7 @@ var Popover = function Popover(props) {
   }, createElement(Root, {
     children: children
   }));
-};
+});
 Popover.Trigger = Trigger;
 Popover.Content = Content;
 Popover.Close = Close;

package/dist/esm/src/components/Popover/Popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.js","sources":["../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Placement } from '../..';\nimport { UnstyledArrow, UnstyledContent } from './Primitives';\n\nconst PopoverContext = React.createContext({\n    props: {},\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Trigger = React.forwardRef((props: PopoverTriggerProps, ref: React.Ref<HTMLButtonElement>) => {\n    const context = React.useContext(PopoverContext);\n    return <PopoverPrimitive.Trigger {...context.props} {...props} ref={ref} asChild />;\n});\nconst RenderPropWrapper = React.forwardRef(({ children, onClick }: any, ref) => {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\nexport type PopoverContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef((props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) => {\n    const className = cn('bg-white focus:border-blue-light', props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <PopoverPrimitive.Close asChild>\n                <RenderPropWrapper>{props.children}</RenderPropWrapper>\n            </PopoverPrimitive.Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <UnstyledContent className={className} placement={props.placement} ref={ref}>\n            {output}\n            <UnstyledArrow className=\"text-white\" />\n        </UnstyledContent>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Close = React.forwardRef(\n    (props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): JSX.Element => (\n        <PopoverPrimitive.Close {...props} ref={ref} asChild />\n    )\n);\n\nexport type PopoverProps = React.PropsWithChildren<{}>;\nexport const Popover = (props: PopoverProps): JSX.Element => {\n    const { children, ...otherProps } = props;\n\n    const context = React.useMemo(() => ({ props: otherProps }), [otherProps]);\n\n    return (\n        <PopoverContext.Provider value={context}>\n            <PopoverPrimitive.Root children={children} />\n        </PopoverContext.Provider>\n    );\n};\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\n"],"names":["PopoverContext","React","props","Trigger","ref","context","PopoverPrimitive","asChild","RenderPropWrapper","children","onClick","close","CustomEvent","Content","className","cn","output","UnstyledContent","placement","UnstyledArrow","Close","Popover","otherProps","Provider","value"],"mappings":";;;;;;;AAMA,IAAMA,cAAc,gBAAGC,aAAA,CAAoB;AACvCC,EAAAA,KAAK,EAAE;AADgC,CAApB,CAAvB;AAKA,IAAMC,OAAO,gBAAGF,UAAA,CAAiB,UAACC,KAAD,EAA6BE,GAA7B;AAC7B,MAAMC,OAAO,GAAGJ,UAAA,CAAiBD,cAAjB,CAAhB;AACA,SAAOC,aAAA,CAACK,SAAD,oBAA8BD,OAAO,CAACH,OAAWA;AAAOE,IAAAA,GAAG,EAAEA;AAAKG,IAAAA,OAAO;IAAzE,CAAP;AACH,CAHe,CAAhB;AAIA,IAAMC,iBAAiB,gBAAGP,UAAA,CAAiB,gBAA6BG,GAA7B;MAAGK,gBAAAA;MAAUC,eAAAA;;AACpD,MAAMC,KAAK,GAAG,SAARA,KAAQ;AACVD,IAAAA,OAAO,CAAC,IAAIE,WAAJ,CAAgB,MAAhB,CAAD,CAAP;AACH,GAFD;;AAIA,SAAOH,QAAQ,CAAC;AAAEE,IAAAA,KAAK,EAALA,KAAF;AAASP,IAAAA,GAAG,EAAHA;AAAT,GAAD,CAAf;AACH,CANyB,CAA1B;AAcA,IAAMS,OAAO,gBAAGZ,UAAA,CAAiB,UAACC,KAAD,EAA6BE,GAA7B;AAC7B,MAAMU,SAAS,GAAGC,EAAE,CAAC,kCAAD,EAAqCb,KAAK,CAACY,SAA3C,CAApB;AAEA,MAAIE,MAAJ;;AAEA,MAAI,OAAOd,KAAK,CAACO,QAAb,KAA0B,UAA9B,EAA0C;AACtCO,IAAAA,MAAM,GACFf,aAAA,CAACK,OAAD;AAAwBC,MAAAA,OAAO;KAA/B,EACIN,aAAA,CAACO,iBAAD,MAAA,EAAoBN,KAAK,CAACO,QAA1B,CADJ,CADJ;AAKH,GAND,MAMO;AACHO,IAAAA,MAAM,GAAGd,KAAK,CAACO,QAAf;AACH;;AAED,SACIR,aAAA,CAACgB,eAAD;AAAiBH,IAAAA,SAAS,EAAEA;AAAWI,IAAAA,SAAS,EAAEhB,KAAK,CAACgB;AAAWd,IAAAA,GAAG,EAAEA;GAAxE,EACKY,MADL,EAEIf,aAAA,CAACkB,aAAD;AAAeL,IAAAA,SAAS,EAAC;GAAzB,CAFJ,CADJ;AAMH,CArBe,CAAhB;AAwBA,IAAMM,KAAK,gBAAGnB,UAAA,CACV,UAACC,KAAD,EAA2BE,GAA3B;AAAA,SACIH,aAAA,CAACK,OAAD,oBAA4BJ;AAAOE,IAAAA,GAAG,EAAEA;AAAKG,IAAAA,OAAO;IAApD,CADJ;AAAA,CADU,CAAd;IAOac,OAAO,GAAG,SAAVA,OAAU,CAACnB,KAAD;AACnB,MAAQO,QAAR,GAAoCP,KAApC,CAAQO,QAAR;AAAA,MAAqBa,UAArB,iCAAoCpB,KAApC;;AAEA,MAAMG,OAAO,GAAGJ,OAAA,CAAc;AAAA,WAAO;AAAEC,MAAAA,KAAK,EAAEoB;AAAT,KAAP;AAAA,GAAd,EAA6C,CAACA,UAAD,CAA7C,CAAhB;AAEA,SACIrB,aAAA,CAACD,cAAc,CAACuB,QAAhB;AAAyBC,IAAAA,KAAK,EAAEnB;GAAhC,EACIJ,aAAA,CAACK,IAAD;AAAuBG,IAAAA,QAAQ,EAAEA;GAAjC,CADJ,CADJ;AAKH;AACDY,OAAO,CAAClB,OAAR,GAAkBA,OAAlB;AACAkB,OAAO,CAACR,OAAR,GAAkBA,OAAlB;AACAQ,OAAO,CAACD,KAAR,GAAgBA,KAAhB;;;;"}
+{"version":3,"file":"Popover.js","sources":["../../../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Placement } from '../..';\nimport { UnstyledArrow, UnstyledContent } from './Primitives';\nimport mergeRefs from '../../utils/mergeRefs';\n\ntype PopoverContextValue = { props: any; ref: React.Ref<HTMLElement> };\n\nconst PopoverContext = React.createContext<PopoverContextValue>({\n    props: {},\n    ref: null,\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Trigger = React.forwardRef((props: PopoverTriggerProps, ref: React.Ref<HTMLButtonElement>) => {\n    const context = React.useContext(PopoverContext);\n    return <PopoverPrimitive.Trigger {...context.props} {...props} ref={mergeRefs([context.ref, ref])} asChild />;\n});\nconst RenderPropWrapper = React.forwardRef(({ children, onClick }: any, ref) => {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\nexport type PopoverContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef((props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) => {\n    const className = cn('bg-white focus:border-blue-light', props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <PopoverPrimitive.Close asChild>\n                <RenderPropWrapper>{props.children}</RenderPropWrapper>\n            </PopoverPrimitive.Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <UnstyledContent className={className} placement={props.placement} ref={ref}>\n            {output}\n            <UnstyledArrow className=\"text-white\" />\n        </UnstyledContent>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement>;\nconst Close = React.forwardRef(\n    (props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): JSX.Element => (\n        <PopoverPrimitive.Close {...props} ref={ref} asChild />\n    )\n);\n\nexport type PopoverProps = React.PropsWithChildren<{}>;\nexport type ForwardedPopoverWithStatics = React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps>;\n    Content: React.ForwardRefExoticComponent<PopoverContentProps>;\n    Close: React.ForwardRefExoticComponent<PopoverCloseProps>;\n};\n\nexport const Popover = React.forwardRef((props: PopoverProps, ref: React.Ref<HTMLElement>): JSX.Element => {\n    const { children, ...otherProps } = props;\n\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <PopoverContext.Provider value={context}>\n            <PopoverPrimitive.Root children={children} />\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\n"],"names":["PopoverContext","React","props","ref","Trigger","context","PopoverPrimitive","mergeRefs","asChild","RenderPropWrapper","children","onClick","close","CustomEvent","Content","className","cn","output","UnstyledContent","placement","UnstyledArrow","Close","Popover","otherProps","Provider","value"],"mappings":";;;;;;;;AASA,IAAMA,cAAc,gBAAGC,aAAA,CAAyC;AAC5DC,EAAAA,KAAK,EAAE,EADqD;AAE5DC,EAAAA,GAAG,EAAE;AAFuD,CAAzC,CAAvB;AAMA,IAAMC,OAAO,gBAAGH,UAAA,CAAiB,UAACC,KAAD,EAA6BC,GAA7B;AAC7B,MAAME,OAAO,GAAGJ,UAAA,CAAiBD,cAAjB,CAAhB;AACA,SAAOC,aAAA,CAACK,SAAD,oBAA8BD,OAAO,CAACH,OAAWA;AAAOC,IAAAA,GAAG,EAAEI,SAAS,CAAC,CAACF,OAAO,CAACF,GAAT,EAAcA,GAAd,CAAD;AAAsBK,IAAAA,OAAO;IAAnG,CAAP;AACH,CAHe,CAAhB;AAIA,IAAMC,iBAAiB,gBAAGR,UAAA,CAAiB,gBAA6BE,GAA7B;MAAGO,gBAAAA;MAAUC,eAAAA;;AACpD,MAAMC,KAAK,GAAG,SAARA,KAAQ;AACVD,IAAAA,OAAO,CAAC,IAAIE,WAAJ,CAAgB,MAAhB,CAAD,CAAP;AACH,GAFD;;AAIA,SAAOH,QAAQ,CAAC;AAAEE,IAAAA,KAAK,EAALA,KAAF;AAAST,IAAAA,GAAG,EAAHA;AAAT,GAAD,CAAf;AACH,CANyB,CAA1B;AAcA,IAAMW,OAAO,gBAAGb,UAAA,CAAiB,UAACC,KAAD,EAA6BC,GAA7B;AAC7B,MAAMY,SAAS,GAAGC,EAAE,CAAC,kCAAD,EAAqCd,KAAK,CAACa,SAA3C,CAApB;AAEA,MAAIE,MAAJ;;AAEA,MAAI,OAAOf,KAAK,CAACQ,QAAb,KAA0B,UAA9B,EAA0C;AACtCO,IAAAA,MAAM,GACFhB,aAAA,CAACK,OAAD;AAAwBE,MAAAA,OAAO;KAA/B,EACIP,aAAA,CAACQ,iBAAD,MAAA,EAAoBP,KAAK,CAACQ,QAA1B,CADJ,CADJ;AAKH,GAND,MAMO;AACHO,IAAAA,MAAM,GAAGf,KAAK,CAACQ,QAAf;AACH;;AAED,SACIT,aAAA,CAACiB,eAAD;AAAiBH,IAAAA,SAAS,EAAEA;AAAWI,IAAAA,SAAS,EAAEjB,KAAK,CAACiB;AAAWhB,IAAAA,GAAG,EAAEA;GAAxE,EACKc,MADL,EAEIhB,aAAA,CAACmB,aAAD;AAAeL,IAAAA,SAAS,EAAC;GAAzB,CAFJ,CADJ;AAMH,CArBe,CAAhB;AAwBA,IAAMM,KAAK,gBAAGpB,UAAA,CACV,UAACC,KAAD,EAA2BC,GAA3B;AAAA,SACIF,aAAA,CAACK,OAAD,oBAA4BJ;AAAOC,IAAAA,GAAG,EAAEA;AAAKK,IAAAA,OAAO;IAApD,CADJ;AAAA,CADU,CAAd;IAaac,OAAO,gBAAGrB,UAAA,CAAiB,UAACC,KAAD,EAAsBC,GAAtB;AACpC,MAAQO,QAAR,GAAoCR,KAApC,CAAQQ,QAAR;AAAA,MAAqBa,UAArB,iCAAoCrB,KAApC;;AAEA,MAAMG,OAAO,GAAGJ,OAAA,CAAc;AAAA,WAAO;AAAEC,MAAAA,KAAK,EAAEqB,UAAT;AAAqBpB,MAAAA,GAAG,EAAHA;AAArB,KAAP;AAAA,GAAd,EAAkD,CAACoB,UAAD,CAAlD,CAAhB;AAEA,SACItB,aAAA,CAACD,cAAc,CAACwB,QAAhB;AAAyBC,IAAAA,KAAK,EAAEpB;GAAhC,EACIJ,aAAA,CAACK,IAAD;AAAuBI,IAAAA,QAAQ,EAAEA;GAAjC,CADJ,CADJ;AAKH,CAVsB;AAWvBY,OAAO,CAAClB,OAAR,GAAkBA,OAAlB;AACAkB,OAAO,CAACR,OAAR,GAAkBA,OAAlB;AACAQ,OAAO,CAACD,KAAR,GAAgBA,KAAhB;;;;"}

package/dist/esm/src/components/RadioGroup/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group';\nimport { Orientation } from '../../types';\n\nexport type RadioGroupItemValue = string | number | boolean | undefined;\n\nexport const getRadioGroupItemValueAsString = (value: RadioGroupItemValue): string =>\n    value === undefined || value === null ? '' : String(value);\n\nexport const findByValue = (values: RadioGroupItemValue[], valueAsString: string): RadioGroupItemValue | undefined =>\n    values.find(value => getRadioGroupItemValueAsString(value) === valueAsString);\n\nconst RadioGroupContext = React.createContext({ disabled: false, invalid: false });\n\nexport type RadioGroupItemProps<T = HTMLButtonElement> = Omit<\n    React.ButtonHTMLAttributes<T>,\n    'children' | 'onSelect' | 'value'\n> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /* Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nconst RadioGroupItem = React.forwardRef(function RadioGroupItem(props: RadioGroupItemProps, ref: React.Ref<HTMLButtonElement>) {\n    const context = React.useContext(RadioGroupContext);\n    const { children, value, ...otherProps } = props;\n\n    const disabled = context.disabled || props.disabled;\n\n    const className = cn('flex items-center justify-center h-4 w-4 mr-2 rounded-full bg-white border-2 ', {\n        'border-grey-dark focus:border-blue focus:yt-focus aria-checked:bg-blue aria-checked:border-blue':\n            !disabled && !context.invalid,\n        'border-grey cursor-not-allowed aria-checked:bg-grey-dark aria-checked:border-grey-dark': disabled,\n        'border-red text-red focus:border-red focus:yt-focus-red aria-checked:bg-red aria-checked:border-red':\n            context.invalid && !disabled,\n    });\n    const labelClassName = cn('flex items-center cursor-pointer', {\n        'cursor-not-allowed text-grey-dark': disabled,\n    });\n\n    return (\n        <label className={labelClassName}>\n            <RadioGroupPrimitive.Item\n                {...otherProps}\n                className={className}\n                disabled={disabled}\n                ref={ref}\n                value={getRadioGroupItemValueAsString(value)}\n            >\n                <RadioGroupPrimitive.Indicator className=\"h-2 w-2 rounded-full bg-white\" />\n            </RadioGroupPrimitive.Item>\n            {children}\n        </label>\n    );\n});\n\ntype RadioGroupBaseProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    children: React.ReactElement<RadioGroupItemProps>[];\n    /* Whether the radio group is disabled */\n    disabled?: boolean;\n    /* Whether the radio group is in an invalid state */\n    invalid?: boolean;\n    /** The name of the radio group, used when submitting an HTML form */\n    name?: string;\n    /**\n     * Orientation of the radio group\n     * @defaultValue vertical\n     */\n    orientation?: Orientation;\n    /* Whether the radio group requires user input */\n    required?: boolean;\n};\n\ninterface UncontrolledRadioGroupProps extends RadioGroupBaseProps {\n    /* The default value (uncontrolled) */\n    defaultValue?: RadioGroupItemValue;\n    onChange?: never;\n    value?: never;\n}\n\ninterface ControlledRadioGroupProps extends RadioGroupBaseProps {\n    defaultValue?: never;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value: RadioGroupItemValue;\n}\n\nexport type RadioGroupProps = UncontrolledRadioGroupProps | ControlledRadioGroupProps;\n\nexport type FowardedRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    RadioGroupProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Item component rendered in a `RadioGroup` component */\n    Item: React.ForwardRefExoticComponent<RadioGroupItemProps>;\n};\n\nexport const useRadioGroup = (props: RadioGroupProps) => {\n    const { children, defaultValue, disabled, invalid, onChange, orientation = 'vertical', value, ...otherProps } = props;\n\n    const values = React.useMemo<RadioGroupItemValue[]>(\n        () => React.Children.map(children, (child: React.ReactElement<RadioGroupItemProps>) => child.props.value) ?? [],\n        [children]\n    );\n\n    const context = React.useMemo(() => ({ disabled: disabled ?? false, invalid: invalid ?? false }), [disabled, invalid]);\n\n    let valueProps;\n\n    if (defaultValue) {\n        valueProps = {\n            defaultValue: getRadioGroupItemValueAsString(defaultValue) || undefined,\n        };\n    } else {\n        const handleChange = onChange ? (value: string): void => onChange(findByValue(values, value)) : undefined;\n\n        valueProps = {\n            onValueChange: handleChange,\n            value: getRadioGroupItemValueAsString(value) || undefined,\n        };\n    }\n\n    return {\n        context,\n        props: {\n            ...otherProps,\n            ...valueProps,\n            children,\n            orientation,\n        },\n    };\n};\n\nexport const RadioGroup = React.forwardRef(function RadioGroup(props: RadioGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { context, props: otherProps } = useRadioGroup(props);\n    const className = cn(\n        'flex items-start',\n        {\n            'flex-wrap space-x-4': props.orientation === 'horizontal',\n            'flex-col space-y-2': props.orientation === 'vertical',\n        },\n        props.className\n    );\n\n    return (\n        <RadioGroupContext.Provider value={context}>\n            <RadioGroupPrimitive.Root {...otherProps} className={className} data-taco=\"radio-group\" ref={ref} />\n        </RadioGroupContext.Provider>\n    );\n}) as FowardedRadioGroupWithStatics;\nRadioGroup.Item = RadioGroupItem;\n"],"names":["getRadioGroupItemValueAsString","value","undefined","String","findByValue","values","valueAsString","find","RadioGroupContext","React","disabled","invalid","RadioGroupItem","props","ref","context","children","otherProps","className","cn","labelClassName","RadioGroupPrimitive","useRadioGroup","defaultValue","onChange","orientation","map","child","valueProps","handleChange","onValueChange","RadioGroup","Provider","Item"],"mappings":"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"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'classnames';\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group';\nimport { Orientation } from '../../types';\n\nexport type RadioGroupItemValue = string | number | boolean | undefined;\n\nexport const getRadioGroupItemValueAsString = (value: RadioGroupItemValue): string =>\n    value === undefined || value === null ? '' : String(value);\n\nexport const findByValue = (values: RadioGroupItemValue[], valueAsString: string): RadioGroupItemValue | undefined =>\n    values.find(value => getRadioGroupItemValueAsString(value) === valueAsString);\n\nconst RadioGroupContext = React.createContext({ disabled: false, invalid: false });\n\nexport type RadioGroupItemProps<T = HTMLButtonElement> = Omit<\n    React.ButtonHTMLAttributes<T>,\n    'children' | 'onSelect' | 'value'\n> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /* Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nconst RadioGroupItem = React.forwardRef(function RadioGroupItem(props: RadioGroupItemProps, ref: React.Ref<HTMLButtonElement>) {\n    const context = React.useContext(RadioGroupContext);\n    const { children, value, ...otherProps } = props;\n\n    const disabled = context.disabled || props.disabled;\n\n    const className = cn('flex items-center justify-center h-4 w-4 mr-2 rounded-full bg-white border-2 ', {\n        'border-grey-dark focus:border-blue focus:yt-focus aria-checked:bg-blue aria-checked:border-blue':\n            !disabled && !context.invalid,\n        'border-grey cursor-not-allowed aria-checked:bg-grey-dark aria-checked:border-grey-dark': disabled,\n        'border-red text-red focus:border-red focus:yt-focus-red aria-checked:bg-red aria-checked:border-red':\n            context.invalid && !disabled,\n    });\n    const labelClassName = cn('flex items-center cursor-pointer', {\n        'cursor-not-allowed text-grey-dark': disabled,\n    });\n\n    return (\n        <label className={labelClassName}>\n            <RadioGroupPrimitive.Item\n                {...otherProps}\n                className={className}\n                disabled={disabled}\n                ref={ref}\n                value={getRadioGroupItemValueAsString(value)}\n            >\n                <RadioGroupPrimitive.Indicator className=\"h-2 w-2 rounded-full bg-white\" />\n            </RadioGroupPrimitive.Item>\n            {children}\n        </label>\n    );\n});\n\ntype RadioGroupBaseProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'defaultValue' | 'onChange' | 'value'> & {\n    children: React.ReactElement<RadioGroupItemProps>[];\n    /* Whether the radio group is disabled */\n    disabled?: boolean;\n    /* Whether the radio group is in an invalid state */\n    invalid?: boolean;\n    /** The name of the radio group, used when submitting an HTML form */\n    name?: string;\n    /**\n     * Orientation of the radio group\n     * @defaultValue vertical\n     */\n    orientation?: Orientation;\n    /* Whether the radio group requires user input */\n    required?: boolean;\n};\n\ninterface UncontrolledRadioGroupProps extends RadioGroupBaseProps {\n    /* The default value (uncontrolled) */\n    defaultValue?: RadioGroupItemValue;\n    onChange?: never;\n    value?: never;\n}\n\ninterface ControlledRadioGroupProps extends RadioGroupBaseProps {\n    defaultValue?: never;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value: RadioGroupItemValue;\n}\n\nexport type RadioGroupProps = UncontrolledRadioGroupProps | ControlledRadioGroupProps;\n\nexport type ForwardedRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    RadioGroupProps & React.RefAttributes<HTMLDivElement>\n> & {\n    /** Item component rendered in a `RadioGroup` component */\n    Item: React.ForwardRefExoticComponent<RadioGroupItemProps>;\n};\n\nexport const useRadioGroup = (props: RadioGroupProps) => {\n    const { children, defaultValue, disabled, invalid, onChange, orientation = 'vertical', value, ...otherProps } = props;\n\n    const values = React.useMemo<RadioGroupItemValue[]>(\n        () => React.Children.map(children, (child: React.ReactElement<RadioGroupItemProps>) => child.props.value) ?? [],\n        [children]\n    );\n\n    const context = React.useMemo(() => ({ disabled: disabled ?? false, invalid: invalid ?? false }), [disabled, invalid]);\n\n    let valueProps;\n\n    if (defaultValue) {\n        valueProps = {\n            defaultValue: getRadioGroupItemValueAsString(defaultValue) || undefined,\n        };\n    } else {\n        const handleChange = onChange ? (value: string): void => onChange(findByValue(values, value)) : undefined;\n\n        valueProps = {\n            onValueChange: handleChange,\n            value: getRadioGroupItemValueAsString(value) || undefined,\n        };\n    }\n\n    return {\n        context,\n        props: {\n            ...otherProps,\n            ...valueProps,\n            children,\n            orientation,\n        },\n    };\n};\n\nexport const RadioGroup = React.forwardRef(function RadioGroup(props: RadioGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { context, props: otherProps } = useRadioGroup(props);\n    const className = cn(\n        'flex items-start',\n        {\n            'flex-wrap space-x-4': props.orientation === 'horizontal',\n            'flex-col space-y-2': props.orientation === 'vertical',\n        },\n        props.className\n    );\n\n    return (\n        <RadioGroupContext.Provider value={context}>\n            <RadioGroupPrimitive.Root {...otherProps} className={className} data-taco=\"radio-group\" ref={ref} />\n        </RadioGroupContext.Provider>\n    );\n}) as ForwardedRadioGroupWithStatics;\nRadioGroup.Item = RadioGroupItem;\n"],"names":["getRadioGroupItemValueAsString","value","undefined","String","findByValue","values","valueAsString","find","RadioGroupContext","React","disabled","invalid","RadioGroupItem","props","ref","context","children","otherProps","className","cn","labelClassName","RadioGroupPrimitive","useRadioGroup","defaultValue","onChange","orientation","map","child","valueProps","handleChange","onValueChange","RadioGroup","Provider","Item"],"mappings":"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"}

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

@@ -6,12 +6,16 @@ import '../Accordion/Accordion.js';
 import '../VisuallyHidden/VisuallyHidden.js';
 import '../Badge/Badge.js';
 import '../Tooltip/Tooltip.js';
-import { IconButton } from '../IconButton/IconButton.js';
-import '../Banner/Banner.js';
-import '../Button/Button.js';
 import '../Spinner/Spinner.js';
 import '../Toast/Toaster.js';
 import { useLocalization } from '../Provider/Provider.js';
+import '../Hanger/Hanger.js';
+import '../Group/Group.js';
+import '../Dialog/Dialog.js';
+import '../Popover/Popover.js';
+import { IconButton } from '../IconButton/IconButton.js';
+import '../Banner/Banner.js';
+import '../Button/Button.js';
 import '../Calendar/Calendar.js';
 import '../Checkbox/Checkbox.js';
 import { Input } from '../Input/Input.js';
@@ -20,12 +24,8 @@ import '../../utils/hooks/useListKeyboardNavigation.js';
 import '../../utils/hooks/useListScrollTo.js';
 import '../Combobox/Combobox.js';
 import '../../utils/date.js';
-import '../Popover/Popover.js';
 import '../Datepicker/Datepicker.js';
-import '../Group/Group.js';
-import '../Dialog/Dialog.js';
 import '../Form/Form.js';
-import '../Hanger/Hanger.js';
 import '../Label/Label.js';
 import '../Listbox/Listbox.js';
 import '../RadioGroup/RadioGroup.js';

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

@@ -71,8 +71,9 @@ var BaseSelect = /*#__PURE__*/forwardRef(function BaseSelect(props, ref) {
     }), props.multiselect ? renderMultiSelection() : createElement("span", {
       className: "flex-grow"
     }, text), createElement("span", {
-      className: "h-8 w-8 flex items-center justify-center"
+      className: "flex h-8 w-8 items-center justify-center"
     }, createElement(Icon, {
+      className: "group-hover:text-grey-darkest text-black",
       name: popover.visible ? 'chevron-up' : 'chevron-down'
     })));
   }), !otherProps.disabled && createElement(Popover, Object.assign({}, base, container), props.multiselect ? createElement(MultiListbox, Object.assign({}, commonListboxProps)) : createElement(Listbox, Object.assign({}, commonListboxProps))));

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

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