@economic/taco 11.0.0 → 11.0.1-react-v19.0

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport { useControlled } from '../../hooks/useControlled';\nimport { isElementInsideTable3OrReport } from '../../utils/dom';\n\nimport type { MenuCheckboxItemProps } from './components/Checkbox';\nimport { Checkbox } from './components/Checkbox';\nimport type { MenuContentProps } from './components/Content';\nimport { Content } from './components/Content';\nimport type { MenuGroupProps } from './components/Group';\nimport { Group } from './components/Group';\nimport type { MenuHeaderProps } from './components/Header';\nimport { Header } from './components/Header';\nimport type { MenuItemProps } from './components/Item';\nimport { Item } from './components/Item';\nimport type { MenuLinkItemProps } from './components/Link';\nimport { Link } from './components/Link';\nimport type { ForwardedMenuRadioGroupWithStatics } from './components/RadioGroup';\nimport { RadioGroup } from './components/RadioGroup';\nimport type { MenuSeparatorProps } from './components/Separator';\nimport { Separator } from './components/Separator';\nimport type { MenuSubMenuProps } from './components/SubMenu';\nimport { SubMenu } from './components/SubMenu';\nimport type { MenuTriggerProps } from './components/Trigger';\nimport { Trigger } from './components/Trigger';\nimport { MenuContext } from './Context';\n\nexport type MenuProps = {\n    children: React.ReactNode;\n    /** Set whether the menu is open by default or not  */\n    defaultOpen?: boolean;\n    /** Called when the menu opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the menu from outside the component  */\n    open?: boolean;\n    /** ID of the trigger the menu is associated with (controlled mode) */\n    triggerId?: string | null;\n    /** A trigger to be used for the menu, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n};\nexport type ForwardedMenuWithStatics = React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<MenuTriggerProps>;\n    Content: React.ForwardRefExoticComponent<MenuContentProps>;\n    Item: React.ForwardRefExoticComponent<MenuItemProps>;\n    Link: React.ForwardRefExoticComponent<MenuLinkItemProps>;\n    Checkbox: React.ForwardRefExoticComponent<MenuCheckboxItemProps>;\n    Separator: React.ForwardRefExoticComponent<MenuSeparatorProps>;\n    Group: React.ForwardRefExoticComponent<MenuGroupProps>;\n    Header: React.ForwardRefExoticComponent<MenuHeaderProps>;\n    RadioGroup: ForwardedMenuRadioGroupWithStatics;\n    SubMenu: React.ForwardRefExoticComponent<MenuSubMenuProps>;\n};\n\nexport const Menu = React.forwardRef<HTMLButtonElement, MenuProps>(function Menu(externalProps, _ref) {\n    const { children, defaultOpen, onChange, open: openProp, trigger, ...props } = externalProps;\n    const [indented, setIndented] = React.useState(false);\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\n    const [open, setOpen] = useControlled<boolean>({\n        defaultValue: defaultOpen ?? false,\n        onChange,\n        value: openProp,\n    });\n    const [dialogState, setDialogState] = React.useState<{ open: boolean; render: (() => React.ReactElement) | null }>({\n        open: false,\n        render: null,\n    });\n\n    const triggerRef = React.useRef<HTMLButtonElement>(null);\n\n    const closeDialog = React.useCallback(() => {\n        setDialogState({ open: false, render: null });\n        triggerRef.current?.focus();\n    }, []);\n\n    const context = React.useMemo(\n        () => ({\n            indented,\n            registerIndentation: () => setIndented(true),\n            minWidth,\n            setMinWidth: (width: number) => setMinWidth(width),\n            open: () => setOpen(true),\n            close: () => setOpen(false),\n            // Dialog state management - survives menu close\n            dialogState,\n            openDialog: (render: () => React.ReactElement) => {\n                setDialogState({ open: true, render });\n                setOpen(false);\n            },\n            closeDialog,\n            // Trigger ref for focus management after dialog closes\n            triggerRef,\n        }),\n        [indented, minWidth, setOpen, dialogState, closeDialog]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: MenuPrimitive.Root.ChangeEventDetails) => {\n        const event = eventDetails.event as KeyboardEvent;\n        const triggerElement = eventDetails.trigger ?? (event?.currentTarget as Element | null);\n        const isTableHeaderOrCellMenu = isElementInsideTable3OrReport(triggerElement);\n\n        // In Table3 header/cell contexts, ArrowUp/ArrowDown should keep driving table row navigation.\n        // Cancel only the menu open transition for these keys so the key event can still bubble to the table.\n        if (open && (event.key === 'ArrowUp' || event.key === 'ArrowDown') && isTableHeaderOrCellMenu) {\n            eventDetails.cancel();\n            return;\n        }\n        setOpen(open);\n    };\n\n    return (\n        <MenuContext.Provider value={context}>\n            <MenuPrimitive.Root {...props} open={open} onOpenChange={handleOpenChange}>\n                {trigger && <Trigger ref={triggerRef}>{trigger}</Trigger>}\n                {children}\n            </MenuPrimitive.Root>\n            {/* Render dialog outside menu tree - state survives menu close */}\n            {dialogState.open && dialogState.render && dialogState.render()}\n        </MenuContext.Provider>\n    );\n}) as ForwardedMenuWithStatics;\nMenu.Trigger = Trigger;\nMenu.Content = Content;\nMenu.Item = Item;\nMenu.Link = Link;\nMenu.Checkbox = Checkbox;\nMenu.Separator = Separator;\nMenu.Group = Group;\nMenu.Header = Header;\nMenu.RadioGroup = RadioGroup;\nMenu.SubMenu = SubMenu;\n\nexport type {\n    MenuItemProps,\n    MenuContentProps,\n    MenuLinkItemProps,\n    MenuTriggerProps,\n    MenuCheckboxItemProps,\n    MenuSeparatorProps,\n    MenuGroupProps,\n    MenuHeaderProps,\n    MenuSubMenuProps,\n};\n"],"names":["Menu","open","MenuPrimitive"],"mappings":";;;;;;;;;;;;;;;AAsDO,MAAM,OAAO,MAAM,WAAyC,SAASA,MAAK,eAAe,MAAM;AAClG,QAAM,EAAE,UAAU,aAAa,UAAU,MAAM,UAAU,SAAS,GAAG,MAAA,IAAU;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAAS,KAAK;AACpD,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAA6B,MAAS;AAC5E,QAAM,CAAC,MAAM,OAAO,IAAI,cAAuB;AAAA,IAC3C,cAAc,eAAe;AAAA,IAC7B;AAAA,IACA,OAAO;AAAA,EAAA,CACV;AACD,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAuE;AAAA,IAC/G,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA,CACX;AAED,QAAM,aAAa,MAAM,OAA0B,IAAI;AAEvD,QAAM,cAAc,MAAM,YAAY,MAAM;AACxC,mBAAe,EAAE,MAAM,OAAO,QAAQ,MAAM;AAC5C,eAAW,SAAS,MAAA;AAAA,EACxB,GAAG,CAAA,CAAE;AAEL,QAAM,UAAU,MAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA,qBAAqB,MAAM,YAAY,IAAI;AAAA,MAC3C;AAAA,MACA,aAAa,CAAC,UAAkB,YAAY,KAAK;AAAA,MACjD,MAAM,MAAM,QAAQ,IAAI;AAAA,MACxB,OAAO,MAAM,QAAQ,KAAK;AAAA;AAAA,MAE1B;AAAA,MACA,YAAY,CAAC,WAAqC;AAC9C,uBAAe,EAAE,MAAM,MAAM,OAAA,CAAQ;AACrC,gBAAQ,KAAK;AAAA,MACjB;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,UAAU,SAAS,aAAa,WAAW;AAAA,EAAA;AAG1D,QAAM,mBAAmB,CAACC,OAAe,iBAAwD;AAC7F,UAAM,QAAQ,aAAa;AAC3B,UAAM,iBAAiB,aAAa,WAAY,OAAO;AACvD,UAAM,0BAA0B,8BAA8B,cAAc;AAI5E,QAAIA,UAAS,MAAM,QAAQ,aAAa,MAAM,QAAQ,gBAAgB,yBAAyB;AAC3F,mBAAa,OAAA;AACb;AAAA,IACJ;AACA,YAAQA,KAAI;AAAA,EAChB;AAEA,SACI,sBAAA,cAAC,YAAY,UAAZ,EAAqB,OAAO,QAAA,GACzB,sBAAA,cAACC,OAAc,MAAd,EAAoB,GAAG,OAAO,MAAY,cAAc,iBAAA,GACpD,WAAW,sBAAA,cAAC,SAAA,EAAQ,KAAK,WAAA,GAAa,OAAQ,GAC9C,QACL,GAEC,YAAY,QAAQ,YAAY,UAAU,YAAY,QAC3D;AAER,CAAC;AACD,KAAK,UAAU;AACf,KAAK,UAAU;AACf,KAAK,OAAO;AACZ,KAAK,OAAO;AACZ,KAAK,WAAW;AAChB,KAAK,YAAY;AACjB,KAAK,QAAQ;AACb,KAAK,SAAS;AACd,KAAK,aAAa;AAClB,KAAK,UAAU;"}
+{"version":3,"file":"Menu.js","sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport { useControlled } from '../../hooks/useControlled';\nimport { isElementInsideTable3OrReport } from '../../utils/dom';\n\nimport type { MenuCheckboxItemProps } from './components/Checkbox';\nimport { Checkbox } from './components/Checkbox';\nimport type { MenuContentProps } from './components/Content';\nimport { Content } from './components/Content';\nimport type { MenuGroupProps } from './components/Group';\nimport { Group } from './components/Group';\nimport type { MenuHeaderProps } from './components/Header';\nimport { Header } from './components/Header';\nimport type { MenuItemProps } from './components/Item';\nimport { Item } from './components/Item';\nimport type { MenuLinkItemProps } from './components/Link';\nimport { Link } from './components/Link';\nimport type { ForwardedMenuRadioGroupWithStatics } from './components/RadioGroup';\nimport { RadioGroup } from './components/RadioGroup';\nimport type { MenuSeparatorProps } from './components/Separator';\nimport { Separator } from './components/Separator';\nimport type { MenuSubMenuProps } from './components/SubMenu';\nimport { SubMenu } from './components/SubMenu';\nimport type { MenuTriggerProps } from './components/Trigger';\nimport { Trigger } from './components/Trigger';\nimport { MenuContext } from './Context';\n\nexport type MenuProps = {\n    children: React.ReactNode;\n    /** Set whether the menu is open by default or not  */\n    defaultOpen?: boolean;\n    /** Called when the menu opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n    /** Control the open state of the menu from outside the component  */\n    open?: boolean;\n    /** ID of the trigger the menu is associated with (controlled mode) */\n    triggerId?: string | null;\n    /** A trigger to be used for the menu, should not be set if `children` already contains a trigger */\n    trigger?: React.JSX.Element;\n};\nexport type ForwardedMenuWithStatics = React.ForwardRefExoticComponent<MenuProps & React.RefAttributes<HTMLElement>> & {\n    Trigger: React.ForwardRefExoticComponent<MenuTriggerProps>;\n    Content: React.ForwardRefExoticComponent<MenuContentProps>;\n    Item: React.ForwardRefExoticComponent<MenuItemProps>;\n    Link: React.ForwardRefExoticComponent<MenuLinkItemProps>;\n    Checkbox: React.ForwardRefExoticComponent<MenuCheckboxItemProps>;\n    Separator: React.ForwardRefExoticComponent<MenuSeparatorProps>;\n    Group: React.ForwardRefExoticComponent<MenuGroupProps>;\n    Header: React.ForwardRefExoticComponent<MenuHeaderProps>;\n    RadioGroup: ForwardedMenuRadioGroupWithStatics;\n    SubMenu: React.ForwardRefExoticComponent<MenuSubMenuProps>;\n};\n\nexport const Menu = React.forwardRef<HTMLButtonElement, MenuProps>(function Menu(externalProps, _ref) {\n    const { children, defaultOpen, onChange, open: openProp, trigger, ...props } = externalProps;\n    const [indented, setIndented] = React.useState(false);\n    const [minWidth, setMinWidth] = React.useState<number | undefined>(undefined);\n    const [open, setOpen] = useControlled<boolean>({\n        defaultValue: defaultOpen ?? false,\n        onChange,\n        value: openProp,\n    });\n    const [dialogState, setDialogState] = React.useState<{ open: boolean; render: (() => React.ReactElement) | null }>({\n        open: false,\n        render: null,\n    });\n\n    const triggerRef = React.useRef<HTMLButtonElement>(null);\n\n    const closeDialog = React.useCallback(() => {\n        setDialogState({ open: false, render: null });\n        triggerRef.current?.focus();\n    }, []);\n\n    const context = React.useMemo(\n        () => ({\n            indented,\n            registerIndentation: () => setIndented(true),\n            minWidth,\n            setMinWidth: (width: number) => setMinWidth(width),\n            open: () => setOpen(true),\n            close: () => setOpen(false),\n            // Dialog state management - survives menu close\n            dialogState,\n            openDialog: (render: () => React.ReactElement) => {\n                setDialogState({ open: true, render });\n                setOpen(false);\n            },\n            closeDialog,\n            // Trigger ref for focus management after dialog closes\n            triggerRef,\n        }),\n        [indented, minWidth, setOpen, dialogState, closeDialog]\n    );\n\n    const handleOpenChange = (open: boolean, eventDetails: MenuPrimitive.Root.ChangeEventDetails) => {\n        const event = eventDetails.event as KeyboardEvent;\n        const triggerElement = eventDetails.trigger ?? (event?.currentTarget as Element | null);\n        const isTableHeaderOrCellMenu = isElementInsideTable3OrReport(triggerElement);\n\n        // In Table3 header/cell contexts, ArrowUp/ArrowDown should keep driving table row navigation.\n        // Cancel only the menu open transition for these keys so the key event can still bubble to the table.\n        if (open && (event.key === 'ArrowUp' || event.key === 'ArrowDown') && isTableHeaderOrCellMenu) {\n            eventDetails.cancel();\n            return;\n        }\n        setOpen(open);\n    };\n\n    return (\n        <MenuContext.Provider value={context}>\n            <MenuPrimitive.Root {...props} open={open} onOpenChange={handleOpenChange}>\n                {trigger && <Trigger ref={triggerRef}>{trigger}</Trigger>}\n                {children}\n            </MenuPrimitive.Root>\n            {/* Render dialog outside menu tree - state survives menu close */}\n            {dialogState.open && dialogState.render && dialogState.render()}\n        </MenuContext.Provider>\n    );\n}) as ForwardedMenuWithStatics;\nMenu.Trigger = Trigger;\nMenu.Content = Content;\nMenu.Item = Item;\nMenu.Link = Link;\nMenu.Checkbox = Checkbox;\nMenu.Separator = Separator;\nMenu.Group = Group;\nMenu.Header = Header;\nMenu.RadioGroup = RadioGroup;\nMenu.SubMenu = SubMenu;\n\nexport type {\n    MenuItemProps,\n    MenuContentProps,\n    MenuLinkItemProps,\n    MenuTriggerProps,\n    MenuCheckboxItemProps,\n    MenuSeparatorProps,\n    MenuGroupProps,\n    MenuHeaderProps,\n    MenuSubMenuProps,\n};\n"],"names":["Menu","open","MenuPrimitive"],"mappings":";;;;;;;;;;;;;;;AAsDO,MAAM,OAAO,MAAM,WAAyC,SAASA,MAAK,eAAe,MAAM;AAClG,QAAM,EAAE,UAAU,aAAa,UAAU,MAAM,UAAU,SAAS,GAAG,MAAA,IAAU;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAAS,KAAK;AACpD,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAA6B,MAAS;AAC5E,QAAM,CAAC,MAAM,OAAO,IAAI,cAAuB;AAAA,IAC3C,cAAc,eAAe;AAAA,IAC7B;AAAA,IACA,OAAO;AAAA,EAAA,CACV;AACD,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAuE;AAAA,IAC/G,MAAM;AAAA,IACN,QAAQ;AAAA,EAAA,CACX;AAED,QAAM,aAAa,MAAM,OAA0B,IAAI;AAEvD,QAAM,cAAc,MAAM,YAAY,MAAM;AACxC,mBAAe,EAAE,MAAM,OAAO,QAAQ,MAAM;AAC5C,eAAW,SAAS,MAAA;AAAA,EACxB,GAAG,CAAA,CAAE;AAEL,QAAM,UAAU,MAAM;AAAA,IAClB,OAAO;AAAA,MACH;AAAA,MACA,qBAAqB,MAAM,YAAY,IAAI;AAAA,MAC3C;AAAA,MACA,aAAa,CAAC,UAAkB,YAAY,KAAK;AAAA,MACjD,MAAM,MAAM,QAAQ,IAAI;AAAA,MACxB,OAAO,MAAM,QAAQ,KAAK;AAAA;AAAA,MAE1B;AAAA,MACA,YAAY,CAAC,WAAqC;AAC9C,uBAAe,EAAE,MAAM,MAAM,OAAA,CAAQ;AACrC,gBAAQ,KAAK;AAAA,MACjB;AAAA,MACA;AAAA;AAAA,MAEA;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,UAAU,SAAS,aAAa,WAAW;AAAA,EAAA;AAG1D,QAAM,mBAAmB,CAACC,OAAe,iBAAwD;AAC7F,UAAM,QAAQ,aAAa;AAC3B,UAAM,iBAAiB,aAAa,WAAY,OAAO;AACvD,UAAM,0BAA0B,8BAA8B,cAAc;AAI5E,QAAIA,UAAS,MAAM,QAAQ,aAAa,MAAM,QAAQ,gBAAgB,yBAAyB;AAC3F,mBAAa,OAAA;AACb;AAAA,IACJ;AACA,YAAQA,KAAI;AAAA,EAChB;AAEA,SACI,sBAAA,cAAC,YAAY,UAAZ,EAAqB,OAAO,QAAA,GACzB,sBAAA,cAACC,OAAc,MAAd,EAAoB,GAAG,OAAO,MAAY,cAAc,iBAAA,GACpD,WAAW,sBAAA,cAAC,SAAA,EAAQ,KAAK,WAAA,GAAa,OAAQ,GAC9C,QACL,GAEC,YAAY,QAAQ,YAAY,UAAU,YAAY,QAC3D;AAER,CAAC;AACD,KAAK,UAAU;AACf,KAAK,UAAU;AACf,KAAK,OAAO;AACZ,KAAK,OAAO;AACZ,KAAK,WAAW;AAChB,KAAK,YAAY;AACjB,KAAK,QAAQ;AACb,KAAK,SAAS;AACd,KAAK,aAAa;AAClB,KAAK,UAAU;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport type { Align, Placement } from '../../../types';\nimport { createShortcutKeyDownHandler } from '../../../utils/keyboard';\nimport { useCurrentMenu } from '../Context';\n\nimport type { MenuItemProps } from './Item';\n\nexport type MenuContentProps = Omit<React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>, 'children' | 'side'> & {\n    align?: Align;\n    children: React.ReactNode;\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\n\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { align = 'start', children: _1, placement: side, ...otherProps } = props;\n    const className = cn(\n        'block rounded border border-transparent bg-white p-1 text-black outline-none yt-shadow',\n        props.className\n    );\n\n    // attach refs to each child\n    const childrenRefs = React.useRef<React.RefObject<HTMLDivElement>[]>([]);\n    const childrenWithRefs = (React.Children.toArray(props.children) as React.ReactElement<MenuItemProps & { ref: any }>[])\n        .filter(child => !!child) // remove falsey children\n        .map((child, index) => {\n            childrenRefs.current[index] = React.createRef<HTMLDivElement>();\n            return React.cloneElement(child, { ref: childrenRefs.current[index] });\n        });\n\n    // register any shortcuts attached to children\n    React.useEffect(() => {\n        const shortcuts: ((event: KeyboardEvent) => void)[] = [];\n        childrenWithRefs.forEach((child, index) => {\n            if (child.props.shortcut) {\n                shortcuts.push(\n                    createShortcutKeyDownHandler(child.props.shortcut, event => {\n                        event.preventDefault();\n\n                        const dialog = document.querySelector('[role=\"dialog\"]');\n\n                        // Don't trigger the shortcut if it is outside of the dialog\n                        if (dialog && !dialog?.contains(internalRef.current)) {\n                            return;\n                        }\n\n                        menu?.open();\n                        setTimeout(() => childrenRefs.current[index]?.current?.click(), 1);\n                    })\n                );\n            }\n        });\n\n        // Use capture phase to intercept events before Base UI menu items can stop propagation\n        shortcuts.forEach(handler => document.addEventListener('keydown', handler, { capture: true }));\n\n        return () => {\n            shortcuts.forEach(handler => document.removeEventListener('keydown', handler, { capture: true }));\n        };\n    }, []);\n\n    return (\n        <MenuPrimitive.Portal>\n            <MenuPrimitive.Positioner align={align} side={side} sideOffset={3}>\n                <MenuPrimitive.Popup\n                    {...otherProps}\n                    className={className}\n                    data-taco=\"menu\"\n                    style={{ minWidth: menu?.minWidth }}\n                    ref={internalRef}>\n                    {childrenWithRefs}\n                </MenuPrimitive.Popup>\n            </MenuPrimitive.Positioner>\n        </MenuPrimitive.Portal>\n    );\n});\n"],"names":["React","useMergedRef","menu","useCurrentMenu","createShortcutKeyDownHandler","MenuPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,UAAUA,iBAAM,WAAW,SAAS,YAAY,OAAyB,KAAgC;AAClH,QAAM,cAAcC,aAAAA,aAAkB,GAAG;AACzC,QAAMC,SAAOC,QAAAA,eAAA;AACb,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM,GAAG,WAAA,IAAe;AAC1E,QAAM,YAAY;AAAA,IACd;AAAA,IACA,MAAM;AAAA,EAAA;AAIV,QAAM,eAAeH,iBAAM,OAA0C,EAAE;AACvE,QAAM,mBAAoBA,iBAAM,SAAS,QAAQ,MAAM,QAAQ,EAC1D,OAAO,CAAA,UAAS,CAAC,CAAC,KAAK,EACvB,IAAI,CAAC,OAAO,UAAU;AACnB,iBAAa,QAAQ,KAAK,IAAIA,iBAAM,UAAA;AACpC,WAAOA,iBAAM,aAAa,OAAO,EAAE,KAAK,aAAa,QAAQ,KAAK,GAAG;AAAA,EACzE,CAAC;AAGLA,mBAAM,UAAU,MAAM;AAClB,UAAM,YAAgD,CAAA;AACtD,qBAAiB,QAAQ,CAAC,OAAO,UAAU;AACvC,UAAI,MAAM,MAAM,UAAU;AACtB,kBAAU;AAAA,UACNI,SAAAA,6BAA6B,MAAM,MAAM,UAAU,CAAA,UAAS;AACxD,kBAAM,eAAA;AAEN,kBAAM,SAAS,SAAS,cAAc,iBAAiB;AAGvD,gBAAI,UAAU,CAAC,QAAQ,SAAS,YAAY,OAAO,GAAG;AAClD;AAAA,YACJ;AAEAF,oBAAM,KAAA;AACN,uBAAW,MAAM,aAAa,QAAQ,KAAK,GAAG,SAAS,MAAA,GAAS,CAAC;AAAA,UACrE,CAAC;AAAA,QAAA;AAAA,MAET;AAAA,IACJ,CAAC;AAGD,cAAU,QAAQ,CAAA,YAAW,SAAS,iBAAiB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAE7F,WAAO,MAAM;AACT,gBAAU,QAAQ,CAAA,YAAW,SAAS,oBAAoB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACpG;AAAA,EACJ,GAAG,CAAA,CAAE;AAEL,SACIF,iCAAA,cAACK,KAAAA,KAAc,QAAd,MACGL,iCAAA,cAACK,KAAAA,KAAc,YAAd,EAAyB,OAAc,MAAY,YAAY,EAAA,GAC5DL,iCAAA;AAAA,IAACK,KAAAA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,OAAO,EAAE,UAAUH,QAAM,SAAA;AAAA,MACzB,KAAK;AAAA,IAAA;AAAA,IACJ;AAAA,EAAA,CAET,CACJ;AAER,CAAC;;"}
+{"version":3,"file":"Content.cjs","sources":["../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport type { Align, Placement } from '../../../types';\nimport { createShortcutKeyDownHandler } from '../../../utils/keyboard';\nimport { useCurrentMenu } from '../Context';\n\nimport type { MenuItemProps } from './Item';\n\nexport type MenuContentProps = Omit<React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>, 'children' | 'side'> & {\n    align?: Align;\n    children: React.ReactNode;\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\n\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { align = 'start', children: _1, placement: side, ...otherProps } = props;\n    const className = cn(\n        'block rounded border border-transparent bg-white p-1 text-black outline-none yt-shadow',\n        props.className\n    );\n\n    // attach refs to each child\n    const childrenRefs = React.useRef<React.RefObject<HTMLDivElement | null>[]>([]);\n    const childrenWithRefs = (React.Children.toArray(props.children) as React.ReactElement<MenuItemProps & { ref: any }>[])\n        .filter(child => !!child) // remove falsey children\n        .map((child, index) => {\n            childrenRefs.current[index] = React.createRef<HTMLDivElement>();\n            return React.cloneElement(child, { ref: childrenRefs.current[index] });\n        });\n\n    // register any shortcuts attached to children\n    React.useEffect(() => {\n        const shortcuts: ((event: KeyboardEvent) => void)[] = [];\n        childrenWithRefs.forEach((child, index) => {\n            if (child.props.shortcut) {\n                shortcuts.push(\n                    createShortcutKeyDownHandler(child.props.shortcut, event => {\n                        event.preventDefault();\n\n                        const dialog = document.querySelector('[role=\"dialog\"]');\n\n                        // Don't trigger the shortcut if it is outside of the dialog\n                        if (dialog && !dialog?.contains(internalRef.current)) {\n                            return;\n                        }\n\n                        menu?.open();\n                        setTimeout(() => childrenRefs.current[index]?.current?.click(), 1);\n                    })\n                );\n            }\n        });\n\n        // Use capture phase to intercept events before Base UI menu items can stop propagation\n        shortcuts.forEach(handler => document.addEventListener('keydown', handler, { capture: true }));\n\n        return () => {\n            shortcuts.forEach(handler => document.removeEventListener('keydown', handler, { capture: true }));\n        };\n    }, []);\n\n    return (\n        <MenuPrimitive.Portal>\n            <MenuPrimitive.Positioner align={align} side={side} sideOffset={3}>\n                <MenuPrimitive.Popup\n                    {...otherProps}\n                    className={className}\n                    data-taco=\"menu\"\n                    style={{ minWidth: menu?.minWidth }}\n                    ref={internalRef}>\n                    {childrenWithRefs}\n                </MenuPrimitive.Popup>\n            </MenuPrimitive.Positioner>\n        </MenuPrimitive.Portal>\n    );\n});\n"],"names":["React","useMergedRef","menu","useCurrentMenu","createShortcutKeyDownHandler","MenuPrimitive"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,UAAUA,iBAAM,WAAW,SAAS,YAAY,OAAyB,KAAgC;AAClH,QAAM,cAAcC,aAAAA,aAAkB,GAAG;AACzC,QAAMC,SAAOC,QAAAA,eAAA;AACb,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM,GAAG,WAAA,IAAe;AAC1E,QAAM,YAAY;AAAA,IACd;AAAA,IACA,MAAM;AAAA,EAAA;AAIV,QAAM,eAAeH,iBAAM,OAAiD,EAAE;AAC9E,QAAM,mBAAoBA,iBAAM,SAAS,QAAQ,MAAM,QAAQ,EAC1D,OAAO,CAAA,UAAS,CAAC,CAAC,KAAK,EACvB,IAAI,CAAC,OAAO,UAAU;AACnB,iBAAa,QAAQ,KAAK,IAAIA,iBAAM,UAAA;AACpC,WAAOA,iBAAM,aAAa,OAAO,EAAE,KAAK,aAAa,QAAQ,KAAK,GAAG;AAAA,EACzE,CAAC;AAGLA,mBAAM,UAAU,MAAM;AAClB,UAAM,YAAgD,CAAA;AACtD,qBAAiB,QAAQ,CAAC,OAAO,UAAU;AACvC,UAAI,MAAM,MAAM,UAAU;AACtB,kBAAU;AAAA,UACNI,SAAAA,6BAA6B,MAAM,MAAM,UAAU,CAAA,UAAS;AACxD,kBAAM,eAAA;AAEN,kBAAM,SAAS,SAAS,cAAc,iBAAiB;AAGvD,gBAAI,UAAU,CAAC,QAAQ,SAAS,YAAY,OAAO,GAAG;AAClD;AAAA,YACJ;AAEAF,oBAAM,KAAA;AACN,uBAAW,MAAM,aAAa,QAAQ,KAAK,GAAG,SAAS,MAAA,GAAS,CAAC;AAAA,UACrE,CAAC;AAAA,QAAA;AAAA,MAET;AAAA,IACJ,CAAC;AAGD,cAAU,QAAQ,CAAA,YAAW,SAAS,iBAAiB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAE7F,WAAO,MAAM;AACT,gBAAU,QAAQ,CAAA,YAAW,SAAS,oBAAoB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACpG;AAAA,EACJ,GAAG,CAAA,CAAE;AAEL,SACIF,iCAAA,cAACK,KAAAA,KAAc,QAAd,MACGL,iCAAA,cAACK,KAAAA,KAAc,YAAd,EAAyB,OAAc,MAAY,YAAY,EAAA,GAC5DL,iCAAA;AAAA,IAACK,KAAAA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,OAAO,EAAE,UAAUH,QAAM,SAAA;AAAA,MACzB,KAAK;AAAA,IAAA;AAAA,IACJ;AAAA,EAAA,CAET,CACJ;AAER,CAAC;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"Content.js","sources":["../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport type { Align, Placement } from '../../../types';\nimport { createShortcutKeyDownHandler } from '../../../utils/keyboard';\nimport { useCurrentMenu } from '../Context';\n\nimport type { MenuItemProps } from './Item';\n\nexport type MenuContentProps = Omit<React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>, 'children' | 'side'> & {\n    align?: Align;\n    children: React.ReactNode;\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\n\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { align = 'start', children: _1, placement: side, ...otherProps } = props;\n    const className = cn(\n        'block rounded border border-transparent bg-white p-1 text-black outline-none yt-shadow',\n        props.className\n    );\n\n    // attach refs to each child\n    const childrenRefs = React.useRef<React.RefObject<HTMLDivElement>[]>([]);\n    const childrenWithRefs = (React.Children.toArray(props.children) as React.ReactElement<MenuItemProps & { ref: any }>[])\n        .filter(child => !!child) // remove falsey children\n        .map((child, index) => {\n            childrenRefs.current[index] = React.createRef<HTMLDivElement>();\n            return React.cloneElement(child, { ref: childrenRefs.current[index] });\n        });\n\n    // register any shortcuts attached to children\n    React.useEffect(() => {\n        const shortcuts: ((event: KeyboardEvent) => void)[] = [];\n        childrenWithRefs.forEach((child, index) => {\n            if (child.props.shortcut) {\n                shortcuts.push(\n                    createShortcutKeyDownHandler(child.props.shortcut, event => {\n                        event.preventDefault();\n\n                        const dialog = document.querySelector('[role=\"dialog\"]');\n\n                        // Don't trigger the shortcut if it is outside of the dialog\n                        if (dialog && !dialog?.contains(internalRef.current)) {\n                            return;\n                        }\n\n                        menu?.open();\n                        setTimeout(() => childrenRefs.current[index]?.current?.click(), 1);\n                    })\n                );\n            }\n        });\n\n        // Use capture phase to intercept events before Base UI menu items can stop propagation\n        shortcuts.forEach(handler => document.addEventListener('keydown', handler, { capture: true }));\n\n        return () => {\n            shortcuts.forEach(handler => document.removeEventListener('keydown', handler, { capture: true }));\n        };\n    }, []);\n\n    return (\n        <MenuPrimitive.Portal>\n            <MenuPrimitive.Positioner align={align} side={side} sideOffset={3}>\n                <MenuPrimitive.Popup\n                    {...otherProps}\n                    className={className}\n                    data-taco=\"menu\"\n                    style={{ minWidth: menu?.minWidth }}\n                    ref={internalRef}>\n                    {childrenWithRefs}\n                </MenuPrimitive.Popup>\n            </MenuPrimitive.Positioner>\n        </MenuPrimitive.Portal>\n    );\n});\n"],"names":["MenuPrimitive"],"mappings":";;;;;;AAkBO,MAAM,UAAU,MAAM,WAAW,SAAS,YAAY,OAAyB,KAAgC;AAClH,QAAM,cAAc,aAAkB,GAAG;AACzC,QAAM,OAAO,eAAA;AACb,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM,GAAG,WAAA,IAAe;AAC1E,QAAM,YAAY;AAAA,IACd;AAAA,IACA,MAAM;AAAA,EAAA;AAIV,QAAM,eAAe,MAAM,OAA0C,EAAE;AACvE,QAAM,mBAAoB,MAAM,SAAS,QAAQ,MAAM,QAAQ,EAC1D,OAAO,CAAA,UAAS,CAAC,CAAC,KAAK,EACvB,IAAI,CAAC,OAAO,UAAU;AACnB,iBAAa,QAAQ,KAAK,IAAI,MAAM,UAAA;AACpC,WAAO,MAAM,aAAa,OAAO,EAAE,KAAK,aAAa,QAAQ,KAAK,GAAG;AAAA,EACzE,CAAC;AAGL,QAAM,UAAU,MAAM;AAClB,UAAM,YAAgD,CAAA;AACtD,qBAAiB,QAAQ,CAAC,OAAO,UAAU;AACvC,UAAI,MAAM,MAAM,UAAU;AACtB,kBAAU;AAAA,UACN,6BAA6B,MAAM,MAAM,UAAU,CAAA,UAAS;AACxD,kBAAM,eAAA;AAEN,kBAAM,SAAS,SAAS,cAAc,iBAAiB;AAGvD,gBAAI,UAAU,CAAC,QAAQ,SAAS,YAAY,OAAO,GAAG;AAClD;AAAA,YACJ;AAEA,kBAAM,KAAA;AACN,uBAAW,MAAM,aAAa,QAAQ,KAAK,GAAG,SAAS,MAAA,GAAS,CAAC;AAAA,UACrE,CAAC;AAAA,QAAA;AAAA,MAET;AAAA,IACJ,CAAC;AAGD,cAAU,QAAQ,CAAA,YAAW,SAAS,iBAAiB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAE7F,WAAO,MAAM;AACT,gBAAU,QAAQ,CAAA,YAAW,SAAS,oBAAoB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACpG;AAAA,EACJ,GAAG,CAAA,CAAE;AAEL,SACI,sBAAA,cAACA,KAAc,QAAd,MACG,sBAAA,cAACA,KAAc,YAAd,EAAyB,OAAc,MAAY,YAAY,EAAA,GAC5D,sBAAA;AAAA,IAACA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,OAAO,EAAE,UAAU,MAAM,SAAA;AAAA,MACzB,KAAK;AAAA,IAAA;AAAA,IACJ;AAAA,EAAA,CAET,CACJ;AAER,CAAC;"}
+{"version":3,"file":"Content.js","sources":["../../../../src/components/Menu/components/Content.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport { useMergedRef } from '../../../hooks/useMergedRef';\nimport type { Align, Placement } from '../../../types';\nimport { createShortcutKeyDownHandler } from '../../../utils/keyboard';\nimport { useCurrentMenu } from '../Context';\n\nimport type { MenuItemProps } from './Item';\n\nexport type MenuContentProps = Omit<React.ComponentPropsWithoutRef<typeof MenuPrimitive.Popup>, 'children' | 'side'> & {\n    align?: Align;\n    children: React.ReactNode;\n    /** Set the position of the Menu relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\n\nexport const Content = React.forwardRef(function MenuContent(props: MenuContentProps, ref: React.Ref<HTMLDivElement>) {\n    const internalRef = useMergedRef<any>(ref);\n    const menu = useCurrentMenu();\n    const { align = 'start', children: _1, placement: side, ...otherProps } = props;\n    const className = cn(\n        'block rounded border border-transparent bg-white p-1 text-black outline-none yt-shadow',\n        props.className\n    );\n\n    // attach refs to each child\n    const childrenRefs = React.useRef<React.RefObject<HTMLDivElement | null>[]>([]);\n    const childrenWithRefs = (React.Children.toArray(props.children) as React.ReactElement<MenuItemProps & { ref: any }>[])\n        .filter(child => !!child) // remove falsey children\n        .map((child, index) => {\n            childrenRefs.current[index] = React.createRef<HTMLDivElement>();\n            return React.cloneElement(child, { ref: childrenRefs.current[index] });\n        });\n\n    // register any shortcuts attached to children\n    React.useEffect(() => {\n        const shortcuts: ((event: KeyboardEvent) => void)[] = [];\n        childrenWithRefs.forEach((child, index) => {\n            if (child.props.shortcut) {\n                shortcuts.push(\n                    createShortcutKeyDownHandler(child.props.shortcut, event => {\n                        event.preventDefault();\n\n                        const dialog = document.querySelector('[role=\"dialog\"]');\n\n                        // Don't trigger the shortcut if it is outside of the dialog\n                        if (dialog && !dialog?.contains(internalRef.current)) {\n                            return;\n                        }\n\n                        menu?.open();\n                        setTimeout(() => childrenRefs.current[index]?.current?.click(), 1);\n                    })\n                );\n            }\n        });\n\n        // Use capture phase to intercept events before Base UI menu items can stop propagation\n        shortcuts.forEach(handler => document.addEventListener('keydown', handler, { capture: true }));\n\n        return () => {\n            shortcuts.forEach(handler => document.removeEventListener('keydown', handler, { capture: true }));\n        };\n    }, []);\n\n    return (\n        <MenuPrimitive.Portal>\n            <MenuPrimitive.Positioner align={align} side={side} sideOffset={3}>\n                <MenuPrimitive.Popup\n                    {...otherProps}\n                    className={className}\n                    data-taco=\"menu\"\n                    style={{ minWidth: menu?.minWidth }}\n                    ref={internalRef}>\n                    {childrenWithRefs}\n                </MenuPrimitive.Popup>\n            </MenuPrimitive.Positioner>\n        </MenuPrimitive.Portal>\n    );\n});\n"],"names":["MenuPrimitive"],"mappings":";;;;;;AAkBO,MAAM,UAAU,MAAM,WAAW,SAAS,YAAY,OAAyB,KAAgC;AAClH,QAAM,cAAc,aAAkB,GAAG;AACzC,QAAM,OAAO,eAAA;AACb,QAAM,EAAE,QAAQ,SAAS,UAAU,IAAI,WAAW,MAAM,GAAG,WAAA,IAAe;AAC1E,QAAM,YAAY;AAAA,IACd;AAAA,IACA,MAAM;AAAA,EAAA;AAIV,QAAM,eAAe,MAAM,OAAiD,EAAE;AAC9E,QAAM,mBAAoB,MAAM,SAAS,QAAQ,MAAM,QAAQ,EAC1D,OAAO,CAAA,UAAS,CAAC,CAAC,KAAK,EACvB,IAAI,CAAC,OAAO,UAAU;AACnB,iBAAa,QAAQ,KAAK,IAAI,MAAM,UAAA;AACpC,WAAO,MAAM,aAAa,OAAO,EAAE,KAAK,aAAa,QAAQ,KAAK,GAAG;AAAA,EACzE,CAAC;AAGL,QAAM,UAAU,MAAM;AAClB,UAAM,YAAgD,CAAA;AACtD,qBAAiB,QAAQ,CAAC,OAAO,UAAU;AACvC,UAAI,MAAM,MAAM,UAAU;AACtB,kBAAU;AAAA,UACN,6BAA6B,MAAM,MAAM,UAAU,CAAA,UAAS;AACxD,kBAAM,eAAA;AAEN,kBAAM,SAAS,SAAS,cAAc,iBAAiB;AAGvD,gBAAI,UAAU,CAAC,QAAQ,SAAS,YAAY,OAAO,GAAG;AAClD;AAAA,YACJ;AAEA,kBAAM,KAAA;AACN,uBAAW,MAAM,aAAa,QAAQ,KAAK,GAAG,SAAS,MAAA,GAAS,CAAC;AAAA,UACrE,CAAC;AAAA,QAAA;AAAA,MAET;AAAA,IACJ,CAAC;AAGD,cAAU,QAAQ,CAAA,YAAW,SAAS,iBAAiB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAE7F,WAAO,MAAM;AACT,gBAAU,QAAQ,CAAA,YAAW,SAAS,oBAAoB,WAAW,SAAS,EAAE,SAAS,KAAA,CAAM,CAAC;AAAA,IACpG;AAAA,EACJ,GAAG,CAAA,CAAE;AAEL,SACI,sBAAA,cAACA,KAAc,QAAd,MACG,sBAAA,cAACA,KAAc,YAAd,EAAyB,OAAc,MAAY,YAAY,EAAA,GAC5D,sBAAA;AAAA,IAACA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MACJ;AAAA,MACA,aAAU;AAAA,MACV,OAAO,EAAE,UAAU,MAAM,SAAA;AAAA,MACzB,KAAK;AAAA,IAAA;AAAA,IACJ;AAAA,EAAA,CAET,CACJ;AAER,CAAC;"}

package/dist/components/Menu/components/Item.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Item.cjs","sources":["../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { KeyDownHandlerOptions } from '../../../utils/keyboard';\nimport type { DialogProps } from '../../Dialog/Dialog';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { Shortcut } from '../../Shortcut/Shortcut';\nimport { useCurrentMenu } from '../Context';\n\nexport const Icon = ({ name }: { name: IconName }) => (\n    // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nexport const useItemStyling = ({\n    disabled,\n    indented,\n    className,\n}: {\n    disabled?: boolean;\n    indented: boolean;\n    className?: string;\n}) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'group relative flex h-8 w-full items-center justify-start rounded pr-1.5 focus:outline-none',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            /* TODO: Why have both hover and data-[highlighted]? */\n            /* shadow-none on hover is to prevent the focus style from showing up on hover */\n            'cursor-pointer text-black hover:bg-gray-100 hover:text-black hover:!shadow-none focus-visible:yt-focus data-[highlighted]:bg-gray-100 data-[highlighted]:text-black':\n                !disabled,\n            'cursor-not-allowed text-gray-300 hover:bg-white': disabled,\n        },\n        className\n    );\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string | KeyDownHandlerOptions;\n    subMenu?: any;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, subMenu, ...otherProps } = props;\n    const menu = useCurrentMenu();\n\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = !!props.disabled || props['aria-disabled'] === true || props['aria-disabled'] === 'true';\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        event.stopPropagation();\n\n        // For dialog items, use menu context to manage state (survives menu close)\n        if (dialog && menu) {\n            menu.openDialog(() =>\n                dialog({\n                    open: true,\n                    onChange: (open: boolean) => {\n                        if (!open) menu.closeDialog();\n                    },\n                    onClose: () => menu.closeDialog(),\n                })\n            );\n            return;\n        }\n\n        // Call onClick handler\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    if (subMenu) {\n        return (\n            <MenuPrimitive.SubmenuRoot>\n                <MenuPrimitive.SubmenuTrigger {...otherProps} className={className} ref={ref}>\n                    {icon ? <Icon name={icon} /> : null}\n                    {props.children}\n                    <IconPrimitive className=\"-mr-1.5 ml-auto !h-5 !w-5\" name=\"chevron-right\" />\n                </MenuPrimitive.SubmenuTrigger>\n                {subMenu()}\n            </MenuPrimitive.SubmenuRoot>\n        );\n    }\n\n    const menuItem = (\n        <MenuPrimitive.Item\n            {...otherProps}\n            // Need to set aria-haspopup=\"dialog\" otherwise there is no way to know item opens the dialo (in e2e tests), and we need to know this to be able to test this scenario in e2e tests.\n            {...(dialog ? { 'aria-haspopup': 'dialog' } : {})}\n            className={className}\n            onClick={handleClick}\n            ref={ref}\n            disabled={disabled}>\n            {icon ? <Icon name={icon} /> : null}\n            {props.children}\n            {shortcut ? (\n                <span className=\"ml-auto pl-5\">\n                    <Shortcut keys={shortcut} className=\"text-gray-700\" />\n                </span>\n            ) : null}\n        </MenuPrimitive.Item>\n    );\n\n    return menuItem;\n});\n"],"names":["React","IconPrimitive","menu","useCurrentMenu","MenuPrimitive","Shortcut"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAWO,MAAM,OAAO,CAAC,EAAE,KAAA;AAAA;AAAA,EAEnBA,iCAAA,cAAC,UAAK,WAAU,uBAAA,kDACXC,OAAAA,MAAA,EAAc,WAAU,2BAA0B,KAAA,CAAY,CACnE;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACJ,MAIM;AACF,QAAMC,QAAOC,QAAAA,eAAA;AAEbH,mBAAM,UAAU,MAAM;AAClB,QAAI,YAAY,CAACE,OAAM,UAAU;AAC7B,MAAAA,OAAM,oBAAA;AAAA,IACV;AAAA,EACJ,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACH;AAAA,IACA;AAAA,MACI,QAAQA,OAAM;AAAA,MACd,UAAU,CAACA,OAAM;AAAA;AAAA;AAAA,MAGjB,uKACI,CAAC;AAAA,MACL,mDAAmD;AAAA,IAAA;AAAA,IAEvD;AAAA,EAAA;AAER;AAWO,MAAM,OAAOF,iBAAM,WAAW,SAAS,SAAS,OAAsB,KAAgC;AACzG,QAAM,EAAE,QAAQ,MAAM,SAAS,UAAU,SAAS,GAAG,eAAe;AACpE,QAAME,SAAOC,QAAAA,eAAA;AAEb,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU,MAAM;AAAA,IAChB,UAAU,CAAC,CAAC;AAAA,IACZ,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,QAAM,WAAW,CAAC,CAAC,MAAM,YAAY,MAAM,eAAe,MAAM,QAAQ,MAAM,eAAe,MAAM;AAEnG,QAAM,cAAc,CAAC,UAA4C;AAC7D,QAAI,UAAU;AACV,YAAM,eAAA;AACN;AAAA,IACJ;AAEA,UAAM,gBAAA;AAGN,QAAI,UAAUD,QAAM;AAChBA,aAAK;AAAA,QAAW,MACZ,OAAO;AAAA,UACH,MAAM;AAAA,UACN,UAAU,CAAC,SAAkB;AACzB,gBAAI,CAAC,KAAMA,QAAK,YAAA;AAAA,UACpB;AAAA,UACA,SAAS,MAAMA,OAAK,YAAA;AAAA,QAAY,CACnC;AAAA,MAAA;AAEL;AAAA,IACJ;AAGA,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,MAAI,SAAS;AACT,WACIF,iCAAA,cAACI,KAAAA,KAAc,aAAd,MACGJ,iCAAA,cAACI,KAAAA,KAAc,gBAAd,EAA8B,GAAG,YAAY,WAAsB,IAAA,GAC/D,OAAOJ,iCAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK,MAC9B,MAAM,UACPA,iCAAA,cAACC,OAAAA,MAAA,EAAc,WAAU,6BAA4B,MAAK,iBAAgB,CAC9E,GACC,SACL;AAAA,EAER;AAEA,QAAM,WACFD,iCAAA;AAAA,IAACI,KAAAA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MAEH,GAAI,SAAS,EAAE,iBAAiB,SAAA,IAAa,CAAA;AAAA,MAC9C;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IACC,OAAOJ,iCAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK;AAAA,IAC9B,MAAM;AAAA,IACN,WACGA,iCAAA,cAAC,QAAA,EAAK,WAAU,kBACZA,iCAAA,cAACK,SAAAA,UAAA,EAAS,MAAM,UAAU,WAAU,gBAAA,CAAgB,CACxD,IACA;AAAA,EAAA;AAIZ,SAAO;AACX,CAAC;;;;"}
+{"version":3,"file":"Item.cjs","sources":["../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { KeyDownHandlerOptions } from '../../../utils/keyboard';\nimport type { DialogProps } from '../../Dialog/Dialog';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { Shortcut } from '../../Shortcut/Shortcut';\nimport { useCurrentMenu } from '../Context';\n\nexport const Icon = ({ name }: { name: IconName }) => (\n    // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nexport const useItemStyling = ({\n    disabled,\n    indented,\n    className,\n}: {\n    disabled?: boolean;\n    indented: boolean;\n    className?: string;\n}) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'group relative flex h-8 w-full items-center justify-start rounded pr-1.5 focus:outline-none',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            /* TODO: Why have both hover and data-[highlighted]? */\n            /* shadow-none on hover is to prevent the focus style from showing up on hover */\n            'cursor-pointer text-black hover:bg-gray-100 hover:text-black hover:!shadow-none focus-visible:yt-focus data-[highlighted]:bg-gray-100 data-[highlighted]:text-black':\n                !disabled,\n            'cursor-not-allowed text-gray-300 hover:bg-white': disabled,\n        },\n        className\n    );\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => React.JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string | KeyDownHandlerOptions;\n    subMenu?: any;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, subMenu, ...otherProps } = props;\n    const menu = useCurrentMenu();\n\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = !!props.disabled || props['aria-disabled'] === true || props['aria-disabled'] === 'true';\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        event.stopPropagation();\n\n        // For dialog items, use menu context to manage state (survives menu close)\n        if (dialog && menu) {\n            menu.openDialog(() =>\n                dialog({\n                    open: true,\n                    onChange: (open: boolean) => {\n                        if (!open) menu.closeDialog();\n                    },\n                    onClose: () => menu.closeDialog(),\n                })\n            );\n            return;\n        }\n\n        // Call onClick handler\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    if (subMenu) {\n        return (\n            <MenuPrimitive.SubmenuRoot>\n                <MenuPrimitive.SubmenuTrigger {...otherProps} className={className} ref={ref}>\n                    {icon ? <Icon name={icon} /> : null}\n                    {props.children}\n                    <IconPrimitive className=\"-mr-1.5 ml-auto !h-5 !w-5\" name=\"chevron-right\" />\n                </MenuPrimitive.SubmenuTrigger>\n                {subMenu()}\n            </MenuPrimitive.SubmenuRoot>\n        );\n    }\n\n    const menuItem = (\n        <MenuPrimitive.Item\n            {...otherProps}\n            // Need to set aria-haspopup=\"dialog\" otherwise there is no way to know item opens the dialo (in e2e tests), and we need to know this to be able to test this scenario in e2e tests.\n            {...(dialog ? { 'aria-haspopup': 'dialog' } : {})}\n            className={className}\n            onClick={handleClick}\n            ref={ref}\n            disabled={disabled}>\n            {icon ? <Icon name={icon} /> : null}\n            {props.children}\n            {shortcut ? (\n                <span className=\"ml-auto pl-5\">\n                    <Shortcut keys={shortcut} className=\"text-gray-700\" />\n                </span>\n            ) : null}\n        </MenuPrimitive.Item>\n    );\n\n    return menuItem;\n});\n"],"names":["React","IconPrimitive","menu","useCurrentMenu","MenuPrimitive","Shortcut"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAWO,MAAM,OAAO,CAAC,EAAE,KAAA;AAAA;AAAA,EAEnBA,iCAAA,cAAC,UAAK,WAAU,uBAAA,kDACXC,OAAAA,MAAA,EAAc,WAAU,2BAA0B,KAAA,CAAY,CACnE;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACJ,MAIM;AACF,QAAMC,QAAOC,QAAAA,eAAA;AAEbH,mBAAM,UAAU,MAAM;AAClB,QAAI,YAAY,CAACE,OAAM,UAAU;AAC7B,MAAAA,OAAM,oBAAA;AAAA,IACV;AAAA,EACJ,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACH;AAAA,IACA;AAAA,MACI,QAAQA,OAAM;AAAA,MACd,UAAU,CAACA,OAAM;AAAA;AAAA;AAAA,MAGjB,uKACI,CAAC;AAAA,MACL,mDAAmD;AAAA,IAAA;AAAA,IAEvD;AAAA,EAAA;AAER;AAWO,MAAM,OAAOF,iBAAM,WAAW,SAAS,SAAS,OAAsB,KAAgC;AACzG,QAAM,EAAE,QAAQ,MAAM,SAAS,UAAU,SAAS,GAAG,eAAe;AACpE,QAAME,SAAOC,QAAAA,eAAA;AAEb,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU,MAAM;AAAA,IAChB,UAAU,CAAC,CAAC;AAAA,IACZ,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,QAAM,WAAW,CAAC,CAAC,MAAM,YAAY,MAAM,eAAe,MAAM,QAAQ,MAAM,eAAe,MAAM;AAEnG,QAAM,cAAc,CAAC,UAA4C;AAC7D,QAAI,UAAU;AACV,YAAM,eAAA;AACN;AAAA,IACJ;AAEA,UAAM,gBAAA;AAGN,QAAI,UAAUD,QAAM;AAChBA,aAAK;AAAA,QAAW,MACZ,OAAO;AAAA,UACH,MAAM;AAAA,UACN,UAAU,CAAC,SAAkB;AACzB,gBAAI,CAAC,KAAMA,QAAK,YAAA;AAAA,UACpB;AAAA,UACA,SAAS,MAAMA,OAAK,YAAA;AAAA,QAAY,CACnC;AAAA,MAAA;AAEL;AAAA,IACJ;AAGA,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,MAAI,SAAS;AACT,WACIF,iCAAA,cAACI,KAAAA,KAAc,aAAd,MACGJ,iCAAA,cAACI,KAAAA,KAAc,gBAAd,EAA8B,GAAG,YAAY,WAAsB,IAAA,GAC/D,OAAOJ,iCAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK,MAC9B,MAAM,UACPA,iCAAA,cAACC,OAAAA,MAAA,EAAc,WAAU,6BAA4B,MAAK,iBAAgB,CAC9E,GACC,SACL;AAAA,EAER;AAEA,QAAM,WACFD,iCAAA;AAAA,IAACI,KAAAA,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MAEH,GAAI,SAAS,EAAE,iBAAiB,SAAA,IAAa,CAAA;AAAA,MAC9C;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IACC,OAAOJ,iCAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK;AAAA,IAC9B,MAAM;AAAA,IACN,WACGA,iCAAA,cAAC,QAAA,EAAK,WAAU,kBACZA,iCAAA,cAACK,SAAAA,UAAA,EAAS,MAAM,UAAU,WAAU,gBAAA,CAAgB,CACxD,IACA;AAAA,EAAA;AAIZ,SAAO;AACX,CAAC;;;;"}

package/dist/components/Menu/components/Item.d.ts

@@ -11,7 +11,7 @@ export declare const useItemStyling: ({ disabled, indented, className, }: {
     className?: string;
 }) => string;
 export type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {
-    dialog?: (props: Partial<DialogProps>) => JSX.Element;
+    dialog?: (props: Partial<DialogProps>) => React.JSX.Element;
     disabled?: boolean;
     icon?: IconName;
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
@@ -19,7 +19,7 @@ export type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect
     subMenu?: any;
 };
 export declare const Item: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, "onSelect"> & {
-    dialog?: (props: Partial<DialogProps>) => JSX.Element;
+    dialog?: (props: Partial<DialogProps>) => React.JSX.Element;
     disabled?: boolean;
     icon?: IconName;
     onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;

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

@@ -1 +1 @@
-{"version":3,"file":"Item.js","sources":["../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { KeyDownHandlerOptions } from '../../../utils/keyboard';\nimport type { DialogProps } from '../../Dialog/Dialog';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { Shortcut } from '../../Shortcut/Shortcut';\nimport { useCurrentMenu } from '../Context';\n\nexport const Icon = ({ name }: { name: IconName }) => (\n    // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nexport const useItemStyling = ({\n    disabled,\n    indented,\n    className,\n}: {\n    disabled?: boolean;\n    indented: boolean;\n    className?: string;\n}) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'group relative flex h-8 w-full items-center justify-start rounded pr-1.5 focus:outline-none',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            /* TODO: Why have both hover and data-[highlighted]? */\n            /* shadow-none on hover is to prevent the focus style from showing up on hover */\n            'cursor-pointer text-black hover:bg-gray-100 hover:text-black hover:!shadow-none focus-visible:yt-focus data-[highlighted]:bg-gray-100 data-[highlighted]:text-black':\n                !disabled,\n            'cursor-not-allowed text-gray-300 hover:bg-white': disabled,\n        },\n        className\n    );\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string | KeyDownHandlerOptions;\n    subMenu?: any;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, subMenu, ...otherProps } = props;\n    const menu = useCurrentMenu();\n\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = !!props.disabled || props['aria-disabled'] === true || props['aria-disabled'] === 'true';\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        event.stopPropagation();\n\n        // For dialog items, use menu context to manage state (survives menu close)\n        if (dialog && menu) {\n            menu.openDialog(() =>\n                dialog({\n                    open: true,\n                    onChange: (open: boolean) => {\n                        if (!open) menu.closeDialog();\n                    },\n                    onClose: () => menu.closeDialog(),\n                })\n            );\n            return;\n        }\n\n        // Call onClick handler\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    if (subMenu) {\n        return (\n            <MenuPrimitive.SubmenuRoot>\n                <MenuPrimitive.SubmenuTrigger {...otherProps} className={className} ref={ref}>\n                    {icon ? <Icon name={icon} /> : null}\n                    {props.children}\n                    <IconPrimitive className=\"-mr-1.5 ml-auto !h-5 !w-5\" name=\"chevron-right\" />\n                </MenuPrimitive.SubmenuTrigger>\n                {subMenu()}\n            </MenuPrimitive.SubmenuRoot>\n        );\n    }\n\n    const menuItem = (\n        <MenuPrimitive.Item\n            {...otherProps}\n            // Need to set aria-haspopup=\"dialog\" otherwise there is no way to know item opens the dialo (in e2e tests), and we need to know this to be able to test this scenario in e2e tests.\n            {...(dialog ? { 'aria-haspopup': 'dialog' } : {})}\n            className={className}\n            onClick={handleClick}\n            ref={ref}\n            disabled={disabled}>\n            {icon ? <Icon name={icon} /> : null}\n            {props.children}\n            {shortcut ? (\n                <span className=\"ml-auto pl-5\">\n                    <Shortcut keys={shortcut} className=\"text-gray-700\" />\n                </span>\n            ) : null}\n        </MenuPrimitive.Item>\n    );\n\n    return menuItem;\n});\n"],"names":["IconPrimitive","MenuPrimitive"],"mappings":";;;;;;AAWO,MAAM,OAAO,CAAC,EAAE,KAAA;AAAA;AAAA,EAEnB,sBAAA,cAAC,UAAK,WAAU,uBAAA,uCACXA,QAAA,EAAc,WAAU,2BAA0B,KAAA,CAAY,CACnE;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACJ,MAIM;AACF,QAAM,OAAO,eAAA;AAEb,QAAM,UAAU,MAAM;AAClB,QAAI,YAAY,CAAC,MAAM,UAAU;AAC7B,YAAM,oBAAA;AAAA,IACV;AAAA,EACJ,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACH;AAAA,IACA;AAAA,MACI,QAAQ,MAAM;AAAA,MACd,UAAU,CAAC,MAAM;AAAA;AAAA;AAAA,MAGjB,uKACI,CAAC;AAAA,MACL,mDAAmD;AAAA,IAAA;AAAA,IAEvD;AAAA,EAAA;AAER;AAWO,MAAM,OAAO,MAAM,WAAW,SAAS,SAAS,OAAsB,KAAgC;AACzG,QAAM,EAAE,QAAQ,MAAM,SAAS,UAAU,SAAS,GAAG,eAAe;AACpE,QAAM,OAAO,eAAA;AAEb,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU,MAAM;AAAA,IAChB,UAAU,CAAC,CAAC;AAAA,IACZ,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,QAAM,WAAW,CAAC,CAAC,MAAM,YAAY,MAAM,eAAe,MAAM,QAAQ,MAAM,eAAe,MAAM;AAEnG,QAAM,cAAc,CAAC,UAA4C;AAC7D,QAAI,UAAU;AACV,YAAM,eAAA;AACN;AAAA,IACJ;AAEA,UAAM,gBAAA;AAGN,QAAI,UAAU,MAAM;AAChB,WAAK;AAAA,QAAW,MACZ,OAAO;AAAA,UACH,MAAM;AAAA,UACN,UAAU,CAAC,SAAkB;AACzB,gBAAI,CAAC,KAAM,MAAK,YAAA;AAAA,UACpB;AAAA,UACA,SAAS,MAAM,KAAK,YAAA;AAAA,QAAY,CACnC;AAAA,MAAA;AAEL;AAAA,IACJ;AAGA,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,MAAI,SAAS;AACT,WACI,sBAAA,cAACC,KAAc,aAAd,MACG,sBAAA,cAACA,KAAc,gBAAd,EAA8B,GAAG,YAAY,WAAsB,IAAA,GAC/D,OAAO,sBAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK,MAC9B,MAAM,UACP,sBAAA,cAACD,QAAA,EAAc,WAAU,6BAA4B,MAAK,iBAAgB,CAC9E,GACC,SACL;AAAA,EAER;AAEA,QAAM,WACF,sBAAA;AAAA,IAACC,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MAEH,GAAI,SAAS,EAAE,iBAAiB,SAAA,IAAa,CAAA;AAAA,MAC9C;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IACC,OAAO,sBAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK;AAAA,IAC9B,MAAM;AAAA,IACN,WACG,sBAAA,cAAC,QAAA,EAAK,WAAU,kBACZ,sBAAA,cAAC,UAAA,EAAS,MAAM,UAAU,WAAU,gBAAA,CAAgB,CACxD,IACA;AAAA,EAAA;AAIZ,SAAO;AACX,CAAC;"}
+{"version":3,"file":"Item.js","sources":["../../../../src/components/Menu/components/Item.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { KeyDownHandlerOptions } from '../../../utils/keyboard';\nimport type { DialogProps } from '../../Dialog/Dialog';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon as IconPrimitive } from '../../Icon/Icon';\nimport { Shortcut } from '../../Shortcut/Shortcut';\nimport { useCurrentMenu } from '../Context';\n\nexport const Icon = ({ name }: { name: IconName }) => (\n    // oxlint-disable-next-line taco/no-component-margin -- grandfathered; removing this margin is a visual breaking change\n    <span className=\"absolute left-0 ml-1\">\n        <IconPrimitive className=\"-ml-px -mt-px !h-5 !w-5\" name={name} />\n    </span>\n);\n\nexport const useItemStyling = ({\n    disabled,\n    indented,\n    className,\n}: {\n    disabled?: boolean;\n    indented: boolean;\n    className?: string;\n}) => {\n    const menu = useCurrentMenu();\n\n    React.useEffect(() => {\n        if (indented && !menu?.indented) {\n            menu?.registerIndentation();\n        }\n    }, [indented]);\n\n    return cn(\n        'group relative flex h-8 w-full items-center justify-start rounded pr-1.5 focus:outline-none',\n        {\n            'pl-7': menu?.indented,\n            'pl-1.5': !menu?.indented,\n            /* TODO: Why have both hover and data-[highlighted]? */\n            /* shadow-none on hover is to prevent the focus style from showing up on hover */\n            'cursor-pointer text-black hover:bg-gray-100 hover:text-black hover:!shadow-none focus-visible:yt-focus data-[highlighted]:bg-gray-100 data-[highlighted]:text-black':\n                !disabled,\n            'cursor-not-allowed text-gray-300 hover:bg-white': disabled,\n        },\n        className\n    );\n};\n\nexport type MenuItemProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> & {\n    dialog?: (props: Partial<DialogProps>) => React.JSX.Element;\n    disabled?: boolean;\n    icon?: IconName;\n    onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n    shortcut?: string | KeyDownHandlerOptions;\n    subMenu?: any;\n};\n\nexport const Item = React.forwardRef(function MenuItem(props: MenuItemProps, ref: React.Ref<HTMLDivElement>) {\n    const { dialog, icon, onClick, shortcut, subMenu, ...otherProps } = props;\n    const menu = useCurrentMenu();\n\n    const className = useItemStyling({\n        disabled: props.disabled,\n        indented: !!icon,\n        className: props.className,\n    });\n\n    const disabled = !!props.disabled || props['aria-disabled'] === true || props['aria-disabled'] === 'true';\n\n    const handleClick = (event: React.MouseEvent<HTMLDivElement>) => {\n        if (disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        event.stopPropagation();\n\n        // For dialog items, use menu context to manage state (survives menu close)\n        if (dialog && menu) {\n            menu.openDialog(() =>\n                dialog({\n                    open: true,\n                    onChange: (open: boolean) => {\n                        if (!open) menu.closeDialog();\n                    },\n                    onClose: () => menu.closeDialog(),\n                })\n            );\n            return;\n        }\n\n        // Call onClick handler\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    if (subMenu) {\n        return (\n            <MenuPrimitive.SubmenuRoot>\n                <MenuPrimitive.SubmenuTrigger {...otherProps} className={className} ref={ref}>\n                    {icon ? <Icon name={icon} /> : null}\n                    {props.children}\n                    <IconPrimitive className=\"-mr-1.5 ml-auto !h-5 !w-5\" name=\"chevron-right\" />\n                </MenuPrimitive.SubmenuTrigger>\n                {subMenu()}\n            </MenuPrimitive.SubmenuRoot>\n        );\n    }\n\n    const menuItem = (\n        <MenuPrimitive.Item\n            {...otherProps}\n            // Need to set aria-haspopup=\"dialog\" otherwise there is no way to know item opens the dialo (in e2e tests), and we need to know this to be able to test this scenario in e2e tests.\n            {...(dialog ? { 'aria-haspopup': 'dialog' } : {})}\n            className={className}\n            onClick={handleClick}\n            ref={ref}\n            disabled={disabled}>\n            {icon ? <Icon name={icon} /> : null}\n            {props.children}\n            {shortcut ? (\n                <span className=\"ml-auto pl-5\">\n                    <Shortcut keys={shortcut} className=\"text-gray-700\" />\n                </span>\n            ) : null}\n        </MenuPrimitive.Item>\n    );\n\n    return menuItem;\n});\n"],"names":["IconPrimitive","MenuPrimitive"],"mappings":";;;;;;AAWO,MAAM,OAAO,CAAC,EAAE,KAAA;AAAA;AAAA,EAEnB,sBAAA,cAAC,UAAK,WAAU,uBAAA,uCACXA,QAAA,EAAc,WAAU,2BAA0B,KAAA,CAAY,CACnE;AAAA;AAGG,MAAM,iBAAiB,CAAC;AAAA,EAC3B;AAAA,EACA;AAAA,EACA;AACJ,MAIM;AACF,QAAM,OAAO,eAAA;AAEb,QAAM,UAAU,MAAM;AAClB,QAAI,YAAY,CAAC,MAAM,UAAU;AAC7B,YAAM,oBAAA;AAAA,IACV;AAAA,EACJ,GAAG,CAAC,QAAQ,CAAC;AAEb,SAAO;AAAA,IACH;AAAA,IACA;AAAA,MACI,QAAQ,MAAM;AAAA,MACd,UAAU,CAAC,MAAM;AAAA;AAAA;AAAA,MAGjB,uKACI,CAAC;AAAA,MACL,mDAAmD;AAAA,IAAA;AAAA,IAEvD;AAAA,EAAA;AAER;AAWO,MAAM,OAAO,MAAM,WAAW,SAAS,SAAS,OAAsB,KAAgC;AACzG,QAAM,EAAE,QAAQ,MAAM,SAAS,UAAU,SAAS,GAAG,eAAe;AACpE,QAAM,OAAO,eAAA;AAEb,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU,MAAM;AAAA,IAChB,UAAU,CAAC,CAAC;AAAA,IACZ,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,QAAM,WAAW,CAAC,CAAC,MAAM,YAAY,MAAM,eAAe,MAAM,QAAQ,MAAM,eAAe,MAAM;AAEnG,QAAM,cAAc,CAAC,UAA4C;AAC7D,QAAI,UAAU;AACV,YAAM,eAAA;AACN;AAAA,IACJ;AAEA,UAAM,gBAAA;AAGN,QAAI,UAAU,MAAM;AAChB,WAAK;AAAA,QAAW,MACZ,OAAO;AAAA,UACH,MAAM;AAAA,UACN,UAAU,CAAC,SAAkB;AACzB,gBAAI,CAAC,KAAM,MAAK,YAAA;AAAA,UACpB;AAAA,UACA,SAAS,MAAM,KAAK,YAAA;AAAA,QAAY,CACnC;AAAA,MAAA;AAEL;AAAA,IACJ;AAGA,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,MAAI,SAAS;AACT,WACI,sBAAA,cAACC,KAAc,aAAd,MACG,sBAAA,cAACA,KAAc,gBAAd,EAA8B,GAAG,YAAY,WAAsB,IAAA,GAC/D,OAAO,sBAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK,MAC9B,MAAM,UACP,sBAAA,cAACD,QAAA,EAAc,WAAU,6BAA4B,MAAK,iBAAgB,CAC9E,GACC,SACL;AAAA,EAER;AAEA,QAAM,WACF,sBAAA;AAAA,IAACC,KAAc;AAAA,IAAd;AAAA,MACI,GAAG;AAAA,MAEH,GAAI,SAAS,EAAE,iBAAiB,SAAA,IAAa,CAAA;AAAA,MAC9C;AAAA,MACA,SAAS;AAAA,MACT;AAAA,MACA;AAAA,IAAA;AAAA,IACC,OAAO,sBAAA,cAAC,MAAA,EAAK,MAAM,MAAM,IAAK;AAAA,IAC9B,MAAM;AAAA,IACN,WACG,sBAAA,cAAC,QAAA,EAAK,WAAU,kBACZ,sBAAA,cAAC,UAAA,EAAS,MAAM,UAAU,WAAU,gBAAA,CAAgB,CACxD,IACA;AAAA,EAAA;AAIZ,SAAO;AACX,CAAC;"}

package/dist/components/Menu/components/RadioGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.cjs","sources":["../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport type { RadioGroupItemValue } from '../../RadioGroup/RadioGroup';\nimport { getRadioItemByValue } from '../../RadioGroup/util';\n\nimport { useItemStyling } from './Item';\n\ntype MenuRadioGroupContextType = {\n    disabled?: boolean;\n    value?: string;\n    onChange?: (value: string) => void;\n};\n\n// Context for the radio group used to pass the disabled state to the radio group items\n// This is needed because context from RadioGroup component context was removed after migration to react-aria\n// TODO: remove this context once this component will be migrated to react-aria\nconst MenuRadioGroupContext = React.createContext<MenuRadioGroupContextType>({});\n\n// item\nexport type MenuRadioGroupItemProps<T = HTMLDivElement> = Omit<React.HTMLAttributes<T>, 'children' | 'onSelect'> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /** Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\n    const { children, disabled, value, ...otherProps } = props;\n    const context = React.useContext(MenuRadioGroupContext);\n    const isDisabled = context.disabled || disabled;\n\n    const className = useItemStyling({\n        disabled: isDisabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <MenuPrimitive.RadioItem {...otherProps} className={className} disabled={isDisabled} value={String(value ?? '')}>\n            <MenuPrimitive.RadioItemIndicator className=\"absolute left-0 ml-1.5\">\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current\" />\n            </MenuPrimitive.RadioItemIndicator>\n            {children}\n        </MenuPrimitive.RadioItem>\n    );\n};\n\n// group\nexport type MenuRadioGroupProps = React.HTMLAttributes<HTMLDivElement> & {\n    disabled?: boolean;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value?: RadioGroupItemValue;\n};\n\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\n> & {\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\n};\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\n    const values = React.useMemo<RadioGroupItemValue[]>(() => {\n        const radioGroupItemValues: RadioGroupItemValue[] = [];\n\n        React.Children.forEach(props.children, child => {\n            if (React.isValidElement(child)) {\n                radioGroupItemValues.push(child.props.value);\n            }\n        });\n\n        return radioGroupItemValues;\n    }, [props.children]);\n\n    const handleChange = (value: string) => props.onChange(getRadioItemByValue(values, value));\n    const value = String(props.value ?? '');\n\n    return (\n        <MenuRadioGroupContext.Provider value={{ disabled: props.disabled, value, onChange: handleChange }}>\n            <MenuPrimitive.RadioGroup {...props} className=\"flex flex-col\" value={value} onValueChange={handleChange} ref={ref} />\n        </MenuRadioGroupContext.Provider>\n    );\n}) as ForwardedMenuRadioGroupWithStatics;\n\nRadioGroup.Item = RadioItem;\n"],"names":["React","useItemStyling","MenuPrimitive","value","getRadioItemByValue"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,wBAAwBA,iBAAM,cAAyC,EAAE;AAYxE,MAAM,YAAY,CAAC,UAAmC;AACzD,QAAM,EAAE,UAAU,UAAU,OAAO,GAAG,eAAe;AACrD,QAAM,UAAUA,iBAAM,WAAW,qBAAqB;AACtD,QAAM,aAAa,QAAQ,YAAY;AAEvC,QAAM,YAAYC,KAAAA,eAAe;AAAA,IAC7B,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,SACID,iCAAA,cAACE,KAAAA,KAAc,WAAd,EAAyB,GAAG,YAAY,WAAsB,UAAU,YAAY,OAAO,OAAO,SAAS,EAAE,KAC1GF,iCAAA,cAACE,KAAAA,KAAc,oBAAd,EAAiC,WAAU,yBAAA,GACxCF,iCAAA,cAAC,QAAA,EAAK,WAAU,gDAAA,CAAgD,CACpE,GACC,QACL;AAER;AAiBO,MAAM,aAAaA,iBAAM,WAAgD,SAAS,cAAc,OAAO,KAAK;AAC/G,QAAM,SAASA,iBAAM,QAA+B,MAAM;AACtD,UAAM,uBAA8C,CAAA;AAEpDA,qBAAM,SAAS,QAAQ,MAAM,UAAU,CAAA,UAAS;AAC5C,UAAIA,iBAAM,eAAe,KAAK,GAAG;AAC7B,6BAAqB,KAAK,MAAM,MAAM,KAAK;AAAA,MAC/C;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX,GAAG,CAAC,MAAM,QAAQ,CAAC;AAEnB,QAAM,eAAe,CAACG,WAAkB,MAAM,SAASC,yBAAoB,QAAQD,MAAK,CAAC;AACzF,QAAM,QAAQ,OAAO,MAAM,SAAS,EAAE;AAEtC,SACIH,iCAAA,cAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,MAAM,UAAU,OAAO,UAAU,aAAA,KAChFA,iCAAA,cAACE,KAAAA,KAAc,YAAd,EAA0B,GAAG,OAAO,WAAU,iBAAgB,OAAc,eAAe,cAAc,IAAA,CAAU,CACxH;AAER,CAAC;AAED,WAAW,OAAO;;;"}
+{"version":3,"file":"RadioGroup.cjs","sources":["../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport type { RadioGroupItemValue } from '../../RadioGroup/RadioGroup';\nimport { getRadioItemByValue } from '../../RadioGroup/util';\n\nimport { useItemStyling } from './Item';\n\ntype MenuRadioGroupContextType = {\n    disabled?: boolean;\n    value?: string;\n    onChange?: (value: string) => void;\n};\n\n// Context for the radio group used to pass the disabled state to the radio group items\n// This is needed because context from RadioGroup component context was removed after migration to react-aria\n// TODO: remove this context once this component will be migrated to react-aria\nconst MenuRadioGroupContext = React.createContext<MenuRadioGroupContextType>({});\n\n// item\nexport type MenuRadioGroupItemProps<T = HTMLDivElement> = Omit<React.HTMLAttributes<T>, 'children' | 'onSelect'> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /** Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\n    const { children, disabled, value, ...otherProps } = props;\n    const context = React.useContext(MenuRadioGroupContext);\n    const isDisabled = context.disabled || disabled;\n\n    const className = useItemStyling({\n        disabled: isDisabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <MenuPrimitive.RadioItem {...otherProps} className={className} disabled={isDisabled} value={String(value ?? '')}>\n            <MenuPrimitive.RadioItemIndicator className=\"absolute left-0 ml-1.5\">\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current\" />\n            </MenuPrimitive.RadioItemIndicator>\n            {children}\n        </MenuPrimitive.RadioItem>\n    );\n};\n\n// group\nexport type MenuRadioGroupProps = React.HTMLAttributes<HTMLDivElement> & {\n    disabled?: boolean;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value?: RadioGroupItemValue;\n};\n\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\n> & {\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\n};\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\n    const values = React.useMemo<RadioGroupItemValue[]>(() => {\n        const radioGroupItemValues: RadioGroupItemValue[] = [];\n\n        React.Children.forEach(props.children, child => {\n            if (React.isValidElement<{ value: RadioGroupItemValue }>(child)) {\n                radioGroupItemValues.push(child.props.value);\n            }\n        });\n\n        return radioGroupItemValues;\n    }, [props.children]);\n\n    const handleChange = (value: string) => props.onChange(getRadioItemByValue(values, value));\n    const value = String(props.value ?? '');\n\n    return (\n        <MenuRadioGroupContext.Provider value={{ disabled: props.disabled, value, onChange: handleChange }}>\n            <MenuPrimitive.RadioGroup {...props} className=\"flex flex-col\" value={value} onValueChange={handleChange} ref={ref} />\n        </MenuRadioGroupContext.Provider>\n    );\n}) as ForwardedMenuRadioGroupWithStatics;\n\nRadioGroup.Item = RadioItem;\n"],"names":["React","useItemStyling","MenuPrimitive","value","getRadioItemByValue"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAiBA,MAAM,wBAAwBA,iBAAM,cAAyC,EAAE;AAYxE,MAAM,YAAY,CAAC,UAAmC;AACzD,QAAM,EAAE,UAAU,UAAU,OAAO,GAAG,eAAe;AACrD,QAAM,UAAUA,iBAAM,WAAW,qBAAqB;AACtD,QAAM,aAAa,QAAQ,YAAY;AAEvC,QAAM,YAAYC,KAAAA,eAAe;AAAA,IAC7B,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,SACID,iCAAA,cAACE,KAAAA,KAAc,WAAd,EAAyB,GAAG,YAAY,WAAsB,UAAU,YAAY,OAAO,OAAO,SAAS,EAAE,KAC1GF,iCAAA,cAACE,KAAAA,KAAc,oBAAd,EAAiC,WAAU,yBAAA,GACxCF,iCAAA,cAAC,QAAA,EAAK,WAAU,gDAAA,CAAgD,CACpE,GACC,QACL;AAER;AAiBO,MAAM,aAAaA,iBAAM,WAAgD,SAAS,cAAc,OAAO,KAAK;AAC/G,QAAM,SAASA,iBAAM,QAA+B,MAAM;AACtD,UAAM,uBAA8C,CAAA;AAEpDA,qBAAM,SAAS,QAAQ,MAAM,UAAU,CAAA,UAAS;AAC5C,UAAIA,iBAAM,eAA+C,KAAK,GAAG;AAC7D,6BAAqB,KAAK,MAAM,MAAM,KAAK;AAAA,MAC/C;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX,GAAG,CAAC,MAAM,QAAQ,CAAC;AAEnB,QAAM,eAAe,CAACG,WAAkB,MAAM,SAASC,yBAAoB,QAAQD,MAAK,CAAC;AACzF,QAAM,QAAQ,OAAO,MAAM,SAAS,EAAE;AAEtC,SACIH,iCAAA,cAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,MAAM,UAAU,OAAO,UAAU,aAAA,KAChFA,iCAAA,cAACE,KAAAA,KAAc,YAAd,EAA0B,GAAG,OAAO,WAAU,iBAAgB,OAAc,eAAe,cAAc,IAAA,CAAU,CACxH;AAER,CAAC;AAED,WAAW,OAAO;;;"}

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

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","sources":["../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport type { RadioGroupItemValue } from '../../RadioGroup/RadioGroup';\nimport { getRadioItemByValue } from '../../RadioGroup/util';\n\nimport { useItemStyling } from './Item';\n\ntype MenuRadioGroupContextType = {\n    disabled?: boolean;\n    value?: string;\n    onChange?: (value: string) => void;\n};\n\n// Context for the radio group used to pass the disabled state to the radio group items\n// This is needed because context from RadioGroup component context was removed after migration to react-aria\n// TODO: remove this context once this component will be migrated to react-aria\nconst MenuRadioGroupContext = React.createContext<MenuRadioGroupContextType>({});\n\n// item\nexport type MenuRadioGroupItemProps<T = HTMLDivElement> = Omit<React.HTMLAttributes<T>, 'children' | 'onSelect'> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /** Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\n    const { children, disabled, value, ...otherProps } = props;\n    const context = React.useContext(MenuRadioGroupContext);\n    const isDisabled = context.disabled || disabled;\n\n    const className = useItemStyling({\n        disabled: isDisabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <MenuPrimitive.RadioItem {...otherProps} className={className} disabled={isDisabled} value={String(value ?? '')}>\n            <MenuPrimitive.RadioItemIndicator className=\"absolute left-0 ml-1.5\">\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current\" />\n            </MenuPrimitive.RadioItemIndicator>\n            {children}\n        </MenuPrimitive.RadioItem>\n    );\n};\n\n// group\nexport type MenuRadioGroupProps = React.HTMLAttributes<HTMLDivElement> & {\n    disabled?: boolean;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value?: RadioGroupItemValue;\n};\n\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\n> & {\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\n};\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\n    const values = React.useMemo<RadioGroupItemValue[]>(() => {\n        const radioGroupItemValues: RadioGroupItemValue[] = [];\n\n        React.Children.forEach(props.children, child => {\n            if (React.isValidElement(child)) {\n                radioGroupItemValues.push(child.props.value);\n            }\n        });\n\n        return radioGroupItemValues;\n    }, [props.children]);\n\n    const handleChange = (value: string) => props.onChange(getRadioItemByValue(values, value));\n    const value = String(props.value ?? '');\n\n    return (\n        <MenuRadioGroupContext.Provider value={{ disabled: props.disabled, value, onChange: handleChange }}>\n            <MenuPrimitive.RadioGroup {...props} className=\"flex flex-col\" value={value} onValueChange={handleChange} ref={ref} />\n        </MenuRadioGroupContext.Provider>\n    );\n}) as ForwardedMenuRadioGroupWithStatics;\n\nRadioGroup.Item = RadioItem;\n"],"names":["MenuPrimitive","value"],"mappings":";;;;AAiBA,MAAM,wBAAwB,MAAM,cAAyC,EAAE;AAYxE,MAAM,YAAY,CAAC,UAAmC;AACzD,QAAM,EAAE,UAAU,UAAU,OAAO,GAAG,eAAe;AACrD,QAAM,UAAU,MAAM,WAAW,qBAAqB;AACtD,QAAM,aAAa,QAAQ,YAAY;AAEvC,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,SACI,sBAAA,cAACA,KAAc,WAAd,EAAyB,GAAG,YAAY,WAAsB,UAAU,YAAY,OAAO,OAAO,SAAS,EAAE,KAC1G,sBAAA,cAACA,KAAc,oBAAd,EAAiC,WAAU,yBAAA,GACxC,sBAAA,cAAC,QAAA,EAAK,WAAU,gDAAA,CAAgD,CACpE,GACC,QACL;AAER;AAiBO,MAAM,aAAa,MAAM,WAAgD,SAAS,cAAc,OAAO,KAAK;AAC/G,QAAM,SAAS,MAAM,QAA+B,MAAM;AACtD,UAAM,uBAA8C,CAAA;AAEpD,UAAM,SAAS,QAAQ,MAAM,UAAU,CAAA,UAAS;AAC5C,UAAI,MAAM,eAAe,KAAK,GAAG;AAC7B,6BAAqB,KAAK,MAAM,MAAM,KAAK;AAAA,MAC/C;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX,GAAG,CAAC,MAAM,QAAQ,CAAC;AAEnB,QAAM,eAAe,CAACC,WAAkB,MAAM,SAAS,oBAAoB,QAAQA,MAAK,CAAC;AACzF,QAAM,QAAQ,OAAO,MAAM,SAAS,EAAE;AAEtC,SACI,sBAAA,cAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,MAAM,UAAU,OAAO,UAAU,aAAA,KAChF,sBAAA,cAACD,KAAc,YAAd,EAA0B,GAAG,OAAO,WAAU,iBAAgB,OAAc,eAAe,cAAc,IAAA,CAAU,CACxH;AAER,CAAC;AAED,WAAW,OAAO;"}
+{"version":3,"file":"RadioGroup.js","sources":["../../../../src/components/Menu/components/RadioGroup.tsx"],"sourcesContent":["import { Menu as MenuPrimitive } from '@base-ui/react/menu';\nimport * as React from 'react';\n\nimport type { RadioGroupItemValue } from '../../RadioGroup/RadioGroup';\nimport { getRadioItemByValue } from '../../RadioGroup/util';\n\nimport { useItemStyling } from './Item';\n\ntype MenuRadioGroupContextType = {\n    disabled?: boolean;\n    value?: string;\n    onChange?: (value: string) => void;\n};\n\n// Context for the radio group used to pass the disabled state to the radio group items\n// This is needed because context from RadioGroup component context was removed after migration to react-aria\n// TODO: remove this context once this component will be migrated to react-aria\nconst MenuRadioGroupContext = React.createContext<MenuRadioGroupContextType>({});\n\n// item\nexport type MenuRadioGroupItemProps<T = HTMLDivElement> = Omit<React.HTMLAttributes<T>, 'children' | 'onSelect'> & {\n    /** Label for the radio group item */\n    children: React.ReactNode;\n    /** Whether the radio group item is disabled */\n    disabled?: boolean;\n    /** Value of the radio button */\n    value: RadioGroupItemValue;\n};\n\nexport const RadioItem = (props: MenuRadioGroupItemProps) => {\n    const { children, disabled, value, ...otherProps } = props;\n    const context = React.useContext(MenuRadioGroupContext);\n    const isDisabled = context.disabled || disabled;\n\n    const className = useItemStyling({\n        disabled: isDisabled,\n        indented: true,\n        className: props.className,\n    });\n\n    return (\n        <MenuPrimitive.RadioItem {...otherProps} className={className} disabled={isDisabled} value={String(value ?? '')}>\n            <MenuPrimitive.RadioItemIndicator className=\"absolute left-0 ml-1.5\">\n                <span className=\"ml-1 flex h-1.5 w-1.5 rounded-full bg-current\" />\n            </MenuPrimitive.RadioItemIndicator>\n            {children}\n        </MenuPrimitive.RadioItem>\n    );\n};\n\n// group\nexport type MenuRadioGroupProps = React.HTMLAttributes<HTMLDivElement> & {\n    disabled?: boolean;\n    /** Handler called when the value changes */\n    onChange: (value: RadioGroupItemValue) => void;\n    /** The current value (controlled) */\n    value?: RadioGroupItemValue;\n};\n\nexport type ForwardedMenuRadioGroupWithStatics = React.ForwardRefExoticComponent<\n    MenuRadioGroupProps & React.RefAttributes<HTMLElement>\n> & {\n    Item: React.FunctionComponent<MenuRadioGroupItemProps>;\n};\n\nexport const RadioGroup = React.forwardRef<HTMLDivElement, MenuRadioGroupProps>(function MenuRadioItem(props, ref) {\n    const values = React.useMemo<RadioGroupItemValue[]>(() => {\n        const radioGroupItemValues: RadioGroupItemValue[] = [];\n\n        React.Children.forEach(props.children, child => {\n            if (React.isValidElement<{ value: RadioGroupItemValue }>(child)) {\n                radioGroupItemValues.push(child.props.value);\n            }\n        });\n\n        return radioGroupItemValues;\n    }, [props.children]);\n\n    const handleChange = (value: string) => props.onChange(getRadioItemByValue(values, value));\n    const value = String(props.value ?? '');\n\n    return (\n        <MenuRadioGroupContext.Provider value={{ disabled: props.disabled, value, onChange: handleChange }}>\n            <MenuPrimitive.RadioGroup {...props} className=\"flex flex-col\" value={value} onValueChange={handleChange} ref={ref} />\n        </MenuRadioGroupContext.Provider>\n    );\n}) as ForwardedMenuRadioGroupWithStatics;\n\nRadioGroup.Item = RadioItem;\n"],"names":["MenuPrimitive","value"],"mappings":";;;;AAiBA,MAAM,wBAAwB,MAAM,cAAyC,EAAE;AAYxE,MAAM,YAAY,CAAC,UAAmC;AACzD,QAAM,EAAE,UAAU,UAAU,OAAO,GAAG,eAAe;AACrD,QAAM,UAAU,MAAM,WAAW,qBAAqB;AACtD,QAAM,aAAa,QAAQ,YAAY;AAEvC,QAAM,YAAY,eAAe;AAAA,IAC7B,UAAU;AAAA,IACV,UAAU;AAAA,IACV,WAAW,MAAM;AAAA,EAAA,CACpB;AAED,SACI,sBAAA,cAACA,KAAc,WAAd,EAAyB,GAAG,YAAY,WAAsB,UAAU,YAAY,OAAO,OAAO,SAAS,EAAE,KAC1G,sBAAA,cAACA,KAAc,oBAAd,EAAiC,WAAU,yBAAA,GACxC,sBAAA,cAAC,QAAA,EAAK,WAAU,gDAAA,CAAgD,CACpE,GACC,QACL;AAER;AAiBO,MAAM,aAAa,MAAM,WAAgD,SAAS,cAAc,OAAO,KAAK;AAC/G,QAAM,SAAS,MAAM,QAA+B,MAAM;AACtD,UAAM,uBAA8C,CAAA;AAEpD,UAAM,SAAS,QAAQ,MAAM,UAAU,CAAA,UAAS;AAC5C,UAAI,MAAM,eAA+C,KAAK,GAAG;AAC7D,6BAAqB,KAAK,MAAM,MAAM,KAAK;AAAA,MAC/C;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX,GAAG,CAAC,MAAM,QAAQ,CAAC;AAEnB,QAAM,eAAe,CAACC,WAAkB,MAAM,SAAS,oBAAoB,QAAQA,MAAK,CAAC;AACzF,QAAM,QAAQ,OAAO,MAAM,SAAS,EAAE;AAEtC,SACI,sBAAA,cAAC,sBAAsB,UAAtB,EAA+B,OAAO,EAAE,UAAU,MAAM,UAAU,OAAO,UAAU,aAAA,KAChF,sBAAA,cAACD,KAAc,YAAd,EAA0B,GAAG,OAAO,WAAU,iBAAgB,OAAc,eAAe,cAAc,IAAA,CAAU,CACxH;AAER,CAAC;AAED,WAAW,OAAO;"}

package/dist/components/Navigation2/components/Group.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Group.cjs","sources":["../../../../src/components/Navigation2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { Icon } from '../../Icon/Icon';\n\nexport type Navigation2GroupProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> & {\n    defaultExpanded?: boolean;\n    heading: string | JSX.Element;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const Group = React.forwardRef<HTMLLIElement, Navigation2GroupProps>(function Group(props, ref) {\n    const { children, defaultExpanded = false, heading, onClick, ...attributes } = props;\n    const [expanded, setExpanded] = React.useState(defaultExpanded);\n    const className = cn(\n        'flex w-full cursor-pointer items-center rounded px-3 text-left font-bold leading-8 hover:bg-black-subtle focus-visible:yt-focus-dark',\n        attributes.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setExpanded(!expanded);\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    return (\n        <li {...attributes} className=\"[[data-taco=navigation2]>&]:px-3\" ref={ref}>\n            <button\n                aria-haspopup=\"true\"\n                aria-expanded={expanded}\n                data-taco=\"navigation2-group\"\n                className={className}\n                onClick={handleClick}>\n                <Icon className=\"-ml-2 !h-5 !w-5\" name={expanded ? 'chevron-down-solid' : 'chevron-right-solid'} />\n                <span className=\"flex-grow truncate\">{heading}</span>\n            </button>\n            <ul className={cn('mb-0 flex flex-col gap-y-px pt-px', { hidden: !expanded })} data-taco=\"navigation2-grouplist\">\n                {children}\n            </ul>\n        </li>\n    );\n});\n"],"names":["Group","Icon"],"mappings":";;;;;AAWO,MAAM,QAAQ,MAAM,WAAiD,SAASA,OAAM,OAAO,KAAK;AACnG,QAAM,EAAE,UAAU,kBAAkB,OAAO,SAAS,SAAS,GAAG,eAAe;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAAS,eAAe;AAC9D,QAAM,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,EAAA;AAGf,QAAM,cAAc,CAAC,UAA+C;AAChE,gBAAY,CAAC,QAAQ;AAErB,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,6CACK,MAAA,EAAI,GAAG,YAAY,WAAU,oCAAmC,OAC7D,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,aAAU;AAAA,MACV;AAAA,MACA,SAAS;AAAA,IAAA;AAAA,wCACRC,KAAAA,MAAA,EAAK,WAAU,mBAAkB,MAAM,WAAW,uBAAuB,uBAAuB;AAAA,IACjG,sBAAA,cAAC,QAAA,EAAK,WAAU,qBAAA,GAAsB,OAAQ;AAAA,EAAA,GAElD,sBAAA,cAAC,MAAA,EAAG,WAAW,GAAG,qCAAqC,EAAE,QAAQ,CAAC,UAAU,GAAG,aAAU,wBAAA,GACpF,QACL,CACJ;AAER,CAAC;;"}
+{"version":3,"file":"Group.cjs","sources":["../../../../src/components/Navigation2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { Icon } from '../../Icon/Icon';\n\nexport type Navigation2GroupProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> & {\n    defaultExpanded?: boolean;\n    heading: string | React.JSX.Element;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const Group = React.forwardRef<HTMLLIElement, Navigation2GroupProps>(function Group(props, ref) {\n    const { children, defaultExpanded = false, heading, onClick, ...attributes } = props;\n    const [expanded, setExpanded] = React.useState(defaultExpanded);\n    const className = cn(\n        'flex w-full cursor-pointer items-center rounded px-3 text-left font-bold leading-8 hover:bg-black-subtle focus-visible:yt-focus-dark',\n        attributes.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setExpanded(!expanded);\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    return (\n        <li {...attributes} className=\"[[data-taco=navigation2]>&]:px-3\" ref={ref}>\n            <button\n                aria-haspopup=\"true\"\n                aria-expanded={expanded}\n                data-taco=\"navigation2-group\"\n                className={className}\n                onClick={handleClick}>\n                <Icon className=\"-ml-2 !h-5 !w-5\" name={expanded ? 'chevron-down-solid' : 'chevron-right-solid'} />\n                <span className=\"flex-grow truncate\">{heading}</span>\n            </button>\n            <ul className={cn('mb-0 flex flex-col gap-y-px pt-px', { hidden: !expanded })} data-taco=\"navigation2-grouplist\">\n                {children}\n            </ul>\n        </li>\n    );\n});\n"],"names":["Group","Icon"],"mappings":";;;;;AAWO,MAAM,QAAQ,MAAM,WAAiD,SAASA,OAAM,OAAO,KAAK;AACnG,QAAM,EAAE,UAAU,kBAAkB,OAAO,SAAS,SAAS,GAAG,eAAe;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAAS,eAAe;AAC9D,QAAM,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,EAAA;AAGf,QAAM,cAAc,CAAC,UAA+C;AAChE,gBAAY,CAAC,QAAQ;AAErB,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,6CACK,MAAA,EAAI,GAAG,YAAY,WAAU,oCAAmC,OAC7D,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,aAAU;AAAA,MACV;AAAA,MACA,SAAS;AAAA,IAAA;AAAA,wCACRC,KAAAA,MAAA,EAAK,WAAU,mBAAkB,MAAM,WAAW,uBAAuB,uBAAuB;AAAA,IACjG,sBAAA,cAAC,QAAA,EAAK,WAAU,qBAAA,GAAsB,OAAQ;AAAA,EAAA,GAElD,sBAAA,cAAC,MAAA,EAAG,WAAW,GAAG,qCAAqC,EAAE,QAAQ,CAAC,UAAU,GAAG,aAAU,wBAAA,GACpF,QACL,CACJ;AAER,CAAC;;"}

package/dist/components/Navigation2/components/Group.d.ts

@@ -1,11 +1,11 @@
 import { default as React } from 'react';
 export type Navigation2GroupProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> & {
     defaultExpanded?: boolean;
-    heading: string | JSX.Element;
+    heading: string | React.JSX.Element;
     onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
 };
 export declare const Group: React.ForwardRefExoticComponent<Omit<React.LiHTMLAttributes<HTMLLIElement>, "onClick"> & {
     defaultExpanded?: boolean;
-    heading: string | JSX.Element;
+    heading: string | React.JSX.Element;
     onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
 } & React.RefAttributes<HTMLLIElement>>;

package/dist/components/Navigation2/components/Group.js.map

@@ -1 +1 @@
-{"version":3,"file":"Group.js","sources":["../../../../src/components/Navigation2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { Icon } from '../../Icon/Icon';\n\nexport type Navigation2GroupProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> & {\n    defaultExpanded?: boolean;\n    heading: string | JSX.Element;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const Group = React.forwardRef<HTMLLIElement, Navigation2GroupProps>(function Group(props, ref) {\n    const { children, defaultExpanded = false, heading, onClick, ...attributes } = props;\n    const [expanded, setExpanded] = React.useState(defaultExpanded);\n    const className = cn(\n        'flex w-full cursor-pointer items-center rounded px-3 text-left font-bold leading-8 hover:bg-black-subtle focus-visible:yt-focus-dark',\n        attributes.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setExpanded(!expanded);\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    return (\n        <li {...attributes} className=\"[[data-taco=navigation2]>&]:px-3\" ref={ref}>\n            <button\n                aria-haspopup=\"true\"\n                aria-expanded={expanded}\n                data-taco=\"navigation2-group\"\n                className={className}\n                onClick={handleClick}>\n                <Icon className=\"-ml-2 !h-5 !w-5\" name={expanded ? 'chevron-down-solid' : 'chevron-right-solid'} />\n                <span className=\"flex-grow truncate\">{heading}</span>\n            </button>\n            <ul className={cn('mb-0 flex flex-col gap-y-px pt-px', { hidden: !expanded })} data-taco=\"navigation2-grouplist\">\n                {children}\n            </ul>\n        </li>\n    );\n});\n"],"names":["React","Group"],"mappings":";;;AAWO,MAAM,QAAQA,eAAM,WAAiD,SAASC,OAAM,OAAO,KAAK;AACnG,QAAM,EAAE,UAAU,kBAAkB,OAAO,SAAS,SAAS,GAAG,eAAe;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAID,eAAM,SAAS,eAAe;AAC9D,QAAM,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,EAAA;AAGf,QAAM,cAAc,CAAC,UAA+C;AAChE,gBAAY,CAAC,QAAQ;AAErB,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,sDACK,MAAA,EAAI,GAAG,YAAY,WAAU,oCAAmC,OAC7DA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,aAAU;AAAA,MACV;AAAA,MACA,SAAS;AAAA,IAAA;AAAA,iDACR,MAAA,EAAK,WAAU,mBAAkB,MAAM,WAAW,uBAAuB,uBAAuB;AAAA,IACjGA,+BAAA,cAAC,QAAA,EAAK,WAAU,qBAAA,GAAsB,OAAQ;AAAA,EAAA,GAElDA,+BAAA,cAAC,MAAA,EAAG,WAAW,GAAG,qCAAqC,EAAE,QAAQ,CAAC,UAAU,GAAG,aAAU,wBAAA,GACpF,QACL,CACJ;AAER,CAAC;"}
+{"version":3,"file":"Group.js","sources":["../../../../src/components/Navigation2/components/Group.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { Icon } from '../../Icon/Icon';\n\nexport type Navigation2GroupProps = Omit<React.LiHTMLAttributes<HTMLLIElement>, 'onClick'> & {\n    defaultExpanded?: boolean;\n    heading: string | React.JSX.Element;\n    onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;\n};\n\nexport const Group = React.forwardRef<HTMLLIElement, Navigation2GroupProps>(function Group(props, ref) {\n    const { children, defaultExpanded = false, heading, onClick, ...attributes } = props;\n    const [expanded, setExpanded] = React.useState(defaultExpanded);\n    const className = cn(\n        'flex w-full cursor-pointer items-center rounded px-3 text-left font-bold leading-8 hover:bg-black-subtle focus-visible:yt-focus-dark',\n        attributes.className\n    );\n\n    const handleClick = (event: React.MouseEvent<HTMLButtonElement>) => {\n        setExpanded(!expanded);\n\n        if (onClick) {\n            onClick(event);\n        }\n    };\n\n    return (\n        <li {...attributes} className=\"[[data-taco=navigation2]>&]:px-3\" ref={ref}>\n            <button\n                aria-haspopup=\"true\"\n                aria-expanded={expanded}\n                data-taco=\"navigation2-group\"\n                className={className}\n                onClick={handleClick}>\n                <Icon className=\"-ml-2 !h-5 !w-5\" name={expanded ? 'chevron-down-solid' : 'chevron-right-solid'} />\n                <span className=\"flex-grow truncate\">{heading}</span>\n            </button>\n            <ul className={cn('mb-0 flex flex-col gap-y-px pt-px', { hidden: !expanded })} data-taco=\"navigation2-grouplist\">\n                {children}\n            </ul>\n        </li>\n    );\n});\n"],"names":["React","Group"],"mappings":";;;AAWO,MAAM,QAAQA,eAAM,WAAiD,SAASC,OAAM,OAAO,KAAK;AACnG,QAAM,EAAE,UAAU,kBAAkB,OAAO,SAAS,SAAS,GAAG,eAAe;AAC/E,QAAM,CAAC,UAAU,WAAW,IAAID,eAAM,SAAS,eAAe;AAC9D,QAAM,YAAY;AAAA,IACd;AAAA,IACA,WAAW;AAAA,EAAA;AAGf,QAAM,cAAc,CAAC,UAA+C;AAChE,gBAAY,CAAC,QAAQ;AAErB,QAAI,SAAS;AACT,cAAQ,KAAK;AAAA,IACjB;AAAA,EACJ;AAEA,sDACK,MAAA,EAAI,GAAG,YAAY,WAAU,oCAAmC,OAC7DA,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,iBAAc;AAAA,MACd,iBAAe;AAAA,MACf,aAAU;AAAA,MACV;AAAA,MACA,SAAS;AAAA,IAAA;AAAA,iDACR,MAAA,EAAK,WAAU,mBAAkB,MAAM,WAAW,uBAAuB,uBAAuB;AAAA,IACjGA,+BAAA,cAAC,QAAA,EAAK,WAAU,qBAAA,GAAsB,OAAQ;AAAA,EAAA,GAElDA,+BAAA,cAAC,MAAA,EAAG,WAAW,GAAG,qCAAqC,EAAE,QAAQ,CAAC,UAAU,GAAG,aAAU,wBAAA,GACpF,QACL,CACJ;AAER,CAAC;"}

package/dist/components/Navigation2/components/Link.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.cjs","sources":["../../../../src/components/Navigation2/components/Link.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useDropTarget } from '../../../utils/hooks/useDropTarget';\nimport { Badge } from '../../Badge/Badge';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../../Menu/Menu';\n\nimport { getAdjacentClasses } from './util';\n\nexport const getNavigationLinkClasses = (isDraggedOver = false) =>\n    cn(\n        'group relative flex w-full items-center rounded px-2 leading-8 !text-black focus-visible:yt-focus-dark',\n        // override styles for links that are children of collapsible menus\n        'font-bold [[data-taco=navigation2-grouplist]>li>&]:pl-5 [[data-taco=navigation2-grouplist]>li>&]:font-normal',\n        // override styles to adjust icons included in menu links\n        '[&_[data-taco=\"icon\"]]:!h-5 [&_[data-taco=\"icon\"]]:!w-5',\n        // override styles to adjust badges included in menu links\n        '[&>span_[data-taco=\"badge\"]]:mr-2.5 [[data-taco=navigation2-grouplist]>li>&>span_[data-taco=\"badge\"]]:mr-2',\n        {\n            'hover:bg-black-subtle aria-current-page:bg-blue-500/[.1]': !isDraggedOver,\n            '!bg-blue-500 !text-white [&>*]:!text-white': isDraggedOver,\n        }\n    );\n\nexport type Navigation2LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {\n    active?: boolean;\n    icon?: IconName;\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => JSX.Element;\n    /** Handler to be used when dropping a dragged element over the Navigation2 link */\n    onDrop?: React.DragEventHandler;\n    /** Total shown inside a Badge component */\n    total?: number;\n};\n\nexport const Link = React.forwardRef<HTMLAnchorElement, Navigation2LinkProps>(function Link(props, ref) {\n    const { active, children, icon, menu, onDrop, total, ...attributes } = props;\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n\n    const className = cn(getNavigationLinkClasses(isDraggedOver), attributes.className);\n\n    const listClassName = cn('border-gray-100 [[data-taco=navigation2]>&]:px-3', getAdjacentClasses(), {\n        '[&>*]:pointer-events-none': isDraggedOver,\n    });\n\n    return (\n        <li {...dropTargetProps} className={listClassName} data-taco=\"navigation2-link-item\">\n            <a\n                {...attributes}\n                aria-current={active ? 'page' : undefined}\n                className={className}\n                data-taco=\"navigation2-link\"\n                ref={ref}\n                tabIndex={0}>\n                {icon ? (\n                    <Icon\n                        className=\"mr-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:-ml-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:mr-0.5\"\n                        name={icon}\n                    />\n                ) : null}\n                <span className=\"flex flex-grow items-center truncate\">{children}</span>\n                {menu ? (\n                    <LegacyIconButton\n                        appearance=\"discrete\"\n                        icon=\"more\"\n                        aria-label=\"More\"\n                        rounded\n                        className={cn(\n                            '-mr-1.5 hidden flex-shrink-0 flex-grow-0 transition-none group-hover:flex aria-expanded:flex',\n                            {\n                                'absolute right-0 !mr-0.5': total !== undefined,\n                            }\n                        )}\n                        menu={menu}\n                        onClick={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                        }}\n                    />\n                ) : null}\n                {total === undefined ? null : (\n                    <Badge\n                        className={cn('flex-shrink-0 flex-grow-0 !font-normal', {\n                            'group-hover:hidden [[aria-expanded=\"true\"]+&]:hidden': menu,\n                        })}\n                        color=\"transparent\">\n                        {total}\n                    </Badge>\n                )}\n            </a>\n        </li>\n    );\n});\n"],"names":["Link","useDropTarget","getAdjacentClasses","Icon","LegacyIconButton","Badge"],"mappings":";;;;;;;;;AAYO,MAAM,2BAA2B,CAAC,gBAAgB,UACrD;AAAA,EACI;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,IACI,4DAA4D,CAAC;AAAA,IAC7D,8CAA8C;AAAA,EAAA;AAEtD;AAaG,MAAM,OAAO,MAAM,WAAoD,SAASA,MAAK,OAAO,KAAK;AACpG,QAAM,EAAE,QAAQ,UAAU,MAAM,MAAM,QAAQ,OAAO,GAAG,WAAA,IAAe;AACvE,QAAM,CAAC,eAAe,eAAe,IAAIC,cAAAA,cAAc,MAAM;AAE7D,QAAM,YAAY,GAAG,yBAAyB,aAAa,GAAG,WAAW,SAAS;AAElF,QAAM,gBAAgB,GAAG,oDAAoDC,KAAAA,mBAAA,GAAsB;AAAA,IAC/F,6BAA6B;AAAA,EAAA,CAChC;AAED,6CACK,MAAA,EAAI,GAAG,iBAAiB,WAAW,eAAe,aAAU,wBAAA,GACzD,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,gBAAc,SAAS,SAAS;AAAA,MAChC;AAAA,MACA,aAAU;AAAA,MACV;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IACT,OACG,sBAAA;AAAA,MAACC,KAAAA;AAAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,MAAM;AAAA,MAAA;AAAA,IAAA,IAEV;AAAA,IACJ,sBAAA,cAAC,QAAA,EAAK,WAAU,uCAAA,GAAwC,QAAS;AAAA,IAChE,OACG,sBAAA;AAAA,MAACC,WAAAA;AAAAA,MAAA;AAAA,QACG,YAAW;AAAA,QACX,MAAK;AAAA,QACL,cAAW;AAAA,QACX,SAAO;AAAA,QACP,WAAW;AAAA,UACP;AAAA,UACA;AAAA,YACI,4BAA4B,UAAU;AAAA,UAAA;AAAA,QAC1C;AAAA,QAEJ;AAAA,QACA,SAAS,CAAA,UAAS;AACd,gBAAM,eAAA;AACN,gBAAM,gBAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAAA,IAEJ;AAAA,IACH,UAAU,SAAY,OACnB,sBAAA;AAAA,MAACC,MAAAA;AAAAA,MAAA;AAAA,QACG,WAAW,GAAG,0CAA0C;AAAA,UACpD,wDAAwD;AAAA,QAAA,CAC3D;AAAA,QACD,OAAM;AAAA,MAAA;AAAA,MACL;AAAA,IAAA;AAAA,EACL,CAGZ;AAER,CAAC;;;"}
+{"version":3,"file":"Link.cjs","sources":["../../../../src/components/Navigation2/components/Link.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useDropTarget } from '../../../utils/hooks/useDropTarget';\nimport { Badge } from '../../Badge/Badge';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../../Menu/Menu';\n\nimport { getAdjacentClasses } from './util';\n\nexport const getNavigationLinkClasses = (isDraggedOver = false) =>\n    cn(\n        'group relative flex w-full items-center rounded px-2 leading-8 !text-black focus-visible:yt-focus-dark',\n        // override styles for links that are children of collapsible menus\n        'font-bold [[data-taco=navigation2-grouplist]>li>&]:pl-5 [[data-taco=navigation2-grouplist]>li>&]:font-normal',\n        // override styles to adjust icons included in menu links\n        '[&_[data-taco=\"icon\"]]:!h-5 [&_[data-taco=\"icon\"]]:!w-5',\n        // override styles to adjust badges included in menu links\n        '[&>span_[data-taco=\"badge\"]]:mr-2.5 [[data-taco=navigation2-grouplist]>li>&>span_[data-taco=\"badge\"]]:mr-2',\n        {\n            'hover:bg-black-subtle aria-current-page:bg-blue-500/[.1]': !isDraggedOver,\n            '!bg-blue-500 !text-white [&>*]:!text-white': isDraggedOver,\n        }\n    );\n\nexport type Navigation2LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {\n    active?: boolean;\n    icon?: IconName;\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => React.JSX.Element;\n    /** Handler to be used when dropping a dragged element over the Navigation2 link */\n    onDrop?: React.DragEventHandler;\n    /** Total shown inside a Badge component */\n    total?: number;\n};\n\nexport const Link = React.forwardRef<HTMLAnchorElement, Navigation2LinkProps>(function Link(props, ref) {\n    const { active, children, icon, menu, onDrop, total, ...attributes } = props;\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n\n    const className = cn(getNavigationLinkClasses(isDraggedOver), attributes.className);\n\n    const listClassName = cn('border-gray-100 [[data-taco=navigation2]>&]:px-3', getAdjacentClasses(), {\n        '[&>*]:pointer-events-none': isDraggedOver,\n    });\n\n    return (\n        <li {...dropTargetProps} className={listClassName} data-taco=\"navigation2-link-item\">\n            <a\n                {...attributes}\n                aria-current={active ? 'page' : undefined}\n                className={className}\n                data-taco=\"navigation2-link\"\n                ref={ref}\n                tabIndex={0}>\n                {icon ? (\n                    <Icon\n                        className=\"mr-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:-ml-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:mr-0.5\"\n                        name={icon}\n                    />\n                ) : null}\n                <span className=\"flex flex-grow items-center truncate\">{children}</span>\n                {menu ? (\n                    <LegacyIconButton\n                        appearance=\"discrete\"\n                        icon=\"more\"\n                        aria-label=\"More\"\n                        rounded\n                        className={cn(\n                            '-mr-1.5 hidden flex-shrink-0 flex-grow-0 transition-none group-hover:flex aria-expanded:flex',\n                            {\n                                'absolute right-0 !mr-0.5': total !== undefined,\n                            }\n                        )}\n                        menu={menu}\n                        onClick={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                        }}\n                    />\n                ) : null}\n                {total === undefined ? null : (\n                    <Badge\n                        className={cn('flex-shrink-0 flex-grow-0 !font-normal', {\n                            'group-hover:hidden [[aria-expanded=\"true\"]+&]:hidden': menu,\n                        })}\n                        color=\"transparent\">\n                        {total}\n                    </Badge>\n                )}\n            </a>\n        </li>\n    );\n});\n"],"names":["Link","useDropTarget","getAdjacentClasses","Icon","LegacyIconButton","Badge"],"mappings":";;;;;;;;;AAYO,MAAM,2BAA2B,CAAC,gBAAgB,UACrD;AAAA,EACI;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,IACI,4DAA4D,CAAC;AAAA,IAC7D,8CAA8C;AAAA,EAAA;AAEtD;AAaG,MAAM,OAAO,MAAM,WAAoD,SAASA,MAAK,OAAO,KAAK;AACpG,QAAM,EAAE,QAAQ,UAAU,MAAM,MAAM,QAAQ,OAAO,GAAG,WAAA,IAAe;AACvE,QAAM,CAAC,eAAe,eAAe,IAAIC,cAAAA,cAAc,MAAM;AAE7D,QAAM,YAAY,GAAG,yBAAyB,aAAa,GAAG,WAAW,SAAS;AAElF,QAAM,gBAAgB,GAAG,oDAAoDC,KAAAA,mBAAA,GAAsB;AAAA,IAC/F,6BAA6B;AAAA,EAAA,CAChC;AAED,6CACK,MAAA,EAAI,GAAG,iBAAiB,WAAW,eAAe,aAAU,wBAAA,GACzD,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,gBAAc,SAAS,SAAS;AAAA,MAChC;AAAA,MACA,aAAU;AAAA,MACV;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IACT,OACG,sBAAA;AAAA,MAACC,KAAAA;AAAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,MAAM;AAAA,MAAA;AAAA,IAAA,IAEV;AAAA,IACJ,sBAAA,cAAC,QAAA,EAAK,WAAU,uCAAA,GAAwC,QAAS;AAAA,IAChE,OACG,sBAAA;AAAA,MAACC,WAAAA;AAAAA,MAAA;AAAA,QACG,YAAW;AAAA,QACX,MAAK;AAAA,QACL,cAAW;AAAA,QACX,SAAO;AAAA,QACP,WAAW;AAAA,UACP;AAAA,UACA;AAAA,YACI,4BAA4B,UAAU;AAAA,UAAA;AAAA,QAC1C;AAAA,QAEJ;AAAA,QACA,SAAS,CAAA,UAAS;AACd,gBAAM,eAAA;AACN,gBAAM,gBAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAAA,IAEJ;AAAA,IACH,UAAU,SAAY,OACnB,sBAAA;AAAA,MAACC,MAAAA;AAAAA,MAAA;AAAA,QACG,WAAW,GAAG,0CAA0C;AAAA,UACpD,wDAAwD;AAAA,QAAA,CAC3D;AAAA,QACD,OAAM;AAAA,MAAA;AAAA,MACL;AAAA,IAAA;AAAA,EACL,CAGZ;AAER,CAAC;;;"}

package/dist/components/Navigation2/components/Link.d.ts

@@ -6,7 +6,7 @@ export type Navigation2LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement>
     active?: boolean;
     icon?: IconName;
     /** Menu component associated with the button. */
-    menu?: (props: Partial<MenuProps>) => JSX.Element;
+    menu?: (props: Partial<MenuProps>) => React.JSX.Element;
     /** Handler to be used when dropping a dragged element over the Navigation2 link */
     onDrop?: React.DragEventHandler;
     /** Total shown inside a Badge component */
@@ -16,7 +16,7 @@ export declare const Link: React.ForwardRefExoticComponent<React.AnchorHTMLAttri
     active?: boolean;
     icon?: IconName;
     /** Menu component associated with the button. */
-    menu?: (props: Partial<MenuProps>) => JSX.Element;
+    menu?: (props: Partial<MenuProps>) => React.JSX.Element;
     /** Handler to be used when dropping a dragged element over the Navigation2 link */
     onDrop?: React.DragEventHandler;
     /** Total shown inside a Badge component */

package/dist/components/Navigation2/components/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../../../src/components/Navigation2/components/Link.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useDropTarget } from '../../../utils/hooks/useDropTarget';\nimport { Badge } from '../../Badge/Badge';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../../Menu/Menu';\n\nimport { getAdjacentClasses } from './util';\n\nexport const getNavigationLinkClasses = (isDraggedOver = false) =>\n    cn(\n        'group relative flex w-full items-center rounded px-2 leading-8 !text-black focus-visible:yt-focus-dark',\n        // override styles for links that are children of collapsible menus\n        'font-bold [[data-taco=navigation2-grouplist]>li>&]:pl-5 [[data-taco=navigation2-grouplist]>li>&]:font-normal',\n        // override styles to adjust icons included in menu links\n        '[&_[data-taco=\"icon\"]]:!h-5 [&_[data-taco=\"icon\"]]:!w-5',\n        // override styles to adjust badges included in menu links\n        '[&>span_[data-taco=\"badge\"]]:mr-2.5 [[data-taco=navigation2-grouplist]>li>&>span_[data-taco=\"badge\"]]:mr-2',\n        {\n            'hover:bg-black-subtle aria-current-page:bg-blue-500/[.1]': !isDraggedOver,\n            '!bg-blue-500 !text-white [&>*]:!text-white': isDraggedOver,\n        }\n    );\n\nexport type Navigation2LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {\n    active?: boolean;\n    icon?: IconName;\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => JSX.Element;\n    /** Handler to be used when dropping a dragged element over the Navigation2 link */\n    onDrop?: React.DragEventHandler;\n    /** Total shown inside a Badge component */\n    total?: number;\n};\n\nexport const Link = React.forwardRef<HTMLAnchorElement, Navigation2LinkProps>(function Link(props, ref) {\n    const { active, children, icon, menu, onDrop, total, ...attributes } = props;\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n\n    const className = cn(getNavigationLinkClasses(isDraggedOver), attributes.className);\n\n    const listClassName = cn('border-gray-100 [[data-taco=navigation2]>&]:px-3', getAdjacentClasses(), {\n        '[&>*]:pointer-events-none': isDraggedOver,\n    });\n\n    return (\n        <li {...dropTargetProps} className={listClassName} data-taco=\"navigation2-link-item\">\n            <a\n                {...attributes}\n                aria-current={active ? 'page' : undefined}\n                className={className}\n                data-taco=\"navigation2-link\"\n                ref={ref}\n                tabIndex={0}>\n                {icon ? (\n                    <Icon\n                        className=\"mr-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:-ml-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:mr-0.5\"\n                        name={icon}\n                    />\n                ) : null}\n                <span className=\"flex flex-grow items-center truncate\">{children}</span>\n                {menu ? (\n                    <LegacyIconButton\n                        appearance=\"discrete\"\n                        icon=\"more\"\n                        aria-label=\"More\"\n                        rounded\n                        className={cn(\n                            '-mr-1.5 hidden flex-shrink-0 flex-grow-0 transition-none group-hover:flex aria-expanded:flex',\n                            {\n                                'absolute right-0 !mr-0.5': total !== undefined,\n                            }\n                        )}\n                        menu={menu}\n                        onClick={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                        }}\n                    />\n                ) : null}\n                {total === undefined ? null : (\n                    <Badge\n                        className={cn('flex-shrink-0 flex-grow-0 !font-normal', {\n                            'group-hover:hidden [[aria-expanded=\"true\"]+&]:hidden': menu,\n                        })}\n                        color=\"transparent\">\n                        {total}\n                    </Badge>\n                )}\n            </a>\n        </li>\n    );\n});\n"],"names":["React","Link"],"mappings":";;;;;;;AAYO,MAAM,2BAA2B,CAAC,gBAAgB,UACrD;AAAA,EACI;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,IACI,4DAA4D,CAAC;AAAA,IAC7D,8CAA8C;AAAA,EAAA;AAEtD;AAaG,MAAM,OAAOA,eAAM,WAAoD,SAASC,MAAK,OAAO,KAAK;AACpG,QAAM,EAAE,QAAQ,UAAU,MAAM,MAAM,QAAQ,OAAO,GAAG,WAAA,IAAe;AACvE,QAAM,CAAC,eAAe,eAAe,IAAI,cAAc,MAAM;AAE7D,QAAM,YAAY,GAAG,yBAAyB,aAAa,GAAG,WAAW,SAAS;AAElF,QAAM,gBAAgB,GAAG,oDAAoD,mBAAA,GAAsB;AAAA,IAC/F,6BAA6B;AAAA,EAAA,CAChC;AAED,sDACK,MAAA,EAAI,GAAG,iBAAiB,WAAW,eAAe,aAAU,wBAAA,GACzDD,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,gBAAc,SAAS,SAAS;AAAA,MAChC;AAAA,MACA,aAAU;AAAA,MACV;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IACT,OACGA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,MAAM;AAAA,MAAA;AAAA,IAAA,IAEV;AAAA,IACJA,+BAAA,cAAC,QAAA,EAAK,WAAU,uCAAA,GAAwC,QAAS;AAAA,IAChE,OACGA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,YAAW;AAAA,QACX,MAAK;AAAA,QACL,cAAW;AAAA,QACX,SAAO;AAAA,QACP,WAAW;AAAA,UACP;AAAA,UACA;AAAA,YACI,4BAA4B,UAAU;AAAA,UAAA;AAAA,QAC1C;AAAA,QAEJ;AAAA,QACA,SAAS,CAAA,UAAS;AACd,gBAAM,eAAA;AACN,gBAAM,gBAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAAA,IAEJ;AAAA,IACH,UAAU,SAAY,OACnBA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,GAAG,0CAA0C;AAAA,UACpD,wDAAwD;AAAA,QAAA,CAC3D;AAAA,QACD,OAAM;AAAA,MAAA;AAAA,MACL;AAAA,IAAA;AAAA,EACL,CAGZ;AAER,CAAC;"}
+{"version":3,"file":"Link.js","sources":["../../../../src/components/Navigation2/components/Link.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useDropTarget } from '../../../utils/hooks/useDropTarget';\nimport { Badge } from '../../Badge/Badge';\nimport type { IconName } from '../../Icon/Icon';\nimport { Icon } from '../../Icon/Icon';\nimport { LegacyIconButton } from '../../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../../Menu/Menu';\n\nimport { getAdjacentClasses } from './util';\n\nexport const getNavigationLinkClasses = (isDraggedOver = false) =>\n    cn(\n        'group relative flex w-full items-center rounded px-2 leading-8 !text-black focus-visible:yt-focus-dark',\n        // override styles for links that are children of collapsible menus\n        'font-bold [[data-taco=navigation2-grouplist]>li>&]:pl-5 [[data-taco=navigation2-grouplist]>li>&]:font-normal',\n        // override styles to adjust icons included in menu links\n        '[&_[data-taco=\"icon\"]]:!h-5 [&_[data-taco=\"icon\"]]:!w-5',\n        // override styles to adjust badges included in menu links\n        '[&>span_[data-taco=\"badge\"]]:mr-2.5 [[data-taco=navigation2-grouplist]>li>&>span_[data-taco=\"badge\"]]:mr-2',\n        {\n            'hover:bg-black-subtle aria-current-page:bg-blue-500/[.1]': !isDraggedOver,\n            '!bg-blue-500 !text-white [&>*]:!text-white': isDraggedOver,\n        }\n    );\n\nexport type Navigation2LinkProps = React.AnchorHTMLAttributes<HTMLAnchorElement> & {\n    active?: boolean;\n    icon?: IconName;\n    /** Menu component associated with the button. */\n    menu?: (props: Partial<MenuProps>) => React.JSX.Element;\n    /** Handler to be used when dropping a dragged element over the Navigation2 link */\n    onDrop?: React.DragEventHandler;\n    /** Total shown inside a Badge component */\n    total?: number;\n};\n\nexport const Link = React.forwardRef<HTMLAnchorElement, Navigation2LinkProps>(function Link(props, ref) {\n    const { active, children, icon, menu, onDrop, total, ...attributes } = props;\n    const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);\n\n    const className = cn(getNavigationLinkClasses(isDraggedOver), attributes.className);\n\n    const listClassName = cn('border-gray-100 [[data-taco=navigation2]>&]:px-3', getAdjacentClasses(), {\n        '[&>*]:pointer-events-none': isDraggedOver,\n    });\n\n    return (\n        <li {...dropTargetProps} className={listClassName} data-taco=\"navigation2-link-item\">\n            <a\n                {...attributes}\n                aria-current={active ? 'page' : undefined}\n                className={className}\n                data-taco=\"navigation2-link\"\n                ref={ref}\n                tabIndex={0}>\n                {icon ? (\n                    <Icon\n                        className=\"mr-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:-ml-1.5 [[data-taco=navigation2-grouplist]>li>a>&]:mr-0.5\"\n                        name={icon}\n                    />\n                ) : null}\n                <span className=\"flex flex-grow items-center truncate\">{children}</span>\n                {menu ? (\n                    <LegacyIconButton\n                        appearance=\"discrete\"\n                        icon=\"more\"\n                        aria-label=\"More\"\n                        rounded\n                        className={cn(\n                            '-mr-1.5 hidden flex-shrink-0 flex-grow-0 transition-none group-hover:flex aria-expanded:flex',\n                            {\n                                'absolute right-0 !mr-0.5': total !== undefined,\n                            }\n                        )}\n                        menu={menu}\n                        onClick={event => {\n                            event.preventDefault();\n                            event.stopPropagation();\n                        }}\n                    />\n                ) : null}\n                {total === undefined ? null : (\n                    <Badge\n                        className={cn('flex-shrink-0 flex-grow-0 !font-normal', {\n                            'group-hover:hidden [[aria-expanded=\"true\"]+&]:hidden': menu,\n                        })}\n                        color=\"transparent\">\n                        {total}\n                    </Badge>\n                )}\n            </a>\n        </li>\n    );\n});\n"],"names":["React","Link"],"mappings":";;;;;;;AAYO,MAAM,2BAA2B,CAAC,gBAAgB,UACrD;AAAA,EACI;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA;AAAA,EAEA;AAAA,EACA;AAAA,IACI,4DAA4D,CAAC;AAAA,IAC7D,8CAA8C;AAAA,EAAA;AAEtD;AAaG,MAAM,OAAOA,eAAM,WAAoD,SAASC,MAAK,OAAO,KAAK;AACpG,QAAM,EAAE,QAAQ,UAAU,MAAM,MAAM,QAAQ,OAAO,GAAG,WAAA,IAAe;AACvE,QAAM,CAAC,eAAe,eAAe,IAAI,cAAc,MAAM;AAE7D,QAAM,YAAY,GAAG,yBAAyB,aAAa,GAAG,WAAW,SAAS;AAElF,QAAM,gBAAgB,GAAG,oDAAoD,mBAAA,GAAsB;AAAA,IAC/F,6BAA6B;AAAA,EAAA,CAChC;AAED,sDACK,MAAA,EAAI,GAAG,iBAAiB,WAAW,eAAe,aAAU,wBAAA,GACzDD,+BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACI,GAAG;AAAA,MACJ,gBAAc,SAAS,SAAS;AAAA,MAChC;AAAA,MACA,aAAU;AAAA,MACV;AAAA,MACA,UAAU;AAAA,IAAA;AAAA,IACT,OACGA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAU;AAAA,QACV,MAAM;AAAA,MAAA;AAAA,IAAA,IAEV;AAAA,IACJA,+BAAA,cAAC,QAAA,EAAK,WAAU,uCAAA,GAAwC,QAAS;AAAA,IAChE,OACGA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,YAAW;AAAA,QACX,MAAK;AAAA,QACL,cAAW;AAAA,QACX,SAAO;AAAA,QACP,WAAW;AAAA,UACP;AAAA,UACA;AAAA,YACI,4BAA4B,UAAU;AAAA,UAAA;AAAA,QAC1C;AAAA,QAEJ;AAAA,QACA,SAAS,CAAA,UAAS;AACd,gBAAM,eAAA;AACN,gBAAM,gBAAA;AAAA,QACV;AAAA,MAAA;AAAA,IAAA,IAEJ;AAAA,IACH,UAAU,SAAY,OACnBA,+BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACG,WAAW,GAAG,0CAA0C;AAAA,UACpD,wDAAwD;AAAA,QAAA,CAC3D;AAAA,QACD,OAAM;AAAA,MAAA;AAAA,MACL;AAAA,IAAA;AAAA,EACL,CAGZ;AAER,CAAC;"}

package/dist/components/OverflowGroup/OverflowGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowGroup.cjs","sources":["../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport type { LegacyButtonProps } from '../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../Menu/Menu';\nimport { Menu } from '../Menu/Menu';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: JSX.Element, index: number) => {\n    const href: string | undefined = button.props.to || button.props.href;\n    const Tag = href ? Menu.Link : Menu.Item;\n\n    // Removing className prop so that custom styling cannot be applied on Menu.Link\n    const {\n        as,\n        className: _,\n        appearance: _1,\n        drawer: _2,\n        fluid: _3,\n        hanger: _4,\n        menu: _5,\n        popover: _6,\n        tooltip: _7,\n        ...attributes\n    } = button.props;\n\n    const props = {\n        ...attributes,\n        key: index,\n        target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n    };\n\n    if (as) {\n        return React.cloneElement(button, { as: Tag, ...props });\n    }\n\n    return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n    moreButton?: (moreButtonText: string) => React.ReactElement<LegacyButtonProps>;\n    wrapChild?: true | undefined;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { moreButton, wrapChild, ...attributes } = props;\n    const internalRef = useMergedRef<HTMLDivElement>(ref);\n    // determine width of more button, to add intersection observer margin\n    const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n    const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n    const { texts } = useLocalization();\n\n    const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n    const children = React.Children.toArray(props.children) as React.ReactElement<LegacyButtonProps>[];\n    const hiddenChildren = intersectedChildIndex === undefined ? [] : children.slice(intersectedChildIndex);\n    const hiddenChildrenCount = hiddenChildren.length;\n    const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n    const MoreButton = moreButton?.(moreButtonText) ?? <LegacyIconButton icon=\"more\" />;\n\n    const className = cn('flex overflow-hidden', props.className);\n\n    return (\n        <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n            {children.map((child, index) =>\n                React.cloneElement(child, {\n                    className: cn(child.props.className, {\n                        visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n                        'pointer-events-none invisible order-[100]':\n                            intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n                    }),\n                })\n            )}\n            {hiddenChildren.length\n                ? React.cloneElement(MoreButton, {\n                      className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n                      'data-observer-ignore': true,\n                      menu: (menuProps: MenuProps) => (\n                          <Menu {...menuProps}>\n                              <Menu.Content>\n                                  {hiddenChildren.map((child, index) =>\n                                      wrapChild ? (\n                                          <Menu.Item key={index}>{child}</Menu.Item>\n                                      ) : (\n                                          sanitizeButtonPropsForMenuItem(child, index)\n                                      )\n                                  )}\n                              </Menu.Content>\n                          </Menu>\n                      ),\n                      ref: buttonRefCallback,\n                  })\n                : null}\n        </div>\n    );\n});\n"],"names":["Menu","OverflowGroup","useMergedRef","useLocalization","useIntersectionObserver","LegacyIconButton"],"mappings":";;;;;;;;;AAWA,MAAM,iCAAiC,CAAC,QAAqB,UAAkB;AAC3E,QAAM,OAA2B,OAAO,MAAM,MAAM,OAAO,MAAM;AACjE,QAAM,MAAM,OAAOA,KAAAA,KAAK,OAAOA,KAAAA,KAAK;AAGpC,QAAM;AAAA,IACF;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACH,OAAO;AAEX,QAAM,QAAQ;AAAA,IACV,GAAG;AAAA,IACH,KAAK;AAAA,IACL,QAAQ,OAAQ,KAAK,WAAW,MAAM,IAAI,WAAW,UAAW;AAAA,EAAA;AAGpE,MAAI,IAAI;AACJ,WAAO,MAAM,aAAa,QAAQ,EAAE,IAAI,KAAK,GAAG,OAAO;AAAA,EAC3D;AAEA,SAAO,sBAAA,cAAC,KAAA,EAAK,GAAG,MAAA,CAAO;AAC3B;AAOA,MAAM,iBAAiB,KAAK;AAErB,MAAM,gBAAgB,MAAM,WAAW,SAASC,eAAc,OAA2B,KAAgC;AAC5H,QAAM,EAAE,YAAY,WAAW,GAAG,eAAe;AACjD,QAAM,cAAcC,aAAAA,aAA6B,GAAG;AAEpD,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAS,cAAc;AACnE,QAAM,oBAAoB,MAAM,YAAY,CAAC,OAAoB,eAAe,IAAI,sBAAA,GAAyB,KAAK,GAAG,CAAA,CAAE;AACvH,QAAM,EAAE,MAAA,IAAUC,6BAAA;AAElB,QAAM,wBAAwBC,wBAAAA,wBAAwB,aAAa,WAAW;AAC9E,QAAM,WAAW,MAAM,SAAS,QAAQ,MAAM,QAAQ;AACtD,QAAM,iBAAiB,0BAA0B,SAAY,CAAA,IAAK,SAAS,MAAM,qBAAqB;AACtG,QAAM,sBAAsB,eAAe;AAC3C,QAAM,iBAAiB,sBAAsB,GAAG,mBAAmB,IAAI,MAAM,OAAO,IAAI,KAAK;AAE7F,QAAM,aAAa,aAAa,cAAc,KAAK,sBAAA,cAACC,6BAAA,EAAiB,MAAK,QAAO;AAEjF,QAAM,YAAY,GAAG,wBAAwB,MAAM,SAAS;AAE5D,SACI,sBAAA,cAAC,SAAK,GAAG,YAAY,WAAsB,aAAU,kBAAiB,KAAK,YAAA,GACtE,SAAS;AAAA,IAAI,CAAC,OAAO,UAClB,MAAM,aAAa,OAAO;AAAA,MACtB,WAAW,GAAG,MAAM,MAAM,WAAW;AAAA,QACjC,SAAS,0BAA0B,UAAa,QAAQ;AAAA,QACxD,6CACI,0BAA0B,UAAa,SAAS;AAAA,MAAA,CACvD;AAAA,IAAA,CACJ;AAAA,EAAA,GAEJ,eAAe,SACV,MAAM,aAAa,YAAY;AAAA,IAC3B,WAAW,GAAG,6BAA6B,WAAW,MAAM,SAAS;AAAA,IACrE,wBAAwB;AAAA,IACxB,MAAM,CAAC,cACH,sBAAA,cAACL,KAAAA,MAAA,EAAM,GAAG,UAAA,GACN,sBAAA,cAACA,KAAAA,KAAK,SAAL,MACI,eAAe;AAAA,MAAI,CAAC,OAAO,UACxB,gDACKA,KAAAA,KAAK,MAAL,EAAU,KAAK,MAAA,GAAQ,KAAM,IAE9B,+BAA+B,OAAO,KAAK;AAAA,IAAA,CAGvD,CACJ;AAAA,IAEJ,KAAK;AAAA,EAAA,CACR,IACD,IACV;AAER,CAAC;;"}
+{"version":3,"file":"OverflowGroup.cjs","sources":["../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport type { LegacyButtonProps } from '../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../Menu/Menu';\nimport { Menu } from '../Menu/Menu';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: React.JSX.Element, index: number) => {\n    const href: string | undefined = button.props.to || button.props.href;\n    const Tag = href ? Menu.Link : Menu.Item;\n\n    // Removing className prop so that custom styling cannot be applied on Menu.Link\n    const {\n        as,\n        className: _,\n        appearance: _1,\n        drawer: _2,\n        fluid: _3,\n        hanger: _4,\n        menu: _5,\n        popover: _6,\n        tooltip: _7,\n        ...attributes\n    } = button.props;\n\n    const props = {\n        ...attributes,\n        key: index,\n        target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n    };\n\n    if (as) {\n        return React.cloneElement(button, { as: Tag, ...props });\n    }\n\n    return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n    moreButton?: (moreButtonText: string) => React.ReactElement<LegacyButtonProps>;\n    wrapChild?: true | undefined;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { moreButton, wrapChild, ...attributes } = props;\n    const internalRef = useMergedRef<HTMLDivElement>(ref);\n    // determine width of more button, to add intersection observer margin\n    const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n    const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n    const { texts } = useLocalization();\n\n    const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n    const children = React.Children.toArray(props.children) as React.ReactElement<LegacyButtonProps>[];\n    const hiddenChildren = intersectedChildIndex === undefined ? [] : children.slice(intersectedChildIndex);\n    const hiddenChildrenCount = hiddenChildren.length;\n    const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n    const MoreButton = moreButton?.(moreButtonText) ?? <LegacyIconButton icon=\"more\" />;\n\n    const className = cn('flex overflow-hidden', props.className);\n\n    return (\n        <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n            {children.map((child, index) =>\n                React.cloneElement(child, {\n                    className: cn(child.props.className, {\n                        visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n                        'pointer-events-none invisible order-[100]':\n                            intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n                    }),\n                })\n            )}\n            {hiddenChildren.length\n                ? React.cloneElement(MoreButton, {\n                      className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n                      'data-observer-ignore': true,\n                      menu: (menuProps: MenuProps) => (\n                          <Menu {...menuProps}>\n                              <Menu.Content>\n                                  {hiddenChildren.map((child, index) =>\n                                      wrapChild ? (\n                                          <Menu.Item key={index}>{child}</Menu.Item>\n                                      ) : (\n                                          sanitizeButtonPropsForMenuItem(child, index)\n                                      )\n                                  )}\n                              </Menu.Content>\n                          </Menu>\n                      ),\n                      ref: buttonRefCallback,\n                  })\n                : null}\n        </div>\n    );\n});\n"],"names":["Menu","OverflowGroup","useMergedRef","useLocalization","useIntersectionObserver","LegacyIconButton"],"mappings":";;;;;;;;;AAWA,MAAM,iCAAiC,CAAC,QAA2B,UAAkB;AACjF,QAAM,OAA2B,OAAO,MAAM,MAAM,OAAO,MAAM;AACjE,QAAM,MAAM,OAAOA,KAAAA,KAAK,OAAOA,KAAAA,KAAK;AAGpC,QAAM;AAAA,IACF;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACH,OAAO;AAEX,QAAM,QAAQ;AAAA,IACV,GAAG;AAAA,IACH,KAAK;AAAA,IACL,QAAQ,OAAQ,KAAK,WAAW,MAAM,IAAI,WAAW,UAAW;AAAA,EAAA;AAGpE,MAAI,IAAI;AACJ,WAAO,MAAM,aAAa,QAAQ,EAAE,IAAI,KAAK,GAAG,OAAO;AAAA,EAC3D;AAEA,SAAO,sBAAA,cAAC,KAAA,EAAK,GAAG,MAAA,CAAO;AAC3B;AAOA,MAAM,iBAAiB,KAAK;AAErB,MAAM,gBAAgB,MAAM,WAAW,SAASC,eAAc,OAA2B,KAAgC;AAC5H,QAAM,EAAE,YAAY,WAAW,GAAG,eAAe;AACjD,QAAM,cAAcC,aAAAA,aAA6B,GAAG;AAEpD,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAS,cAAc;AACnE,QAAM,oBAAoB,MAAM,YAAY,CAAC,OAAoB,eAAe,IAAI,sBAAA,GAAyB,KAAK,GAAG,CAAA,CAAE;AACvH,QAAM,EAAE,MAAA,IAAUC,6BAAA;AAElB,QAAM,wBAAwBC,wBAAAA,wBAAwB,aAAa,WAAW;AAC9E,QAAM,WAAW,MAAM,SAAS,QAAQ,MAAM,QAAQ;AACtD,QAAM,iBAAiB,0BAA0B,SAAY,CAAA,IAAK,SAAS,MAAM,qBAAqB;AACtG,QAAM,sBAAsB,eAAe;AAC3C,QAAM,iBAAiB,sBAAsB,GAAG,mBAAmB,IAAI,MAAM,OAAO,IAAI,KAAK;AAE7F,QAAM,aAAa,aAAa,cAAc,KAAK,sBAAA,cAACC,6BAAA,EAAiB,MAAK,QAAO;AAEjF,QAAM,YAAY,GAAG,wBAAwB,MAAM,SAAS;AAE5D,SACI,sBAAA,cAAC,SAAK,GAAG,YAAY,WAAsB,aAAU,kBAAiB,KAAK,YAAA,GACtE,SAAS;AAAA,IAAI,CAAC,OAAO,UAClB,MAAM,aAAa,OAAO;AAAA,MACtB,WAAW,GAAG,MAAM,MAAM,WAAW;AAAA,QACjC,SAAS,0BAA0B,UAAa,QAAQ;AAAA,QACxD,6CACI,0BAA0B,UAAa,SAAS;AAAA,MAAA,CACvD;AAAA,IAAA,CACJ;AAAA,EAAA,GAEJ,eAAe,SACV,MAAM,aAAa,YAAY;AAAA,IAC3B,WAAW,GAAG,6BAA6B,WAAW,MAAM,SAAS;AAAA,IACrE,wBAAwB;AAAA,IACxB,MAAM,CAAC,cACH,sBAAA,cAACL,KAAAA,MAAA,EAAM,GAAG,UAAA,GACN,sBAAA,cAACA,KAAAA,KAAK,SAAL,MACI,eAAe;AAAA,MAAI,CAAC,OAAO,UACxB,gDACKA,KAAAA,KAAK,MAAL,EAAU,KAAK,MAAA,GAAQ,KAAM,IAE9B,+BAA+B,OAAO,KAAK;AAAA,IAAA,CAGvD,CACJ;AAAA,IAEJ,KAAK;AAAA,EAAA,CACR,IACD,IACV;AAER,CAAC;;"}

package/dist/components/OverflowGroup/OverflowGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"OverflowGroup.js","sources":["../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport type { LegacyButtonProps } from '../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../Menu/Menu';\nimport { Menu } from '../Menu/Menu';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: JSX.Element, index: number) => {\n    const href: string | undefined = button.props.to || button.props.href;\n    const Tag = href ? Menu.Link : Menu.Item;\n\n    // Removing className prop so that custom styling cannot be applied on Menu.Link\n    const {\n        as,\n        className: _,\n        appearance: _1,\n        drawer: _2,\n        fluid: _3,\n        hanger: _4,\n        menu: _5,\n        popover: _6,\n        tooltip: _7,\n        ...attributes\n    } = button.props;\n\n    const props = {\n        ...attributes,\n        key: index,\n        target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n    };\n\n    if (as) {\n        return React.cloneElement(button, { as: Tag, ...props });\n    }\n\n    return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n    moreButton?: (moreButtonText: string) => React.ReactElement<LegacyButtonProps>;\n    wrapChild?: true | undefined;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { moreButton, wrapChild, ...attributes } = props;\n    const internalRef = useMergedRef<HTMLDivElement>(ref);\n    // determine width of more button, to add intersection observer margin\n    const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n    const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n    const { texts } = useLocalization();\n\n    const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n    const children = React.Children.toArray(props.children) as React.ReactElement<LegacyButtonProps>[];\n    const hiddenChildren = intersectedChildIndex === undefined ? [] : children.slice(intersectedChildIndex);\n    const hiddenChildrenCount = hiddenChildren.length;\n    const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n    const MoreButton = moreButton?.(moreButtonText) ?? <LegacyIconButton icon=\"more\" />;\n\n    const className = cn('flex overflow-hidden', props.className);\n\n    return (\n        <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n            {children.map((child, index) =>\n                React.cloneElement(child, {\n                    className: cn(child.props.className, {\n                        visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n                        'pointer-events-none invisible order-[100]':\n                            intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n                    }),\n                })\n            )}\n            {hiddenChildren.length\n                ? React.cloneElement(MoreButton, {\n                      className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n                      'data-observer-ignore': true,\n                      menu: (menuProps: MenuProps) => (\n                          <Menu {...menuProps}>\n                              <Menu.Content>\n                                  {hiddenChildren.map((child, index) =>\n                                      wrapChild ? (\n                                          <Menu.Item key={index}>{child}</Menu.Item>\n                                      ) : (\n                                          sanitizeButtonPropsForMenuItem(child, index)\n                                      )\n                                  )}\n                              </Menu.Content>\n                          </Menu>\n                      ),\n                      ref: buttonRefCallback,\n                  })\n                : null}\n        </div>\n    );\n});\n"],"names":["React","OverflowGroup"],"mappings":";;;;;;;AAWA,MAAM,iCAAiC,CAAC,QAAqB,UAAkB;AAC3E,QAAM,OAA2B,OAAO,MAAM,MAAM,OAAO,MAAM;AACjE,QAAM,MAAM,OAAO,KAAK,OAAO,KAAK;AAGpC,QAAM;AAAA,IACF;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACH,OAAO;AAEX,QAAM,QAAQ;AAAA,IACV,GAAG;AAAA,IACH,KAAK;AAAA,IACL,QAAQ,OAAQ,KAAK,WAAW,MAAM,IAAI,WAAW,UAAW;AAAA,EAAA;AAGpE,MAAI,IAAI;AACJ,WAAOA,eAAM,aAAa,QAAQ,EAAE,IAAI,KAAK,GAAG,OAAO;AAAA,EAC3D;AAEA,SAAOA,+BAAA,cAAC,KAAA,EAAK,GAAG,MAAA,CAAO;AAC3B;AAOA,MAAM,iBAAiB,KAAK;AAErB,MAAM,gBAAgBA,eAAM,WAAW,SAASC,eAAc,OAA2B,KAAgC;AAC5H,QAAM,EAAE,YAAY,WAAW,GAAG,eAAe;AACjD,QAAM,cAAc,aAA6B,GAAG;AAEpD,QAAM,CAAC,aAAa,cAAc,IAAID,eAAM,SAAS,cAAc;AACnE,QAAM,oBAAoBA,eAAM,YAAY,CAAC,OAAoB,eAAe,IAAI,sBAAA,GAAyB,KAAK,GAAG,CAAA,CAAE;AACvH,QAAM,EAAE,MAAA,IAAU,gBAAA;AAElB,QAAM,wBAAwB,wBAAwB,aAAa,WAAW;AAC9E,QAAM,WAAWA,eAAM,SAAS,QAAQ,MAAM,QAAQ;AACtD,QAAM,iBAAiB,0BAA0B,SAAY,CAAA,IAAK,SAAS,MAAM,qBAAqB;AACtG,QAAM,sBAAsB,eAAe;AAC3C,QAAM,iBAAiB,sBAAsB,GAAG,mBAAmB,IAAI,MAAM,OAAO,IAAI,KAAK;AAE7F,QAAM,aAAa,aAAa,cAAc,KAAKA,+BAAA,cAAC,kBAAA,EAAiB,MAAK,QAAO;AAEjF,QAAM,YAAY,GAAG,wBAAwB,MAAM,SAAS;AAE5D,SACIA,+BAAA,cAAC,SAAK,GAAG,YAAY,WAAsB,aAAU,kBAAiB,KAAK,YAAA,GACtE,SAAS;AAAA,IAAI,CAAC,OAAO,UAClBA,eAAM,aAAa,OAAO;AAAA,MACtB,WAAW,GAAG,MAAM,MAAM,WAAW;AAAA,QACjC,SAAS,0BAA0B,UAAa,QAAQ;AAAA,QACxD,6CACI,0BAA0B,UAAa,SAAS;AAAA,MAAA,CACvD;AAAA,IAAA,CACJ;AAAA,EAAA,GAEJ,eAAe,SACVA,eAAM,aAAa,YAAY;AAAA,IAC3B,WAAW,GAAG,6BAA6B,WAAW,MAAM,SAAS;AAAA,IACrE,wBAAwB;AAAA,IACxB,MAAM,CAAC,cACHA,+BAAA,cAAC,MAAA,EAAM,GAAG,UAAA,GACNA,+BAAA,cAAC,KAAK,SAAL,MACI,eAAe;AAAA,MAAI,CAAC,OAAO,UACxB,yDACK,KAAK,MAAL,EAAU,KAAK,MAAA,GAAQ,KAAM,IAE9B,+BAA+B,OAAO,KAAK;AAAA,IAAA,CAGvD,CACJ;AAAA,IAEJ,KAAK;AAAA,EAAA,CACR,IACD,IACV;AAER,CAAC;"}
+{"version":3,"file":"OverflowGroup.js","sources":["../../../src/components/OverflowGroup/OverflowGroup.tsx"],"sourcesContent":["import cn from 'clsx';\nimport React from 'react';\n\nimport { useIntersectionObserver } from '../../hooks/useIntersectionObserver';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport type { LegacyButtonProps } from '../LegacyComponents/Button/Button';\nimport { LegacyIconButton } from '../LegacyComponents/IconButton/IconButton';\nimport type { MenuProps } from '../Menu/Menu';\nimport { Menu } from '../Menu/Menu';\nimport { useLocalization } from '../Provider/Localization';\n\nconst sanitizeButtonPropsForMenuItem = (button: React.JSX.Element, index: number) => {\n    const href: string | undefined = button.props.to || button.props.href;\n    const Tag = href ? Menu.Link : Menu.Item;\n\n    // Removing className prop so that custom styling cannot be applied on Menu.Link\n    const {\n        as,\n        className: _,\n        appearance: _1,\n        drawer: _2,\n        fluid: _3,\n        hanger: _4,\n        menu: _5,\n        popover: _6,\n        tooltip: _7,\n        ...attributes\n    } = button.props;\n\n    const props = {\n        ...attributes,\n        key: index,\n        target: href ? (href.startsWith('http') ? '_blank' : '_self') : undefined,\n    };\n\n    if (as) {\n        return React.cloneElement(button, { as: Tag, ...props });\n    }\n\n    return <Tag {...props} />;\n};\n\ntype OverflowGroupProps = React.HTMLAttributes<HTMLElement> & {\n    moreButton?: (moreButtonText: string) => React.ReactElement<LegacyButtonProps>;\n    wrapChild?: true | undefined;\n};\n\nconst DEFAULT_OFFSET = 32 + 8;\n\nexport const OverflowGroup = React.forwardRef(function OverflowGroup(props: OverflowGroupProps, ref: React.Ref<HTMLDivElement>) {\n    const { moreButton, wrapChild, ...attributes } = props;\n    const internalRef = useMergedRef<HTMLDivElement>(ref);\n    // determine width of more button, to add intersection observer margin\n    const [buttonWidth, setButtonWidth] = React.useState(DEFAULT_OFFSET);\n    const buttonRefCallback = React.useCallback((el: HTMLElement) => setButtonWidth(el?.getBoundingClientRect()?.width), []);\n    const { texts } = useLocalization();\n\n    const intersectedChildIndex = useIntersectionObserver(internalRef, buttonWidth);\n    const children = React.Children.toArray(props.children) as React.ReactElement<LegacyButtonProps>[];\n    const hiddenChildren = intersectedChildIndex === undefined ? [] : children.slice(intersectedChildIndex);\n    const hiddenChildrenCount = hiddenChildren.length;\n    const moreButtonText = hiddenChildrenCount ? `${hiddenChildrenCount} ${texts.header.more}` : '';\n\n    const MoreButton = moreButton?.(moreButtonText) ?? <LegacyIconButton icon=\"more\" />;\n\n    const className = cn('flex overflow-hidden', props.className);\n\n    return (\n        <div {...attributes} className={className} data-taco=\"overflow-group\" ref={internalRef}>\n            {children.map((child, index) =>\n                React.cloneElement(child, {\n                    className: cn(child.props.className, {\n                        visible: intersectedChildIndex === undefined || index < intersectedChildIndex,\n                        'pointer-events-none invisible order-[100]':\n                            intersectedChildIndex !== undefined && index >= intersectedChildIndex,\n                    }),\n                })\n            )}\n            {hiddenChildren.length\n                ? React.cloneElement(MoreButton, {\n                      className: cn('sticky right-0 order-[99]', MoreButton.props.className),\n                      'data-observer-ignore': true,\n                      menu: (menuProps: MenuProps) => (\n                          <Menu {...menuProps}>\n                              <Menu.Content>\n                                  {hiddenChildren.map((child, index) =>\n                                      wrapChild ? (\n                                          <Menu.Item key={index}>{child}</Menu.Item>\n                                      ) : (\n                                          sanitizeButtonPropsForMenuItem(child, index)\n                                      )\n                                  )}\n                              </Menu.Content>\n                          </Menu>\n                      ),\n                      ref: buttonRefCallback,\n                  })\n                : null}\n        </div>\n    );\n});\n"],"names":["React","OverflowGroup"],"mappings":";;;;;;;AAWA,MAAM,iCAAiC,CAAC,QAA2B,UAAkB;AACjF,QAAM,OAA2B,OAAO,MAAM,MAAM,OAAO,MAAM;AACjE,QAAM,MAAM,OAAO,KAAK,OAAO,KAAK;AAGpC,QAAM;AAAA,IACF;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ,QAAQ;AAAA,IACR,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,IACT,GAAG;AAAA,EAAA,IACH,OAAO;AAEX,QAAM,QAAQ;AAAA,IACV,GAAG;AAAA,IACH,KAAK;AAAA,IACL,QAAQ,OAAQ,KAAK,WAAW,MAAM,IAAI,WAAW,UAAW;AAAA,EAAA;AAGpE,MAAI,IAAI;AACJ,WAAOA,eAAM,aAAa,QAAQ,EAAE,IAAI,KAAK,GAAG,OAAO;AAAA,EAC3D;AAEA,SAAOA,+BAAA,cAAC,KAAA,EAAK,GAAG,MAAA,CAAO;AAC3B;AAOA,MAAM,iBAAiB,KAAK;AAErB,MAAM,gBAAgBA,eAAM,WAAW,SAASC,eAAc,OAA2B,KAAgC;AAC5H,QAAM,EAAE,YAAY,WAAW,GAAG,eAAe;AACjD,QAAM,cAAc,aAA6B,GAAG;AAEpD,QAAM,CAAC,aAAa,cAAc,IAAID,eAAM,SAAS,cAAc;AACnE,QAAM,oBAAoBA,eAAM,YAAY,CAAC,OAAoB,eAAe,IAAI,sBAAA,GAAyB,KAAK,GAAG,CAAA,CAAE;AACvH,QAAM,EAAE,MAAA,IAAU,gBAAA;AAElB,QAAM,wBAAwB,wBAAwB,aAAa,WAAW;AAC9E,QAAM,WAAWA,eAAM,SAAS,QAAQ,MAAM,QAAQ;AACtD,QAAM,iBAAiB,0BAA0B,SAAY,CAAA,IAAK,SAAS,MAAM,qBAAqB;AACtG,QAAM,sBAAsB,eAAe;AAC3C,QAAM,iBAAiB,sBAAsB,GAAG,mBAAmB,IAAI,MAAM,OAAO,IAAI,KAAK;AAE7F,QAAM,aAAa,aAAa,cAAc,KAAKA,+BAAA,cAAC,kBAAA,EAAiB,MAAK,QAAO;AAEjF,QAAM,YAAY,GAAG,wBAAwB,MAAM,SAAS;AAE5D,SACIA,+BAAA,cAAC,SAAK,GAAG,YAAY,WAAsB,aAAU,kBAAiB,KAAK,YAAA,GACtE,SAAS;AAAA,IAAI,CAAC,OAAO,UAClBA,eAAM,aAAa,OAAO;AAAA,MACtB,WAAW,GAAG,MAAM,MAAM,WAAW;AAAA,QACjC,SAAS,0BAA0B,UAAa,QAAQ;AAAA,QACxD,6CACI,0BAA0B,UAAa,SAAS;AAAA,MAAA,CACvD;AAAA,IAAA,CACJ;AAAA,EAAA,GAEJ,eAAe,SACVA,eAAM,aAAa,YAAY;AAAA,IAC3B,WAAW,GAAG,6BAA6B,WAAW,MAAM,SAAS;AAAA,IACrE,wBAAwB;AAAA,IACxB,MAAM,CAAC,cACHA,+BAAA,cAAC,MAAA,EAAM,GAAG,UAAA,GACNA,+BAAA,cAAC,KAAK,SAAL,MACI,eAAe;AAAA,MAAI,CAAC,OAAO,UACxB,yDACK,KAAK,MAAL,EAAU,KAAK,MAAA,GAAQ,KAAM,IAE9B,+BAA+B,OAAO,KAAK;AAAA,IAAA,CAGvD,CACJ;AAAA,IAEJ,KAAK;AAAA,EAAA,CACR,IACD,IACV;AAER,CAAC;"}

package/dist/components/Pagination/PageNumbers.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PageNumbers.cjs","sources":["../../../src/components/Pagination/PageNumbers.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Inline } from '../Inline/Inline';\nimport { LegacyButton } from '../LegacyComponents/Button/Button';\nimport { useLocalization } from '../Provider/Localization';\n\ntype PageNumberProps = {\n    currentPageIndex: number;\n    onClick: (pageIndex: number) => void;\n    pageCount: number;\n};\n\nconst createPageRange = (pageCount: number, pageNumber: number): number[] => {\n    let lowerLimit = Math.min(pageNumber, pageCount);\n    let upperLimit = Math.min(pageNumber, pageCount);\n\n    for (let b = 1; b < 5 && b < pageCount;) {\n        if (lowerLimit > 1) {\n            lowerLimit--;\n            b++;\n        }\n        if (b < 5 && upperLimit < pageCount) {\n            upperLimit++;\n            b++;\n        }\n    }\n\n    const range: number[] = [];\n\n    for (let i = lowerLimit; i <= upperLimit; i++) {\n        range.push(i);\n    }\n\n    return range;\n};\n\nexport const PageNumbers = ({ currentPageIndex = 0, onClick: handleClick, pageCount }: PageNumberProps): JSX.Element => {\n    const range = createPageRange(pageCount, currentPageIndex + 1);\n    const { texts } = useLocalization();\n\n    return (\n        <Inline spacing={8}>\n            {range.map((pageNumber: number) => (\n                <LegacyButton\n                    appearance={pageNumber === currentPageIndex + 1 ? 'primary' : 'default'}\n                    aria-current={pageNumber === currentPageIndex + 1 ? 'page' : undefined}\n                    key={pageNumber}\n                    onClick={() => handleClick(pageNumber - 1)}\n                    aria-label={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}\n                    tooltip={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}>\n                    {pageNumber}\n                </LegacyButton>\n            ))}\n        </Inline>\n    );\n};\n"],"names":["useLocalization","Inline","React","LegacyButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,kBAAkB,CAAC,WAAmB,eAAiC;AACzE,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAC/C,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAE/C,WAAS,IAAI,GAAG,IAAI,KAAK,IAAI,aAAY;AACrC,QAAI,aAAa,GAAG;AAChB;AACA;AAAA,IACJ;AACA,QAAI,IAAI,KAAK,aAAa,WAAW;AACjC;AACA;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,QAAkB,CAAA;AAExB,WAAS,IAAI,YAAY,KAAK,YAAY,KAAK;AAC3C,UAAM,KAAK,CAAC;AAAA,EAChB;AAEA,SAAO;AACX;AAEO,MAAM,cAAc,CAAC,EAAE,mBAAmB,GAAG,SAAS,aAAa,gBAA8C;AACpH,QAAM,QAAQ,gBAAgB,WAAW,mBAAmB,CAAC;AAC7D,QAAM,EAAE,MAAA,IAAUA,6BAAA;AAElB,wDACKC,OAAAA,QAAA,EAAO,SAAS,KACZ,MAAM,IAAI,CAAC,eACRC,iCAAA;AAAA,IAACC,OAAAA;AAAAA,IAAA;AAAA,MACG,YAAY,eAAe,mBAAmB,IAAI,YAAY;AAAA,MAC9D,gBAAc,eAAe,mBAAmB,IAAI,SAAS;AAAA,MAC7D,KAAK;AAAA,MACL,SAAS,MAAM,YAAY,aAAa,CAAC;AAAA,MACzC,cAAY,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MAC5E,SAAS,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,IAAA;AAAA,IACxE;AAAA,EAAA,CAER,CACL;AAER;;"}
+{"version":3,"file":"PageNumbers.cjs","sources":["../../../src/components/Pagination/PageNumbers.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Inline } from '../Inline/Inline';\nimport { LegacyButton } from '../LegacyComponents/Button/Button';\nimport { useLocalization } from '../Provider/Localization';\n\ntype PageNumberProps = {\n    currentPageIndex: number;\n    onClick: (pageIndex: number) => void;\n    pageCount: number;\n};\n\nconst createPageRange = (pageCount: number, pageNumber: number): number[] => {\n    let lowerLimit = Math.min(pageNumber, pageCount);\n    let upperLimit = Math.min(pageNumber, pageCount);\n\n    for (let b = 1; b < 5 && b < pageCount;) {\n        if (lowerLimit > 1) {\n            lowerLimit--;\n            b++;\n        }\n        if (b < 5 && upperLimit < pageCount) {\n            upperLimit++;\n            b++;\n        }\n    }\n\n    const range: number[] = [];\n\n    for (let i = lowerLimit; i <= upperLimit; i++) {\n        range.push(i);\n    }\n\n    return range;\n};\n\nexport const PageNumbers = ({ currentPageIndex = 0, onClick: handleClick, pageCount }: PageNumberProps): React.JSX.Element => {\n    const range = createPageRange(pageCount, currentPageIndex + 1);\n    const { texts } = useLocalization();\n\n    return (\n        <Inline spacing={8}>\n            {range.map((pageNumber: number) => (\n                <LegacyButton\n                    appearance={pageNumber === currentPageIndex + 1 ? 'primary' : 'default'}\n                    aria-current={pageNumber === currentPageIndex + 1 ? 'page' : undefined}\n                    key={pageNumber}\n                    onClick={() => handleClick(pageNumber - 1)}\n                    aria-label={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}\n                    tooltip={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}>\n                    {pageNumber}\n                </LegacyButton>\n            ))}\n        </Inline>\n    );\n};\n"],"names":["useLocalization","Inline","React","LegacyButton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,kBAAkB,CAAC,WAAmB,eAAiC;AACzE,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAC/C,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAE/C,WAAS,IAAI,GAAG,IAAI,KAAK,IAAI,aAAY;AACrC,QAAI,aAAa,GAAG;AAChB;AACA;AAAA,IACJ;AACA,QAAI,IAAI,KAAK,aAAa,WAAW;AACjC;AACA;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,QAAkB,CAAA;AAExB,WAAS,IAAI,YAAY,KAAK,YAAY,KAAK;AAC3C,UAAM,KAAK,CAAC;AAAA,EAChB;AAEA,SAAO;AACX;AAEO,MAAM,cAAc,CAAC,EAAE,mBAAmB,GAAG,SAAS,aAAa,gBAAoD;AAC1H,QAAM,QAAQ,gBAAgB,WAAW,mBAAmB,CAAC;AAC7D,QAAM,EAAE,MAAA,IAAUA,6BAAA;AAElB,wDACKC,OAAAA,QAAA,EAAO,SAAS,KACZ,MAAM,IAAI,CAAC,eACRC,iCAAA;AAAA,IAACC,OAAAA;AAAAA,IAAA;AAAA,MACG,YAAY,eAAe,mBAAmB,IAAI,YAAY;AAAA,MAC9D,gBAAc,eAAe,mBAAmB,IAAI,SAAS;AAAA,MAC7D,KAAK;AAAA,MACL,SAAS,MAAM,YAAY,aAAa,CAAC;AAAA,MACzC,cAAY,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MAC5E,SAAS,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,IAAA;AAAA,IACxE;AAAA,EAAA,CAER,CACL;AAER;;"}

package/dist/components/Pagination/PageNumbers.d.ts

@@ -1,7 +1,8 @@
+import * as React from 'react';
 type PageNumberProps = {
     currentPageIndex: number;
     onClick: (pageIndex: number) => void;
     pageCount: number;
 };
-export declare const PageNumbers: ({ currentPageIndex, onClick: handleClick, pageCount }: PageNumberProps) => JSX.Element;
+export declare const PageNumbers: ({ currentPageIndex, onClick: handleClick, pageCount }: PageNumberProps) => React.JSX.Element;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"PageNumbers.js","sources":["../../../src/components/Pagination/PageNumbers.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Inline } from '../Inline/Inline';\nimport { LegacyButton } from '../LegacyComponents/Button/Button';\nimport { useLocalization } from '../Provider/Localization';\n\ntype PageNumberProps = {\n    currentPageIndex: number;\n    onClick: (pageIndex: number) => void;\n    pageCount: number;\n};\n\nconst createPageRange = (pageCount: number, pageNumber: number): number[] => {\n    let lowerLimit = Math.min(pageNumber, pageCount);\n    let upperLimit = Math.min(pageNumber, pageCount);\n\n    for (let b = 1; b < 5 && b < pageCount;) {\n        if (lowerLimit > 1) {\n            lowerLimit--;\n            b++;\n        }\n        if (b < 5 && upperLimit < pageCount) {\n            upperLimit++;\n            b++;\n        }\n    }\n\n    const range: number[] = [];\n\n    for (let i = lowerLimit; i <= upperLimit; i++) {\n        range.push(i);\n    }\n\n    return range;\n};\n\nexport const PageNumbers = ({ currentPageIndex = 0, onClick: handleClick, pageCount }: PageNumberProps): JSX.Element => {\n    const range = createPageRange(pageCount, currentPageIndex + 1);\n    const { texts } = useLocalization();\n\n    return (\n        <Inline spacing={8}>\n            {range.map((pageNumber: number) => (\n                <LegacyButton\n                    appearance={pageNumber === currentPageIndex + 1 ? 'primary' : 'default'}\n                    aria-current={pageNumber === currentPageIndex + 1 ? 'page' : undefined}\n                    key={pageNumber}\n                    onClick={() => handleClick(pageNumber - 1)}\n                    aria-label={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}\n                    tooltip={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}>\n                    {pageNumber}\n                </LegacyButton>\n            ))}\n        </Inline>\n    );\n};\n"],"names":[],"mappings":";;;;AAYA,MAAM,kBAAkB,CAAC,WAAmB,eAAiC;AACzE,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAC/C,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAE/C,WAAS,IAAI,GAAG,IAAI,KAAK,IAAI,aAAY;AACrC,QAAI,aAAa,GAAG;AAChB;AACA;AAAA,IACJ;AACA,QAAI,IAAI,KAAK,aAAa,WAAW;AACjC;AACA;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,QAAkB,CAAA;AAExB,WAAS,IAAI,YAAY,KAAK,YAAY,KAAK;AAC3C,UAAM,KAAK,CAAC;AAAA,EAChB;AAEA,SAAO;AACX;AAEO,MAAM,cAAc,CAAC,EAAE,mBAAmB,GAAG,SAAS,aAAa,gBAA8C;AACpH,QAAM,QAAQ,gBAAgB,WAAW,mBAAmB,CAAC;AAC7D,QAAM,EAAE,MAAA,IAAU,gBAAA;AAElB,6CACK,QAAA,EAAO,SAAS,KACZ,MAAM,IAAI,CAAC,eACR,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,YAAY,eAAe,mBAAmB,IAAI,YAAY;AAAA,MAC9D,gBAAc,eAAe,mBAAmB,IAAI,SAAS;AAAA,MAC7D,KAAK;AAAA,MACL,SAAS,MAAM,YAAY,aAAa,CAAC;AAAA,MACzC,cAAY,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MAC5E,SAAS,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,IAAA;AAAA,IACxE;AAAA,EAAA,CAER,CACL;AAER;"}
+{"version":3,"file":"PageNumbers.js","sources":["../../../src/components/Pagination/PageNumbers.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Inline } from '../Inline/Inline';\nimport { LegacyButton } from '../LegacyComponents/Button/Button';\nimport { useLocalization } from '../Provider/Localization';\n\ntype PageNumberProps = {\n    currentPageIndex: number;\n    onClick: (pageIndex: number) => void;\n    pageCount: number;\n};\n\nconst createPageRange = (pageCount: number, pageNumber: number): number[] => {\n    let lowerLimit = Math.min(pageNumber, pageCount);\n    let upperLimit = Math.min(pageNumber, pageCount);\n\n    for (let b = 1; b < 5 && b < pageCount;) {\n        if (lowerLimit > 1) {\n            lowerLimit--;\n            b++;\n        }\n        if (b < 5 && upperLimit < pageCount) {\n            upperLimit++;\n            b++;\n        }\n    }\n\n    const range: number[] = [];\n\n    for (let i = lowerLimit; i <= upperLimit; i++) {\n        range.push(i);\n    }\n\n    return range;\n};\n\nexport const PageNumbers = ({ currentPageIndex = 0, onClick: handleClick, pageCount }: PageNumberProps): React.JSX.Element => {\n    const range = createPageRange(pageCount, currentPageIndex + 1);\n    const { texts } = useLocalization();\n\n    return (\n        <Inline spacing={8}>\n            {range.map((pageNumber: number) => (\n                <LegacyButton\n                    appearance={pageNumber === currentPageIndex + 1 ? 'primary' : 'default'}\n                    aria-current={pageNumber === currentPageIndex + 1 ? 'page' : undefined}\n                    key={pageNumber}\n                    onClick={() => handleClick(pageNumber - 1)}\n                    aria-label={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}\n                    tooltip={texts.pagination.actions.pageX.replace('[X]', String(pageNumber))}>\n                    {pageNumber}\n                </LegacyButton>\n            ))}\n        </Inline>\n    );\n};\n"],"names":[],"mappings":";;;;AAYA,MAAM,kBAAkB,CAAC,WAAmB,eAAiC;AACzE,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAC/C,MAAI,aAAa,KAAK,IAAI,YAAY,SAAS;AAE/C,WAAS,IAAI,GAAG,IAAI,KAAK,IAAI,aAAY;AACrC,QAAI,aAAa,GAAG;AAChB;AACA;AAAA,IACJ;AACA,QAAI,IAAI,KAAK,aAAa,WAAW;AACjC;AACA;AAAA,IACJ;AAAA,EACJ;AAEA,QAAM,QAAkB,CAAA;AAExB,WAAS,IAAI,YAAY,KAAK,YAAY,KAAK;AAC3C,UAAM,KAAK,CAAC;AAAA,EAChB;AAEA,SAAO;AACX;AAEO,MAAM,cAAc,CAAC,EAAE,mBAAmB,GAAG,SAAS,aAAa,gBAAoD;AAC1H,QAAM,QAAQ,gBAAgB,WAAW,mBAAmB,CAAC;AAC7D,QAAM,EAAE,MAAA,IAAU,gBAAA;AAElB,6CACK,QAAA,EAAO,SAAS,KACZ,MAAM,IAAI,CAAC,eACR,sBAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,YAAY,eAAe,mBAAmB,IAAI,YAAY;AAAA,MAC9D,gBAAc,eAAe,mBAAmB,IAAI,SAAS;AAAA,MAC7D,KAAK;AAAA,MACL,SAAS,MAAM,YAAY,aAAa,CAAC;AAAA,MACzC,cAAY,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,MAC5E,SAAS,MAAM,WAAW,QAAQ,MAAM,QAAQ,OAAO,OAAO,UAAU,CAAC;AAAA,IAAA;AAAA,IACxE;AAAA,EAAA,CAER,CACL;AAER;"}

package/dist/components/Popover/Popover.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.cjs","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { Placement } from '../..';\nimport { mergeRefs } from '../../utils/mergeRefs';\n\nimport { UnstyledArrow } from './Primitives';\nimport { getPopoverStyleClassnames } from './util';\n\ntype PopoverContextValue = { props: any; ref: React.Ref<HTMLElement>; anchorRef: React.RefObject<HTMLElement> };\n\nconst PopoverContext = React.createContext<PopoverContextValue>({\n    anchorRef: { current: null },\n    props: {},\n    ref: null,\n});\n\nexport type PopoverAnchorProps = React.HTMLAttributes<HTMLElement> & {\n    children: React.ReactElement;\n};\nconst Anchor = React.forwardRef(function PopoverAnchor(props: PopoverAnchorProps, forwardedRef: React.Ref<HTMLDivElement>) {\n    const context = React.useContext(PopoverContext);\n\n    const ref = mergeRefs([context.anchorRef, forwardedRef]);\n\n    const { children, ...restProps } = props;\n\n    return <PopoverPrimitive.Trigger {...restProps} ref={ref} render={children} />;\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLElement> & {\n    children: React.ReactElement;\n    /**\n     * Whether the trigger renders a native `<button>` element.\n     * Set to `false` if the trigger child is not a button (e.g. `<input>`, `<div>`, '<span>', etc.).\n     * @default true\n     */\n    nativeButton?: boolean;\n};\nconst Trigger = React.forwardRef(function PopoverTrigger(props: PopoverTriggerProps, externalRef: React.Ref<HTMLElement>) {\n    const { ref: parentRef, props: parentProps } = React.useContext(PopoverContext);\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    let { children, nativeButton, ...restProps } = props;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        // oxlint-disable-next-line no-console\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Trigger\n            {...parentProps}\n            {...restProps}\n            nativeButton={nativeButton}\n            ref={refCallback}\n            render={children}\n        />\n    );\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\n\nexport type PopoverContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    container?: HTMLElement | null;\n    finalFocus?: PopoverPrimitive.Popup.Props['finalFocus'];\n    initialFocus?: PopoverPrimitive.Popup.Props['initialFocus'];\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef(function PopoverContent(props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { placement: side, container, ...popoverContentProps } = props;\n\n    const context = React.useContext(PopoverContext);\n\n    const className = cn(getPopoverStyleClassnames(), props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = <PopoverPrimitive.Close render={<RenderPropWrapper>{props.children}</RenderPropWrapper>} />;\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <PopoverPrimitive.Portal container={container}>\n            <PopoverPrimitive.Positioner side={side} sideOffset={8} anchor={context.anchorRef}>\n                <PopoverPrimitive.Popup {...popoverContentProps} className={className} data-taco=\"popover\" ref={ref}>\n                    <UnstyledArrow />\n                    {output}\n                </PopoverPrimitive.Popup>\n            </PopoverPrimitive.Positioner>\n        </PopoverPrimitive.Portal>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.ReactElement;\n};\nconst Close = React.forwardRef((props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): JSX.Element => {\n    const { children, ...restProps } = props;\n    return <PopoverPrimitive.Close {...restProps} ref={ref} render={children} />;\n});\n\nexport type PopoverProps = React.PropsWithChildren<{\n    anchor?: JSX.Element;\n    modal?: boolean | 'trap-focus';\n    /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */\n    trigger?: JSX.Element;\n    /** Set whether the popover is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Control the open state of the popover from outside the component  */\n    open?: boolean;\n    /** Called when the popover opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n}>;\nexport type ForwardedPopoverWithStatics = React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLElement>> & {\n    Anchor: React.ForwardRefExoticComponent<PopoverAnchorProps>;\n    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps>;\n    Content: React.ForwardRefExoticComponent<PopoverContentProps>;\n    Close: React.ForwardRefExoticComponent<PopoverCloseProps>;\n};\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(function Popover(props, ref) {\n    const { anchor, children, defaultOpen, modal = 'trap-focus', open, onChange, trigger, ...otherProps } = props;\n\n    const anchorRef = React.useRef(null);\n\n    const handleOpenChange = (open: boolean, eventDetails: PopoverPrimitive.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                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            }\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <PopoverContext.Provider value={{ anchorRef, props: otherProps, ref }}>\n            <PopoverPrimitive.Root defaultOpen={defaultOpen} modal={modal} open={open} onOpenChange={handleOpenChange}>\n                {anchor ? <Anchor>{anchor}</Anchor> : null}\n                {trigger && !anchor ? <Trigger>{trigger}</Trigger> : null}\n                {children}\n            </PopoverPrimitive.Root>\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Anchor = Anchor;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\n"],"names":["React","mergeRefs","PopoverPrimitive","RenderPropWrapper","getPopoverStyleClassnames","UnstyledArrow","Popover","open"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,iBAAiBA,iBAAM,cAAmC;AAAA,EAC5D,WAAW,EAAE,SAAS,KAAA;AAAA,EACtB,OAAO,CAAA;AAAA,EACP,KAAK;AACT,CAAC;AAKD,MAAM,SAASA,iBAAM,WAAW,SAAS,cAAc,OAA2B,cAAyC;AACvH,QAAM,UAAUA,iBAAM,WAAW,cAAc;AAE/C,QAAM,MAAMC,UAAAA,UAAU,CAAC,QAAQ,WAAW,YAAY,CAAC;AAEvD,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AAEnC,SAAOD,iCAAA,cAACE,MAAAA,QAAiB,SAAjB,EAA0B,GAAG,WAAW,KAAU,QAAQ,UAAU;AAChF,CAAC;AAWD,MAAM,UAAUF,iBAAM,WAAW,SAAS,eAAe,OAA4B,aAAqC;AACtH,QAAM,EAAE,KAAK,WAAW,OAAO,gBAAgBA,iBAAM,WAAW,cAAc;AAC9E,QAAM,cAAcC,UAAAA,UAAU,CAAC,WAAW,WAAW,CAAC;AAEtD,MAAI,EAAE,UAAU,cAAc,GAAG,cAAc;AAE/C,MAAID,iBAAM,eAAe,MAAM,QAAQ,KAAK,OAAO,MAAM,UAAU,SAAS,YAAY;AAEpF,YAAQ;AAAA,MACJ,oHAAoH,MAAM,SAAS,KAAK,IAAI,8CAA8C,MAAM,SAAS,KAAK,IAAI;AAAA,IAAA;AAEtN,eAAWA,iCAAA,cAAC,QAAA,MAAM,MAAM,QAAS;AAAA,EACrC;AAEA,SACIA,iCAAA;AAAA,IAACE,MAAAA,QAAiB;AAAA,IAAjB;AAAA,MACI,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,KAAK;AAAA,MACL,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGpB,CAAC;AAED,MAAM,oBAAoBF,iBAAM,WAAW,SAASG,mBAAkB,EAAE,UAAU,QAAA,GAAgB,KAAK;AACnG,QAAM,QAAQ,MAAM;AAChB,YAAQ,IAAI,YAAY,MAAM,CAAC;AAAA,EACnC;AAEA,SAAO,SAAS,EAAE,OAAO,KAAK;AAClC,CAAC;AAYD,MAAM,UAAUH,iBAAM,WAAW,SAAS,eAAe,OAA4B,KAAgC;AACjH,QAAM,EAAE,WAAW,MAAM,WAAW,GAAG,wBAAwB;AAE/D,QAAM,UAAUA,iBAAM,WAAW,cAAc;AAE/C,QAAM,YAAY,GAAGI,KAAAA,0BAAA,GAA6B,MAAM,SAAS;AAEjE,MAAI;AAEJ,MAAI,OAAO,MAAM,aAAa,YAAY;AACtC,aAASJ,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAuB,QAAQF,iCAAA,cAAC,mBAAA,MAAmB,MAAM,QAAS,EAAA,CAAsB;AAAA,EACtG,OAAO;AACH,aAAS,MAAM;AAAA,EACnB;AAEA,SACIA,iCAAA,cAACE,MAAAA,QAAiB,QAAjB,EAAwB,UAAA,GACrBF,iCAAA,cAACE,MAAAA,QAAiB,YAAjB,EAA4B,MAAY,YAAY,GAAG,QAAQ,QAAQ,UAAA,GACpEF,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAwB,GAAG,qBAAqB,WAAsB,aAAU,WAAU,IAAA,GACvFF,iCAAA,cAACK,WAAAA,eAAA,IAAc,GACd,MACL,CACJ,CACJ;AAER,CAAC;AAKD,MAAM,QAAQL,iBAAM,WAAW,CAAC,OAA0B,QAAmD;AACzG,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,SAAOA,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAwB,GAAG,WAAW,KAAU,QAAQ,UAAU;AAC9E,CAAC;AAqBM,MAAM,UAAUF,iBAAM,WAAsC,SAASM,SAAQ,OAAO,KAAK;AAC5F,QAAM,EAAE,QAAQ,UAAU,aAAa,QAAQ,cAAc,MAAM,UAAU,SAAS,GAAG,WAAA,IAAe;AAExG,QAAM,YAAYN,iBAAM,OAAO,IAAI;AAEnC,QAAM,mBAAmB,CAACO,OAAe,iBAA2D;AAChG,QAAI,aAAa,WAAW,cAAc;AACtC,YAAM,2BAA4B,aAAa,MAAM,QAAwB;AAAA,QACzE;AAAA,MAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAA;AAEb,qBAAa,iBAAA;AACb;AAAA,MACJ;AAAA,IACJ;AAEA,eAAWA,KAAI;AAAA,EACnB;AAEA,SACIP,iCAAA,cAAC,eAAe,UAAf,EAAwB,OAAO,EAAE,WAAW,OAAO,YAAY,MAAI,GAChEA,iCAAA,cAACE,MAAAA,QAAiB,MAAjB,EAAsB,aAA0B,OAAc,MAAY,cAAc,oBACpF,SAASF,iCAAA,cAAC,QAAA,MAAQ,MAAO,IAAY,MACrC,WAAW,CAAC,wDAAU,SAAA,MAAS,OAAQ,IAAa,MACpD,QACL,CACJ;AAER,CAAC;AACD,QAAQ,SAAS;AACjB,QAAQ,UAAU;AAClB,QAAQ,UAAU;AAClB,QAAQ,QAAQ;;"}
+{"version":3,"file":"Popover.cjs","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["import { Popover as PopoverPrimitive } from '@base-ui/react';\nimport cn from 'clsx';\nimport * as React from 'react';\n\nimport type { Placement } from '../..';\nimport { mergeRefs } from '../../utils/mergeRefs';\n\nimport { UnstyledArrow } from './Primitives';\nimport { getPopoverStyleClassnames } from './util';\n\ntype PopoverContextValue = { props: any; ref: React.Ref<HTMLElement>; anchorRef: React.RefObject<HTMLElement | null> };\n\nconst PopoverContext = React.createContext<PopoverContextValue>({\n    anchorRef: { current: null },\n    props: {},\n    ref: null,\n});\n\nexport type PopoverAnchorProps = React.HTMLAttributes<HTMLElement> & {\n    children: React.ReactElement;\n};\nconst Anchor = React.forwardRef(function PopoverAnchor(props: PopoverAnchorProps, forwardedRef: React.Ref<HTMLDivElement>) {\n    const context = React.useContext(PopoverContext);\n\n    const ref = mergeRefs([context.anchorRef, forwardedRef]);\n\n    const { children, ...restProps } = props;\n\n    return <PopoverPrimitive.Trigger {...restProps} ref={ref} render={children} />;\n});\n\nexport type PopoverTriggerProps = React.HTMLAttributes<HTMLElement> & {\n    children: React.ReactElement;\n    /**\n     * Whether the trigger renders a native `<button>` element.\n     * Set to `false` if the trigger child is not a button (e.g. `<input>`, `<div>`, '<span>', etc.).\n     * @default true\n     */\n    nativeButton?: boolean;\n};\nconst Trigger = React.forwardRef(function PopoverTrigger(props: PopoverTriggerProps, externalRef: React.Ref<HTMLElement>) {\n    const { ref: parentRef, props: parentProps } = React.useContext(PopoverContext);\n    const refCallback = mergeRefs([parentRef, externalRef]);\n\n    let { children, nativeButton, ...restProps } = props;\n\n    if (React.isValidElement(props.children) && typeof props.children?.type === 'function') {\n        // oxlint-disable-next-line no-console\n        console.warn(\n            `Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`\n        );\n        children = <span>{props.children}</span>;\n    }\n\n    return (\n        <PopoverPrimitive.Trigger\n            {...parentProps}\n            {...restProps}\n            nativeButton={nativeButton}\n            ref={refCallback}\n            render={children}\n        />\n    );\n});\n\nconst RenderPropWrapper = React.forwardRef(function RenderPropWrapper({ children, onClick }: any, ref) {\n    const close = () => {\n        onClick(new CustomEvent('hide'));\n    };\n\n    return children({ close, ref });\n});\n\nexport type PopoverContentRenderProps = { close: () => void };\n\nexport type PopoverContentProps = Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> & {\n    children: React.ReactNode | ((props: PopoverContentRenderProps) => React.ReactNode);\n    container?: HTMLElement | null;\n    finalFocus?: PopoverPrimitive.Popup.Props['finalFocus'];\n    initialFocus?: PopoverPrimitive.Popup.Props['initialFocus'];\n    /** Set the position of the Popover relative to its trigger. Default value is `bottom` */\n    placement?: Placement;\n};\nconst Content = React.forwardRef(function PopoverContent(props: PopoverContentProps, ref: React.Ref<HTMLDivElement>) {\n    const { placement: side, container, ...popoverContentProps } = props;\n\n    const context = React.useContext(PopoverContext);\n\n    const className = cn(getPopoverStyleClassnames(), props.className);\n\n    let output;\n\n    if (typeof props.children === 'function') {\n        output = <PopoverPrimitive.Close render={<RenderPropWrapper>{props.children}</RenderPropWrapper>} />;\n    } else {\n        output = props.children;\n    }\n\n    return (\n        <PopoverPrimitive.Portal container={container}>\n            <PopoverPrimitive.Positioner side={side} sideOffset={8} anchor={context.anchorRef}>\n                <PopoverPrimitive.Popup {...popoverContentProps} className={className} data-taco=\"popover\" ref={ref}>\n                    <UnstyledArrow />\n                    {output}\n                </PopoverPrimitive.Popup>\n            </PopoverPrimitive.Positioner>\n        </PopoverPrimitive.Portal>\n    );\n});\n\nexport type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement> & {\n    children: React.ReactElement;\n};\nconst Close = React.forwardRef((props: PopoverCloseProps, ref: React.Ref<HTMLButtonElement>): React.JSX.Element => {\n    const { children, ...restProps } = props;\n    return <PopoverPrimitive.Close {...restProps} ref={ref} render={children} />;\n});\n\nexport type PopoverProps = React.PropsWithChildren<{\n    anchor?: React.JSX.Element;\n    modal?: boolean | 'trap-focus';\n    /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */\n    trigger?: React.JSX.Element;\n    /** Set whether the popover is open by default or not, use when not providing a trigger  */\n    defaultOpen?: boolean;\n    /** Control the open state of the popover from outside the component  */\n    open?: boolean;\n    /** Called when the popover opens or closes, must be used in conjunction with open  */\n    onChange?: (open: boolean) => void;\n}>;\nexport type ForwardedPopoverWithStatics = React.ForwardRefExoticComponent<PopoverProps & React.RefAttributes<HTMLElement>> & {\n    Anchor: React.ForwardRefExoticComponent<PopoverAnchorProps>;\n    Trigger: React.ForwardRefExoticComponent<PopoverTriggerProps>;\n    Content: React.ForwardRefExoticComponent<PopoverContentProps>;\n    Close: React.ForwardRefExoticComponent<PopoverCloseProps>;\n};\n\nexport const Popover = React.forwardRef<HTMLElement, PopoverProps>(function Popover(props, ref) {\n    const { anchor, children, defaultOpen, modal = 'trap-focus', open, onChange, trigger, ...otherProps } = props;\n\n    const anchorRef = React.useRef(null);\n\n    const handleOpenChange = (open: boolean, eventDetails: PopoverPrimitive.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                // propagate to allow the radix overlay to close\n                eventDetails.allowPropagation();\n                return;\n            }\n        }\n\n        onChange?.(open);\n    };\n\n    return (\n        <PopoverContext.Provider value={{ anchorRef, props: otherProps, ref }}>\n            <PopoverPrimitive.Root defaultOpen={defaultOpen} modal={modal} open={open} onOpenChange={handleOpenChange}>\n                {anchor ? <Anchor>{anchor}</Anchor> : null}\n                {trigger && !anchor ? <Trigger>{trigger}</Trigger> : null}\n                {children}\n            </PopoverPrimitive.Root>\n        </PopoverContext.Provider>\n    );\n}) as ForwardedPopoverWithStatics;\nPopover.Anchor = Anchor;\nPopover.Trigger = Trigger;\nPopover.Content = Content;\nPopover.Close = Close;\n"],"names":["React","mergeRefs","PopoverPrimitive","RenderPropWrapper","getPopoverStyleClassnames","UnstyledArrow","Popover","open"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAM,iBAAiBA,iBAAM,cAAmC;AAAA,EAC5D,WAAW,EAAE,SAAS,KAAA;AAAA,EACtB,OAAO,CAAA;AAAA,EACP,KAAK;AACT,CAAC;AAKD,MAAM,SAASA,iBAAM,WAAW,SAAS,cAAc,OAA2B,cAAyC;AACvH,QAAM,UAAUA,iBAAM,WAAW,cAAc;AAE/C,QAAM,MAAMC,UAAAA,UAAU,CAAC,QAAQ,WAAW,YAAY,CAAC;AAEvD,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AAEnC,SAAOD,iCAAA,cAACE,MAAAA,QAAiB,SAAjB,EAA0B,GAAG,WAAW,KAAU,QAAQ,UAAU;AAChF,CAAC;AAWD,MAAM,UAAUF,iBAAM,WAAW,SAAS,eAAe,OAA4B,aAAqC;AACtH,QAAM,EAAE,KAAK,WAAW,OAAO,gBAAgBA,iBAAM,WAAW,cAAc;AAC9E,QAAM,cAAcC,UAAAA,UAAU,CAAC,WAAW,WAAW,CAAC;AAEtD,MAAI,EAAE,UAAU,cAAc,GAAG,cAAc;AAE/C,MAAID,iBAAM,eAAe,MAAM,QAAQ,KAAK,OAAO,MAAM,UAAU,SAAS,YAAY;AAEpF,YAAQ;AAAA,MACJ,oHAAoH,MAAM,SAAS,KAAK,IAAI,8CAA8C,MAAM,SAAS,KAAK,IAAI;AAAA,IAAA;AAEtN,eAAWA,iCAAA,cAAC,QAAA,MAAM,MAAM,QAAS;AAAA,EACrC;AAEA,SACIA,iCAAA;AAAA,IAACE,MAAAA,QAAiB;AAAA,IAAjB;AAAA,MACI,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MACA,KAAK;AAAA,MACL,QAAQ;AAAA,IAAA;AAAA,EAAA;AAGpB,CAAC;AAED,MAAM,oBAAoBF,iBAAM,WAAW,SAASG,mBAAkB,EAAE,UAAU,QAAA,GAAgB,KAAK;AACnG,QAAM,QAAQ,MAAM;AAChB,YAAQ,IAAI,YAAY,MAAM,CAAC;AAAA,EACnC;AAEA,SAAO,SAAS,EAAE,OAAO,KAAK;AAClC,CAAC;AAYD,MAAM,UAAUH,iBAAM,WAAW,SAAS,eAAe,OAA4B,KAAgC;AACjH,QAAM,EAAE,WAAW,MAAM,WAAW,GAAG,wBAAwB;AAE/D,QAAM,UAAUA,iBAAM,WAAW,cAAc;AAE/C,QAAM,YAAY,GAAGI,KAAAA,0BAAA,GAA6B,MAAM,SAAS;AAEjE,MAAI;AAEJ,MAAI,OAAO,MAAM,aAAa,YAAY;AACtC,aAASJ,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAuB,QAAQF,iCAAA,cAAC,mBAAA,MAAmB,MAAM,QAAS,EAAA,CAAsB;AAAA,EACtG,OAAO;AACH,aAAS,MAAM;AAAA,EACnB;AAEA,SACIA,iCAAA,cAACE,MAAAA,QAAiB,QAAjB,EAAwB,UAAA,GACrBF,iCAAA,cAACE,MAAAA,QAAiB,YAAjB,EAA4B,MAAY,YAAY,GAAG,QAAQ,QAAQ,UAAA,GACpEF,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAwB,GAAG,qBAAqB,WAAsB,aAAU,WAAU,IAAA,GACvFF,iCAAA,cAACK,WAAAA,eAAA,IAAc,GACd,MACL,CACJ,CACJ;AAER,CAAC;AAKD,MAAM,QAAQL,iBAAM,WAAW,CAAC,OAA0B,QAAyD;AAC/G,QAAM,EAAE,UAAU,GAAG,UAAA,IAAc;AACnC,SAAOA,iCAAA,cAACE,MAAAA,QAAiB,OAAjB,EAAwB,GAAG,WAAW,KAAU,QAAQ,UAAU;AAC9E,CAAC;AAqBM,MAAM,UAAUF,iBAAM,WAAsC,SAASM,SAAQ,OAAO,KAAK;AAC5F,QAAM,EAAE,QAAQ,UAAU,aAAa,QAAQ,cAAc,MAAM,UAAU,SAAS,GAAG,WAAA,IAAe;AAExG,QAAM,YAAYN,iBAAM,OAAO,IAAI;AAEnC,QAAM,mBAAmB,CAACO,OAAe,iBAA2D;AAChG,QAAI,aAAa,WAAW,cAAc;AACtC,YAAM,2BAA4B,aAAa,MAAM,QAAwB;AAAA,QACzE;AAAA,MAAA;AAGJ,UAAI,0BAA0B;AAI1B,qBAAa,OAAA;AAEb,qBAAa,iBAAA;AACb;AAAA,MACJ;AAAA,IACJ;AAEA,eAAWA,KAAI;AAAA,EACnB;AAEA,SACIP,iCAAA,cAAC,eAAe,UAAf,EAAwB,OAAO,EAAE,WAAW,OAAO,YAAY,MAAI,GAChEA,iCAAA,cAACE,MAAAA,QAAiB,MAAjB,EAAsB,aAA0B,OAAc,MAAY,cAAc,oBACpF,SAASF,iCAAA,cAAC,QAAA,MAAQ,MAAO,IAAY,MACrC,WAAW,CAAC,wDAAU,SAAA,MAAS,OAAQ,IAAa,MACpD,QACL,CACJ;AAER,CAAC;AACD,QAAQ,SAAS;AACjB,QAAQ,UAAU;AAClB,QAAQ,UAAU;AAClB,QAAQ,QAAQ;;"}

package/dist/components/Popover/Popover.d.ts

@@ -28,10 +28,10 @@ export type PopoverCloseProps = React.HTMLAttributes<HTMLButtonElement> & {
     children: React.ReactElement;
 };
 export type PopoverProps = React.PropsWithChildren<{
-    anchor?: JSX.Element;
+    anchor?: React.JSX.Element;
     modal?: boolean | 'trap-focus';
     /** A trigger to be used for the popover, should not be set if `children` already contains a trigger */
-    trigger?: JSX.Element;
+    trigger?: React.JSX.Element;
     /** Set whether the popover is open by default or not, use when not providing a trigger  */
     defaultOpen?: boolean;
     /** Control the open state of the popover from outside the component  */