@economic/taco 0.0.7-alpha.0 → 0.0.11-alpha.0

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

@@ -1 +1 @@
-{"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport './Dialog.css';\nimport { DialogTriggerProps, Trigger } from './components/Trigger';\nimport {\n    Content,\n    Title,\n    Footer,\n    Close,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogContentDrawerRenderProps,\n    DialogTitleProps,\n    DialogFooterProps,\n    DialogCloseProps,\n} from './components/Content';\nimport { DialogDrawerProps, Drawer } from './components/Drawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\n\nexport {\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogContentDrawerRenderProps,\n    DialogTitleProps,\n    DialogFooterProps,\n    DialogCloseProps,\n    DialogSize,\n};\n\nexport type DialogTexts = {\n    /**\n     * Aria-label for close icon button in dialog.\n     * To read more about how to provide the text, see [Provider](component:provider) component\n     */\n    close: string;\n    drag: string;\n};\n\nexport type DialogProps = {\n    children: React.ReactNode | React.ReactNode[];\n    /** When `true`, pressing escape will close the dialog */\n    closeOnEscape?: boolean;\n    /** Allows dragging the dialog around the screen (window constrained) */\n    draggable?: boolean;\n    /** Handler called when dialog closes by user interaction */\n    onClose?: () => void;\n    /** Set whether the dialog is open by default or not, use when not providing a trigger  */\n    open?: boolean;\n    /** Shows the close icon button of the dialog */\n    showCloseButton?: boolean;\n    /** Size of the dialog. This is the recommended way to set a size for dialog component. */\n    size?: DialogSize;\n};\n\nconst useSeparatedChildren = initialChildren => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.forEach(initialChildren, (child: any) => {\n            if (child.type.displayName === 'Drawer') {\n                drawer = child;\n            } else if (child.type.displayName === 'Extra') {\n                extra = child;\n            } else {\n                children.push(child);\n            }\n        });\n\n        return [children, drawer, extra];\n    }, [initialChildren]);\n};\n\nexport type ForwardedDialogWithStatics = React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<DialogTriggerProps>;\n    Content: React.ForwardRefExoticComponent<DialogContentProps>;\n    Title: React.ForwardRefExoticComponent<DialogTitleProps>;\n    Footer: React.ForwardRefExoticComponent<DialogFooterProps>;\n    Extra: React.ForwardRefExoticComponent<DialogExtraProps>;\n    Drawer: React.ForwardRefExoticComponent<DialogDrawerProps>;\n    Close: React.ForwardRefExoticComponent<DialogCloseProps>;\n};\n\nexport const Dialog = React.forwardRef((props: DialogProps, ref: React.Ref<HTMLElement>): JSX.Element => {\n    const {\n        children: initialChildren,\n        closeOnEscape = true,\n        draggable = false,\n        onClose,\n        open: defaultOpen,\n        showCloseButton = true,\n        size = 'sm',\n        ...otherProps\n    } = props;\n    const [children, drawer, extra] = useSeparatedChildren(initialChildren);\n\n    const [open, setOpen] = React.useState(defaultOpen);\n    const [drawerOpen, setDrawerOpen] = React.useState(false);\n\n    const context = React.useMemo(\n        () => ({\n            close: () => setOpen(false),\n            closeOnEscape,\n            draggable,\n            drawer: {\n                open: drawerOpen,\n                toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen),\n            },\n            elements: {\n                drawer,\n                extra,\n            },\n            onClose,\n            props: otherProps,\n            showCloseButton,\n            size,\n            ref,\n        }),\n        [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\n    );\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root children={children} open={open} onOpenChange={setOpen} />\n        </DialogContext.Provider>\n    );\n}) as ForwardedDialogWithStatics;\n\nDialog.Trigger = Trigger;\nDialog.Content = Content;\nDialog.Title = Title;\nDialog.Footer = Footer;\nDialog.Extra = Extra;\nDialog.Drawer = Drawer;\nDialog.Close = Close;\n"],"names":["useSeparatedChildren","initialChildren","React","children","drawer","extra","forEach","child","type","displayName","push","Dialog","props","ref","closeOnEscape","draggable","onClose","defaultOpen","open","showCloseButton","size","otherProps","setOpen","drawerOpen","setDrawerOpen","context","close","toggle","isDrawerOpen","elements","DialogContext","Provider","value","DialogPrimitive","onOpenChange","Trigger","Content","Title","Footer","Extra","Drawer","Close"],"mappings":"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"}
+{"version":3,"file":"Dialog.js","sources":["../../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport './Dialog.css';\nimport { DialogTriggerProps, Trigger } from './components/Trigger';\nimport {\n    Content,\n    Title,\n    Footer,\n    Close,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogContentDrawerRenderProps,\n    DialogTitleProps,\n    DialogFooterProps,\n    DialogCloseProps,\n} from './components/Content';\nimport { DialogDrawerProps, Drawer } from './components/Drawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\n\nexport {\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogContentDrawerRenderProps,\n    DialogTitleProps,\n    DialogFooterProps,\n    DialogCloseProps,\n    DialogSize,\n};\n\nexport type DialogTexts = {\n    /**\n     * Aria-label for close icon button in dialog.\n     * To read more about how to provide the text, see [Provider](component:provider) component\n     */\n    close: string;\n    drag: string;\n};\n\nexport type DialogProps = {\n    children: React.ReactNode | React.ReactNode[];\n    /** When `true`, pressing escape will close the dialog */\n    closeOnEscape?: boolean;\n    /** Set whether the dialog is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Allows dragging the dialog around the screen (window constrained) */\n    draggable?: boolean;\n    /** Handler called when dialog closes by user interaction */\n    onClose?: () => void;\n    /** Called when the dialog opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the dialog from outside the component  */\n    open?: boolean;\n    /** Shows the close icon button of the dialog */\n    showCloseButton?: boolean;\n    /** Size of the dialog. This is the recommended way to set a size for dialog component. */\n    size?: DialogSize;\n    /** A trigger to be used for the dialog, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n};\n\nconst useSeparatedChildren = initialChildren => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.forEach(initialChildren, (child: any) => {\n            if (child.type.displayName === 'Drawer') {\n                drawer = child;\n            } else if (child.type.displayName === 'Extra') {\n                extra = child;\n            } else {\n                children.push(child);\n            }\n        });\n\n        return [children, drawer, extra];\n    }, [initialChildren]);\n};\n\nexport type ForwardedDialogWithStatics = React.ForwardRefExoticComponent<DialogProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;\n    Content: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;\n    Title: React.ForwardRefExoticComponent<DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;\n    Footer: React.ForwardRefExoticComponent<DialogFooterProps & React.RefAttributes<HTMLDivElement>>;\n    Extra: React.ForwardRefExoticComponent<DialogExtraProps & React.RefAttributes<HTMLDivElement>>;\n    Drawer: React.ForwardRefExoticComponent<DialogDrawerProps & React.RefAttributes<HTMLDivElement>>;\n    Close: React.ForwardRefExoticComponent<DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;\n};\n\nexport const Dialog = React.forwardRef((props: DialogProps, ref: React.Ref<HTMLElement>): JSX.Element => {\n    const {\n        children: initialChildren,\n        closeOnEscape = true,\n        defaultOpen,\n        draggable = false,\n        onChange,\n        onClose,\n        open,\n        showCloseButton = true,\n        size = 'sm',\n        trigger,\n        ...otherProps\n    } = props;\n    const [children, drawer, extra] = useSeparatedChildren(initialChildren);\n    const [drawerOpen, setDrawerOpen] = React.useState(false);\n\n    const context = React.useMemo(\n        () => ({\n            closeOnEscape,\n            draggable,\n            drawer: {\n                open: drawerOpen,\n                toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen),\n            },\n            elements: {\n                drawer,\n                extra,\n            },\n            onClose,\n            props: otherProps,\n            showCloseButton,\n            size,\n            ref,\n        }),\n        [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\n    );\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root defaultOpen={defaultOpen} open={open} onOpenChange={onChange}>\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </DialogPrimitive.Root>\n        </DialogContext.Provider>\n    );\n}) as ForwardedDialogWithStatics;\n\nDialog.Trigger = Trigger;\nDialog.Content = Content;\nDialog.Title = Title;\nDialog.Footer = Footer;\nDialog.Extra = Extra;\nDialog.Drawer = Drawer;\nDialog.Close = Close;\n"],"names":["useSeparatedChildren","initialChildren","React","children","drawer","extra","forEach","child","type","displayName","push","Dialog","props","ref","closeOnEscape","defaultOpen","draggable","onChange","onClose","open","showCloseButton","size","trigger","otherProps","drawerOpen","setDrawerOpen","context","toggle","isDrawerOpen","elements","DialogContext","Provider","value","DialogPrimitive","onOpenChange","Trigger","Content","Title","Footer","Extra","Drawer","Close"],"mappings":"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"}

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

