@yahoo/uds 3.59.0-beta.1 → 3.60.0

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

@@ -1,163 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { cx } from "../../../styles/styler.js";
-import { VStack } from "../../VStack.js";
-import { useNestedBorderRadius } from "../../../hooks/useNestedBorderRadius.js";
-import { forwardRef, useEffect, useMemo, useState } from "react";
-import { spacingMap } from "@yahoo/uds/fixtures";
-import { jsx } from "react/jsx-runtime";
-import { AnimatePresence, m } from "motion/react";
-import { Menu, useMenuContext } from "@ariakit/react/menu";
-import { useStoreState } from "@ariakit/react-core/utils/store";
-
-//#region src/components/client/Menu/Menu.Content.tsx
-const MotionVStack = m.create(VStack);
-const ANIMATION_CONFIG = {
-	distance: 5,
-	scale: .97
-};
-const variants = {
-	top: {
-		x: 0,
-		y: ANIMATION_CONFIG.distance
-	},
-	bottom: {
-		x: 0,
-		y: -ANIMATION_CONFIG.distance
-	},
-	left: {
-		x: ANIMATION_CONFIG.distance,
-		y: 0
-	},
-	right: {
-		x: -ANIMATION_CONFIG.distance,
-		y: 0
-	}
-};
-const getMenuAnimationVariants = (placement = "bottom") => {
-	const [base = "top"] = placement?.split("-");
-	return {
-		closed: {
-			...variants[base],
-			opacity: 0,
-			scale: ANIMATION_CONFIG.scale
-		},
-		open: {
-			y: 0,
-			x: 0,
-			opacity: 1,
-			scale: 1
-		}
-	};
-};
-const useMenuAnimationVariants = (placement) => {
-	return useMemo(() => getMenuAnimationVariants(placement), [placement]);
-};
-/**
-* **📦 A Menu Content component**
-*
-* @componentType Client component
-*
-* @description
-* A content component for the menu, which is used to provide the menu context to the menu items.
-*
-* @see The {@link https://uds.build/docs/components/menu-content Menu.Content Docs} for more info
-*
-* @example
-* ```tsx
-* 'use client'; // Next.js client component
-*
-* import { Menu, Button } from "@yahoo/uds";
-* import { Calendar, Clipboard } from "@yahoo/uds-icons";
-*
-* export function MenuProviderExample() {
-*   return (
-*     <Menu.Provider>
-*       <Menu.Trigger asChild>
-*         <Button>Menu Options</Button>
-*       </Menu.Trigger>
-*       <Menu.Content>
-*         <Menu.Item startIcon={Calendar}>Calendar</Menu.Item>
-*         <Menu.Item startIcon={Clipboard} endIcon={DiagonalRightUp}>
-*           Clipboard
-*         </Menu.Item>
-*         <Menu.Item active>Active Item</Menu.Item>
-*       </Menu.Content>
-*     </Menu.Provider>
-*   )
-* }
-* ```
-*
-* @usage
-* Using Menu.Content is required to use Menu.Item and Menu.ItemCheckbox. It acts as the actual menu container.
-*
-* @related [Menu](https://uds.build/docs/components/menu), [Menu.ItemCheckbox](https://uds.build/docs/components/menu-item-checkbox)
-**/
-const MenuContent = forwardRef(function MenuContent$1({ gap, spacing, spacingBottom, spacingEnd, spacingStart, spacingTop, gutter = "1", backgroundColor = "primary", borderRadius = "md", borderColor, borderWidth = "thin", overflow, dropShadow = "lg", className, sameWidth, focusable, children, portalElement, portal = true, disableAutoBorderRadius,...props }, ref) {
-	const context = useMenuContext();
-	const open = useStoreState(context, "open");
-	const mounted = useStoreState(context, "mounted");
-	const currentPlacement = useStoreState(context, "currentPlacement");
-	const placement = useStoreState(context, "placement");
-	const [prevPlacement, setPrevPlacement] = useState(currentPlacement);
-	const [nextPlacement, setNextPlacement] = useState(currentPlacement);
-	useEffect(() => {
-		if (placement !== nextPlacement) setNextPlacement(placement);
-	}, [placement]);
-	useEffect(() => {
-		if (currentPlacement !== nextPlacement) setNextPlacement(currentPlacement);
-	}, [currentPlacement]);
-	useEffect(() => {
-		if (mounted && nextPlacement !== prevPlacement) setPrevPlacement(nextPlacement);
-	}, [
-		mounted,
-		nextPlacement,
-		prevPlacement
-	]);
-	const motionState = useMemo(() => {
-		if (!open || !mounted) return "closed";
-		return "open";
-	}, [open, mounted]);
-	const shadowVariant = useMemo(() => open ? dropShadow : "none", [open, dropShadow]);
-	const variants$1 = useMenuAnimationVariants(nextPlacement);
-	const borderRadiusClassName = useNestedBorderRadius({
-		borderRadius,
-		spacing
-	});
-	return /* @__PURE__ */ jsx(AnimatePresence, {
-		initial: false,
-		children: /* @__PURE__ */ jsx(Menu, {
-			gutter: useMemo(() => spacingMap[gutter], [gutter]),
-			sameWidth,
-			focusable,
-			store: context,
-			ref,
-			portalElement,
-			portal,
-			...props,
-			render: /* @__PURE__ */ jsx(MotionVStack, {
-				backgroundColor,
-				gap,
-				spacing,
-				spacingBottom,
-				spacingEnd,
-				spacingStart,
-				spacingTop,
-				borderRadius,
-				borderColor,
-				borderWidth,
-				overflow,
-				animate: motionState,
-				variants: variants$1,
-				dropShadow: shadowVariant,
-				className: cx("uds-menu-content", "transition-shadow", "duration-200", "ease-in-out", "min-w-60", "max-w-lg", "max-h-96", "overflow-auto", "uds-ring", "z-10", "group", !disableAutoBorderRadius && borderRadiusClassName, className),
-				children
-			})
-		})
-	});
-});
-MenuContent.displayName = "MenuContent";
-
-//#endregion
-export { MenuContent };
-//# sourceMappingURL=Menu.Content.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Content.js","names":["MenuContent","variants","AriakitMenu"],"sources":["../../../../src/components/client/Menu/Menu.Content.tsx"],"sourcesContent":["import type {\n  MenuProps as AriakitMenuProps,\n  MenuProviderProps as AriakitMenuProviderProps,\n} from '@ariakit/react/menu';\nimport { Menu as AriakitMenu, useMenuContext } from '@ariakit/react/menu';\nimport { useStoreState } from '@ariakit/react-core/utils/store';\nimport { spacingMap } from '@yahoo/uds/fixtures';\nimport type { SpacingAlias } from '@yahoo/uds/tokens';\nimport { AnimatePresence, m } from 'motion/react';\nimport { forwardRef, useEffect, useMemo, useState } from 'react';\n\nimport { useNestedBorderRadius } from '../../../hooks/useNestedBorderRadius';\nimport { cx } from '../../../styles/styler';\nimport type { VStackProps } from '../../VStack';\nimport { VStack } from '../../VStack';\n\nconst MotionVStack = m.create(VStack);\n\n/* ---------------------------- ANIMATION HELPERS --------------------------- */\n\n// TODO: Move this to a shared location\ntype BasePlacement = 'top' | 'bottom' | 'left' | 'right';\n\nconst ANIMATION_CONFIG = { distance: 5, scale: 0.97 };\nconst variants = {\n  top: { x: 0, y: ANIMATION_CONFIG.distance },\n  bottom: { x: 0, y: -ANIMATION_CONFIG.distance },\n  left: { x: ANIMATION_CONFIG.distance, y: 0 },\n  right: { x: -ANIMATION_CONFIG.distance, y: 0 },\n} as const;\n\nconst getMenuAnimationVariants = (placement: AriakitMenuProviderProps['placement'] = 'bottom') => {\n  const [base = 'top'] = placement?.split('-') as [BasePlacement];\n\n  return {\n    closed: { ...variants[base], opacity: 0, scale: ANIMATION_CONFIG.scale },\n    open: { y: 0, x: 0, opacity: 1, scale: 1 },\n  };\n};\n\nconst useMenuAnimationVariants = (placement: AriakitMenuProviderProps['placement']) => {\n  return useMemo(() => getMenuAnimationVariants(placement), [placement]);\n};\n\n/* -------------------------------- COMPONENT ------------------------------- */\n\ninterface MenuContentProps extends Omit<VStackProps, 'asChild'> {\n  gutter?: SpacingAlias;\n  /** UDS handles nested border radius for the first and last item for you to prevent clipping and visual jank.\n   *  If you need to disable this, set this prop to true.\n   *\n   *  @link https://github.com/yahoo-uds/uds/blob/main/packages/uds/src/hooks/useNestedBorderRadius.ts\n   **/\n  disableAutoBorderRadius?: boolean;\n  /**\n   * `portalRef` is similar to `ref` but is scoped to the portal node. It's\n   * useful when you need to be informed when the portal element is appended to\n   * the DOM or removed from the DOM.\n   *\n   * Live examples:\n   * - [Form with Select](https://ariakit.org/examples/form-select)\n   * @example\n   * ```jsx\n   * const [portalElement, setPortalElement] = useState(null);\n   *\n   * <Portal portalRef={setPortalElement} />\n   * ```\n   */\n  portalRef?: AriakitMenuProps['portalRef'];\n  /**\n   * Determines whether the element should be rendered as a React Portal.\n   *\n   * Live examples:\n   * - [Combobox with integrated\n   *   filter](https://ariakit.org/examples/combobox-filtering-integrated)\n   * - [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n   * - [Hovercard with keyboard\n   *   support](https://ariakit.org/examples/hovercard-disclosure)\n   * - [Menubar](https://ariakit.org/components/menubar)\n   * - [Standalone Popover](https://ariakit.org/examples/popover-standalone)\n   * - [Animated Select](https://ariakit.org/examples/select-animated)\n   * @default true\n   */\n  portal?: boolean;\n  /**\n   * An HTML element or a memoized callback function that returns an HTML\n   * element to be used as the portal element. By default, the portal element\n   * will be a `div` element appended to the `document.body`.\n   *\n   * Live examples:\n   * - [Navigation Menubar](https://ariakit.org/examples/menubar-navigation)\n   * @example\n   * ```jsx\n   * const [portal, setPortal] = useState(null);\n   *\n   * <Portal portalElement={portal} />\n   * <div ref={setPortal} />\n   * ```\n   * @example\n   * ```jsx\n   * const getPortalElement = useCallback(() => {\n   *   const div = document.createElement(\"div\");\n   *   const portalRoot = document.getElementById(\"portal-root\");\n   *   portalRoot.appendChild(div);\n   *   return div;\n   * }, []);\n   *\n   * <Portal portalElement={getPortalElement} />\n   * ```\n   */\n  portalElement?: AriakitMenuProps['portalElement'];\n  /**\n   * Determines whether the popover should hide when the mouse leaves the\n   * popover or the anchor element and there's no _hover intent_, meaning, the\n   * mouse isn't moving toward the popover.\n   *\n   * This can be either a boolean or a callback receiving the mouse move event\n   * that initiated the behavior. The callback should return a boolean.\n   *\n   * **Note**: This behavior won't be triggered when the popover or any of its\n   * descendants are in focus.\n   * @default true\n   */\n  hideOnHoverOutside?: AriakitMenuProps['hideOnHoverOutside'];\n  /**\n   * Determines if the dialog will hide when the user presses the Escape key.\n   *\n   * This prop can be either a boolean or a function that accepts an event as an\n   * argument and returns a boolean. The event object represents the keydown\n   * event that initiated the hide action, which could be either a native\n   * keyboard event or a React synthetic event.\n   *\n   * **Note**: When placing Ariakit dialogs inside third-party dialogs, using\n   * `event.stopPropagation()` within this function will stop the event from\n   * reaching the third-party dialog, closing only the Ariakit dialog.\n   * @default true\n   */\n  hideOnEscape?: AriakitMenuProps['hideOnEscape'];\n  /**\n   * Determines if the dialog should hide when the user clicks or focuses on an\n   * element outside the dialog.\n   *\n   * This prop can be either a boolean or a function that takes an event as an\n   * argument and returns a boolean. The event object represents the event that\n   * triggered the action, which could be a native event or a React synthetic\n   * event of various types.\n   *\n   * Live examples:\n   * - [Selection Popover](https://ariakit.org/examples/popover-selection)\n   * @default true\n   */\n  hideOnInteractOutside?: AriakitMenuProps['hideOnInteractOutside'];\n  /**\n   * Determines if the pointer events outside of the popover and its anchor\n   * element should be disabled during _hover intent_, that is, when the mouse\n   * is moving toward the popover.\n   *\n   * This is required as these external events may trigger focus on other\n   * elements and close the popover while the user is attempting to hover over\n   * it.\n   *\n   * This can be either a boolean or a callback receiving the mouse event\n   * happening during hover intent. The callback should return a boolean.\n   * @default true\n   */\n  disablePointerEventsOnApproach?: AriakitMenuProps['disablePointerEventsOnApproach'];\n  /**\n   * Object returned by the [`useMenuStore`](https://ariakit.org/reference/use-menu-store) hook.\n   * If not provided, the closest [`Menu.Content`](https://uds.build/docs/components/menu#menu-content) or\n   * [`Menu.Provider`](https://uds.build/docs/components/menu#menu-provider) context will be used.\n   */\n  store?: AriakitMenuProps['store'];\n  /**\n   * Whether the popover should have the same width as the anchor element. This\n   * will be exposed to CSS as\n   * [`--popover-anchor-width`](https://ariakit.org/guide/styling#--popover-anchor-width).\n   * @default false\n   */\n  sameWidth?: AriakitMenuProps['sameWidth'];\n  /**\n   * @see https://ariakit.org/reference/focusable\n   * @default true\n   */\n  focusable?: AriakitMenuProps['focusable'];\n  /**\n   * This is an event handler prop triggered when the dialog's `close` event is\n   * dispatched. The `close` event is similar to the native dialog\n   * [`close`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement/close_event)\n   * event. The only difference is that this event can be canceled with\n   * `event.preventDefault()`, which will prevent the dialog from hiding.\n   *\n   * It's important to note that this event only fires when the dialog store's\n   * [`open`](https://ariakit.org/reference/use-dialog-store#open) state is set\n   * to `false`. If the controlled\n   * [`open`](https://ariakit.org/reference/dialog#open) prop value changes, or\n   * if the dialog's visibility is altered in any other way (such as unmounting\n   * the dialog without adjusting the open state), this event won't be\n   * triggered.\n   *\n   * Live examples:\n   * - [Dialog with scrollable\n   *   backdrop](https://ariakit.org/examples/dialog-backdrop-scrollable)\n   * - [Dialog with details &\n   *   summary](https://ariakit.org/examples/dialog-details)\n   * - [Warning on Dialog\n   *   hide](https://ariakit.org/examples/dialog-hide-warning)\n   * - [Dialog with Menu](https://ariakit.org/examples/dialog-menu)\n   */\n  onClose?: AriakitMenuProps['onClose'];\n}\n\n/**\n * **📦 A Menu Content component**\n *\n * @componentType Client component\n *\n * @description\n * A content component for the menu, which is used to provide the menu context to the menu items.\n *\n * @see The {@link https://uds.build/docs/components/menu-content Menu.Content Docs} for more info\n *\n * @example\n * ```tsx\n * 'use client'; // Next.js client component\n *\n * import { Menu, Button } from \"@yahoo/uds\";\n * import { Calendar, Clipboard } from \"@yahoo/uds-icons\";\n *\n * export function MenuProviderExample() {\n *   return (\n *     <Menu.Provider>\n *       <Menu.Trigger asChild>\n *         <Button>Menu Options</Button>\n *       </Menu.Trigger>\n *       <Menu.Content>\n *         <Menu.Item startIcon={Calendar}>Calendar</Menu.Item>\n *         <Menu.Item startIcon={Clipboard} endIcon={DiagonalRightUp}>\n *           Clipboard\n *         </Menu.Item>\n *         <Menu.Item active>Active Item</Menu.Item>\n *       </Menu.Content>\n *     </Menu.Provider>\n *   )\n * }\n * ```\n *\n * @usage\n * Using Menu.Content is required to use Menu.Item and Menu.ItemCheckbox. It acts as the actual menu container.\n *\n * @related [Menu](https://uds.build/docs/components/menu), [Menu.ItemCheckbox](https://uds.build/docs/components/menu-item-checkbox)\n **/\nconst MenuContent = forwardRef<HTMLDivElement, MenuContentProps>(function MenuContent(\n  {\n    // Spacing\n    gap,\n    spacing,\n    spacingBottom,\n    spacingEnd,\n    spacingStart,\n    spacingTop,\n    gutter = '1',\n    // Color\n    backgroundColor = 'primary',\n    borderRadius = 'md',\n    // Borders\n    borderColor,\n    borderWidth = 'thin',\n    overflow,\n    dropShadow = 'lg',\n    // Styles\n    className,\n    // Ariakit props\n    sameWidth,\n    focusable,\n    children,\n    portalElement,\n    portal = true,\n    // Misc\n    disableAutoBorderRadius,\n    // Rest\n    ...props\n  },\n  ref,\n) {\n  const context = useMenuContext();\n  const open = useStoreState(context, 'open');\n  const mounted = useStoreState(context, 'mounted');\n  const currentPlacement = useStoreState(context, 'currentPlacement');\n\n  const placement = useStoreState(context, 'placement');\n  const [prevPlacement, setPrevPlacement] =\n    useState<AriakitMenuProviderProps['placement']>(currentPlacement);\n  const [nextPlacement, setNextPlacement] =\n    useState<AriakitMenuProviderProps['placement']>(currentPlacement);\n\n  // If placement changes (This can happen when the html direction updates)\n  useEffect(() => {\n    if (placement !== nextPlacement) {\n      setNextPlacement(placement);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [placement]);\n\n  // If the placement is updated because of some collision\n  useEffect(() => {\n    if (currentPlacement !== nextPlacement) {\n      setNextPlacement(currentPlacement);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [currentPlacement]);\n\n  useEffect(() => {\n    if (mounted && nextPlacement !== prevPlacement) {\n      setPrevPlacement(nextPlacement);\n    }\n  }, [mounted, nextPlacement, prevPlacement]);\n\n  // Setup variants\n  const motionState = useMemo(() => {\n    if (!open || !mounted) {\n      return 'closed';\n    }\n    return 'open';\n  }, [open, mounted]);\n\n  // Allows us to animate the shadow when the menu is open\n  const shadowVariant = useMemo(() => (open ? dropShadow : 'none'), [open, dropShadow]);\n\n  const variants = useMenuAnimationVariants(nextPlacement);\n  const borderRadiusClassName = useNestedBorderRadius({ borderRadius, spacing });\n  const gutterValue = useMemo(() => spacingMap[gutter], [gutter]);\n\n  return (\n    <AnimatePresence initial={false}>\n      <AriakitMenu\n        gutter={gutterValue}\n        sameWidth={sameWidth}\n        focusable={focusable}\n        store={context}\n        ref={ref}\n        portalElement={portalElement}\n        portal={portal}\n        {...props}\n        render={\n          <MotionVStack\n            backgroundColor={backgroundColor}\n            gap={gap}\n            spacing={spacing}\n            spacingBottom={spacingBottom}\n            spacingEnd={spacingEnd}\n            spacingStart={spacingStart}\n            spacingTop={spacingTop}\n            borderRadius={borderRadius}\n            borderColor={borderColor}\n            borderWidth={borderWidth}\n            overflow={overflow}\n            animate={motionState}\n            variants={variants}\n            dropShadow={shadowVariant}\n            className={cx(\n              // Base class\n              'uds-menu-content',\n              // Handle shadow animation\n              'transition-shadow',\n              'duration-200',\n              'ease-in-out',\n              // Set a min/max width\n              'min-w-60',\n              'max-w-lg',\n              'max-h-96',\n              'overflow-auto',\n              // Focus ring\n              'uds-ring',\n              'z-10',\n              // Misc\n              'group',\n              !disableAutoBorderRadius && borderRadiusClassName,\n              className,\n            )}\n          >\n            {children}\n          </MotionVStack>\n        }\n      />\n    </AnimatePresence>\n  );\n});\n\nMenuContent.displayName = 'MenuContent';\n\nexport { MenuContent, type MenuContentProps };\n"],"mappings":";;;;;;;;;;;;AAgBA,MAAM,eAAe,EAAE,OAAO,OAAO;AAOrC,MAAM,mBAAmB;CAAE,UAAU;CAAG,OAAO;CAAM;AACrD,MAAM,WAAW;CACf,KAAK;EAAE,GAAG;EAAG,GAAG,iBAAiB;EAAU;CAC3C,QAAQ;EAAE,GAAG;EAAG,GAAG,CAAC,iBAAiB;EAAU;CAC/C,MAAM;EAAE,GAAG,iBAAiB;EAAU,GAAG;EAAG;CAC5C,OAAO;EAAE,GAAG,CAAC,iBAAiB;EAAU,GAAG;EAAG;CAC/C;AAED,MAAM,4BAA4B,YAAmD,aAAa;CAChG,MAAM,CAAC,OAAO,SAAS,WAAW,MAAM,IAAI;AAE5C,QAAO;EACL,QAAQ;GAAE,GAAG,SAAS;GAAO,SAAS;GAAG,OAAO,iBAAiB;GAAO;EACxE,MAAM;GAAE,GAAG;GAAG,GAAG;GAAG,SAAS;GAAG,OAAO;GAAG;EAC3C;;AAGH,MAAM,4BAA4B,cAAqD;AACrF,QAAO,cAAc,yBAAyB,UAAU,EAAE,CAAC,UAAU,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkNxE,MAAM,cAAc,WAA6C,SAASA,cACxE,EAEE,KACA,SACA,eACA,YACA,cACA,YACA,SAAS,KAET,kBAAkB,WAClB,eAAe,MAEf,aACA,cAAc,QACd,UACA,aAAa,MAEb,WAEA,WACA,WACA,UACA,eACA,SAAS,MAET,wBAEA,GAAG,SAEL,KACA;CACA,MAAM,UAAU,gBAAgB;CAChC,MAAM,OAAO,cAAc,SAAS,OAAO;CAC3C,MAAM,UAAU,cAAc,SAAS,UAAU;CACjD,MAAM,mBAAmB,cAAc,SAAS,mBAAmB;CAEnE,MAAM,YAAY,cAAc,SAAS,YAAY;CACrD,MAAM,CAAC,eAAe,oBACpB,SAAgD,iBAAiB;CACnE,MAAM,CAAC,eAAe,oBACpB,SAAgD,iBAAiB;AAGnE,iBAAgB;AACd,MAAI,cAAc,cAChB,kBAAiB,UAAU;IAG5B,CAAC,UAAU,CAAC;AAGf,iBAAgB;AACd,MAAI,qBAAqB,cACvB,kBAAiB,iBAAiB;IAGnC,CAAC,iBAAiB,CAAC;AAEtB,iBAAgB;AACd,MAAI,WAAW,kBAAkB,cAC/B,kBAAiB,cAAc;IAEhC;EAAC;EAAS;EAAe;EAAc,CAAC;CAG3C,MAAM,cAAc,cAAc;AAChC,MAAI,CAAC,QAAQ,CAAC,QACZ,QAAO;AAET,SAAO;IACN,CAAC,MAAM,QAAQ,CAAC;CAGnB,MAAM,gBAAgB,cAAe,OAAO,aAAa,QAAS,CAAC,MAAM,WAAW,CAAC;CAErF,MAAMC,aAAW,yBAAyB,cAAc;CACxD,MAAM,wBAAwB,sBAAsB;EAAE;EAAc;EAAS,CAAC;AAG9E,QACE,oBAAC;EAAgB,SAAS;YACxB,oBAACC;GACC,QALc,cAAc,WAAW,SAAS,CAAC,OAAO,CAAC;GAM9C;GACA;GACX,OAAO;GACF;GACU;GACP;GACR,GAAI;GACJ,QACE,oBAAC;IACkB;IACZ;IACI;IACM;IACH;IACE;IACF;IACE;IACD;IACA;IACH;IACV,SAAS;IACT,UAAUD;IACV,YAAY;IACZ,WAAW,GAET,oBAEA,qBACA,gBACA,eAEA,YACA,YACA,YACA,iBAEA,YACA,QAEA,SACA,CAAC,2BAA2B,uBAC5B,UACD;IAEA;KACY;IAEjB;GACc;EAEpB;AAEF,YAAY,cAAc"}

