@economic/taco 8.0.0 → 8.1.0-EC-80345-test-release.0

package/dist/components/Dialog/Context.cjs

@@ -32,6 +32,7 @@ const DialogContext = React__namespace.createContext({
   },
   onClose: () => {
   },
+  popupRef: null,
   props: {},
   ref: null,
   showCloseButton: true,

package/dist/components/Dialog/Context.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Context.cjs","sources":["../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* oxlint-disable no-empty-function */\nimport * as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n    closeOnEscape: boolean;\n    draggable: boolean;\n    drawer: {\n        open: boolean;\n        toggle: () => void;\n    };\n    elements: {\n        drawer?: React.ReactNode;\n        extra?: React.ReactNode;\n    };\n    onClose?: () => void;\n    props: Record<string, any>;\n    ref: React.Ref<HTMLElement>;\n    showCloseButton: boolean;\n    size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n    closeOnEscape: true,\n    draggable: false,\n    drawer: {\n        open: false,\n        toggle: () => {},\n    },\n    elements: {\n        drawer: undefined,\n        extra: undefined,\n    },\n    onClose: () => {},\n    props: {},\n    ref: null,\n    showCloseButton: true,\n    size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n    return React.useContext(DialogContext);\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBa,MAAA,gBAAgBA,iBAAM,cAA6B;AAAA,EAC5D,eAAe;AAAA,EACf,WAAW;AAAA,EACX,QAAQ;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ,MAAM;AAAA,IAAA;AAAA,EAClB;AAAA,EACA,UAAU;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,EACX;AAAA,EACA,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,OAAO,CAAC;AAAA,EACR,KAAK;AAAA,EACL,iBAAiB;AAAA,EACjB,MAAM;AACV,CAAC;AAEM,MAAM,mBAAmB,MAAM;AAC3B,SAAAA,iBAAM,WAAW,aAAa;AACzC;;;"}
+{"version":3,"file":"Context.cjs","sources":["../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* oxlint-disable no-empty-function */\nimport * as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n    closeOnEscape: boolean;\n    draggable: boolean;\n    drawer: {\n        open: boolean;\n        toggle: () => void;\n    };\n    elements: {\n        drawer?: React.ReactNode;\n        extra?: React.ReactNode;\n    };\n    onClose?: () => void;\n    /** Stable ref to the dialog popup element. */\n    popupRef: React.RefObject<HTMLElement | null> | null;\n    props: Record<string, any>;\n    /** Forwarded ref from `<Dialog>` — attached to the Trigger button. */\n    ref: React.Ref<HTMLElement>;\n    showCloseButton: boolean;\n    size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n    closeOnEscape: true,\n    draggable: false,\n    drawer: {\n        open: false,\n        toggle: () => {},\n    },\n    elements: {\n        drawer: undefined,\n        extra: undefined,\n    },\n    onClose: () => {},\n    popupRef: null,\n    props: {},\n    ref: null,\n    showCloseButton: true,\n    size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n    return React.useContext(DialogContext);\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyBa,MAAA,gBAAgBA,iBAAM,cAA6B;AAAA,EAC5D,eAAe;AAAA,EACf,WAAW;AAAA,EACX,QAAQ;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ,MAAM;AAAA,IAAA;AAAA,EAClB;AAAA,EACA,UAAU;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,EACX;AAAA,EACA,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,UAAU;AAAA,EACV,OAAO,CAAC;AAAA,EACR,KAAK;AAAA,EACL,iBAAiB;AAAA,EACjB,MAAM;AACV,CAAC;AAEM,MAAM,mBAAmB,MAAM;AAC3B,SAAAA,iBAAM,WAAW,aAAa;AACzC;;;"}

package/dist/components/Dialog/Context.d.ts

@@ -12,7 +12,10 @@ export type DialogContext = {
         extra?: React.ReactNode;
     };
     onClose?: () => void;
+    /** Stable ref to the dialog popup element. */
+    popupRef: React.RefObject<HTMLElement | null> | null;
     props: Record<string, any>;
+    /** Forwarded ref from `<Dialog>` — attached to the Trigger button. */
     ref: React.Ref<HTMLElement>;
     showCloseButton: boolean;
     size: DialogSize;

package/dist/components/Dialog/Context.js

@@ -13,6 +13,7 @@ const DialogContext = React.createContext({
   },
   onClose: () => {
   },
+  popupRef: null,
   props: {},
   ref: null,
   showCloseButton: true,

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

@@ -1 +1 @@
-{"version":3,"file":"Context.js","sources":["../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* oxlint-disable no-empty-function */\nimport * as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n    closeOnEscape: boolean;\n    draggable: boolean;\n    drawer: {\n        open: boolean;\n        toggle: () => void;\n    };\n    elements: {\n        drawer?: React.ReactNode;\n        extra?: React.ReactNode;\n    };\n    onClose?: () => void;\n    props: Record<string, any>;\n    ref: React.Ref<HTMLElement>;\n    showCloseButton: boolean;\n    size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n    closeOnEscape: true,\n    draggable: false,\n    drawer: {\n        open: false,\n        toggle: () => {},\n    },\n    elements: {\n        drawer: undefined,\n        extra: undefined,\n    },\n    onClose: () => {},\n    props: {},\n    ref: null,\n    showCloseButton: true,\n    size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n    return React.useContext(DialogContext);\n};\n"],"names":[],"mappings":";AAsBa,MAAA,gBAAgB,MAAM,cAA6B;AAAA,EAC5D,eAAe;AAAA,EACf,WAAW;AAAA,EACX,QAAQ;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ,MAAM;AAAA,IAAA;AAAA,EAClB;AAAA,EACA,UAAU;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,EACX;AAAA,EACA,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,OAAO,CAAC;AAAA,EACR,KAAK;AAAA,EACL,iBAAiB;AAAA,EACjB,MAAM;AACV,CAAC;AAEM,MAAM,mBAAmB,MAAM;AAC3B,SAAA,MAAM,WAAW,aAAa;AACzC;"}
+{"version":3,"file":"Context.js","sources":["../../../src/components/Dialog/Context.tsx"],"sourcesContent":["/* oxlint-disable no-empty-function */\nimport * as React from 'react';\nimport { DialogSize } from './types';\n\nexport type DialogContext = {\n    closeOnEscape: boolean;\n    draggable: boolean;\n    drawer: {\n        open: boolean;\n        toggle: () => void;\n    };\n    elements: {\n        drawer?: React.ReactNode;\n        extra?: React.ReactNode;\n    };\n    onClose?: () => void;\n    /** Stable ref to the dialog popup element. */\n    popupRef: React.RefObject<HTMLElement | null> | null;\n    props: Record<string, any>;\n    /** Forwarded ref from `<Dialog>` — attached to the Trigger button. */\n    ref: React.Ref<HTMLElement>;\n    showCloseButton: boolean;\n    size: DialogSize;\n};\n\nexport const DialogContext = React.createContext<DialogContext>({\n    closeOnEscape: true,\n    draggable: false,\n    drawer: {\n        open: false,\n        toggle: () => {},\n    },\n    elements: {\n        drawer: undefined,\n        extra: undefined,\n    },\n    onClose: () => {},\n    popupRef: null,\n    props: {},\n    ref: null,\n    showCloseButton: true,\n    size: 'sm',\n});\n\nexport const useCurrentDialog = () => {\n    return React.useContext(DialogContext);\n};\n"],"names":[],"mappings":";AAyBa,MAAA,gBAAgB,MAAM,cAA6B;AAAA,EAC5D,eAAe;AAAA,EACf,WAAW;AAAA,EACX,QAAQ;AAAA,IACJ,MAAM;AAAA,IACN,QAAQ,MAAM;AAAA,IAAA;AAAA,EAClB;AAAA,EACA,UAAU;AAAA,IACN,QAAQ;AAAA,IACR,OAAO;AAAA,EACX;AAAA,EACA,SAAS,MAAM;AAAA,EAAC;AAAA,EAChB,UAAU;AAAA,EACV,OAAO,CAAC;AAAA,EACR,KAAK;AAAA,EACL,iBAAiB;AAAA,EACjB,MAAM;AACV,CAAC;AAEM,MAAM,mBAAmB,MAAM;AAC3B,SAAA,MAAM,WAAW,aAAa;AACzC;"}

package/dist/components/Dialog/Dialog.cjs

@@ -59,6 +59,7 @@ const Dialog = React__namespace.forwardRef(function Dialog2(props, ref) {
   } = props;
   const [children, drawer, extra] = useSeparatedChildren(initialChildren);
   const [drawerOpen, setDrawerOpen] = React__namespace.useState(false);
+  const popupRef = React__namespace.useRef(null);
   const context = React__namespace.useMemo(
     () => ({
       closeOnEscape,
@@ -72,6 +73,7 @@ const Dialog = React__namespace.forwardRef(function Dialog2(props, ref) {
         extra
       },
       onClose,
+      popupRef,
       props: otherProps,
       showCloseButton,
       size,

package/dist/components/Dialog/Dialog.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Dialog.cjs","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\n\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, DialogDrawerRenderProps, DialogDrawer } from './components/DialogDrawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\nimport './Dialog.css';\n\nexport type {\n    DialogCloseProps,\n    DialogContentDrawerRenderProps,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogDrawerProps,\n    DialogDrawerRenderProps,\n    DialogFooterProps,\n    DialogSize,\n    DialogTitleProps,\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  */\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: React.ReactNode) => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.toArray(initialChildren).forEach((child: any) => {\n            if (child.type?.displayName === DialogDrawer.displayName) {\n                drawer = child;\n            } else if (child.type?.displayName === Extra.displayName) {\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(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\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    const handleOpenChange = (open: boolean, eventDetails: DialogPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (closeOnEscape === false) {\n                eventDetails.cancel();\n                return;\n            }\n            // call onClose, and fall through to also call onChange.\n            props.onClose?.();\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root\n                defaultOpen={defaultOpen}\n                disablePointerDismissal\n                modal\n                open={open}\n                onOpenChange={handleOpenChange}>\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 = DialogDrawer;\nDialog.Close = Close;\n"],"names":["React","DialogDrawer","Extra","Dialog","open","DialogContext","DialogPrimitive","Trigger","Content","Title","Footer","Close"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,MAAM,uBAAuB,CAAC,oBAAqC;AACxD,SAAAA,iBAAM,QAAQ,MAAM;AACvB,UAAM,WAAkB,CAAC;AACrB,QAAA;AACA,QAAA;AAEJA,qBAAM,SAAS,QAAQ,eAAe,EAAE,QAAQ,CAAC,UAAe;;AAC5D,YAAI,WAAM,SAAN,mBAAY,iBAAgBC,aAAAA,aAAa,aAAa;AAC7C,iBAAA;AAAA,MACF,aAAA,WAAM,SAAN,mBAAY,iBAAgBC,MAAAA,MAAM,aAAa;AAC9C,gBAAA;AAAA,MAAA,OACL;AACH,iBAAS,KAAK,KAAK;AAAA,MAAA;AAAA,IACvB,CACH;AAEM,WAAA,CAAC,UAAU,QAAQ,KAAK;AAAA,EAAA,GAChC,CAAC,eAAe,CAAC;AACxB;AAYO,MAAM,SAASF,iBAAM,WAAW,SAASG,QAAO,OAAoB,KAA6B;AAC9F,QAAA;AAAA,IACF,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AACJ,QAAM,CAAC,UAAU,QAAQ,KAAK,IAAI,qBAAqB,eAAe;AACtE,QAAM,CAAC,YAAY,aAAa,IAAIH,iBAAM,SAAS,KAAK;AAExD,QAAM,UAAUA,iBAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,QACJ,MAAM;AAAA,QACN,QAAQ,MAAM,cAAc,CAAA,iBAAgB,CAAC,YAAY;AAAA,MAC7D;AAAA,MACA,UAAU;AAAA,QACN;AAAA,QACA;AAAA,MACJ;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,eAAe,YAAY,WAAW,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC3F;AAEM,QAAA,mBAAmB,CAACI,OAAe,iBAA0D;;AAC3F,QAAA,aAAa,WAAW,cAAc;AAChC,YAAA,4BAA4B,kBAAa,MAAM,WAAnB,mBAA2C;AAAA,QACzE;AAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAO;AAGpB,qBAAa,iBAAiB;AAC9B;AAAA,MAAA,WACO,kBAAkB,OAAO;AAChC,qBAAa,OAAO;AACpB;AAAA,MAAA;AAGJ,kBAAM,YAAN;AAAA,IAAgB;AAGpB,yCAAWA;AAAAA,EACf;AAEA,SACKJ,iCAAA,cAAAK,sBAAc,UAAd,EAAuB,OAAO,WAC3BL,iCAAA;AAAA,IAACM,OAAAA,OAAgB;AAAA,IAAhB;AAAA,MACG;AAAA,MACA,yBAAuB;AAAA,MACvB,OAAK;AAAA,MACL;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,IACb,WAAYN,iCAAA,cAAAO,QAAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAUA,QAAA;AACjB,OAAO,UAAUC,QAAA;AACjB,OAAO,QAAQC,QAAA;AACf,OAAO,SAASC,QAAA;AAChB,OAAO,QAAQR,MAAA;AACf,OAAO,SAASD,aAAA;AAChB,OAAO,QAAQU,QAAA;;"}
+{"version":3,"file":"Dialog.cjs","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\n\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, DialogDrawerRenderProps, DialogDrawer } from './components/DialogDrawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\nimport './Dialog.css';\n\nexport type {\n    DialogCloseProps,\n    DialogContentDrawerRenderProps,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogDrawerProps,\n    DialogDrawerRenderProps,\n    DialogFooterProps,\n    DialogSize,\n    DialogTitleProps,\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  */\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: React.ReactNode) => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.toArray(initialChildren).forEach((child: any) => {\n            if (child.type?.displayName === DialogDrawer.displayName) {\n                drawer = child;\n            } else if (child.type?.displayName === Extra.displayName) {\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(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\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    const popupRef = React.useRef<HTMLElement | null>(null);\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            popupRef,\n            props: otherProps,\n            showCloseButton,\n            size,\n            ref,\n        }),\n        [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: DialogPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (closeOnEscape === false) {\n                eventDetails.cancel();\n                return;\n            }\n            // call onClose, and fall through to also call onChange.\n            props.onClose?.();\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root\n                defaultOpen={defaultOpen}\n                disablePointerDismissal\n                modal\n                open={open}\n                onOpenChange={handleOpenChange}>\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 = DialogDrawer;\nDialog.Close = Close;\n"],"names":["React","DialogDrawer","Extra","Dialog","open","DialogContext","DialogPrimitive","Trigger","Content","Title","Footer","Close"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAiEA,MAAM,uBAAuB,CAAC,oBAAqC;AACxD,SAAAA,iBAAM,QAAQ,MAAM;AACvB,UAAM,WAAkB,CAAC;AACrB,QAAA;AACA,QAAA;AAEJA,qBAAM,SAAS,QAAQ,eAAe,EAAE,QAAQ,CAAC,UAAe;;AAC5D,YAAI,WAAM,SAAN,mBAAY,iBAAgBC,aAAAA,aAAa,aAAa;AAC7C,iBAAA;AAAA,MACF,aAAA,WAAM,SAAN,mBAAY,iBAAgBC,MAAAA,MAAM,aAAa;AAC9C,gBAAA;AAAA,MAAA,OACL;AACH,iBAAS,KAAK,KAAK;AAAA,MAAA;AAAA,IACvB,CACH;AAEM,WAAA,CAAC,UAAU,QAAQ,KAAK;AAAA,EAAA,GAChC,CAAC,eAAe,CAAC;AACxB;AAYO,MAAM,SAASF,iBAAM,WAAW,SAASG,QAAO,OAAoB,KAA6B;AAC9F,QAAA;AAAA,IACF,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AACJ,QAAM,CAAC,UAAU,QAAQ,KAAK,IAAI,qBAAqB,eAAe;AACtE,QAAM,CAAC,YAAY,aAAa,IAAIH,iBAAM,SAAS,KAAK;AAClD,QAAA,WAAWA,iBAAM,OAA2B,IAAI;AAEtD,QAAM,UAAUA,iBAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,QACJ,MAAM;AAAA,QACN,QAAQ,MAAM,cAAc,CAAA,iBAAgB,CAAC,YAAY;AAAA,MAC7D;AAAA,MACA,UAAU;AAAA,QACN;AAAA,QACA;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,eAAe,YAAY,WAAW,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC3F;AAEM,QAAA,mBAAmB,CAACI,OAAe,iBAA0D;;AAC3F,QAAA,aAAa,WAAW,cAAc;AAChC,YAAA,4BAA4B,kBAAa,MAAM,WAAnB,mBAA2C;AAAA,QACzE;AAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAO;AAGpB,qBAAa,iBAAiB;AAC9B;AAAA,MAAA,WACO,kBAAkB,OAAO;AAChC,qBAAa,OAAO;AACpB;AAAA,MAAA;AAGJ,kBAAM,YAAN;AAAA,IAAgB;AAGpB,yCAAWA;AAAAA,EACf;AAEA,SACKJ,iCAAA,cAAAK,sBAAc,UAAd,EAAuB,OAAO,WAC3BL,iCAAA;AAAA,IAACM,OAAAA,OAAgB;AAAA,IAAhB;AAAA,MACG;AAAA,MACA,yBAAuB;AAAA,MACvB,OAAK;AAAA,MACL;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,IACb,WAAYN,iCAAA,cAAAO,QAAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAUA,QAAA;AACjB,OAAO,UAAUC,QAAA;AACjB,OAAO,QAAQC,QAAA;AACf,OAAO,SAASC,QAAA;AAChB,OAAO,QAAQR,MAAA;AACf,OAAO,SAASD,aAAA;AAChB,OAAO,QAAQU,QAAA;;"}

package/dist/components/Dialog/Dialog.js

@@ -40,6 +40,7 @@ const Dialog = React.forwardRef(function Dialog2(props, ref) {
   } = props;
   const [children, drawer, extra] = useSeparatedChildren(initialChildren);
   const [drawerOpen, setDrawerOpen] = React.useState(false);
+  const popupRef = React.useRef(null);
   const context = React.useMemo(
     () => ({
       closeOnEscape,
@@ -53,6 +54,7 @@ const Dialog = React.forwardRef(function Dialog2(props, ref) {
         extra
       },
       onClose,
+      popupRef,
       props: otherProps,
       showCloseButton,
       size,

package/dist/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 { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\n\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, DialogDrawerRenderProps, DialogDrawer } from './components/DialogDrawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\nimport './Dialog.css';\n\nexport type {\n    DialogCloseProps,\n    DialogContentDrawerRenderProps,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogDrawerProps,\n    DialogDrawerRenderProps,\n    DialogFooterProps,\n    DialogSize,\n    DialogTitleProps,\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  */\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: React.ReactNode) => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.toArray(initialChildren).forEach((child: any) => {\n            if (child.type?.displayName === DialogDrawer.displayName) {\n                drawer = child;\n            } else if (child.type?.displayName === Extra.displayName) {\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(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\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    const handleOpenChange = (open: boolean, eventDetails: DialogPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (closeOnEscape === false) {\n                eventDetails.cancel();\n                return;\n            }\n            // call onClose, and fall through to also call onChange.\n            props.onClose?.();\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root\n                defaultOpen={defaultOpen}\n                disablePointerDismissal\n                modal\n                open={open}\n                onOpenChange={handleOpenChange}>\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 = DialogDrawer;\nDialog.Close = Close;\n"],"names":["Dialog","open","DialogPrimitive"],"mappings":";;;;;;;;AAiEA,MAAM,uBAAuB,CAAC,oBAAqC;AACxD,SAAA,MAAM,QAAQ,MAAM;AACvB,UAAM,WAAkB,CAAC;AACrB,QAAA;AACA,QAAA;AAEJ,UAAM,SAAS,QAAQ,eAAe,EAAE,QAAQ,CAAC,UAAe;;AAC5D,YAAI,WAAM,SAAN,mBAAY,iBAAgB,aAAa,aAAa;AAC7C,iBAAA;AAAA,MACF,aAAA,WAAM,SAAN,mBAAY,iBAAgB,MAAM,aAAa;AAC9C,gBAAA;AAAA,MAAA,OACL;AACH,iBAAS,KAAK,KAAK;AAAA,MAAA;AAAA,IACvB,CACH;AAEM,WAAA,CAAC,UAAU,QAAQ,KAAK;AAAA,EAAA,GAChC,CAAC,eAAe,CAAC;AACxB;AAYO,MAAM,SAAS,MAAM,WAAW,SAASA,QAAO,OAAoB,KAA6B;AAC9F,QAAA;AAAA,IACF,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AACJ,QAAM,CAAC,UAAU,QAAQ,KAAK,IAAI,qBAAqB,eAAe;AACtE,QAAM,CAAC,YAAY,aAAa,IAAI,MAAM,SAAS,KAAK;AAExD,QAAM,UAAU,MAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,QACJ,MAAM;AAAA,QACN,QAAQ,MAAM,cAAc,CAAA,iBAAgB,CAAC,YAAY;AAAA,MAC7D;AAAA,MACA,UAAU;AAAA,QACN;AAAA,QACA;AAAA,MACJ;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,eAAe,YAAY,WAAW,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC3F;AAEM,QAAA,mBAAmB,CAACC,OAAe,iBAA0D;;AAC3F,QAAA,aAAa,WAAW,cAAc;AAChC,YAAA,4BAA4B,kBAAa,MAAM,WAAnB,mBAA2C;AAAA,QACzE;AAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAO;AAGpB,qBAAa,iBAAiB;AAC9B;AAAA,MAAA,WACO,kBAAkB,OAAO;AAChC,qBAAa,OAAO;AACpB;AAAA,MAAA;AAGJ,kBAAM,YAAN;AAAA,IAAgB;AAGpB,yCAAWA;AAAAA,EACf;AAEA,SACK,sBAAA,cAAA,cAAc,UAAd,EAAuB,OAAO,WAC3B,sBAAA;AAAA,IAACC,SAAgB;AAAA,IAAhB;AAAA,MACG;AAAA,MACA,yBAAuB;AAAA,MACvB,OAAK;AAAA,MACL;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,IACb,WAAY,sBAAA,cAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,QAAQ;"}
+{"version":3,"file":"Dialog.js","sources":["../../../src/components/Dialog/Dialog.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\n\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, DialogDrawerRenderProps, DialogDrawer } from './components/DialogDrawer';\nimport { DialogExtraProps, Extra } from './components/Extra';\nimport { DialogContext } from './Context';\nimport { DialogSize } from './types';\nimport './Dialog.css';\n\nexport type {\n    DialogCloseProps,\n    DialogContentDrawerRenderProps,\n    DialogContentProps,\n    DialogContentRenderProps,\n    DialogDrawerProps,\n    DialogDrawerRenderProps,\n    DialogFooterProps,\n    DialogSize,\n    DialogTitleProps,\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  */\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: React.ReactNode) => {\n    return React.useMemo(() => {\n        const children: any[] = [];\n        let drawer;\n        let extra;\n\n        React.Children.toArray(initialChildren).forEach((child: any) => {\n            if (child.type?.displayName === DialogDrawer.displayName) {\n                drawer = child;\n            } else if (child.type?.displayName === Extra.displayName) {\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(function Dialog(props: DialogProps, ref: React.Ref<HTMLElement>) {\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    const popupRef = React.useRef<HTMLElement | null>(null);\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            popupRef,\n            props: otherProps,\n            showCloseButton,\n            size,\n            ref,\n        }),\n        [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: DialogPrimitive.Root.ChangeEventDetails) => {\n        if (eventDetails.reason === 'escape-key') {\n            const triggeredFromRadixPortal = (eventDetails.event.target as HTMLElement)?.closest(\n                'div[data-radix-popper-content-wrapper]'\n            );\n\n            if (triggeredFromRadixPortal) {\n                // TODO: This could be removed when all radix overlays are replaced with base UI components, but currently it propagates through and closes the dialog.\n\n                // cancel closing the dialog\n                eventDetails.cancel();\n\n                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            } else if (closeOnEscape === false) {\n                eventDetails.cancel();\n                return;\n            }\n            // call onClose, and fall through to also call onChange.\n            props.onClose?.();\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <DialogContext.Provider value={context}>\n            <DialogPrimitive.Root\n                defaultOpen={defaultOpen}\n                disablePointerDismissal\n                modal\n                open={open}\n                onOpenChange={handleOpenChange}>\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 = DialogDrawer;\nDialog.Close = Close;\n"],"names":["Dialog","open","DialogPrimitive"],"mappings":";;;;;;;;AAiEA,MAAM,uBAAuB,CAAC,oBAAqC;AACxD,SAAA,MAAM,QAAQ,MAAM;AACvB,UAAM,WAAkB,CAAC;AACrB,QAAA;AACA,QAAA;AAEJ,UAAM,SAAS,QAAQ,eAAe,EAAE,QAAQ,CAAC,UAAe;;AAC5D,YAAI,WAAM,SAAN,mBAAY,iBAAgB,aAAa,aAAa;AAC7C,iBAAA;AAAA,MACF,aAAA,WAAM,SAAN,mBAAY,iBAAgB,MAAM,aAAa;AAC9C,gBAAA;AAAA,MAAA,OACL;AACH,iBAAS,KAAK,KAAK;AAAA,MAAA;AAAA,IACvB,CACH;AAEM,WAAA,CAAC,UAAU,QAAQ,KAAK;AAAA,EAAA,GAChC,CAAC,eAAe,CAAC;AACxB;AAYO,MAAM,SAAS,MAAM,WAAW,SAASA,QAAO,OAAoB,KAA6B;AAC9F,QAAA;AAAA,IACF,UAAU;AAAA,IACV,gBAAgB;AAAA,IAChB;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB,OAAO;AAAA,IACP;AAAA,IACA,GAAG;AAAA,EAAA,IACH;AACJ,QAAM,CAAC,UAAU,QAAQ,KAAK,IAAI,qBAAqB,eAAe;AACtE,QAAM,CAAC,YAAY,aAAa,IAAI,MAAM,SAAS,KAAK;AAClD,QAAA,WAAW,MAAM,OAA2B,IAAI;AAEtD,QAAM,UAAU,MAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA;AAAA,MACA,QAAQ;AAAA,QACJ,MAAM;AAAA,QACN,QAAQ,MAAM,cAAc,CAAA,iBAAgB,CAAC,YAAY;AAAA,MAC7D;AAAA,MACA,UAAU;AAAA,QACN;AAAA,QACA;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEJ,CAAC,eAAe,YAAY,WAAW,QAAQ,OAAO,MAAM,YAAY,eAAe;AAAA,EAC3F;AAEM,QAAA,mBAAmB,CAACC,OAAe,iBAA0D;;AAC3F,QAAA,aAAa,WAAW,cAAc;AAChC,YAAA,4BAA4B,kBAAa,MAAM,WAAnB,mBAA2C;AAAA,QACzE;AAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAO;AAGpB,qBAAa,iBAAiB;AAC9B;AAAA,MAAA,WACO,kBAAkB,OAAO;AAChC,qBAAa,OAAO;AACpB;AAAA,MAAA;AAGJ,kBAAM,YAAN;AAAA,IAAgB;AAGpB,yCAAWA;AAAAA,EACf;AAEA,SACK,sBAAA,cAAA,cAAc,UAAd,EAAuB,OAAO,WAC3B,sBAAA;AAAA,IAACC,SAAgB;AAAA,IAAhB;AAAA,MACG;AAAA,MACA,yBAAuB;AAAA,MACvB,OAAK;AAAA,MACL;AAAA,MACA,cAAc;AAAA,IAAA;AAAA,IACb,WAAY,sBAAA,cAAA,SAAA,MAAS,OAAQ;AAAA,IAC7B;AAAA,EAAA,CAET;AAER,CAAC;AAED,OAAO,UAAU;AACjB,OAAO,UAAU;AACjB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,QAAQ;AACf,OAAO,SAAS;AAChB,OAAO,QAAQ;"}

package/dist/components/Dialog/components/Content.cjs

@@ -3,8 +3,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const cn = require("clsx");
 const dialog = require("@base-ui/react/dialog");
-const useMergedRef = require("../../../hooks/useMergedRef.cjs");
 const useDraggable = require("../../../utils/hooks/useDraggable.cjs");
+const mergeRefs = require("../../../utils/mergeRefs.cjs");
 const Context = require("../Context.cjs");
 const Localization = require("../../Provider/Localization.cjs");
 const IconButton = require("../../IconButton/IconButton.cjs");
@@ -48,8 +48,9 @@ const RenderPropWrapper = React__namespace.forwardRef(function RenderPropWrapper
 });
 const Content = React__namespace.forwardRef(function DialogContent(props, forwardedRef) {
   const dialog$1 = Context.useCurrentDialog();
-  const internalRef = useMergedRef.useMergedRef(forwardedRef);
-  const { position, dragging, handleProps: dragHandleProps } = useDraggable.useDraggable(internalRef);
+  const popupRef = dialog$1.popupRef;
+  const setPopupRef = React__namespace.useMemo(() => mergeRefs.mergeRefs([popupRef, forwardedRef]), [popupRef, forwardedRef]);
+  const { position, dragging, handleProps: dragHandleProps } = useDraggable.useDraggable(popupRef);
   const { texts } = Localization.useLocalization();
   const className = cn(
     "relative bg-white animate-[fade-in_150ms] rounded print:!static",
@@ -77,7 +78,7 @@ const Content = React__namespace.forwardRef(function DialogContent(props, forwar
     {
       ...props,
       className,
-      ref: internalRef,
+      ref: setPopupRef,
       style: {
         ...props.style,
         left: dialog$1.draggable ? `${position.x}px` : void 0,

package/dist/components/Dialog/components/Content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\nimport { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\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    children: JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ 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: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    const internalRef = useMergedRef<HTMLDivElement>(forwardedRef);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(internalRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative bg-white animate-[fade-in_150ms] rounded print:!static',\n        getDialogPositionClassnames(),\n        getDialogSizeClassnames(dialog.size),\n        'print:w-full print:h-max print:m-0 print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'bg-white p-6 rounded relative z-10 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={internalRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <IconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["React","DialogPrimitive","dialog","useCurrentDialog","RenderPropWrapper","useMergedRef","useDraggable","useLocalization","getDialogPositionClassnames","getDialogSizeClassnames","Backdrop","IconButton"],"mappings":"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"}
+{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Dialog/components/Content.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\nimport { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\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    children: JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ 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: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative bg-white animate-[fade-in_150ms] rounded print:!static',\n        getDialogPositionClassnames(),\n        getDialogSizeClassnames(dialog.size),\n        'print:w-full print:h-max print:m-0 print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'bg-white p-6 rounded relative z-10 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <IconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["React","DialogPrimitive","dialog","useCurrentDialog","RenderPropWrapper","mergeRefs","useDraggable","useLocalization","getDialogPositionClassnames","getDialogSizeClassnames","Backdrop","IconButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmBO,MAAM,QAAQA,iBAAM,WAAW,SAAS,YAAY,OAAyB,KAAoC;AACpH,QAAM,YAAY,GAAG,eAAe,MAAM,SAAS;AACnD,wDAAQC,cAAgB,OAAhB,EAAuB,GAAG,OAAO,WAAsB,KAAU;AAC7E,CAAC;AAGM,MAAM,SAASD,iBAAM,WAAW,SAAS,aAAa,OAA0B,KAAgC;AACnH,QAAM,YAAY,GAAG,yBAAyB,MAAM,SAAS;AAC7D,wDACK,OAAK,EAAA,GAAG,OAAO,WAAsB,IAAA,GACjC,MAAM,QACX;AAER,CAAC;AAMM,MAAM,QAAQA,iBAAM,WAAW,SAAS,YAAY,OAAyB,KAAmC;AACnH,QAAME,WAASC,QAAAA,iBAAiB;AAChC,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AAE5B,SAAAH,iCAAA,cAACC,cAAgB,OAAhB,EAAuB,GAAG,WAAW,SAASC,SAAO,SAAS,KAAU,QAAQ,SAAU,CAAA;AACtG,CAAC;AAED,MAAM,oBAAoBF,iBAAM,WAAW,SAASI,mBAAkB,EAAE,UAAU,SAAS,YAAY,GAAQ,KAAK;AAChH,QAAM,QAAQ,MAAM;AACR,YAAA,IAAI,YAAY,OAAO,CAAC;AAAA,EACpC;AAEA,SAAO,SAAS,EAAE,OAAO,KAAK,GAAG,aAAa;AAClD,CAAC;AASM,MAAM,UAAUJ,iBAAM,WAAW,SAAS,cAC7C,OACA,cACF;AACE,QAAME,WAASC,QAAAA,iBAAiB;AAGhC,QAAM,WAAWD,SAAO;AACxB,QAAM,cAAcF,iBAAM,QAAQ,MAAMK,UAAAA,UAA0B,CAAC,UAAU,YAAY,CAAC,GAAG,CAAC,UAAU,YAAY,CAAC;AACrH,QAAM,EAAE,UAAU,UAAU,aAAa,gBAAgB,IAAIC,0BAAa,QAAQ;AAC5E,QAAA,EAAE,MAAM,IAAIC,6BAAgB;AAElC,QAAM,YAAY;AAAA,IACd;AAAA,IACAC,iCAA4B;AAAA,IAC5BC,KAAA,wBAAwBP,SAAO,IAAI;AAAA,IACnC;AAAA,EACJ;AAEA,QAAM,qBAAqB;AAAA,IACvB;AAAA;AAAA,IAEA;AAAA,IACA;AAAA,MACI,kBAAkB,CAAC,CAACA,SAAO,SAAS;AAAA,IACxC;AAAA,IACA,MAAM;AAAA,EACV;AAEI,MAAA;AAEA,MAAA,OAAO,MAAM,aAAa,YAAY;AACtC,aACKF,iCAAA,cAAA,OAAA,MACIA,iCAAA,cAAA,mBAAA,EAAkB,aAAa,EAAE,QAAQE,SAAO,OAAO,EAAA,GAAI,MAAM,QAAS,CAC/E;AAAA,EAAA,OAED;AACH,aAAS,MAAM;AAAA,EAAA;AAEnB,SACKF,iCAAA,cAAAC,OAAA,OAAgB,QAAhB,qDACIS,SAAAA,UACG,MAAAV,iCAAA;AAAA,IAACC,OAAAA,OAAgB;AAAA,IAAhB;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,KAAK;AAAA,MACL,OAAO;AAAA,QACH,GAAG,MAAM;AAAA,QACT,MAAMC,SAAO,YAAY,GAAG,SAAS,CAAC,OAAO;AAAA,QAC7C,KAAKA,SAAO,YAAY,GAAG,SAAS,CAAC,OAAO;AAAA,MAAA;AAAA,IAChD;AAAA,IACAF,iCAAA,cAAC,SAAI,WAAW,oBAAoB,aAAU,SACzC,GAAA,QACAE,SAAO,aACJF,iCAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACI,GAAG;AAAA,QACJ,MAAK;AAAA,QACL,WAAS;AAAA,QACT,gBAAc;AAAA,QACd,cAAY,MAAM,OAAO;AAAA,QACzB,WAAU;AAAA,MAAA;AAAA,IAAA,GAGjBE,SAAO,kBACJF,iCAAA;AAAA,MAACC,OAAAA,OAAgB;AAAA,MAAhB;AAAA,QACG,SAASC,SAAO;AAAA,QAChB,QACIF,iCAAA;AAAA,UAACW,WAAA;AAAA,UAAA;AAAA,YACG,YAAW;AAAA,YACX,cAAY,MAAM,OAAO;AAAA,YACzB,WAAU;AAAA,YACV,MAAK;AAAA,UAAA;AAAA,QAAA;AAAA,MACT;AAAA,QAER,IACR;AAAA,IACCT,SAAO,SAAS;AAAA,IAChBA,SAAO,SAAS;AAAA,EAAA,CAEzB,CACJ;AAER,CAAC;;;;;"}

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

@@ -1,8 +1,8 @@
 import * as React from "react";
 import cn from "clsx";
 import { Dialog } from "@base-ui/react/dialog";
-import { useMergedRef } from "../../../hooks/useMergedRef.js";
 import { useDraggable } from "../../../utils/hooks/useDraggable.js";
+import { mergeRefs } from "../../../utils/mergeRefs.js";
 import { useCurrentDialog } from "../Context.js";
 import { useLocalization } from "../../Provider/Localization.js";
 import { IconButton } from "../../IconButton/IconButton.js";
@@ -29,8 +29,9 @@ const RenderPropWrapper = React.forwardRef(function RenderPropWrapper2({ childre
 });
 const Content = React.forwardRef(function DialogContent(props, forwardedRef) {
   const dialog = useCurrentDialog();
-  const internalRef = useMergedRef(forwardedRef);
-  const { position, dragging, handleProps: dragHandleProps } = useDraggable(internalRef);
+  const popupRef = dialog.popupRef;
+  const setPopupRef = React.useMemo(() => mergeRefs([popupRef, forwardedRef]), [popupRef, forwardedRef]);
+  const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);
   const { texts } = useLocalization();
   const className = cn(
     "relative bg-white animate-[fade-in_150ms] rounded print:!static",
@@ -58,7 +59,7 @@ const Content = React.forwardRef(function DialogContent(props, forwardedRef) {
     {
       ...props,
       className,
-      ref: internalRef,
+      ref: setPopupRef,
       style: {
         ...props.style,
         left: dialog.draggable ? `${position.x}px` : void 0,

package/dist/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 'clsx';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\nimport { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\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    children: JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ 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: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    const internalRef = useMergedRef<HTMLDivElement>(forwardedRef);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(internalRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative bg-white animate-[fade-in_150ms] rounded print:!static',\n        getDialogPositionClassnames(),\n        getDialogSizeClassnames(dialog.size),\n        'print:w-full print:h-max print:m-0 print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'bg-white p-6 rounded relative z-10 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={internalRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <IconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["DialogPrimitive","RenderPropWrapper"],"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 'clsx';\nimport { Dialog as DialogPrimitive } from '@base-ui/react/dialog';\nimport { useDraggable } from '../../../utils/hooks/useDraggable';\nimport { mergeRefs } from '../../../utils/mergeRefs';\nimport { DialogContext, useCurrentDialog } from '../Context';\nimport { useLocalization } from '../../Provider/Localization';\nimport { IconButton } from '../../IconButton/IconButton';\nimport { getDialogPositionClassnames, getDialogSizeClassnames } from '../util';\nimport { Backdrop } from '../../Backdrop/Backdrop';\n\nexport type DialogContentDrawerRenderProps = DialogContext['drawer'];\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    children: JSX.Element;\n};\n\nexport const Close = React.forwardRef(function DialogClose(props: DialogCloseProps, ref: React.Ref<HTMLButtonElement>) {\n    const dialog = useCurrentDialog();\n    const { children, ...restProps } = props;\n\n    return <DialogPrimitive.Close {...restProps} onClick={dialog.onClose} ref={ref} render={children} />;\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ 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: React.ReactNode | ((props: DialogContentRenderProps) => React.ReactNode);\n    initialFocus?: DialogPrimitive.Popup.Props['initialFocus'];\n    finalFocus?: DialogPrimitive.Popup.Props['finalFocus'];\n};\nexport const Content = React.forwardRef(function DialogContent(\n    props: DialogContentProps,\n    forwardedRef: React.Ref<HTMLDivElement>\n) {\n    const dialog = useCurrentDialog();\n    // Popup ref lives on the Dialog root so descendants can read it via `useDialogScope`;\n    // we attach it to the popup node here and merge in any forwarded ref.\n    const popupRef = dialog.popupRef as React.MutableRefObject<HTMLDivElement | null>;\n    const setPopupRef = React.useMemo(() => mergeRefs<HTMLDivElement>([popupRef, forwardedRef]), [popupRef, forwardedRef]);\n    const { position, dragging, handleProps: dragHandleProps } = useDraggable(popupRef);\n    const { texts } = useLocalization();\n\n    const className = cn(\n        'relative bg-white animate-[fade-in_150ms] rounded print:!static',\n        getDialogPositionClassnames(),\n        getDialogSizeClassnames(dialog.size),\n        'print:w-full print:h-max print:m-0 print:overflow-visible'\n    );\n\n    const containerClassName = cn(\n        'bg-white p-6 rounded relative z-10 shadow print:p-0',\n        // The `!fixed` property is crucial to ensure that when a draggable dialog is moved, the printed document still displays its content across the full page.\n        'print:overflow-visible print:h-max print:!transform-none print:!inset-0 print:!m-0',\n        {\n            'rounded-b-none': !!dialog.elements.extra,\n        },\n        props.className\n    );\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = (\n            <Close>\n                <RenderPropWrapper renderProps={{ drawer: dialog.drawer }}>{props.children}</RenderPropWrapper>\n            </Close>\n        );\n    } else {\n        output = props.children;\n    }\n    return (\n        <DialogPrimitive.Portal>\n            <Backdrop>\n                <DialogPrimitive.Popup\n                    {...props}\n                    className={className}\n                    ref={setPopupRef}\n                    style={{\n                        ...props.style,\n                        left: dialog.draggable ? `${position.x}px` : undefined,\n                        top: dialog.draggable ? `${position.y}px` : undefined,\n                    }}>\n                    <div className={containerClassName} data-taco=\"dialog\">\n                        {output}\n                        {dialog.draggable && (\n                            <div\n                                {...dragHandleProps}\n                                role=\"button\"\n                                draggable\n                                aria-grabbed={dragging}\n                                aria-label={texts.dialog.drag}\n                                className=\"yt-dialog__drag absolute-center-x top-1.5 h-3 w-24 cursor-move rounded bg-gray-100 text-center print:hidden\"\n                            />\n                        )}\n                        {dialog.showCloseButton ? (\n                            <DialogPrimitive.Close\n                                onClick={dialog.onClose}\n                                render={\n                                    <IconButton\n                                        appearance=\"discrete\"\n                                        aria-label={texts.dialog.close}\n                                        className=\"absolute right-0 top-0 mr-2 mt-2 print:hidden\"\n                                        icon=\"close\"\n                                    />\n                                }></DialogPrimitive.Close>\n                        ) : null}\n                    </div>\n                    {dialog.elements.drawer}\n                    {dialog.elements.extra}\n                </DialogPrimitive.Popup>\n            </Backdrop>\n        </DialogPrimitive.Portal>\n    );\n});\n"],"names":["DialogPrimitive","RenderPropWrapper"],"mappings":"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"}

package/dist/components/Dialog/useDialogScope.cjs

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const React = require("react");
+const Context = require("./Context.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const useDialogScope = () => {
+  return React__namespace.useContext(Context.DialogContext).popupRef;
+};
+exports.useDialogScope = useDialogScope;
+//# sourceMappingURL=useDialogScope.cjs.map

package/dist/components/Dialog/useDialogScope.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDialogScope.cjs","sources":["../../../src/components/Dialog/useDialogScope.ts"],"sourcesContent":["import * as React from 'react';\nimport { DialogContext } from './Context';\n\n/**\n * Returns a ref to the dialog popup element (or `null` outside any `<Dialog>`). Use it to\n * scope element-bound listeners (e.g. keyboard shortcuts) to the current dialog. Read\n * `.current` inside an effect — it's populated once `Dialog.Content` mounts.\n */\nexport const useDialogScope = () => {\n    return React.useContext(DialogContext).popupRef;\n};\n"],"names":["React","DialogContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAQO,MAAM,iBAAiB,MAAM;AACzB,SAAAA,iBAAM,WAAWC,QAAa,aAAA,EAAE;AAC3C;;"}

package/dist/components/Dialog/useDialogScope.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+/**
+ * Returns a ref to the dialog popup element (or `null` outside any `<Dialog>`). Use it to
+ * scope element-bound listeners (e.g. keyboard shortcuts) to the current dialog. Read
+ * `.current` inside an effect — it's populated once `Dialog.Content` mounts.
+ */
+export declare const useDialogScope: () => React.RefObject<HTMLElement | null> | null;

package/dist/components/Dialog/useDialogScope.js

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { DialogContext } from "./Context.js";
+const useDialogScope = () => {
+  return React.useContext(DialogContext).popupRef;
+};
+export {
+  useDialogScope
+};
+//# sourceMappingURL=useDialogScope.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useDialogScope.js","sources":["../../../src/components/Dialog/useDialogScope.ts"],"sourcesContent":["import * as React from 'react';\nimport { DialogContext } from './Context';\n\n/**\n * Returns a ref to the dialog popup element (or `null` outside any `<Dialog>`). Use it to\n * scope element-bound listeners (e.g. keyboard shortcuts) to the current dialog. Read\n * `.current` inside an effect — it's populated once `Dialog.Content` mounts.\n */\nexport const useDialogScope = () => {\n    return React.useContext(DialogContext).popupRef;\n};\n"],"names":[],"mappings":";;AAQO,MAAM,iBAAiB,MAAM;AACzB,SAAA,MAAM,WAAW,aAAa,EAAE;AAC3C;"}

package/dist/components/Inline/Inline.cjs

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const cn = require("clsx");
-const props = require("../../utils/props.cjs");
 const layout = require("../../utils/layout.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -21,9 +20,17 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const Inline = React__namespace.forwardRef(function Inline2(props$1, ref) {
-  const { spacing, alignInline = "start", alignBlock = "stretch", noWrap = false, children, ...rest } = props$1;
-  const restProps = props.omitPropsRuntime(rest, ["className", "style"]);
+const Inline = React__namespace.forwardRef(function Inline2(props, ref) {
+  const {
+    spacing,
+    alignInline = "start",
+    alignBlock = "stretch",
+    noWrap = false,
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const inlineClassName = cn(
     "flex flex-row",
     layout.SPACING_MAP[spacing],

package/dist/components/Inline/Inline.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Inline.cjs","sources":["../../../src/components/Inline/Inline.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { omitPropsRuntime } from '../../utils/props';\nimport { SPACING_MAP, JUSTIFY_CONTENT_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type InlineSpacing = keyof typeof SPACING_MAP;\nexport type InlineAlignInline = keyof typeof JUSTIFY_CONTENT_MAP;\nexport type InlineAlignBlock = keyof typeof ALIGN_ITEMS_MAP;\n\nexport type InlineProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between inline items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: InlineSpacing;\n    /**\n     * Align children on the inline axis (horizontal).\n     * @defaultValue start\n     */\n    alignInline?: InlineAlignInline;\n    /**\n     * Align children on the block axis (vertical).\n     * @defaultValue stretch\n     */\n    alignBlock?: InlineAlignBlock;\n    /**\n     * Prevents contents from wrapping to a new line.\n     * @defaultValue false\n     */\n    noWrap?: boolean;\n    /** Content to be distributed horizontally */\n    children: React.ReactNode;\n};\n\nexport const Inline = React.forwardRef<HTMLDivElement, InlineProps>(function Inline(props, ref) {\n    const { spacing, alignInline = 'start', alignBlock = 'stretch', noWrap = false, children, ...rest } = props;\n    // In cases where people ignoring the type errors and still passing in className and style, we need to omit them from the restProps object.\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n\n    const inlineClassName = cn(\n        'flex flex-row',\n        SPACING_MAP[spacing],\n        JUSTIFY_CONTENT_MAP[alignInline],\n        ALIGN_ITEMS_MAP[alignBlock],\n        noWrap ? 'flex-nowrap' : 'flex-wrap'\n    );\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={inlineClassName} {...restProps} data-taco=\"inline\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["React","Inline","props","omitPropsRuntime","SPACING_MAP","JUSTIFY_CONTENT_MAP","ALIGN_ITEMS_MAP"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAkCO,MAAM,SAASA,iBAAM,WAAwC,SAASC,QAAOC,SAAO,KAAK;AACtF,QAAA,EAAE,SAAS,cAAc,SAAS,aAAa,WAAW,SAAS,OAAO,UAAU,GAAG,KAAS,IAAAA;AAEtG,QAAM,YAAYC,MAAAA,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAE/D,QAAM,kBAAkB;AAAA,IACpB;AAAA,IACAC,OAAAA,YAAY,OAAO;AAAA,IACnBC,OAAAA,oBAAoB,WAAW;AAAA,IAC/BC,OAAAA,gBAAgB,UAAU;AAAA,IAC1B,SAAS,gBAAgB;AAAA,EAC7B;AAGA,QAAM,kBAAkBN,iBAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQA,iCAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAAA,iCAAA,cAAC,SAAI,WAAW,iBAAkB,GAAG,WAAW,aAAU,UAAS,IAAA,GAC9D,eACL;AAER,CAAC;;"}
+{"version":3,"file":"Inline.cjs","sources":["../../../src/components/Inline/Inline.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { SPACING_MAP, JUSTIFY_CONTENT_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type InlineSpacing = keyof typeof SPACING_MAP;\nexport type InlineAlignInline = keyof typeof JUSTIFY_CONTENT_MAP;\nexport type InlineAlignBlock = keyof typeof ALIGN_ITEMS_MAP;\n\nexport type InlineProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between inline items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: InlineSpacing;\n    /**\n     * Align children on the inline axis (horizontal).\n     * @defaultValue start\n     */\n    alignInline?: InlineAlignInline;\n    /**\n     * Align children on the block axis (vertical).\n     * @defaultValue stretch\n     */\n    alignBlock?: InlineAlignBlock;\n    /**\n     * Prevents contents from wrapping to a new line.\n     * @defaultValue false\n     */\n    noWrap?: boolean;\n    /** Content to be distributed horizontally */\n    children: React.ReactNode;\n};\n\nexport const Inline = React.forwardRef<HTMLDivElement, InlineProps>(function Inline(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        spacing,\n        alignInline = 'start',\n        alignBlock = 'stretch',\n        noWrap = false,\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as InlineProps & { className?: string; style?: React.CSSProperties };\n\n    const inlineClassName = cn(\n        'flex flex-row',\n        SPACING_MAP[spacing],\n        JUSTIFY_CONTENT_MAP[alignInline],\n        ALIGN_ITEMS_MAP[alignBlock],\n        noWrap ? 'flex-nowrap' : 'flex-wrap'\n    );\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={inlineClassName} {...restProps} data-taco=\"inline\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["React","Inline","SPACING_MAP","JUSTIFY_CONTENT_MAP","ALIGN_ITEMS_MAP"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAiCO,MAAM,SAASA,iBAAM,WAAwC,SAASC,QAAO,OAAO,KAAK;AAEtF,QAAA;AAAA,IACF;AAAA,IACA,cAAc;AAAA,IACd,aAAa;AAAA,IACb,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,kBAAkB;AAAA,IACpB;AAAA,IACAC,OAAAA,YAAY,OAAO;AAAA,IACnBC,OAAAA,oBAAoB,WAAW;AAAA,IAC/BC,OAAAA,gBAAgB,UAAU;AAAA,IAC1B,SAAS,gBAAgB;AAAA,EAC7B;AAGA,QAAM,kBAAkBJ,iBAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQA,iCAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAAA,iCAAA,cAAC,SAAI,WAAW,iBAAkB,GAAG,WAAW,aAAU,UAAS,IAAA,GAC9D,eACL;AAER,CAAC;;"}

package/dist/components/Inline/Inline.js

@@ -1,10 +1,17 @@
 import * as React from "react";
 import cn from "clsx";
-import { omitPropsRuntime } from "../../utils/props.js";
 import { SPACING_MAP, JUSTIFY_CONTENT_MAP, ALIGN_ITEMS_MAP } from "../../utils/layout.js";
 const Inline = React.forwardRef(function Inline2(props, ref) {
-  const { spacing, alignInline = "start", alignBlock = "stretch", noWrap = false, children, ...rest } = props;
-  const restProps = omitPropsRuntime(rest, ["className", "style"]);
+  const {
+    spacing,
+    alignInline = "start",
+    alignBlock = "stretch",
+    noWrap = false,
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const inlineClassName = cn(
     "flex flex-row",
     SPACING_MAP[spacing],

package/dist/components/Inline/Inline.js.map

@@ -1 +1 @@
-{"version":3,"file":"Inline.js","sources":["../../../src/components/Inline/Inline.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { omitPropsRuntime } from '../../utils/props';\nimport { SPACING_MAP, JUSTIFY_CONTENT_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type InlineSpacing = keyof typeof SPACING_MAP;\nexport type InlineAlignInline = keyof typeof JUSTIFY_CONTENT_MAP;\nexport type InlineAlignBlock = keyof typeof ALIGN_ITEMS_MAP;\n\nexport type InlineProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between inline items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: InlineSpacing;\n    /**\n     * Align children on the inline axis (horizontal).\n     * @defaultValue start\n     */\n    alignInline?: InlineAlignInline;\n    /**\n     * Align children on the block axis (vertical).\n     * @defaultValue stretch\n     */\n    alignBlock?: InlineAlignBlock;\n    /**\n     * Prevents contents from wrapping to a new line.\n     * @defaultValue false\n     */\n    noWrap?: boolean;\n    /** Content to be distributed horizontally */\n    children: React.ReactNode;\n};\n\nexport const Inline = React.forwardRef<HTMLDivElement, InlineProps>(function Inline(props, ref) {\n    const { spacing, alignInline = 'start', alignBlock = 'stretch', noWrap = false, children, ...rest } = props;\n    // In cases where people ignoring the type errors and still passing in className and style, we need to omit them from the restProps object.\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n\n    const inlineClassName = cn(\n        'flex flex-row',\n        SPACING_MAP[spacing],\n        JUSTIFY_CONTENT_MAP[alignInline],\n        ALIGN_ITEMS_MAP[alignBlock],\n        noWrap ? 'flex-nowrap' : 'flex-wrap'\n    );\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={inlineClassName} {...restProps} data-taco=\"inline\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["Inline"],"mappings":";;;;AAkCO,MAAM,SAAS,MAAM,WAAwC,SAASA,QAAO,OAAO,KAAK;AACtF,QAAA,EAAE,SAAS,cAAc,SAAS,aAAa,WAAW,SAAS,OAAO,UAAU,GAAG,KAAS,IAAA;AAEtG,QAAM,YAAY,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAE/D,QAAM,kBAAkB;AAAA,IACpB;AAAA,IACA,YAAY,OAAO;AAAA,IACnB,oBAAoB,WAAW;AAAA,IAC/B,gBAAgB,UAAU;AAAA,IAC1B,SAAS,gBAAgB;AAAA,EAC7B;AAGA,QAAM,kBAAkB,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQ,sBAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAA,sBAAA,cAAC,SAAI,WAAW,iBAAkB,GAAG,WAAW,aAAU,UAAS,IAAA,GAC9D,eACL;AAER,CAAC;"}
+{"version":3,"file":"Inline.js","sources":["../../../src/components/Inline/Inline.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { SPACING_MAP, JUSTIFY_CONTENT_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type InlineSpacing = keyof typeof SPACING_MAP;\nexport type InlineAlignInline = keyof typeof JUSTIFY_CONTENT_MAP;\nexport type InlineAlignBlock = keyof typeof ALIGN_ITEMS_MAP;\n\nexport type InlineProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between inline items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: InlineSpacing;\n    /**\n     * Align children on the inline axis (horizontal).\n     * @defaultValue start\n     */\n    alignInline?: InlineAlignInline;\n    /**\n     * Align children on the block axis (vertical).\n     * @defaultValue stretch\n     */\n    alignBlock?: InlineAlignBlock;\n    /**\n     * Prevents contents from wrapping to a new line.\n     * @defaultValue false\n     */\n    noWrap?: boolean;\n    /** Content to be distributed horizontally */\n    children: React.ReactNode;\n};\n\nexport const Inline = React.forwardRef<HTMLDivElement, InlineProps>(function Inline(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        spacing,\n        alignInline = 'start',\n        alignBlock = 'stretch',\n        noWrap = false,\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as InlineProps & { className?: string; style?: React.CSSProperties };\n\n    const inlineClassName = cn(\n        'flex flex-row',\n        SPACING_MAP[spacing],\n        JUSTIFY_CONTENT_MAP[alignInline],\n        ALIGN_ITEMS_MAP[alignBlock],\n        noWrap ? 'flex-nowrap' : 'flex-wrap'\n    );\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={inlineClassName} {...restProps} data-taco=\"inline\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["Inline"],"mappings":";;;AAiCO,MAAM,SAAS,MAAM,WAAwC,SAASA,QAAO,OAAO,KAAK;AAEtF,QAAA;AAAA,IACF;AAAA,IACA,cAAc;AAAA,IACd,aAAa;AAAA,IACb,SAAS;AAAA,IACT;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,kBAAkB;AAAA,IACpB;AAAA,IACA,YAAY,OAAO;AAAA,IACnB,oBAAoB,WAAW;AAAA,IAC/B,gBAAgB,UAAU;AAAA,IAC1B,SAAS,gBAAgB;AAAA,EAC7B;AAGA,QAAM,kBAAkB,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQ,sBAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAA,sBAAA,cAAC,SAAI,WAAW,iBAAkB,GAAG,WAAW,aAAU,UAAS,IAAA,GAC9D,eACL;AAER,CAAC;"}

package/dist/components/Stack/Stack.cjs

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const cn = require("clsx");
-const props = require("../../utils/props.cjs");
 const layout = require("../../utils/layout.cjs");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -21,9 +20,15 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const Stack = React__namespace.forwardRef(function Stack2(props$1, ref) {
-  const { spacing, alignInline = "stretch", children, ...rest } = props$1;
-  const restProps = props.omitPropsRuntime(rest, ["className", "style"]);
+const Stack = React__namespace.forwardRef(function Stack2(props, ref) {
+  const {
+    spacing,
+    alignInline = "stretch",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const stackClassName = cn("flex flex-col", layout.SPACING_MAP[spacing], layout.ALIGN_ITEMS_MAP[alignInline]);
   const wrappedChildren = React__namespace.Children.map(children, (child, index) => {
     if (child === null || child === void 0 || child === false) {

package/dist/components/Stack/Stack.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.cjs","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { omitPropsRuntime } from '../../utils/props';\nimport { SPACING_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type StackSpacing = keyof typeof SPACING_MAP;\nexport type StackAlignInline = keyof typeof ALIGN_ITEMS_MAP;\nexport type StackProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between stack items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: StackSpacing;\n    /**\n     * Align children on the inline axis.\n     * @defaultValue stretch\n     */\n    alignInline?: StackAlignInline;\n    /** Content to be stacked vertically */\n    children: React.ReactNode;\n};\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(function Stack(props, ref) {\n    const { spacing, alignInline = 'stretch', children, ...rest } = props;\n    // In cases where people ignoring the type errors and still passing in className and style, we need to omit them from the restProps object.\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n\n    const stackClassName = cn('flex flex-col', SPACING_MAP[spacing], ALIGN_ITEMS_MAP[alignInline]);\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={stackClassName} {...restProps} data-taco=\"stack\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["React","Stack","props","omitPropsRuntime","SPACING_MAP","ALIGN_ITEMS_MAP"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAsBO,MAAM,QAAQA,iBAAM,WAAuC,SAASC,OAAMC,SAAO,KAAK;AACzF,QAAM,EAAE,SAAS,cAAc,WAAW,UAAU,GAAG,SAASA;AAEhE,QAAM,YAAYC,MAAAA,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAEzD,QAAA,iBAAiB,GAAG,iBAAiBC,OAAAA,YAAY,OAAO,GAAGC,OAAAA,gBAAgB,WAAW,CAAC;AAG7F,QAAM,kBAAkBL,iBAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQA,iCAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAAA,iCAAA,cAAC,SAAI,WAAW,gBAAiB,GAAG,WAAW,aAAU,SAAQ,IAAA,GAC5D,eACL;AAER,CAAC;;"}
+{"version":3,"file":"Stack.cjs","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { SPACING_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type StackSpacing = keyof typeof SPACING_MAP;\nexport type StackAlignInline = keyof typeof ALIGN_ITEMS_MAP;\nexport type StackProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between stack items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: StackSpacing;\n    /**\n     * Align children on the inline axis.\n     * @defaultValue stretch\n     */\n    alignInline?: StackAlignInline;\n    /** Content to be stacked vertically */\n    children: React.ReactNode;\n};\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(function Stack(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        spacing,\n        alignInline = 'stretch',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as StackProps & { className?: string; style?: React.CSSProperties };\n\n    const stackClassName = cn('flex flex-col', SPACING_MAP[spacing], ALIGN_ITEMS_MAP[alignInline]);\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={stackClassName} {...restProps} data-taco=\"stack\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["React","Stack","SPACING_MAP","ALIGN_ITEMS_MAP"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAqBO,MAAM,QAAQA,iBAAM,WAAuC,SAASC,OAAM,OAAO,KAAK;AAEnF,QAAA;AAAA,IACF;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEE,QAAA,iBAAiB,GAAG,iBAAiBC,OAAAA,YAAY,OAAO,GAAGC,OAAAA,gBAAgB,WAAW,CAAC;AAG7F,QAAM,kBAAkBH,iBAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQA,iCAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAAA,iCAAA,cAAC,SAAI,WAAW,gBAAiB,GAAG,WAAW,aAAU,SAAQ,IAAA,GAC5D,eACL;AAER,CAAC;;"}

package/dist/components/Stack/Stack.js

@@ -1,10 +1,15 @@
 import * as React from "react";
 import cn from "clsx";
-import { omitPropsRuntime } from "../../utils/props.js";
 import { SPACING_MAP, ALIGN_ITEMS_MAP } from "../../utils/layout.js";
 const Stack = React.forwardRef(function Stack2(props, ref) {
-  const { spacing, alignInline = "stretch", children, ...rest } = props;
-  const restProps = omitPropsRuntime(rest, ["className", "style"]);
+  const {
+    spacing,
+    alignInline = "stretch",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const stackClassName = cn("flex flex-col", SPACING_MAP[spacing], ALIGN_ITEMS_MAP[alignInline]);
   const wrappedChildren = React.Children.map(children, (child, index) => {
     if (child === null || child === void 0 || child === false) {

package/dist/components/Stack/Stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"Stack.js","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { omitPropsRuntime } from '../../utils/props';\nimport { SPACING_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type StackSpacing = keyof typeof SPACING_MAP;\nexport type StackAlignInline = keyof typeof ALIGN_ITEMS_MAP;\nexport type StackProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between stack items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: StackSpacing;\n    /**\n     * Align children on the inline axis.\n     * @defaultValue stretch\n     */\n    alignInline?: StackAlignInline;\n    /** Content to be stacked vertically */\n    children: React.ReactNode;\n};\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(function Stack(props, ref) {\n    const { spacing, alignInline = 'stretch', children, ...rest } = props;\n    // In cases where people ignoring the type errors and still passing in className and style, we need to omit them from the restProps object.\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n\n    const stackClassName = cn('flex flex-col', SPACING_MAP[spacing], ALIGN_ITEMS_MAP[alignInline]);\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={stackClassName} {...restProps} data-taco=\"stack\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["Stack"],"mappings":";;;;AAsBO,MAAM,QAAQ,MAAM,WAAuC,SAASA,OAAM,OAAO,KAAK;AACzF,QAAM,EAAE,SAAS,cAAc,WAAW,UAAU,GAAG,SAAS;AAEhE,QAAM,YAAY,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAEzD,QAAA,iBAAiB,GAAG,iBAAiB,YAAY,OAAO,GAAG,gBAAgB,WAAW,CAAC;AAG7F,QAAM,kBAAkB,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQ,sBAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAA,sBAAA,cAAC,SAAI,WAAW,gBAAiB,GAAG,WAAW,aAAU,SAAQ,IAAA,GAC5D,eACL;AAER,CAAC;"}
+{"version":3,"file":"Stack.js","sources":["../../../src/components/Stack/Stack.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport { SPACING_MAP, ALIGN_ITEMS_MAP } from '../../utils/layout';\n\nexport type StackSpacing = keyof typeof SPACING_MAP;\nexport type StackAlignInline = keyof typeof ALIGN_ITEMS_MAP;\nexport type StackProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children' | 'className' | 'style'> & {\n    /**\n     * Spacing between stack items in pixels.\n     * Available values: 0, 4, 8, 12, 16, 24, 32, 48\n     */\n    spacing: StackSpacing;\n    /**\n     * Align children on the inline axis.\n     * @defaultValue stretch\n     */\n    alignInline?: StackAlignInline;\n    /** Content to be stacked vertically */\n    children: React.ReactNode;\n};\n\nexport const Stack = React.forwardRef<HTMLDivElement, StackProps>(function Stack(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        spacing,\n        alignInline = 'stretch',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as StackProps & { className?: string; style?: React.CSSProperties };\n\n    const stackClassName = cn('flex flex-col', SPACING_MAP[spacing], ALIGN_ITEMS_MAP[alignInline]);\n\n    // Wrap each child in a div to prevent it from inheriting flex properties\n    const wrappedChildren = React.Children.map(children, (child, index) => {\n        if (child === null || child === undefined || child === false) {\n            return null;\n        }\n        return <div key={index}>{child}</div>;\n    });\n\n    return (\n        <div className={stackClassName} {...restProps} data-taco=\"stack\" ref={ref}>\n            {wrappedChildren}\n        </div>\n    );\n});\n"],"names":["Stack"],"mappings":";;;AAqBO,MAAM,QAAQ,MAAM,WAAuC,SAASA,OAAM,OAAO,KAAK;AAEnF,QAAA;AAAA,IACF;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEE,QAAA,iBAAiB,GAAG,iBAAiB,YAAY,OAAO,GAAG,gBAAgB,WAAW,CAAC;AAG7F,QAAM,kBAAkB,MAAM,SAAS,IAAI,UAAU,CAAC,OAAO,UAAU;AACnE,QAAI,UAAU,QAAQ,UAAU,UAAa,UAAU,OAAO;AACnD,aAAA;AAAA,IAAA;AAEX,WAAQ,sBAAA,cAAA,OAAA,EAAI,KAAK,MAAA,GAAQ,KAAM;AAAA,EAAA,CAClC;AAGG,SAAA,sBAAA,cAAC,SAAI,WAAW,gBAAiB,GAAG,WAAW,aAAU,SAAQ,IAAA,GAC5D,eACL;AAER,CAAC;"}

package/dist/components/Typography/Heading.cjs

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const props = require("../../utils/props.cjs");
 const cn = require("clsx");
 const typography = require("../../utils/typography.cjs");
 function _interopNamespaceDefault(e) {
@@ -22,9 +21,17 @@ function _interopNamespaceDefault(e) {
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
 const HEADING_LINE_HEIGHT_CLASS = "leading-normal";
-const Heading = React__namespace.forwardRef(function Heading2(props$1, ref) {
-  const { size = "md", level, color = "primary", align = "start", children, ...rest } = props$1;
-  const restProps = props.omitPropsRuntime(rest, ["className", "style"]);
+const Heading = React__namespace.forwardRef(function Heading2(props, ref) {
+  const {
+    size = "md",
+    level,
+    color = "primary",
+    align = "start",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const Component = `h${level}`;
   const headingClassName = cn(
     typography.TYPOGRAPHY_BASE_CLASSES,

package/dist/components/Typography/Heading.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.cjs","sources":["../../../src/components/Typography/Heading.tsx"],"sourcesContent":["import * as React from 'react';\nimport { omitPropsRuntime } from '../../utils/props';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_HEADING_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type HeadingSize = 'sm' | 'md' | 'lg';\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type HeadingAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type HeadingProps = Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'className' | 'style'> & {\n    size?: HeadingSize;\n    level: HeadingLevel;\n    color?: HeadingColor;\n    align?: HeadingAlign;\n    children: React.ReactNode;\n};\n\nconst HEADING_LINE_HEIGHT_CLASS = 'leading-normal';\n\nexport const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(function Heading(props, ref) {\n    const { size = 'md', level, color = 'primary', align = 'start', children, ...rest } = props;\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n    const Component = `h${level}` as const;\n    const headingClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        'font-bold',\n        TYPOGRAPHY_HEADING_SIZE_CLASSES[size],\n        HEADING_LINE_HEIGHT_CLASS,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align]\n    );\n\n    return (\n        <Component {...restProps} className={headingClassName} data-taco=\"heading\" ref={ref}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["React","Heading","props","omitPropsRuntime","TYPOGRAPHY_BASE_CLASSES","TYPOGRAPHY_HEADING_SIZE_CLASSES","TYPOGRAPHY_COLOR_MAP","TYPOGRAPHY_ALIGN_CLASSES"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAuBA,MAAM,4BAA4B;AAE3B,MAAM,UAAUA,iBAAM,WAA6C,SAASC,SAAQC,SAAO,KAAK;AAC7F,QAAA,EAAE,OAAO,MAAM,OAAO,QAAQ,WAAW,QAAQ,SAAS,UAAU,GAAG,KAAS,IAAAA;AACtF,QAAM,YAAYC,MAAAA,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AACzD,QAAA,YAAY,IAAI,KAAK;AAC3B,QAAM,mBAAmB;AAAA,IACrBC,WAAA;AAAA,IACA;AAAA,IACAC,WAAAA,gCAAgC,IAAI;AAAA,IACpC;AAAA,IACAC,WAAAA,qBAAqB,KAAK;AAAA,IAC1BC,WAAAA,yBAAyB,KAAK;AAAA,EAClC;AAGI,SAAAP,iCAAA,cAAC,aAAW,GAAG,WAAW,WAAW,kBAAkB,aAAU,WAAU,IAAA,GACtE,QACL;AAER,CAAC;;"}
+{"version":3,"file":"Heading.cjs","sources":["../../../src/components/Typography/Heading.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_HEADING_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type HeadingSize = 'sm' | 'md' | 'lg';\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type HeadingAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type HeadingProps = Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'className' | 'style'> & {\n    size?: HeadingSize;\n    level: HeadingLevel;\n    color?: HeadingColor;\n    align?: HeadingAlign;\n    children: React.ReactNode;\n};\n\nconst HEADING_LINE_HEIGHT_CLASS = 'leading-normal';\n\nexport const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(function Heading(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        size = 'md',\n        level,\n        color = 'primary',\n        align = 'start',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as HeadingProps & { className?: string; style?: React.CSSProperties };\n\n    const Component = `h${level}` as const;\n    const headingClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        'font-bold',\n        TYPOGRAPHY_HEADING_SIZE_CLASSES[size],\n        HEADING_LINE_HEIGHT_CLASS,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align]\n    );\n\n    return (\n        <Component {...restProps} className={headingClassName} data-taco=\"heading\" ref={ref}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["React","Heading","TYPOGRAPHY_BASE_CLASSES","TYPOGRAPHY_HEADING_SIZE_CLASSES","TYPOGRAPHY_COLOR_MAP","TYPOGRAPHY_ALIGN_CLASSES"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAM,4BAA4B;AAE3B,MAAM,UAAUA,iBAAM,WAA6C,SAASC,SAAQ,OAAO,KAAK;AAE7F,QAAA;AAAA,IACF,OAAO;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEE,QAAA,YAAY,IAAI,KAAK;AAC3B,QAAM,mBAAmB;AAAA,IACrBC,WAAA;AAAA,IACA;AAAA,IACAC,WAAAA,gCAAgC,IAAI;AAAA,IACpC;AAAA,IACAC,WAAAA,qBAAqB,KAAK;AAAA,IAC1BC,WAAAA,yBAAyB,KAAK;AAAA,EAClC;AAGI,SAAAL,iCAAA,cAAC,aAAW,GAAG,WAAW,WAAW,kBAAkB,aAAU,WAAU,IAAA,GACtE,QACL;AAER,CAAC;;"}

package/dist/components/Typography/Heading.js

@@ -1,11 +1,18 @@
 import * as React from "react";
-import { omitPropsRuntime } from "../../utils/props.js";
 import cn from "clsx";
 import { TYPOGRAPHY_BASE_CLASSES, TYPOGRAPHY_HEADING_SIZE_CLASSES, TYPOGRAPHY_COLOR_MAP, TYPOGRAPHY_ALIGN_CLASSES } from "../../utils/typography.js";
 const HEADING_LINE_HEIGHT_CLASS = "leading-normal";
 const Heading = React.forwardRef(function Heading2(props, ref) {
-  const { size = "md", level, color = "primary", align = "start", children, ...rest } = props;
-  const restProps = omitPropsRuntime(rest, ["className", "style"]);
+  const {
+    size = "md",
+    level,
+    color = "primary",
+    align = "start",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const Component = `h${level}`;
   const headingClassName = cn(
     TYPOGRAPHY_BASE_CLASSES,

package/dist/components/Typography/Heading.js.map

@@ -1 +1 @@
-{"version":3,"file":"Heading.js","sources":["../../../src/components/Typography/Heading.tsx"],"sourcesContent":["import * as React from 'react';\nimport { omitPropsRuntime } from '../../utils/props';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_HEADING_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type HeadingSize = 'sm' | 'md' | 'lg';\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type HeadingAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type HeadingProps = Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'className' | 'style'> & {\n    size?: HeadingSize;\n    level: HeadingLevel;\n    color?: HeadingColor;\n    align?: HeadingAlign;\n    children: React.ReactNode;\n};\n\nconst HEADING_LINE_HEIGHT_CLASS = 'leading-normal';\n\nexport const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(function Heading(props, ref) {\n    const { size = 'md', level, color = 'primary', align = 'start', children, ...rest } = props;\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n    const Component = `h${level}` as const;\n    const headingClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        'font-bold',\n        TYPOGRAPHY_HEADING_SIZE_CLASSES[size],\n        HEADING_LINE_HEIGHT_CLASS,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align]\n    );\n\n    return (\n        <Component {...restProps} className={headingClassName} data-taco=\"heading\" ref={ref}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["Heading"],"mappings":";;;;AAuBA,MAAM,4BAA4B;AAE3B,MAAM,UAAU,MAAM,WAA6C,SAASA,SAAQ,OAAO,KAAK;AAC7F,QAAA,EAAE,OAAO,MAAM,OAAO,QAAQ,WAAW,QAAQ,SAAS,UAAU,GAAG,KAAS,IAAA;AACtF,QAAM,YAAY,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AACzD,QAAA,YAAY,IAAI,KAAK;AAC3B,QAAM,mBAAmB;AAAA,IACrB;AAAA,IACA;AAAA,IACA,gCAAgC,IAAI;AAAA,IACpC;AAAA,IACA,qBAAqB,KAAK;AAAA,IAC1B,yBAAyB,KAAK;AAAA,EAClC;AAGI,SAAA,sBAAA,cAAC,aAAW,GAAG,WAAW,WAAW,kBAAkB,aAAU,WAAU,IAAA,GACtE,QACL;AAER,CAAC;"}
+{"version":3,"file":"Heading.js","sources":["../../../src/components/Typography/Heading.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_HEADING_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type HeadingSize = 'sm' | 'md' | 'lg';\nexport type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;\nexport type HeadingColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type HeadingAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type HeadingProps = Omit<React.HTMLAttributes<HTMLHeadingElement>, 'children' | 'className' | 'style'> & {\n    size?: HeadingSize;\n    level: HeadingLevel;\n    color?: HeadingColor;\n    align?: HeadingAlign;\n    children: React.ReactNode;\n};\n\nconst HEADING_LINE_HEIGHT_CLASS = 'leading-normal';\n\nexport const Heading = React.forwardRef<HTMLHeadingElement, HeadingProps>(function Heading(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        size = 'md',\n        level,\n        color = 'primary',\n        align = 'start',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as HeadingProps & { className?: string; style?: React.CSSProperties };\n\n    const Component = `h${level}` as const;\n    const headingClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        'font-bold',\n        TYPOGRAPHY_HEADING_SIZE_CLASSES[size],\n        HEADING_LINE_HEIGHT_CLASS,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align]\n    );\n\n    return (\n        <Component {...restProps} className={headingClassName} data-taco=\"heading\" ref={ref}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["Heading"],"mappings":";;;AAsBA,MAAM,4BAA4B;AAE3B,MAAM,UAAU,MAAM,WAA6C,SAASA,SAAQ,OAAO,KAAK;AAE7F,QAAA;AAAA,IACF,OAAO;AAAA,IACP;AAAA,IACA,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEE,QAAA,YAAY,IAAI,KAAK;AAC3B,QAAM,mBAAmB;AAAA,IACrB;AAAA,IACA;AAAA,IACA,gCAAgC,IAAI;AAAA,IACpC;AAAA,IACA,qBAAqB,KAAK;AAAA,IAC1B,yBAAyB,KAAK;AAAA,EAClC;AAGI,SAAA,sBAAA,cAAC,aAAW,GAAG,WAAW,WAAW,kBAAkB,aAAU,WAAU,IAAA,GACtE,QACL;AAER,CAAC;"}

package/dist/components/Typography/Text.cjs

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
-const props = require("../../utils/props.cjs");
 const cn = require("clsx");
 const typography = require("../../utils/typography.cjs");
 function _interopNamespaceDefault(e) {
@@ -21,9 +20,18 @@ function _interopNamespaceDefault(e) {
   return Object.freeze(n);
 }
 const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const Text = React__namespace.forwardRef(function Text2(props$1, ref) {
-  const { size = "md", as = "p", bold = false, color = "primary", align = "start", children, ...rest } = props$1;
-  const restProps = props.omitPropsRuntime(rest, ["className", "style"]);
+const Text = React__namespace.forwardRef(function Text2(props, ref) {
+  const {
+    size = "md",
+    as = "p",
+    bold = false,
+    color = "primary",
+    align = "start",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const Component = as;
   const resetListMarker = as === "li";
   const textLineHeightClass = size === "md" ? "leading-snug" : "leading-normal";

package/dist/components/Typography/Text.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Text.cjs","sources":["../../../src/components/Typography/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport { omitPropsRuntime } from '../../utils/props';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_TEXT_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type TextSize = 'sm' | 'md' | 'lg';\nexport type TextAs = 'p' | 'li' | 'dt' | 'dd' | 'span';\nexport type TextColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type TextAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {\n    size?: TextSize;\n    as?: TextAs;\n    bold?: boolean;\n    color?: TextColor;\n    align?: TextAlign;\n    children: React.ReactNode;\n};\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(function Text(props, ref) {\n    const { size = 'md', as = 'p', bold = false, color = 'primary', align = 'start', children, ...rest } = props;\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n    const Component = as;\n    const resetListMarker = as === 'li';\n    const textLineHeightClass = size === 'md' ? 'leading-snug' : 'leading-normal';\n    const textClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        TYPOGRAPHY_TEXT_SIZE_CLASSES[size],\n        textLineHeightClass,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align],\n        {\n            'font-bold': bold,\n            'font-normal': !bold,\n            'list-none': resetListMarker,\n        }\n    );\n\n    return (\n        <Component {...restProps} className={textClassName} data-taco=\"text\" ref={ref as any}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["React","Text","props","omitPropsRuntime","TYPOGRAPHY_BASE_CLASSES","TYPOGRAPHY_TEXT_SIZE_CLASSES","TYPOGRAPHY_COLOR_MAP","TYPOGRAPHY_ALIGN_CLASSES"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAwBO,MAAM,OAAOA,iBAAM,WAAmC,SAASC,MAAKC,SAAO,KAAK;AACnF,QAAM,EAAE,OAAO,MAAM,KAAK,KAAK,OAAO,OAAO,QAAQ,WAAW,QAAQ,SAAS,UAAU,GAAG,KAAS,IAAAA;AACvG,QAAM,YAAYC,MAAAA,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAC/D,QAAM,YAAY;AAClB,QAAM,kBAAkB,OAAO;AACzB,QAAA,sBAAsB,SAAS,OAAO,iBAAiB;AAC7D,QAAM,gBAAgB;AAAA,IAClBC,WAAA;AAAA,IACAC,WAAAA,6BAA6B,IAAI;AAAA,IACjC;AAAA,IACAC,WAAAA,qBAAqB,KAAK;AAAA,IAC1BC,WAAAA,yBAAyB,KAAK;AAAA,IAC9B;AAAA,MACI,aAAa;AAAA,MACb,eAAe,CAAC;AAAA,MAChB,aAAa;AAAA,IAAA;AAAA,EAErB;AAGI,SAAAP,iCAAA,cAAC,aAAW,GAAG,WAAW,WAAW,eAAe,aAAU,QAAO,IAAA,GAChE,QACL;AAER,CAAC;;"}
+{"version":3,"file":"Text.cjs","sources":["../../../src/components/Typography/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_TEXT_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type TextSize = 'sm' | 'md' | 'lg';\nexport type TextAs = 'p' | 'li' | 'dt' | 'dd' | 'span';\nexport type TextColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type TextAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {\n    size?: TextSize;\n    as?: TextAs;\n    bold?: boolean;\n    color?: TextColor;\n    align?: TextAlign;\n    children: React.ReactNode;\n};\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(function Text(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        size = 'md',\n        as = 'p',\n        bold = false,\n        color = 'primary',\n        align = 'start',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as TextProps & { className?: string; style?: React.CSSProperties };\n\n    const Component = as;\n    const resetListMarker = as === 'li';\n    const textLineHeightClass = size === 'md' ? 'leading-snug' : 'leading-normal';\n    const textClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        TYPOGRAPHY_TEXT_SIZE_CLASSES[size],\n        textLineHeightClass,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align],\n        {\n            'font-bold': bold,\n            'font-normal': !bold,\n            'list-none': resetListMarker,\n        }\n    );\n\n    return (\n        <Component {...restProps} className={textClassName} data-taco=\"text\" ref={ref as any}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["React","Text","TYPOGRAPHY_BASE_CLASSES","TYPOGRAPHY_TEXT_SIZE_CLASSES","TYPOGRAPHY_COLOR_MAP","TYPOGRAPHY_ALIGN_CLASSES"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAuBO,MAAM,OAAOA,iBAAM,WAAmC,SAASC,MAAK,OAAO,KAAK;AAE7E,QAAA;AAAA,IACF,OAAO;AAAA,IACP,KAAK;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,YAAY;AAClB,QAAM,kBAAkB,OAAO;AACzB,QAAA,sBAAsB,SAAS,OAAO,iBAAiB;AAC7D,QAAM,gBAAgB;AAAA,IAClBC,WAAA;AAAA,IACAC,WAAAA,6BAA6B,IAAI;AAAA,IACjC;AAAA,IACAC,WAAAA,qBAAqB,KAAK;AAAA,IAC1BC,WAAAA,yBAAyB,KAAK;AAAA,IAC9B;AAAA,MACI,aAAa;AAAA,MACb,eAAe,CAAC;AAAA,MAChB,aAAa;AAAA,IAAA;AAAA,EAErB;AAGI,SAAAL,iCAAA,cAAC,aAAW,GAAG,WAAW,WAAW,eAAe,aAAU,QAAO,IAAA,GAChE,QACL;AAER,CAAC;;"}

package/dist/components/Typography/Text.js

@@ -1,10 +1,18 @@
 import * as React from "react";
-import { omitPropsRuntime } from "../../utils/props.js";
 import cn from "clsx";
 import { TYPOGRAPHY_BASE_CLASSES, TYPOGRAPHY_TEXT_SIZE_CLASSES, TYPOGRAPHY_COLOR_MAP, TYPOGRAPHY_ALIGN_CLASSES } from "../../utils/typography.js";
 const Text = React.forwardRef(function Text2(props, ref) {
-  const { size = "md", as = "p", bold = false, color = "primary", align = "start", children, ...rest } = props;
-  const restProps = omitPropsRuntime(rest, ["className", "style"]);
+  const {
+    size = "md",
+    as = "p",
+    bold = false,
+    color = "primary",
+    align = "start",
+    children,
+    className: _className,
+    style: _style,
+    ...restProps
+  } = props;
   const Component = as;
   const resetListMarker = as === "li";
   const textLineHeightClass = size === "md" ? "leading-snug" : "leading-normal";

package/dist/components/Typography/Text.js.map

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../../../src/components/Typography/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport { omitPropsRuntime } from '../../utils/props';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_TEXT_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type TextSize = 'sm' | 'md' | 'lg';\nexport type TextAs = 'p' | 'li' | 'dt' | 'dd' | 'span';\nexport type TextColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type TextAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {\n    size?: TextSize;\n    as?: TextAs;\n    bold?: boolean;\n    color?: TextColor;\n    align?: TextAlign;\n    children: React.ReactNode;\n};\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(function Text(props, ref) {\n    const { size = 'md', as = 'p', bold = false, color = 'primary', align = 'start', children, ...rest } = props;\n    const restProps = omitPropsRuntime(rest, ['className', 'style']);\n    const Component = as;\n    const resetListMarker = as === 'li';\n    const textLineHeightClass = size === 'md' ? 'leading-snug' : 'leading-normal';\n    const textClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        TYPOGRAPHY_TEXT_SIZE_CLASSES[size],\n        textLineHeightClass,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align],\n        {\n            'font-bold': bold,\n            'font-normal': !bold,\n            'list-none': resetListMarker,\n        }\n    );\n\n    return (\n        <Component {...restProps} className={textClassName} data-taco=\"text\" ref={ref as any}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["Text"],"mappings":";;;;AAwBO,MAAM,OAAO,MAAM,WAAmC,SAASA,MAAK,OAAO,KAAK;AACnF,QAAM,EAAE,OAAO,MAAM,KAAK,KAAK,OAAO,OAAO,QAAQ,WAAW,QAAQ,SAAS,UAAU,GAAG,KAAS,IAAA;AACvG,QAAM,YAAY,iBAAiB,MAAM,CAAC,aAAa,OAAO,CAAC;AAC/D,QAAM,YAAY;AAClB,QAAM,kBAAkB,OAAO;AACzB,QAAA,sBAAsB,SAAS,OAAO,iBAAiB;AAC7D,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA,6BAA6B,IAAI;AAAA,IACjC;AAAA,IACA,qBAAqB,KAAK;AAAA,IAC1B,yBAAyB,KAAK;AAAA,IAC9B;AAAA,MACI,aAAa;AAAA,MACb,eAAe,CAAC;AAAA,MAChB,aAAa;AAAA,IAAA;AAAA,EAErB;AAGI,SAAA,sBAAA,cAAC,aAAW,GAAG,WAAW,WAAW,eAAe,aAAU,QAAO,IAAA,GAChE,QACL;AAER,CAAC;"}
+{"version":3,"file":"Text.js","sources":["../../../src/components/Typography/Text.tsx"],"sourcesContent":["import * as React from 'react';\nimport cn from 'clsx';\nimport {\n    TYPOGRAPHY_ALIGN_CLASSES,\n    TYPOGRAPHY_BASE_CLASSES,\n    TYPOGRAPHY_COLOR_MAP,\n    TYPOGRAPHY_TEXT_SIZE_CLASSES,\n} from '../../utils/typography';\n\nexport type TextSize = 'sm' | 'md' | 'lg';\nexport type TextAs = 'p' | 'li' | 'dt' | 'dd' | 'span';\nexport type TextColor = keyof typeof TYPOGRAPHY_COLOR_MAP;\nexport type TextAlign = keyof typeof TYPOGRAPHY_ALIGN_CLASSES;\n\nexport type TextProps = Omit<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {\n    size?: TextSize;\n    as?: TextAs;\n    bold?: boolean;\n    color?: TextColor;\n    align?: TextAlign;\n    children: React.ReactNode;\n};\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(function Text(props, ref) {\n    // In cases where people ignoring the type errors and still passing in className and style, we destructure them to make sure they're not applied.\n    const {\n        size = 'md',\n        as = 'p',\n        bold = false,\n        color = 'primary',\n        align = 'start',\n        children,\n        className: _className,\n        style: _style,\n        ...restProps\n    } = props as TextProps & { className?: string; style?: React.CSSProperties };\n\n    const Component = as;\n    const resetListMarker = as === 'li';\n    const textLineHeightClass = size === 'md' ? 'leading-snug' : 'leading-normal';\n    const textClassName = cn(\n        TYPOGRAPHY_BASE_CLASSES,\n        TYPOGRAPHY_TEXT_SIZE_CLASSES[size],\n        textLineHeightClass,\n        TYPOGRAPHY_COLOR_MAP[color],\n        TYPOGRAPHY_ALIGN_CLASSES[align],\n        {\n            'font-bold': bold,\n            'font-normal': !bold,\n            'list-none': resetListMarker,\n        }\n    );\n\n    return (\n        <Component {...restProps} className={textClassName} data-taco=\"text\" ref={ref as any}>\n            {children}\n        </Component>\n    );\n});\n"],"names":["Text"],"mappings":";;;AAuBO,MAAM,OAAO,MAAM,WAAmC,SAASA,MAAK,OAAO,KAAK;AAE7E,QAAA;AAAA,IACF,OAAO;AAAA,IACP,KAAK;AAAA,IACL,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP,GAAG;AAAA,EAAA,IACH;AAEJ,QAAM,YAAY;AAClB,QAAM,kBAAkB,OAAO;AACzB,QAAA,sBAAsB,SAAS,OAAO,iBAAiB;AAC7D,QAAM,gBAAgB;AAAA,IAClB;AAAA,IACA,6BAA6B,IAAI;AAAA,IACjC;AAAA,IACA,qBAAqB,KAAK;AAAA,IAC1B,yBAAyB,KAAK;AAAA,IAC9B;AAAA,MACI,aAAa;AAAA,MACb,eAAe,CAAC;AAAA,MAChB,aAAa;AAAA,IAAA;AAAA,EAErB;AAGI,SAAA,sBAAA,cAAC,aAAW,GAAG,WAAW,WAAW,eAAe,aAAU,QAAO,IAAA,GAChE,QACL;AAER,CAAC;"}

package/dist/index.cjs

@@ -76,6 +76,7 @@ const useTableDataLoader2 = require("./primitives/Table/useTableDataLoader2.cjs"
 const date = require("./utils/date.cjs");
 const keyboard = require("./utils/keyboard.cjs");
 const mergeRefs = require("./utils/mergeRefs.cjs");
+const useDialogScope = require("./components/Dialog/useDialogScope.cjs");
 const useBoundaryOverflowDetection = require("./hooks/useBoundaryOverflowDetection.cjs");
 const useBoundingClientRectListener = require("./hooks/useBoundingClientRectListener.cjs");
 const useIntersectionObserver = require("./hooks/useIntersectionObserver.cjs");
@@ -189,6 +190,7 @@ exports.isMacOs = keyboard.isMacOs;
 exports.isPressingMetaKey = keyboard.isPressingMetaKey;
 exports.shouldTriggerShortcut = keyboard.shouldTriggerShortcut;
 exports.mergeRefs = mergeRefs.mergeRefs;
+exports.useDialogScope = useDialogScope.useDialogScope;
 exports.useBoundaryOverflowDetection = useBoundaryOverflowDetection.useBoundaryOverflowDetection;
 exports.useBoundingClientRectListener = useBoundingClientRectListener.useBoundingClientRectListener;
 exports.useIntersectionObserver = useIntersectionObserver.useIntersectionObserver;

package/dist/index.cjs.map

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

package/dist/index.d.ts

@@ -74,6 +74,7 @@ export * from './primitives/Table/useTableDataLoader2';
 export * from './utils/date';
 export * from './utils/keyboard';
 export * from './utils/mergeRefs';
+export * from './components/Dialog/useDialogScope';
 export * from './hooks/useBoundaryOverflowDetection';
 export * from './hooks/useBoundingClientRectListener';
 export * from './hooks/useIntersectionObserver';

package/dist/index.js

@@ -74,6 +74,7 @@ import { useTableDataLoader2 } from "./primitives/Table/useTableDataLoader2.js";
 import { format, isWeakEqual, parse, parseFromCustomString, parseFromISOString } from "./utils/date.js";
 import { createShortcutKeyDownHandler, isMacOs, isPressingMetaKey, shouldTriggerShortcut } from "./utils/keyboard.js";
 import { mergeRefs } from "./utils/mergeRefs.js";
+import { useDialogScope } from "./components/Dialog/useDialogScope.js";
 import { useBoundaryOverflowDetection } from "./hooks/useBoundaryOverflowDetection.js";
 import { useBoundingClientRectListener } from "./hooks/useBoundingClientRectListener.js";
 import { useIntersectionObserver } from "./hooks/useIntersectionObserver.js";
@@ -200,6 +201,7 @@ export {
   shouldTriggerShortcut,
   useBoundaryOverflowDetection,
   useBoundingClientRectListener,
+  useDialogScope,
   useDropTarget,
   useIntersectionObserver,
   useIsLargeScreen,

package/dist/index.js.map

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

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@economic/taco",
-    "version": "8.0.0",
+    "version": "8.1.0-EC-80345-test-release.0",
     "license": "MIT",
     "type": "module",
     "main": "./dist/index.cjs",
@@ -43,7 +43,7 @@
         "@dnd-kit/modifiers": "^7.0.0",
         "@dnd-kit/sortable": "^7.0.2",
         "@dnd-kit/utilities": "^3.2.2",
-        "@economic/taco-tokens": "^2.2.3",
+        "@economic/taco-tokens": "^2.2.4-EC-80345-test-release.0",
         "@radix-ui/react-popover": "1.0.2",
         "@radix-ui/react-scroll-area": "1.2.10",
         "@react-aria/focus": "^3.19.0",
@@ -54,7 +54,7 @@
         "date-fns": "^3.6.0",
         "framer-motion": "12.38.0",
         "lodash": "^4.17.21",
-        "nanoid": "^5.1.9",
+        "nanoid": "^5.1.11",
         "react-aria-components": "^1.7.1",
         "react-day-picker": "^9.11.0",
         "react-intersection-observer": "^9.4.0",
@@ -71,13 +71,13 @@
         "tailwindcss": ">=3.4.19"
     },
     "devDependencies": {
-        "@oxlint/plugins": "^1.60.0",
+        "@oxlint/plugins": "^1.66.0",
         "@svgr/cli": "^5.5.0",
         "@testing-library/jest-dom": "6.9.1",
         "@testing-library/react": "16.3.2",
         "@testing-library/user-event": "14.6.1",
         "@types/lodash": "^4.17.24",
-        "@types/node": "^22.19.18",
+        "@types/node": "^22.19.19",
         "@types/react": "18.3.28",
         "@types/react-dom": "18.3.7",
         "@types/react-table": "^7.7.20",
@@ -87,7 +87,7 @@
         "jsdom": "^26.1.0",
         "resize-observer-polyfill": "^1.5.1",
         "rimraf": "^3.0.2",
-        "stylelint": "^17.11.0",
+        "stylelint": "^17.12.0",
         "svgo": "^1.3.2",
         "tailwindcss": "^3.4.19",
         "typescript": "^5.9.3",
@@ -97,7 +97,7 @@
         "vitest": "^3.2.4"
     },
     "optionalDependencies": {
-        "@rollup/rollup-linux-x64-gnu": "^4.60.3"
+        "@rollup/rollup-linux-x64-gnu": "^4.60.4"
     },
-    "gitHead": "fa584b5a1771faa292cac60eaf64616160beb198"
+    "gitHead": "abad712229237c7e5bcc73bdf7d0f8b131939ce0"
 }

package/dist/utils/props.cjs

@@ -1,11 +0,0 @@
-"use strict";
-Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const omitPropsRuntime = (props, keys) => {
-  const result = { ...props };
-  keys.forEach((key) => {
-    delete result[key];
-  });
-  return result;
-};
-exports.omitPropsRuntime = omitPropsRuntime;
-//# sourceMappingURL=props.cjs.map

package/dist/utils/props.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"props.cjs","sources":["../../src/utils/props.ts"],"sourcesContent":["/**\n * Generic utility to omit specific keys from a props object at runtime.\n * Useful when you need to exclude certain props before spreading.\n */\nexport const omitPropsRuntime = <T extends Record<string, any>, K extends keyof any>(props: T, keys: K[]): Omit<T, K> => {\n    const result = { ...props };\n    keys.forEach(key => {\n        delete (result as any)[key];\n    });\n    return result as Omit<T, K>;\n};\n"],"names":[],"mappings":";;AAIa,MAAA,mBAAmB,CAAqD,OAAU,SAA0B;AAC/G,QAAA,SAAS,EAAE,GAAG,MAAM;AAC1B,OAAK,QAAQ,CAAO,QAAA;AAChB,WAAQ,OAAe,GAAG;AAAA,EAAA,CAC7B;AACM,SAAA;AACX;;"}

package/dist/utils/props.d.ts

@@ -1,5 +0,0 @@
-/**
- * Generic utility to omit specific keys from a props object at runtime.
- * Useful when you need to exclude certain props before spreading.
- */
-export declare const omitPropsRuntime: <T extends Record<string, any>, K extends keyof any>(props: T, keys: K[]) => Omit<T, K>;

package/dist/utils/props.js

@@ -1,11 +0,0 @@
-const omitPropsRuntime = (props, keys) => {
-  const result = { ...props };
-  keys.forEach((key) => {
-    delete result[key];
-  });
-  return result;
-};
-export {
-  omitPropsRuntime
-};
-//# sourceMappingURL=props.js.map

package/dist/utils/props.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"props.js","sources":["../../src/utils/props.ts"],"sourcesContent":["/**\n * Generic utility to omit specific keys from a props object at runtime.\n * Useful when you need to exclude certain props before spreading.\n */\nexport const omitPropsRuntime = <T extends Record<string, any>, K extends keyof any>(props: T, keys: K[]): Omit<T, K> => {\n    const result = { ...props };\n    keys.forEach(key => {\n        delete (result as any)[key];\n    });\n    return result as Omit<T, K>;\n};\n"],"names":[],"mappings":"AAIa,MAAA,mBAAmB,CAAqD,OAAU,SAA0B;AAC/G,QAAA,SAAS,EAAE,GAAG,MAAM;AAC1B,OAAK,QAAQ,CAAO,QAAA;AAChB,WAAQ,OAAe,GAAG;AAAA,EAAA,CAC7B;AACM,SAAA;AACX;"}