@@ -2,13 +2,13 @@ import { extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
 import { Backdrop } from '../../Backdrop/Backdrop.js';
+import { IconButton } from '../../IconButton/IconButton.js';
 import { useLocalization } from '../../Provider/Provider.js';
-import { useCurrentMenu } from '../../Menu/Context.js';
 import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
 import { Title as Title$1, Close as Close$1, Portal, Overlay, Content as Content$1 } from '@radix-ui/react-dialog';
 import { useCurrentDialog } from '../Context.js';
 import { useDraggable } from '../../../utils/hooks/useDraggable.js';
-import { IconButton } from '../../IconButton/IconButton.js';
+import { useCurrentMenu } from '../../Menu/Context.js';
 
 var Title = /*#__PURE__*/forwardRef(function DialogTitle(props, ref) {
   var className = cn('text-center', props.className);
@@ -33,6 +33,20 @@ var Close = /*#__PURE__*/forwardRef(function DialogClose(props, ref) {
     asChild: true
   }));
 });
+var RenderPropWrapper = /*#__PURE__*/forwardRef(function (_ref, ref) {
+  var children = _ref.children,
+      onClick = _ref.onClick,
+      renderProps = _ref.renderProps;
+
+  var close = function close() {
+    onClick(new CustomEvent('close'));
+  };
+
+  return children(_extends({
+    close: close,
+    ref: ref
+  }, renderProps));
+});
 var Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
   var dialog = useCurrentDialog();
   var internalRef = useProxiedRef(ref);
@@ -55,7 +69,7 @@ var Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
     };
   }
 