package/dist/components/client/Menu/Menu.Divider.cjs

@@ -1,74 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_styles_styler = require('../../../styles/styler.cjs');
-const require_components_Divider_DividerInternal = require('../../Divider/DividerInternal.cjs');
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/components/client/Menu/Menu.Divider.tsx
-/**
-* **〰️ A Menu Divider component**
-*
-* @componentType Client component
-*
-* @description
-* A divider component for the menu.
-*
-* @see The {@link https://uds.build/docs/components/menu-divider Menu.Divider Docs} for more info
-*
-* @example
-* ```tsx
-* 'use client'; // Next.js client component
-*
-* import { Menu, Button } from "@yahoo/uds";
-*
-* export function DividerExample() {
-*   return (
-*     <Menu>
-*       <Menu.Trigger asChild>
-*         <Button>Menu Options</Button>
-*       </Menu.Trigger>
-*       <Menu.Content>
-*         <Menu.Item>Calendar</Menu.Item>
-*         <Menu.Divider>Other actions</Menu.Divider>
-*         <Menu.Item>Clipboard</Menu.Item>
-*         <Menu.Item active>Active Item</Menu.Item>
-*       </Menu.Content>
-*     </Menu>
-*   )
-* }
-* ```
-*
-* @usage
-* Use MenuDivider to separate groups of menu items.
-*
-* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item), [Divider](https://uds.build/docs/components/divider)
-**/
-const MenuDivider = (0, react.forwardRef)(function MenuDivider$1({ role = "separator", contentPosition = "start", gap = "4", children, spacingVertical = children ? "2" : "0", spacingHorizontal = children ? "4" : "0", className,...props }, ref) {
-	const layerClassNames = {
-		root: require_styles_styler.getStyles({
-			menuDividerVariantRoot: "default",
-			className
-		}),
-		text: require_styles_styler.getStyles({ menuDividerVariantText: "default" }),
-		line: require_styles_styler.getStyles({ menuDividerVariantLine: "default" })
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Divider_DividerInternal.DividerInternal, {
-		ref,
-		role,
-		variant: "inherit",
-		contentPosition,
-		gap,
-		spacingVertical,
-		spacingHorizontal,
-		className: layerClassNames.root,
-		layerClassNames,
-		...props,
-		children
-	});
-});
-MenuDivider.displayName = "MenuDivider";
-
-//#endregion
-exports.MenuDivider = MenuDivider;

package/dist/components/client/Menu/Menu.Divider.d.cts

@@ -1,54 +0,0 @@
-import { DividerProps } from "../../Divider/Divider.cjs";
-import * as react33 from "react";
-import { AriaRole } from "react";
-
-//#region src/components/client/Menu/Menu.Divider.d.ts
-interface MenuDividerProps extends Omit<DividerProps, 'variant'> {
-  /**
-   * The role of the divider.
-   * @default 'separator'
-   */
-  role?: AriaRole;
-}
-/**
- * **〰️ A Menu Divider component**
- *
- * @componentType Client component
- *
- * @description
- * A divider component for the menu.
- *
- * @see The {@link https://uds.build/docs/components/menu-divider Menu.Divider Docs} for more info
- *
- * @example
- * ```tsx
- * 'use client'; // Next.js client component
- *
- * import { Menu, Button } from "@yahoo/uds";
- *
- * export function DividerExample() {
- *   return (
- *     <Menu>
- *       <Menu.Trigger asChild>
- *         <Button>Menu Options</Button>
- *       </Menu.Trigger>
- *       <Menu.Content>
- *         <Menu.Item>Calendar</Menu.Item>
- *         <Menu.Divider>Other actions</Menu.Divider>
- *         <Menu.Item>Clipboard</Menu.Item>
- *         <Menu.Item active>Active Item</Menu.Item>
- *       </Menu.Content>
- *     </Menu>
- *   )
- * }
- * ```
- *
- * @usage
- * Use MenuDivider to separate groups of menu items.
- *
- * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item), [Divider](https://uds.build/docs/components/divider)
- **/
-declare const MenuDivider: react33.ForwardRefExoticComponent<MenuDividerProps & react33.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { MenuDivider, type MenuDividerProps };
-//# sourceMappingURL=Menu.Divider.d.cts.map