-  var className = cn('bg-white rounded mt-16 mx-auto', {
+  var className = cn('bg-white rounded relative mt-16 mx-auto', {
     'w-128 text-center justify-center': dialog.size === 'dialog',
     'w-xs': dialog.size === 'xs',
     'w-sm': dialog.size === 'sm',
@@ -82,10 +96,13 @@ var Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
   var output;
 
   if (typeof props.children === 'function') {
-    output = props.children({
-      drawer: dialog.drawer,
-      close: dialog.close
-    });
+    output = createElement(Close$1, {
+      asChild: true
+    }, createElement(RenderPropWrapper, {
+      renderProps: {
+        drawer: dialog.drawer
+      }
+    }, props.children));
   } else {
     output = props.children;
   }
@@ -99,8 +116,8 @@ var Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
     onCloseAutoFocus: handleCloseAutoFocus,
     ref: ref,
     style: _extends({}, props.style, {
-      left: dialog.draggable ? "calc(50% + " + position.x + "px)" : undefined,
-      top: dialog.draggable ? "calc(50% + " + position.y + "px)" : undefined
+      left: dialog.draggable ? position.x + "px" : undefined,
+      top: dialog.draggable ? position.y + "px" : undefined
     })
   }), createElement("div", {
     className: containerClassName,
@@ -109,8 +126,8 @@ var Content = /*#__PURE__*/forwardRef(function DialogContent(props, ref) {
     "aria-label": texts.dialog.drag,
     className: "yt-dialog__drag absolute-center-x bg-grey-light top-1.5 h-3 w-24 cursor-move rounded text-center"
   })), dialog.showCloseButton ? createElement(Close$1, {
-    asChild: true,
-    onClick: dialog.onClose
+    onClick: dialog.onClose,
+    asChild: true
   }, createElement(IconButton, {
     appearance: "discrete",
     "aria-label": texts.dialog.close,

package/dist/esm/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 { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = {\n    open: boolean;\n    toggle: () => void;\n};\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\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 label to be announced when the dialog is opened */\n    'aria-label': 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        '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 handleEscapeKeyDown = event => {\n        if (!dialog.closeOnEscape) {\n            event.preventDefault();\n        } else if (dialog.onClose) {\n            dialog.onClose();\n        }\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 asChild>\n                <Backdrop>\n                    <DialogPrimitive.Content\n                        {...props}\n                        className={className}\n                        onEscapeKeyDown={handleEscapeKeyDown}\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} data-taco=\"dialog\">\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                            {dialog.showCloseButton ? (\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                            ) : null}\n                        </div>\n                        {dialog.elements.drawer}\n                        {dialog.elements.extra}\n                    </DialogPrimitive.Content>\n                </Backdrop>\n            </DialogPrimitive.Overlay>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["Title","React","DialogTitle","props","ref","className","cn","DialogPrimitive","Footer","DialogFooter","children","Close","DialogClose","dialog","useCurrentDialog","onClick","onClose","asChild","Content","DialogContent","internalRef","useProxiedRef","useDraggable","position","dragHandleProps","handleProps","useLocalization","texts","menu","useCurrentMenu","handleCloseAutoFocus","close","size","containerClassName","elements","extra","handleEscapeKeyDown","event","closeOnEscape","preventDefault","handleInteractOutside","output","drawer","Backdrop","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus","style","left","draggable","x","undefined","top","y","drag","showCloseButton","IconButton","appearance","icon"],"mappings":";;;;;;;;;;;;IAsBaA,KAAK,gBAAGC,UAAA,CAAiB,SAASC,WAAT,CAAqBC,KAArB,EAA8CC,GAA9C;AAClC,MAAMC,SAAS,GAAGC,EAAE,CAAC,aAAD,EAAgBH,KAAK,CAACE,SAAtB,CAApB;AACA,SAAOJ,aAAA,CAACM,OAAD,oBAA2BJ;AAAOE,IAAAA,SAAS,EAAEA;AAAWD,IAAAA,GAAG,EAAEA;IAA7D,CAAP;AACH,CAHoB;IAMRI,MAAM,gBAAGP,UAAA,CAAiB,SAASQ,YAAT,CAAsBN,KAAtB,EAAgDC,GAAhD;AACnC,MAAMC,SAAS,GAAGC,EAAE,CAAC,uBAAD,EAA0BH,KAAK,CAACE,SAAhC,CAApB;AACA,SACIJ,aAAA,MAAA,oBAASE;AAAOE,IAAAA,SAAS,EAAEA;AAAWD,IAAAA,GAAG,EAAEA;IAA3C,EACKD,KAAK,CAACO,QADX,CADJ;AAKH,CAPqB;IAWTC,KAAK,gBAAGV,UAAA,CAAiB,SAASW,WAAT,CAAqBT,KAArB,EAA8CC,GAA9C;AAClC,MAAMS,MAAM,GAAGC,gBAAgB,EAA/B;AAEA,SAAOb,aAAA,CAACM,OAAD;AAAuBQ,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,MAAM1B,SAAS,GAAGC,EAAE,CAAC,gCAAD,EAAmC;AACnD,wCAAoCO,MAAM,CAACmB,IAAP,KAAgB,QADD;AAEnD,YAAQnB,MAAM,CAACmB,IAAP,KAAgB,IAF2B;AAGnD,YAAQnB,MAAM,CAACmB,IAAP,KAAgB,IAH2B;AAInD,YAAQnB,MAAM,CAACmB,IAAP,KAAgB,IAJ2B;AAKnD,YAAQnB,MAAM,CAACmB,IAAP,KAAgB;AAL2B,GAAnC,CAApB;AAQA,MAAMC,kBAAkB,GAAG3B,EAAE,CACzB,uCADyB,EAEzB,sEAFyB,EAGzB;AACI,sBAAkB,CAAC,CAACO,MAAM,CAACqB,QAAP,CAAgBC;AADxC,GAHyB,EAMzBhC,KAAK,CAACE,SANmB,CAA7B;;AASA,MAAM+B,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAAC,KAAK;AAC7B,QAAI,CAACxB,MAAM,CAACyB,aAAZ,EAA2B;AACvBD,MAAAA,KAAK,CAACE,cAAN;AACH,KAFD,MAEO,IAAI1B,MAAM,CAACG,OAAX,EAAoB;AACvBH,MAAAA,MAAM,CAACG,OAAP;AACH;AACJ,GAND;;;AASA,MAAMwB,qBAAqB,GAAG,SAAxBA,qBAAwB,CAAAH,KAAK;AAAA,WAAIA,KAAK,CAACE,cAAN,EAAJ;AAAA,GAAnC;;AAEA,MAAIE,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,CAACM,MAAD,MAAA,EACIN,aAAA,CAACM,OAAD;AAAyBU,IAAAA,OAAO;GAAhC,EACIhB,aAAA,CAAC0C,QAAD,MAAA,EACI1C,aAAA,CAACM,SAAD,oBACQJ;AACJE,IAAAA,SAAS,EAAEA;AACXuC,IAAAA,eAAe,EAAER;AACjBS,IAAAA,iBAAiB,EAAEL;AACnBM,IAAAA,gBAAgB,EAAEhB;AAClB1B,IAAAA,GAAG,EAAEA;AACL2C,IAAAA,KAAK,eACE5C,KAAK,CAAC4C,KADR;AAEDC,MAAAA,IAAI,EAAEnC,MAAM,CAACoC,SAAP,mBAAiC1B,QAAQ,CAAC2B,CAA1C,WAAmDC,SAFxD;AAGDC,MAAAA,GAAG,EAAEvC,MAAM,CAACoC,SAAP,mBAAiC1B,QAAQ,CAAC8B,CAA1C,WAAmDF;AAHvD;IAPT,EAaIlD,aAAA,MAAA;AAAKI,IAAAA,SAAS,EAAE4B;iBAA8B;GAA9C,EACKQ,MADL,EAEK5B,MAAM,CAACoC,SAAP,IACGhD,aAAA,MAAA,oBACQuB;kBACQG,KAAK,CAACd,MAAN,CAAayC;AACzBjD,IAAAA,SAAS,EAAC;IAHd,CAHR,EASKQ,MAAM,CAAC0C,eAAP,GACGtD,aAAA,CAACM,OAAD;AAAuBU,IAAAA,OAAO;AAACF,IAAAA,OAAO,EAAEF,MAAM,CAACG;GAA/C,EACIf,aAAA,CAACuD,UAAD;AACIC,IAAAA,UAAU,EAAC;kBACC9B,KAAK,CAACd,MAAN,CAAakB;AACzB1B,IAAAA,SAAS,EAAC;AACVqD,IAAAA,IAAI,EAAC;GAJT,CADJ,CADH,GASG,IAlBR,CAbJ,EAiCK7C,MAAM,CAACqB,QAAP,CAAgBQ,MAjCrB,EAkCK7B,MAAM,CAACqB,QAAP,CAAgBC,KAlCrB,CADJ,CADJ,CADJ,CADJ;AA4CH,CA/FsB;;;;"}
+{"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 { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = {\n    open: boolean;\n    toggle: () => void;\n};\n\nexport type DialogContentRenderProps = {\n    close: () => void;\n    drawer?: DialogContentDrawerRenderProps;\n};\n\nexport type DialogTitleProps = React.HTMLAttributes<HTMLHeadingElement>;\nexport const Title = React.forwardRef(function DialogTitle(props: DialogTitleProps, ref: React.Ref<HTMLHeadingElement>) {\n    const className = cn('text-center', props.className);\n    return <DialogPrimitive.Title {...props} className={className} ref={ref} />;\n});\n\nexport type DialogFooterProps = React.HTMLAttributes<HTMLDivElement>;\nexport const Footer = React.forwardRef(function DialogFooter(props: DialogFooterProps, ref: React.Ref<HTMLDivElement>) {\n    const className = cn('mt-8 flex justify-end', props.className);\n    return (\n        <div {...props} className={className} ref={ref}>\n            {props.children}\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\nconst RenderPropWrapper = React.forwardRef(({ children, onClick, renderProps }: any, ref) => {\n    const close = () => {\n        onClick(new CustomEvent('close'));\n    };\n\n    return children({ close, ref, ...renderProps });\n});\n\nexport type DialogContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    /** An accessible label to be announced when the dialog is opened */\n    'aria-label': 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 relative 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        '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 handleEscapeKeyDown = event => {\n        if (!dialog.closeOnEscape) {\n            event.preventDefault();\n        } else if (dialog.onClose) {\n            dialog.onClose();\n        }\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 = (\n            <DialogPrimitive.Close asChild>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </DialogPrimitive.Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <DialogPrimitive.Portal>\n            <DialogPrimitive.Overlay asChild>\n                <Backdrop>\n                    <DialogPrimitive.Content\n                        {...props}\n                        className={className}\n                        onEscapeKeyDown={handleEscapeKeyDown}\n                        onInteractOutside={handleInteractOutside}\n                        onCloseAutoFocus={handleCloseAutoFocus}\n                        ref={ref}\n                        style={{\n                            ...props.style,\n                            left: dialog.draggable ? `${position.x}px` : undefined,\n                            top: dialog.draggable ? `${position.y}px` : undefined,\n                        }}\n                    >\n                        <div className={containerClassName} data-taco=\"dialog\">\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                            {dialog.showCloseButton ? (\n                                <DialogPrimitive.Close onClick={dialog.onClose} asChild>\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                            ) : null}\n                        </div>\n                        {dialog.elements.drawer}\n                        {dialog.elements.extra}\n                    </DialogPrimitive.Content>\n                </Backdrop>\n            </DialogPrimitive.Overlay>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["Title","React","DialogTitle","props","ref","className","cn","DialogPrimitive","Footer","DialogFooter","children","Close","DialogClose","dialog","useCurrentDialog","onClick","onClose","asChild","RenderPropWrapper","renderProps","close","CustomEvent","Content","DialogContent","internalRef","useProxiedRef","useDraggable","position","dragHandleProps","handleProps","useLocalization","texts","menu","useCurrentMenu","handleCloseAutoFocus","size","containerClassName","elements","extra","handleEscapeKeyDown","event","closeOnEscape","preventDefault","handleInteractOutside","output","drawer","Backdrop","onEscapeKeyDown","onInteractOutside","onCloseAutoFocus","style","left","draggable","x","undefined","top","y","drag","showCloseButton","IconButton","appearance","icon"],"mappings":"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"}

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

@@ -1,13 +1,13 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, useMemo, createElement, createContext, useContext, isValidElement } 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 _excluded = ["anchor", "children"];
 var HangerContext = /*#__PURE__*/createContext({
   props: {},
   ref: null
@@ -58,7 +58,8 @@ var Content = /*#__PURE__*/forwardRef(function (props, ref) {
   })));
 });
 var Hanger = /*#__PURE__*/forwardRef(function (props, ref) {
-  var children = props.children,
+  var anchor = props.anchor,
+      children = props.children,
       otherProps = _objectWithoutPropertiesLoose(props, _excluded);
 
   var context = useMemo(function () {
@@ -70,9 +71,8 @@ var Hanger = /*#__PURE__*/forwardRef(function (props, ref) {
   return createElement(HangerContext.Provider, {
     value: context
   }, createElement(Root, {
-    children: children,
     defaultOpen: true
-  }));
+  }, anchor && createElement(Anchor, null, anchor), children));
 });
 Hanger.Anchor = Anchor;
 Hanger.Content = Content;

package/dist/esm/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';\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    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Hanger.Anchor requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Anchor {...context.props} {...props} children={children} ref={mergeRefs([context.ref, ref])} asChild />\n    );\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","children","type","console","warn","name","PopoverPrimitive","mergeRefs","asChild","Content","useLocalization","texts","className","cn","handleInteractOutside","event","preventDefault","UnstyledContent","onInteractOutside","placement","UnstyledArrow","IconButton","appearance","hanger","close","icon","onClick","onClose","Hanger","otherProps","Provider","value","defaultOpen"],"mappings":"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"}
+{"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    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Hanger.Anchor requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Anchor {...context.props} {...props} children={children} ref={mergeRefs([context.ref, ref])} asChild />\n    );\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    /** An anchor to be used for the hanger, should not be set if `children` already contains an anchor */\n    anchor?: JSX.Element;\n}>;\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 { anchor, children, ...otherProps } = props;\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <HangerContext.Provider value={context}>\n            <PopoverPrimitive.Root defaultOpen>\n                {anchor && <Anchor>{anchor}</Anchor>}\n                {children}\n            </PopoverPrimitive.Root>\n        </HangerContext.Provider>\n    );\n}) as ForwardedHangerWithStatics;\nHanger.Anchor = Anchor;\nHanger.Content = Content;\n"],"names":["HangerContext","React","props","ref","Anchor","context","children","type","console","warn","name","PopoverPrimitive","mergeRefs","asChild","Content","useLocalization","texts","className","cn","handleInteractOutside","event","preventDefault","UnstyledContent","onInteractOutside","placement","UnstyledArrow","IconButton","appearance","hanger","close","icon","onClick","onClose","Hanger","anchor","otherProps","Provider","value","defaultOpen"],"mappings":"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"}

package/dist/esm/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, 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;;;;"}
+{"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, MenuProps, 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?: (props: Partial<DialogProps>) => JSX.Element;\n    /** Hanger component associated with the button. */\n    hanger?: (props: Partial<HangerProps>) => JSX.Element;\n    /** Set which icon should be rendered within button */\n    icon: IconName; // this dynamic type causes the type extraction for props to fail\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => JSX.Element;\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?: (props: Partial<PopoverProps>) => JSX.Element;\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":";;;;;;;IAsCaA,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/components/Input/Input.js

@@ -5,7 +5,7 @@ import { Icon } from '../Icon/Icon.js';
 import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
 import { getInputClasses, getButtonStateClasses } from './util.js';
 
-var _excluded = ["button", "defaultValue", "icon", "highlighted", "state", "autoFocus"];
+var _excluded = ["button", "icon", "highlighted", "state", "autoFocus"];
 var Input = /*#__PURE__*/forwardRef(function Input(props, ref) {
   var button = props.button,
       icon = props.icon,

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

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

package/dist/esm/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 { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
 import { Checkbox } from '../Checkbox/Checkbox.js';
+import { useProxiedRef } from '../../utils/hooks/useProxiedRef.js';
 import { getInputClasses } from '../Input/util.js';
 import { getNextIndexFromKeycode } from '../../utils/hooks/useListKeyboardNavigation.js';
 import { useListScrollTo } from '../../utils/hooks/useListScrollTo.js';

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

@@ -1,6 +1,7 @@
+import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../_virtual/_rollupPluginBabelHelpers.js';
 import { useState, useMemo, createElement } from 'react';
-import { Root } from '@radix-ui/react-dropdown-menu';
 import { MenuContext } from './Context.js';
+import { Root } from '@radix-ui/react-dropdown-menu';
 import { Content } from './components/Content.js';
 import { Item } from './components/Item.js';
 import { Link } from './components/Link.js';
@@ -10,7 +11,12 @@ import { RadioGroup } from './components/RadioGroup.js';
 import { Separator } from './components/Separator.js';
 import { Header } from './components/Header.js';
 
-var Menu = function Menu(props) {
+var _excluded = ["children", "trigger"];
+var Menu = function Menu(externalProps) {
+  var children = externalProps.children,
+      trigger = externalProps.trigger,
+      props = _objectWithoutPropertiesLoose(externalProps, _excluded);
+
   var _React$useState = useState(false),
       open = _React$useState[0],
       setOpen = _React$useState[1];
@@ -51,7 +57,7 @@ var Menu = function Menu(props) {
   }, createElement(Root, Object.assign({}, props, {
     open: open,
     onOpenChange: setOpen
-  })));
+  }), trigger && createElement(Trigger, null, trigger), children));
 };
 Menu.Trigger = Trigger;
 Menu.Content = Content;

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","sources":["../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { MenuContext } from './Context';\nimport { Content } from './components/Content';\nimport { Item } from './components/Item';\nimport { Link } from './components/Link';\nimport { Trigger } from './components/Trigger';\nimport { Checkbox } from './components/Checkbox';\nimport { RadioGroup } from './components/RadioGroup';\nimport { Separator } from './components/Separator';\nimport { Header } from './components/Header';\nimport { Appearance } from '../..';\n\nexport type MenuProps = {\n    children: React.ReactNode;\n    id?: string;\n};\n\nexport const Menu = (props: MenuProps): JSX.Element => {\n    const [open, setOpen] = React.useState(false);\n    const [appearance, setAppearance] = React.useState<Appearance>('default');\n    const [indented, setIndented] = React.useState(false);\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\n\n    const context = React.useMemo(\n        () => ({\n            appearance,\n            setAppearance: (appearance: Appearance) => setAppearance(appearance),\n            indented,\n            registerIndentation: () => setIndented(true),\n            minWidth,\n            setMinWidth: (width: number) => setMinWidth(width),\n            close: () => setOpen(false),\n        }),\n        [indented, minWidth, appearance]\n    );\n\n    return (\n        <MenuContext.Provider value={context}>\n            <DropdownMenuPrimitive.Root {...props} open={open} onOpenChange={setOpen} />\n        </MenuContext.Provider>\n    );\n};\nMenu.Trigger = Trigger;\nMenu.Content = Content;\nMenu.Item = Item;\nMenu.Link = Link;\nMenu.Checkbox = Checkbox;\nMenu.Separator = Separator;\nMenu.Header = Header;\nMenu.RadioGroup = RadioGroup;\n"],"names":["Menu","props","React","open","setOpen","appearance","setAppearance","indented","setIndented","undefined","minWidth","setMinWidth","context","registerIndentation","width","close","MenuContext","Provider","value","DropdownMenuPrimitive","onOpenChange","Trigger","Content","Item","Link","Checkbox","Separator","Header","RadioGroup"],"mappings":";;;;;;;;;;;;IAkBaA,IAAI,GAAG,SAAPA,IAAO,CAACC,KAAD;AAChB,wBAAwBC,QAAA,CAAe,KAAf,CAAxB;AAAA,MAAOC,IAAP;AAAA,MAAaC,OAAb;;AACA,yBAAoCF,QAAA,CAA2B,SAA3B,CAApC;AAAA,MAAOG,UAAP;AAAA,MAAmBC,cAAnB;;AACA,yBAAgCJ,QAAA,CAAe,KAAf,CAAhC;AAAA,MAAOK,QAAP;AAAA,MAAiBC,WAAjB;;AACA,yBAAgCN,QAAA,CAAmCO,SAAnC,CAAhC;AAAA,MAAOC,QAAP;AAAA,MAAiBC,YAAjB;;AAEA,MAAMC,OAAO,GAAGV,OAAA,CACZ;AAAA,WAAO;AACHG,MAAAA,UAAU,EAAVA,UADG;AAEHC,MAAAA,aAAa,EAAE,uBAACD,UAAD;AAAA,eAA4BC,cAAa,CAACD,UAAD,CAAzC;AAAA,OAFZ;AAGHE,MAAAA,QAAQ,EAARA,QAHG;AAIHM,MAAAA,mBAAmB,EAAE;AAAA,eAAML,WAAW,CAAC,IAAD,CAAjB;AAAA,OAJlB;AAKHE,MAAAA,QAAQ,EAARA,QALG;AAMHC,MAAAA,WAAW,EAAE,qBAACG,KAAD;AAAA,eAAmBH,YAAW,CAACG,KAAD,CAA9B;AAAA,OANV;AAOHC,MAAAA,KAAK,EAAE;AAAA,eAAMX,OAAO,CAAC,KAAD,CAAb;AAAA;AAPJ,KAAP;AAAA,GADY,EAUZ,CAACG,QAAD,EAAWG,QAAX,EAAqBL,UAArB,CAVY,CAAhB;AAaA,SACIH,aAAA,CAACc,WAAW,CAACC,QAAb;AAAsBC,IAAAA,KAAK,EAAEN;GAA7B,EACIV,aAAA,CAACiB,IAAD,oBAAgClB;AAAOE,IAAAA,IAAI,EAAEA;AAAMiB,IAAAA,YAAY,EAAEhB;IAAjE,CADJ,CADJ;AAKH;AACDJ,IAAI,CAACqB,OAAL,GAAeA,OAAf;AACArB,IAAI,CAACsB,OAAL,GAAeA,OAAf;AACAtB,IAAI,CAACuB,IAAL,GAAYA,IAAZ;AACAvB,IAAI,CAACwB,IAAL,GAAYA,IAAZ;AACAxB,IAAI,CAACyB,QAAL,GAAgBA,QAAhB;AACAzB,IAAI,CAAC0B,SAAL,GAAiBA,SAAjB;AACA1B,IAAI,CAAC2B,MAAL,GAAcA,MAAd;AACA3B,IAAI,CAAC4B,UAAL,GAAkBA,UAAlB;;;;"}
+{"version":3,"file":"Menu.js","sources":["../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import * as React from 'react';\nimport * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';\nimport { MenuContext } from './Context';\nimport { Content } from './components/Content';\nimport { Item } from './components/Item';\nimport { Link } from './components/Link';\nimport { Trigger } from './components/Trigger';\nimport { Checkbox } from './components/Checkbox';\nimport { RadioGroup } from './components/RadioGroup';\nimport { Separator } from './components/Separator';\nimport { Header } from './components/Header';\nimport { Appearance } from '../..';\n\nexport type MenuProps = {\n    children: React.ReactNode;\n    id?: string;\n    /** A trigger to be used for the menu, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n};\n\nexport const Menu = (externalProps: MenuProps): JSX.Element => {\n    const { children, trigger, ...props } = externalProps;\n    const [open, setOpen] = React.useState(false);\n    const [appearance, setAppearance] = React.useState<Appearance>('default');\n    const [indented, setIndented] = React.useState(false);\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\n\n    const context = React.useMemo(\n        () => ({\n            appearance,\n            setAppearance: (appearance: Appearance) => setAppearance(appearance),\n            indented,\n            registerIndentation: () => setIndented(true),\n            minWidth,\n            setMinWidth: (width: number) => setMinWidth(width),\n            close: () => setOpen(false),\n        }),\n        [indented, minWidth, appearance]\n    );\n\n    return (\n        <MenuContext.Provider value={context}>\n            <DropdownMenuPrimitive.Root {...props} open={open} onOpenChange={setOpen}>\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </DropdownMenuPrimitive.Root>\n        </MenuContext.Provider>\n    );\n};\nMenu.Trigger = Trigger;\nMenu.Content = Content;\nMenu.Item = Item;\nMenu.Link = Link;\nMenu.Checkbox = Checkbox;\nMenu.Separator = Separator;\nMenu.Header = Header;\nMenu.RadioGroup = RadioGroup;\n"],"names":["Menu","externalProps","children","trigger","props","React","open","setOpen","appearance","setAppearance","indented","setIndented","undefined","minWidth","setMinWidth","context","registerIndentation","width","close","MenuContext","Provider","value","DropdownMenuPrimitive","onOpenChange","Trigger","Content","Item","Link","Checkbox","Separator","Header","RadioGroup"],"mappings":";;;;;;;;;;;;;;IAoBaA,IAAI,GAAG,SAAPA,IAAO,CAACC,aAAD;AAChB,MAAQC,QAAR,GAAwCD,aAAxC,CAAQC,QAAR;AAAA,MAAkBC,OAAlB,GAAwCF,aAAxC,CAAkBE,OAAlB;AAAA,MAA8BC,KAA9B,iCAAwCH,aAAxC;;AACA,wBAAwBI,QAAA,CAAe,KAAf,CAAxB;AAAA,MAAOC,IAAP;AAAA,MAAaC,OAAb;;AACA,yBAAoCF,QAAA,CAA2B,SAA3B,CAApC;AAAA,MAAOG,UAAP;AAAA,MAAmBC,cAAnB;;AACA,yBAAgCJ,QAAA,CAAe,KAAf,CAAhC;AAAA,MAAOK,QAAP;AAAA,MAAiBC,WAAjB;;AACA,yBAAgCN,QAAA,CAAmCO,SAAnC,CAAhC;AAAA,MAAOC,QAAP;AAAA,MAAiBC,YAAjB;;AAEA,MAAMC,OAAO,GAAGV,OAAA,CACZ;AAAA,WAAO;AACHG,MAAAA,UAAU,EAAVA,UADG;AAEHC,MAAAA,aAAa,EAAE,uBAACD,UAAD;AAAA,eAA4BC,cAAa,CAACD,UAAD,CAAzC;AAAA,OAFZ;AAGHE,MAAAA,QAAQ,EAARA,QAHG;AAIHM,MAAAA,mBAAmB,EAAE;AAAA,eAAML,WAAW,CAAC,IAAD,CAAjB;AAAA,OAJlB;AAKHE,MAAAA,QAAQ,EAARA,QALG;AAMHC,MAAAA,WAAW,EAAE,qBAACG,KAAD;AAAA,eAAmBH,YAAW,CAACG,KAAD,CAA9B;AAAA,OANV;AAOHC,MAAAA,KAAK,EAAE;AAAA,eAAMX,OAAO,CAAC,KAAD,CAAb;AAAA;AAPJ,KAAP;AAAA,GADY,EAUZ,CAACG,QAAD,EAAWG,QAAX,EAAqBL,UAArB,CAVY,CAAhB;AAaA,SACIH,aAAA,CAACc,WAAW,CAACC,QAAb;AAAsBC,IAAAA,KAAK,EAAEN;GAA7B,EACIV,aAAA,CAACiB,IAAD,oBAAgClB;AAAOE,IAAAA,IAAI,EAAEA;AAAMiB,IAAAA,YAAY,EAAEhB;IAAjE,EACKJ,OAAO,IAAIE,aAAA,CAACmB,OAAD,MAAA,EAAUrB,OAAV,CADhB,EAEKD,QAFL,CADJ,CADJ;AAQH;AACDF,IAAI,CAACwB,OAAL,GAAeA,OAAf;AACAxB,IAAI,CAACyB,OAAL,GAAeA,OAAf;AACAzB,IAAI,CAAC0B,IAAL,GAAYA,IAAZ;AACA1B,IAAI,CAAC2B,IAAL,GAAYA,IAAZ;AACA3B,IAAI,CAAC4B,QAAL,GAAgBA,QAAhB;AACA5B,IAAI,CAAC6B,SAAL,GAAiBA,SAAjB;AACA7B,IAAI,CAAC8B,MAAL,GAAcA,MAAd;AACA9B,IAAI,CAAC+B,UAAL,GAAkBA,UAAlB;;;;"}

package/dist/esm/components/Menu/components/Content.js

@@ -1,9 +1,9 @@
 import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '../../../_virtual/_rollupPluginBabelHelpers.js';
 import { forwardRef, createElement } from 'react';
 import cn from 'classnames';
-import { Content as Content$1 } from '@radix-ui/react-dropdown-menu';
-import { useCurrentMenu } from '../Context.js';
 import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useCurrentMenu } from '../Context.js';
+import { Content as Content$1 } from '@radix-ui/react-dropdown-menu';
 
 var _excluded = ["children", "placement"];
 

package/dist/esm/components/Menu/components/Header.js

@@ -1,7 +1,7 @@
 import { createElement } from 'react';
 import cn from 'classnames';
-import { Label } from '@radix-ui/react-dropdown-menu';
 import { useCurrentMenu } from '../Context.js';
+import { Label } from '@radix-ui/react-dropdown-menu';
 
 var getAppearanceClasses = function getAppearanceClasses(appearance) {
   switch (appearance) {

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

@@ -2,8 +2,8 @@ import { objectWithoutPropertiesLoose as _objectWithoutPropertiesLoose } from '.
 import { forwardRef, createElement, useEffect } from 'react';
 import cn from 'classnames';
 import { Icon as Icon$1 } from '../../Icon/Icon.js';
-import { Item as Item$1 } from '@radix-ui/react-dropdown-menu';
 import { useCurrentMenu } from '../Context.js';
+import { Item as Item$1 } from '@radix-ui/react-dropdown-menu';
 
 var _excluded = ["icon", "shortcut"];
 var Icon = function Icon(_ref) {

package/dist/esm/components/Menu/components/Separator.js

@@ -1,7 +1,7 @@
 import { createElement } from 'react';
 import cn from 'classnames';
-import { Separator as Separator$1 } from '@radix-ui/react-dropdown-menu';
 import { useCurrentMenu } from '../Context.js';
+import { Separator as Separator$1 } from '@radix-ui/react-dropdown-menu';
 
 var getAppearanceClasses = function getAppearanceClasses(appearance) {
   switch (appearance) {

package/dist/esm/components/Menu/components/Trigger.js

@@ -1,7 +1,7 @@
 import { forwardRef, useEffect, createElement } from 'react';
-import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
-import { useCurrentMenu } from '../Context.js';
 import { useProxiedRef } from '../../../utils/hooks/useProxiedRef.js';
+import { useCurrentMenu } from '../Context.js';
+import { Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
 
 var Trigger = /*#__PURE__*/forwardRef(function MenuTrigger(props, ref) {
   var _props$children3, _props$children3$prop;

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

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

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

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

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

@@ -5,7 +5,7 @@ import { Root, Trigger as Trigger$1, Close as Close$1 } from '@radix-ui/react-po
 import { UnstyledContent, UnstyledArrow } from './Primitives.js';
 import mergeRefs from '../../utils/mergeRefs.js';
 
-var _excluded = ["children"];
+var _excluded = ["children", "trigger"];
 var PopoverContext = /*#__PURE__*/createContext({
   props: {},
   ref: null
@@ -68,6 +68,7 @@ var Close = /*#__PURE__*/forwardRef(function (props, ref) {
 });
 var Popover = /*#__PURE__*/forwardRef(function (props, ref) {
   var children = props.children,
+      trigger = props.trigger,
       otherProps = _objectWithoutPropertiesLoose(props, _excluded);
 
   var context = useMemo(function () {
@@ -78,9 +79,7 @@ var Popover = /*#__PURE__*/forwardRef(function (props, ref) {
   }, [otherProps]);
   return createElement(PopoverContext.Provider, {
     value: context
-  }, createElement(Root, {
-    children: children
-  }));
+  }, createElement(Root, null, trigger && createElement(Trigger, null, trigger), children));
 });
 Popover.Trigger = Trigger;
 Popover.Content = Content;

package/dist/esm/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';\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    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Trigger {...context.props} {...props} children={children} ref={mergeRefs([context.ref, ref])} asChild />\n    );\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","children","type","console","warn","name","PopoverPrimitive","mergeRefs","asChild","RenderPropWrapper","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,MAAIM,QAAQ,GAAGJ,KAAK,CAACI,QAArB;;AAEA,MAAIL,cAAA,CAAqBC,KAAK,CAACI,QAA3B,KAAwC,2BAAOJ,KAAK,CAACI,QAAb,oDAAO,gBAAgBC,IAAvB,MAAgC,UAA5E,EAAwF;AACpFC,IAAAA,OAAO,CAACC,IAAR,uHACwHP,KAAK,CAACI,QAAN,CAAeC,IAAf,CAAoBG,IAD5I,mDAC8LR,KAAK,CAACI,QAAN,CAAeC,IAAf,CAAoBG,IADlN;AAGAJ,IAAAA,QAAQ,GAAGL,aAAA,OAAA,MAAA,EAAOC,KAAK,CAACI,QAAb,CAAX;AACH;;AAED,SACIL,aAAA,CAACU,SAAD,oBAA8BN,OAAO,CAACH,OAAWA;AAAOI,IAAAA,QAAQ,EAAEA;AAAUH,IAAAA,GAAG,EAAES,SAAS,CAAC,CAACP,OAAO,CAACF,GAAT,EAAcA,GAAd,CAAD;AAAsBU,IAAAA,OAAO;IAAvH,CADJ;AAGH,CAde,CAAhB;AAeA,IAAMC,iBAAiB,gBAAGb,UAAA,CAAiB,gBAA6BE,GAA7B;MAAGG,gBAAAA;MAAUS,eAAAA;;AACpD,MAAMC,KAAK,GAAG,SAARA,KAAQ;AACVD,IAAAA,OAAO,CAAC,IAAIE,WAAJ,CAAgB,MAAhB,CAAD,CAAP;AACH,GAFD;;AAIA,SAAOX,QAAQ,CAAC;AAAEU,IAAAA,KAAK,EAALA,KAAF;AAASb,IAAAA,GAAG,EAAHA;AAAT,GAAD,CAAf;AACH,CANyB,CAA1B;AAcA,IAAMe,OAAO,gBAAGjB,UAAA,CAAiB,UAACC,KAAD,EAA6BC,GAA7B;AAC7B,MAAMgB,SAAS,GAAGC,EAAE,CAAC,kCAAD,EAAqClB,KAAK,CAACiB,SAA3C,CAApB;AAEA,MAAIE,MAAJ;;AAEA,MAAI,OAAOnB,KAAK,CAACI,QAAb,KAA0B,UAA9B,EAA0C;AACtCe,IAAAA,MAAM,GACFpB,aAAA,CAACU,OAAD;AAAwBE,MAAAA,OAAO;KAA/B,EACIZ,aAAA,CAACa,iBAAD,MAAA,EAAoBZ,KAAK,CAACI,QAA1B,CADJ,CADJ;AAKH,GAND,MAMO;AACHe,IAAAA,MAAM,GAAGnB,KAAK,CAACI,QAAf;AACH;;AAED,SACIL,aAAA,CAACqB,eAAD;AAAiBH,IAAAA,SAAS,EAAEA;AAAWI,IAAAA,SAAS,EAAErB,KAAK,CAACqB;AAAWpB,IAAAA,GAAG,EAAEA;GAAxE,EACKkB,MADL,EAEIpB,aAAA,CAACuB,aAAD;AAAeL,IAAAA,SAAS,EAAC;GAAzB,CAFJ,CADJ;AAMH,CArBe,CAAhB;AAwBA,IAAMM,KAAK,gBAAGxB,UAAA,CACV,UAACC,KAAD,EAA2BC,GAA3B;AAAA,SACIF,aAAA,CAACU,OAAD,oBAA4BT;AAAOC,IAAAA,GAAG,EAAEA;AAAKU,IAAAA,OAAO;IAApD,CADJ;AAAA,CADU,CAAd;IAaaa,OAAO,gBAAGzB,UAAA,CAAiB,UAACC,KAAD,EAAsBC,GAAtB;AACpC,MAAQG,QAAR,GAAoCJ,KAApC,CAAQI,QAAR;AAAA,MAAqBqB,UAArB,iCAAoCzB,KAApC;;AAEA,MAAMG,OAAO,GAAGJ,OAAA,CAAc;AAAA,WAAO;AAAEC,MAAAA,KAAK,EAAEyB,UAAT;AAAqBxB,MAAAA,GAAG,EAAHA;AAArB,KAAP;AAAA,GAAd,EAAkD,CAACwB,UAAD,CAAlD,CAAhB;AAEA,SACI1B,aAAA,CAACD,cAAc,CAAC4B,QAAhB;AAAyBC,IAAAA,KAAK,EAAExB;GAAhC,EACIJ,aAAA,CAACU,IAAD;AAAuBL,IAAAA,QAAQ,EAAEA;GAAjC,CADJ,CADJ;AAKH,CAVsB;AAWvBoB,OAAO,CAACtB,OAAR,GAAkBA,OAAlB;AACAsB,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    let children = props.children;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Trigger {...context.props} {...props} children={children} ref={mergeRefs([context.ref, ref])} asChild />\n    );\n});\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<{\n    /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n}>;\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, trigger, ...otherProps } = props;\n    const context = React.useMemo(() => ({ props: otherProps, ref }), [otherProps]);\n\n    return (\n        <PopoverContext.Provider value={context}>\n            <PopoverPrimitive.Root>\n                {trigger && <Trigger>{trigger}</Trigger>}\n                {children}\n            </PopoverPrimitive.Root>\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\n"],"names":["PopoverContext","React","props","ref","Trigger","context","children","type","console","warn","name","PopoverPrimitive","mergeRefs","asChild","RenderPropWrapper","onClick","close","CustomEvent","Content","className","cn","output","UnstyledContent","placement","UnstyledArrow","Close","Popover","trigger","otherProps","Provider","value"],"mappings":"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"}

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

@@ -7,17 +7,12 @@ import '../Backdrop/Backdrop.js';
 import '../VisuallyHidden/VisuallyHidden.js';
 import '../Badge/Badge.js';
 import '../Tooltip/Tooltip.js';
-import '../Spinner/Spinner.js';
-import '../Toast/Toaster.js';
-import { useLocalization } from '../Provider/Provider.js';
-import '../Hanger/Hanger.js';
-import '../RadioGroup/RadioGroup.js';
-import '../Menu/Menu.js';
-import '../Dialog/Dialog.js';
-import '../Popover/Popover.js';
 import { IconButton } from '../IconButton/IconButton.js';
 import '../Banner/Banner.js';
 import '../Button/Button.js';
+import '../Spinner/Spinner.js';
+import '../Toast/Toaster.js';
+import { useLocalization } from '../Provider/Provider.js';
 import '../Calendar/Calendar.js';
 import '../Checkbox/Checkbox.js';
 import { Input } from '../Input/Input.js';
@@ -26,11 +21,16 @@ 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 '../Dialog/Dialog.js';
 import '../Form/Form.js';
 import '../Group/Group.js';
+import '../Hanger/Hanger.js';
 import '../Label/Label.js';
 import '../Listbox/Listbox.js';
+import '../RadioGroup/RadioGroup.js';
+import '../Menu/Menu.js';
 import '../Treeview/Treeview.js';
 import '../Navigation/Navigation.js';
 import '../Select/Select.js';

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

@@ -38,8 +38,7 @@ var Table = /*#__PURE__*/React__default.forwardRef(function Table(props, ref) {
   }
 
   return React__default.createElement(React__default.Fragment, null, paginationElement, React__default.createElement(BaseTable, Object.assign({}, tableProps, {
-    ref: tableRef,
-    tabIndex: 0
+    ref: tableRef
   }), rows.length ? rows.map(function (row, index) {
     prepareRow(row, index);
     return React__default.createElement(Row, Object.assign({}, rowProps, {