package/dist/components/client/Menu/Menu.Divider.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Divider.d.cts","names":[],"sources":["../../../../src/components/client/Menu/Menu.Divider.tsx"],"sourcesContent":[],"mappings":";;;;;UAOU,gBAAA,CAAA,OAAA,CAAyB,KAAK;;;AAHkB,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,OAAA,CAAA,CAAA,SAAA;;EAQjD,IAAA,CAAA,CAAA,CAAA,QAAA;;;AAL8B,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA,CAAA,OAAA,CAAA,SAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA8CjC,aAAW,OAAA,CAAA,0BAAA,mBAAA,OAAA,CAAA,cAAA"}

package/dist/components/client/Menu/Menu.Divider.d.ts

@@ -1,54 +0,0 @@
-import { DividerProps } from "../../Divider/Divider.js";
-import * as react47 from "react";
-import { AriaRole } from "react";
-
-//#region src/components/client/Menu/Menu.Divider.d.ts
-interface MenuDividerProps extends Omit<DividerProps, 'variant'> {
-  /**
-   * The role of the divider.
-   * @default 'separator'
-   */
-  role?: AriaRole;
-}
-/**
- * **〰️ A Menu Divider component**
- *
- * @componentType Client component
- *
- * @description
- * A divider component for the menu.
- *
- * @see The {@link https://uds.build/docs/components/menu-divider Menu.Divider Docs} for more info
- *
- * @example
- * ```tsx
- * 'use client'; // Next.js client component
- *
- * import { Menu, Button } from "@yahoo/uds";
- *
- * export function DividerExample() {
- *   return (
- *     <Menu>
- *       <Menu.Trigger asChild>
- *         <Button>Menu Options</Button>
- *       </Menu.Trigger>
- *       <Menu.Content>
- *         <Menu.Item>Calendar</Menu.Item>
- *         <Menu.Divider>Other actions</Menu.Divider>
- *         <Menu.Item>Clipboard</Menu.Item>
- *         <Menu.Item active>Active Item</Menu.Item>
- *       </Menu.Content>
- *     </Menu>
- *   )
- * }
- * ```
- *
- * @usage
- * Use MenuDivider to separate groups of menu items.
- *
- * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item), [Divider](https://uds.build/docs/components/divider)
- **/
-declare const MenuDivider: react47.ForwardRefExoticComponent<MenuDividerProps & react47.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { MenuDivider, type MenuDividerProps };
-//# sourceMappingURL=Menu.Divider.d.ts.map

package/dist/components/client/Menu/Menu.Divider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Divider.d.ts","names":[],"sources":["../../../../src/components/client/Menu/Menu.Divider.tsx"],"sourcesContent":[],"mappings":";;;;;UAOU,gBAAA,CAAA,OAAA,CAAyB,KAAK;;;AAHkB,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,OAAA,CAAA,CAAA,SAAA;;EAQjD,IAAA,CAAA,CAAA,CAAA,QAAA;;;AAL8B,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA,CAAA,OAAA,CAAA,SAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA8CjC,aAAW,OAAA,CAAA,0BAAA,mBAAA,OAAA,CAAA,cAAA"}

package/dist/components/client/Menu/Menu.Divider.js

@@ -1,74 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { getStyles } from "../../../styles/styler.js";
-import { DividerInternal } from "../../Divider/DividerInternal.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/client/Menu/Menu.Divider.tsx
-/**
-* **〰️ A Menu Divider component**
-*
-* @componentType Client component
-*
-* @description
-* A divider component for the menu.
-*
-* @see The {@link https://uds.build/docs/components/menu-divider Menu.Divider Docs} for more info
-*
-* @example
-* ```tsx
-* 'use client'; // Next.js client component
-*
-* import { Menu, Button } from "@yahoo/uds";
-*
-* export function DividerExample() {
-*   return (
-*     <Menu>
-*       <Menu.Trigger asChild>
-*         <Button>Menu Options</Button>
-*       </Menu.Trigger>
-*       <Menu.Content>
-*         <Menu.Item>Calendar</Menu.Item>
-*         <Menu.Divider>Other actions</Menu.Divider>
-*         <Menu.Item>Clipboard</Menu.Item>
-*         <Menu.Item active>Active Item</Menu.Item>
-*       </Menu.Content>
-*     </Menu>
-*   )
-* }
-* ```
-*
-* @usage
-* Use MenuDivider to separate groups of menu items.
-*
-* @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item), [Divider](https://uds.build/docs/components/divider)
-**/
-const MenuDivider = forwardRef(function MenuDivider$1({ role = "separator", contentPosition = "start", gap = "4", children, spacingVertical = children ? "2" : "0", spacingHorizontal = children ? "4" : "0", className,...props }, ref) {
-	const layerClassNames = {
-		root: getStyles({
-			menuDividerVariantRoot: "default",
-			className
-		}),
-		text: getStyles({ menuDividerVariantText: "default" }),
-		line: getStyles({ menuDividerVariantLine: "default" })
-	};
-	return /* @__PURE__ */ jsx(DividerInternal, {
-		ref,
-		role,
-		variant: "inherit",
-		contentPosition,
-		gap,
-		spacingVertical,
-		spacingHorizontal,
-		className: layerClassNames.root,
-		layerClassNames,
-		...props,
-		children
-	});
-});
-MenuDivider.displayName = "MenuDivider";
-
-//#endregion
-export { MenuDivider };
-//# sourceMappingURL=Menu.Divider.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Divider.js","names":["MenuDivider"],"sources":["../../../../src/components/client/Menu/Menu.Divider.tsx"],"sourcesContent":["import type { AriaRole } from 'react';\nimport { forwardRef } from 'react';\n\nimport { getStyles } from '../../../styles/styler';\nimport type { DividerProps } from '../../Divider/Divider';\nimport { DividerInternal } from '../../Divider/DividerInternal';\n\ninterface MenuDividerProps extends Omit<DividerProps, 'variant'> {\n  /**\n   * The role of the divider.\n   * @default 'separator'\n   */\n  role?: AriaRole;\n}\n\n/**\n * **〰️ A Menu Divider component**\n *\n * @componentType Client component\n *\n * @description\n * A divider component for the menu.\n *\n * @see The {@link https://uds.build/docs/components/menu-divider Menu.Divider Docs} for more info\n *\n * @example\n * ```tsx\n * 'use client'; // Next.js client component\n *\n * import { Menu, Button } from \"@yahoo/uds\";\n *\n * export function DividerExample() {\n *   return (\n *     <Menu>\n *       <Menu.Trigger asChild>\n *         <Button>Menu Options</Button>\n *       </Menu.Trigger>\n *       <Menu.Content>\n *         <Menu.Item>Calendar</Menu.Item>\n *         <Menu.Divider>Other actions</Menu.Divider>\n *         <Menu.Item>Clipboard</Menu.Item>\n *         <Menu.Item active>Active Item</Menu.Item>\n *       </Menu.Content>\n *     </Menu>\n *   )\n * }\n * ```\n *\n * @usage\n * Use MenuDivider to separate groups of menu items.\n *\n * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item), [Divider](https://uds.build/docs/components/divider)\n **/\nconst MenuDivider = forwardRef<HTMLDivElement, MenuDividerProps>(function MenuDivider(\n  {\n    role = 'separator',\n    contentPosition = 'start',\n    gap = '4',\n    children,\n    spacingVertical = children ? '2' : '0',\n    spacingHorizontal = children ? '4' : '0',\n    className,\n    ...props\n  },\n  ref,\n) {\n  const layerClassNames = {\n    root: getStyles({\n      menuDividerVariantRoot: 'default',\n      className,\n    }),\n\n    text: getStyles({\n      menuDividerVariantText: 'default',\n    }),\n\n    line: getStyles({\n      menuDividerVariantLine: 'default',\n    }),\n  };\n\n  return (\n    <DividerInternal\n      ref={ref}\n      role={role}\n      variant=\"inherit\"\n      contentPosition={contentPosition}\n      gap={gap}\n      spacingVertical={spacingVertical}\n      spacingHorizontal={spacingHorizontal}\n      className={layerClassNames.root}\n      layerClassNames={layerClassNames}\n      {...props}\n    >\n      {children}\n    </DividerInternal>\n  );\n});\n\nMenuDivider.displayName = 'MenuDivider';\n\nexport { MenuDivider, type MenuDividerProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqDA,MAAM,cAAc,WAA6C,SAASA,cACxE,EACE,OAAO,aACP,kBAAkB,SAClB,MAAM,KACN,UACA,kBAAkB,WAAW,MAAM,KACnC,oBAAoB,WAAW,MAAM,KACrC,UACA,GAAG,SAEL,KACA;CACA,MAAM,kBAAkB;EACtB,MAAM,UAAU;GACd,wBAAwB;GACxB;GACD,CAAC;EAEF,MAAM,UAAU,EACd,wBAAwB,WACzB,CAAC;EAEF,MAAM,UAAU,EACd,wBAAwB,WACzB,CAAC;EACH;AAED,QACE,oBAAC;EACM;EACC;EACN,SAAQ;EACS;EACZ;EACY;EACE;EACnB,WAAW,gBAAgB;EACV;EACjB,GAAI;EAEH;GACe;EAEpB;AAEF,YAAY,cAAc"}

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

@@ -1,80 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_styles_styler = require('../../../styles/styler.cjs');
-const require_components_client_Menu_Menu_ItemBase = require('./Menu.ItemBase.cjs');
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-let __ariakit_react_menu = require("@ariakit/react/menu");
-
-//#region src/components/client/Menu/Menu.Item.tsx
-/**
-* **📋 A Menu Item component for navigation and actions**
-*
-* @componentType Client component
-*
-* @description
-* A standard menu item that can be used for navigation, actions, or displaying options in a menu.
-* Menu items can be styled with active states, icons, and can trigger callbacks when clicked.
-* They support both visual and functional customization.
-*
-* @see The {@link https://uds.build/docs/components/menu-item Menu.Item Docs} for more info
-*
-* @example
-* ```tsx
-* 'use client'; // Next.js client component
-*
-* import { Menu, Button } from "@yahoo/uds";
-* import { Calendar, Clipboard } from "@yahoo/uds-icons";
-*
-* export function MenuItemExample() {
-*   return (
-*     <Menu.Provider>
-*       <Menu.Trigger asChild>
-*         <Button>Menu Options</Button>
-*       </Menu.Trigger>
-*       <Menu.Content>
-*         <Menu.Item startIcon={Calendar}>Calendar</Menu.Item>
-*         <Menu.Item startIcon={Clipboard} endIcon={DiagonalRightUp}>
-*           Clipboard
-*         </Menu.Item>
-*         <Menu.Item active>Active Item</Menu.Item>
-*       </Menu.Content>
-*     </Menu>
-*   )
-* }
-* ```
-*
-* @usage
-* Use MenuItem for standard menu options that trigger actions or navigate to other parts of the application.
-* The active prop can be used to highlight the currently selected item.
-*
-* @related [Menu](https://uds.build/docs/components/menu), [Menu.ItemCheckbox](https://uds.build/docs/components/menu-item-checkbox)
-**/
-const MenuItem = (0, react.forwardRef)(function MenuItem$1({ active, hideOnClick,...props }, ref) {
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Menu_Menu_ItemBase.MenuItemBase, {
-		ref,
-		as: __ariakit_react_menu.MenuItem,
-		active,
-		layerClassNames: {
-			root: require_styles_styler.getStyles({
-				menuItemVariantRoot: "default",
-				menuItemVariantActiveRoot: active ? "on" : "off"
-			}),
-			text: require_styles_styler.getStyles({
-				menuItemVariantText: "default",
-				menuItemVariantActiveText: active ? "on" : "off"
-			}),
-			startIcon: require_styles_styler.getStyles({
-				menuItemVariantIcon: "default",
-				menuItemVariantActiveIcon: active ? "on" : "off"
-			})
-		},
-		rootProps: { hideOnClick },
-		...props
-	});
-});
-MenuItem.displayName = "MenuItem";
-
-//#endregion
-exports.MenuItem = MenuItem;

package/dist/components/client/Menu/Menu.Item.d.cts

@@ -1,79 +0,0 @@
-import { UniversalMenuItemProps } from "../../../tokens/types.cjs";
-import "../../../tokens/index.cjs";
-import { PressableProps } from "../Pressable.cjs";
-import * as react36 from "react";
-import { AriaRole } from "react";
-import { MenuItemProps as MenuItemProps$1 } from "@ariakit/react/menu";
-
-//#region src/components/client/Menu/Menu.Item.d.ts
-interface MenuItemProps extends Omit<PressableProps, 'asChild'>, Omit<UniversalMenuItemProps, 'name'> {
-  /**
-   * Object returned by the [`useMenuStore`](https://ariakit.org/reference/use-menu-store) hook.
-   * If not provided, the closest [`Menu.Content`](https://uds.build/docs/components/menu#menu-content) or
-   * [`Menu.Provider`](https://uds.build/docs/components/menu#menu-provider) context will be used.
-   */
-  store?: MenuItemProps$1['store'];
-  /**
-   * Determines if the menu should hide when this item is clicked.
-   *
-   * **Note**: This behavior isn't triggered if this menu item is rendered as a
-   * link and modifier keys are used to either open the link in a new tab or
-   * download it.
-   *
-   * @default true
-   */
-  hideOnClick?: MenuItemProps$1['hideOnClick'];
-  /**
-   * The role of the menu item.
-   *
-   * @default 'menuitem'
-   */
-  role?: AriaRole;
-}
-/**
- * **📋 A Menu Item component for navigation and actions**
- *
- * @componentType Client component
- *
- * @description
- * A standard menu item that can be used for navigation, actions, or displaying options in a menu.
- * Menu items can be styled with active states, icons, and can trigger callbacks when clicked.
- * They support both visual and functional customization.
- *
- * @see The {@link https://uds.build/docs/components/menu-item Menu.Item Docs} for more info
- *
- * @example
- * ```tsx
- * 'use client'; // Next.js client component
- *
- * import { Menu, Button } from "@yahoo/uds";
- * import { Calendar, Clipboard } from "@yahoo/uds-icons";
- *
- * export function MenuItemExample() {
- *   return (
- *     <Menu.Provider>
- *       <Menu.Trigger asChild>
- *         <Button>Menu Options</Button>
- *       </Menu.Trigger>
- *       <Menu.Content>
- *         <Menu.Item startIcon={Calendar}>Calendar</Menu.Item>
- *         <Menu.Item startIcon={Clipboard} endIcon={DiagonalRightUp}>
- *           Clipboard
- *         </Menu.Item>
- *         <Menu.Item active>Active Item</Menu.Item>
- *       </Menu.Content>
- *     </Menu>
- *   )
- * }
- * ```
- *
- * @usage
- * Use MenuItem for standard menu options that trigger actions or navigate to other parts of the application.
- * The active prop can be used to highlight the currently selected item.
- *
- * @related [Menu](https://uds.build/docs/components/menu), [Menu.ItemCheckbox](https://uds.build/docs/components/menu-item-checkbox)
- **/
-declare const MenuItem: react36.ForwardRefExoticComponent<MenuItemProps & react36.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { MenuItem, type MenuItemProps };
-//# sourceMappingURL=Menu.Item.d.cts.map

package/dist/components/client/Menu/Menu.Item.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Item.d.cts","names":[],"sources":["../../../../src/components/client/Menu/Menu.Item.tsx"],"sourcesContent":[],"mappings":";;;;;;;;UAUU,aAAA,CAAA,OAAA,CACA,KAAK,4BACX,KAAK;;;;AAL0C,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,CAAA,IAAA,CAAA,QAAA,CAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,CAAA,IAAA,CAAA,UAAA,CAAA,IAAA,CAAA,IAAA,CAAA,QAAA,CAAA,CAAA,OAAA,CAAA,IAAA,CAAA,EAAA,CAAA,IAAA;;EAK1C,KAAA,CAAA,CAAA,CAMC,aAAA,CAAA,CAND,CAAA,CAAA,KAAA,CAAA,CAAA;EAMC,CAAA,CAAA;;;;;;AANF,CAAA,CAAA,CAAA;;;EAoEM,WAAA,CAAA,CAAA,CApDE,aAAA,CAAA,CAoDF,CAAA,CAAA,WAAA,CAAA,CAAA;EAAA,CAAA,CAAA;;;;;SA9CL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cA8CH,UAAQ,OAAA,CAAA,0BAAA,gBAAA,OAAA,CAAA,cAAA"}