@yahoo/uds 3.59.0-beta.1 → 3.60.0

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

@@ -1,79 +0,0 @@
-import { UniversalMenuItemProps } from "../../../tokens/types.js";
-import "../../../tokens/index.js";
-import { PressableProps } from "../Pressable.js";
-import * as react41 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: react41.ForwardRefExoticComponent<MenuItemProps & react41.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { MenuItem, type MenuItemProps };
-//# sourceMappingURL=Menu.Item.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Item.d.ts","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"}

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

@@ -1,80 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { getStyles } from "../../../styles/styler.js";
-import { MenuItemBase } from "./Menu.ItemBase.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-import { MenuItem as MenuItem$1 } from "@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 = forwardRef(function MenuItem$2({ active, hideOnClick,...props }, ref) {
-	return /* @__PURE__ */ jsx(MenuItemBase, {
-		ref,
-		as: MenuItem$1,
-		active,
-		layerClassNames: {
-			root: getStyles({
-				menuItemVariantRoot: "default",
-				menuItemVariantActiveRoot: active ? "on" : "off"
-			}),
-			text: getStyles({
-				menuItemVariantText: "default",
-				menuItemVariantActiveText: active ? "on" : "off"
-			}),
-			startIcon: getStyles({
-				menuItemVariantIcon: "default",
-				menuItemVariantActiveIcon: active ? "on" : "off"
-			})
-		},
-		rootProps: { hideOnClick },
-		...props
-	});
-});
-MenuItem.displayName = "MenuItem";
-
-//#endregion
-export { MenuItem };
-//# sourceMappingURL=Menu.Item.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.Item.js","names":["MenuItem","AriakitMenuItem"],"sources":["../../../../src/components/client/Menu/Menu.Item.tsx"],"sourcesContent":["import type { MenuItemProps as AriakitMenuItemProps } from '@ariakit/react/menu';\nimport { MenuItem as AriakitMenuItem } from '@ariakit/react/menu';\nimport type { UniversalMenuItemProps } from '@yahoo/uds/tokens';\nimport type { AriaRole } from 'react';\nimport { forwardRef } from 'react';\n\nimport { getStyles } from '../../../styles/styler';\nimport type { PressableProps } from '../Pressable';\nimport { MenuItemBase } from './Menu.ItemBase';\n\ninterface MenuItemProps\n  extends Omit<PressableProps, 'asChild'>,\n    Omit<UniversalMenuItemProps, 'name'> {\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?: AriakitMenuItemProps['store'];\n  /**\n   * Determines if the menu should hide when this item is clicked.\n   *\n   * **Note**: This behavior isn't triggered if this menu item is rendered as a\n   * link and modifier keys are used to either open the link in a new tab or\n   * download it.\n   *\n   * @default true\n   */\n  hideOnClick?: AriakitMenuItemProps['hideOnClick'];\n  /**\n   * The role of the menu item.\n   *\n   * @default 'menuitem'\n   */\n  role?: AriaRole;\n}\n\n/**\n * **📋 A Menu Item component for navigation and actions**\n *\n * @componentType Client component\n *\n * @description\n * A standard menu item that can be used for navigation, actions, or displaying options in a menu.\n * Menu items can be styled with active states, icons, and can trigger callbacks when clicked.\n * They support both visual and functional customization.\n *\n * @see The {@link https://uds.build/docs/components/menu-item Menu.Item 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 MenuItemExample() {\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>\n *   )\n * }\n * ```\n *\n * @usage\n * Use MenuItem for standard menu options that trigger actions or navigate to other parts of the application.\n * The active prop can be used to highlight the currently selected item.\n *\n * @related [Menu](https://uds.build/docs/components/menu), [Menu.ItemCheckbox](https://uds.build/docs/components/menu-item-checkbox)\n **/\nconst MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(function MenuItem(\n  { active, hideOnClick, ...props },\n  ref,\n) {\n  const layerClassNames = {\n    root: getStyles({\n      menuItemVariantRoot: 'default',\n      menuItemVariantActiveRoot: active ? 'on' : 'off',\n    }),\n    text: getStyles({\n      menuItemVariantText: 'default',\n      menuItemVariantActiveText: active ? 'on' : 'off',\n    }),\n    startIcon: getStyles({\n      menuItemVariantIcon: 'default',\n      menuItemVariantActiveIcon: active ? 'on' : 'off',\n    }),\n  };\n\n  return (\n    <MenuItemBase\n      ref={ref}\n      as={AriakitMenuItem}\n      active={active}\n      layerClassNames={layerClassNames}\n      rootProps={{ hideOnClick }}\n      {...props}\n    />\n  );\n});\n\nMenuItem.displayName = 'MenuItem';\n\nexport { MenuItem, type MenuItemProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgFA,MAAM,WAAW,WAA0C,SAASA,WAClE,EAAE,QAAQ,YAAa,GAAG,SAC1B,KACA;AAgBA,QACE,oBAAC;EACM;EACL,IAAIC;EACI;EACR,iBApBoB;GACtB,MAAM,UAAU;IACd,qBAAqB;IACrB,2BAA2B,SAAS,OAAO;IAC5C,CAAC;GACF,MAAM,UAAU;IACd,qBAAqB;IACrB,2BAA2B,SAAS,OAAO;IAC5C,CAAC;GACF,WAAW,UAAU;IACnB,qBAAqB;IACrB,2BAA2B,SAAS,OAAO;IAC5C,CAAC;GACH;EAQG,WAAW,EAAE,aAAa;EAC1B,GAAI;GACJ;EAEJ;AAEF,SAAS,cAAc"}

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

@@ -1,163 +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_HStack = require('../../HStack.cjs');
-const require_components_IconSlot = require('../../IconSlot.cjs');
-const require_components_client_Pressable = require('../Pressable.cjs');
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-let motion_react = require("motion/react");
-
-//#region src/components/client/Menu/Menu.ItemBase.tsx
-const ITEM_CLASS_NAME = "uds-menu-item";
-const iconAnimationVariants = {
-	visible: {
-		scale: 1,
-		opacity: 1
-	},
-	hidden: {
-		scale: .7,
-		opacity: 0
-	}
-};
-/** Builds the class names for the menu item */
-const buildMenuItemClasses = ({ active, disabled, className }) => {
-	return require_styles_styler.cx(ITEM_CLASS_NAME, "flex", "focus-visible:text-brand", "focus-visible:bg-brand-secondary", "focus-visible:z-10", "uds-ring", "!-outline-offset-2", active && ["[&:not([aria-checked])]:cursor-default"], disabled && "opacity-25 cursor-not-allowed", "duration-20 transition-[font-variation-settings] ease-in-out", "z-0", className);
-};
-/**
-* @private This is an internal component shared by [Menu.Item](https://uds.build/docs/components/menu#menu-item) and [Menu.ItemCheckbox](https://uds.build/docs/components/menu#menu-item-checkbox)
-* and may change without notice. Please do not use this component directly.
-*/
-const MenuItemBase = (0, react.forwardRef)(function MenuItemBase$1({ spacing = "0", spacingBottom, spacingEnd, spacingHorizontal = "4", spacingStart, spacingTop, spacingVertical = "3.5", columnGap = "2", className, children, endIcon, startIcon, hideEndIcon, active, disabled, as: RootComponent, name, alignItems = "center", justifyContent = "space-between", layerClassNames, slots, rootProps,...props }, ref) {
-	const hasMultipleChildren = react.Children.count(children) > 1;
-	const menuItemClassName = buildMenuItemClasses({
-		active,
-		disabled,
-		className
-	});
-	/**
-	* Get content styles based on children layout needs
-	*/
-	const contentStyles = require_styles_styler.getStyles({
-		className: require_styles_styler.cx(`${ITEM_CLASS_NAME}-content truncate`, layerClassNames?.text),
-		textAlign: "start",
-		...hasMultipleChildren && {
-			columnGap,
-			display: "flex",
-			alignItems: "center",
-			width: "full",
-			justifyContent: "space-between"
-		}
-	});
-	/**
-	* Styles
-	*/
-	const classNames = (0, react.useMemo)(() => ({
-		root: require_styles_styler.getStyles({
-			menuSizeRoot: "default",
-			flexDirection: "row",
-			spacing,
-			spacingBottom,
-			spacingEnd,
-			spacingHorizontal,
-			spacingStart,
-			spacingTop,
-			spacingVertical,
-			columnGap,
-			alignItems,
-			justifyContent,
-			className: require_styles_styler.cx(menuItemClassName, layerClassNames?.root)
-		}),
-		startIcon: require_styles_styler.getStyles({
-			menuSizeStartIcon: "default",
-			className: layerClassNames?.startIcon
-		}),
-		endIcon: require_styles_styler.getStyles({
-			menuSizeEndIcon: "default",
-			className: layerClassNames?.endIcon
-		})
-	}), [
-		alignItems,
-		columnGap,
-		justifyContent,
-		layerClassNames?.endIcon,
-		layerClassNames?.root,
-		layerClassNames?.startIcon,
-		menuItemClassName,
-		spacing,
-		spacingBottom,
-		spacingEnd,
-		spacingHorizontal,
-		spacingStart,
-		spacingTop,
-		spacingVertical
-	]);
-	const rootRender = slots?.root ?? ((p) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_client_Pressable.Pressable, {
-		...p,
-		...props,
-		onClick: (e) => {
-			p.onClick?.(e);
-			props.onClick?.(e);
-		}
-	}));
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(RootComponent, {
-		ref,
-		name: name ?? "",
-		...rootProps,
-		render: rootRender,
-		disabled,
-		className: classNames.root,
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_components_HStack.HStack, {
-			gap: columnGap,
-			alignItems: "center",
-			width: "full",
-			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, {
-				initial: false,
-				children: startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.span, {
-					variants: iconAnimationVariants,
-					initial: "hidden",
-					animate: "visible",
-					exit: "hidden",
-					className: "uds-start-icon",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
-						icon: startIcon,
-						className: classNames.startIcon,
-						iconProps: {
-							size: "sm",
-							variant: active ? "fill" : "outline",
-							color: "current"
-						}
-					})
-				})
-			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-				className: contentStyles,
-				children
-			})]
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.AnimatePresence, {
-			initial: false,
-			mode: "popLayout",
-			children: !hideEndIcon && endIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.span, {
-				variants: iconAnimationVariants,
-				initial: "hidden",
-				animate: "visible",
-				exit: "hidden",
-				className: "uds-end-icon",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
-					icon: endIcon,
-					className: classNames.endIcon,
-					iconProps: {
-						size: "sm",
-						variant: active ? "fill" : "outline",
-						color: "current"
-					}
-				})
-			})
-		})]
-	});
-});
-MenuItemBase.displayName = "MenuItemBase";
-
-//#endregion
-exports.ITEM_CLASS_NAME = ITEM_CLASS_NAME;
-exports.MenuItemBase = MenuItemBase;

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

@@ -1,32 +0,0 @@
-import { UniversalMenuItemProps } from "../../../tokens/types.cjs";
-import "../../../tokens/index.cjs";
-import { PressableProps } from "../Pressable.cjs";
-import * as react38 from "react";
-import { MenuItem, MenuItemCheckbox } from "@ariakit/react";
-
-//#region src/components/client/Menu/Menu.ItemBase.d.ts
-type MenuItemRootComponent = typeof MenuItem | typeof MenuItemCheckbox;
-interface MenuItemBaseProps extends Omit<PressableProps, 'asChild'>, UniversalMenuItemProps {
-  /** Whether to show the end icon */
-  hideEndIcon?: boolean;
-  /** The component to render as the root */
-  as: MenuItemRootComponent;
-  /** Additional props to pass to the root component */
-  rootProps?: Record<string, unknown>;
-  /** Internal overrides for downstream components. */
-  layerClassNames?: {
-    root?: string;
-    text?: string;
-    startIcon?: string;
-    endIcon?: string;
-  };
-}
-declare const ITEM_CLASS_NAME = "uds-menu-item";
-/**
- * @private This is an internal component shared by [Menu.Item](https://uds.build/docs/components/menu#menu-item) and [Menu.ItemCheckbox](https://uds.build/docs/components/menu#menu-item-checkbox)
- * and may change without notice. Please do not use this component directly.
- */
-declare const MenuItemBase: react38.ForwardRefExoticComponent<MenuItemBaseProps & react38.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { ITEM_CLASS_NAME, MenuItemBase };
-//# sourceMappingURL=Menu.ItemBase.d.cts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.ItemBase.d.cts","names":[],"sources":["../../../../src/components/client/Menu/Menu.ItemBase.tsx"],"sourcesContent":[],"mappings":";;;;;;;KAkBK,qBAAA,CAAA,CAAA,QAA+B,kBAAyB;UAEnD,iBAAA,CAAA,OAAA,CAA0B,KAAK,4BAA4B;;;EAFhE,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA,CAAA,EAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA;EAEK,EAAA,CAAA,CAIJ,qBAJsB;EAAa,CAAA,CAAA,CAAA,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA,CAAA,IAAA,CAAA,EAAA,CAAA,GAAA,CAAA,IAAA,CAAA,SAAA,CAAA,CAAA;EAInC,SAAA,CAAA,CAAA,CAEQ,MAFR,CAAA,MAAA,CAAA,CAAA,OAAA,CAAA;EAEQ,CAAA,CAAA,CAAA,CAAA,QAAA,CAAA,SAAA,CAAA,GAAA,CAAA,UAAA,CAAA,UAAA,CAAA,CAAA,CAAA;EANsB,eAAA,CAAA,CAAA,CAAA;IAAiC,IAAA,CAAA,CAAA,CAAA,MAAA;IAAsB,IAAA,CAAA,CAAA,CAAA,MAAA;IAqBrF,SAAA,CAAA,CAAA,CAAA,MAAe;IAmDf,OAAA,CAAA,CAAA,CAAA,MAwKJ;EAxKgB,CAAA;;cAnDZ,eAAA,CAAA,CAAA,CAmDY,CAAA,GAAA,CAAA,IAAA,CAAA,IAAA,CAAA;;;;;cAAZ,cAAY,OAAA,CAAA,0BAAA,oBAAA,OAAA,CAAA,cAAA"}

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

@@ -1,32 +0,0 @@
-import { UniversalMenuItemProps } from "../../../tokens/types.js";
-import "../../../tokens/index.js";
-import { PressableProps } from "../Pressable.js";
-import * as react49 from "react";
-import { MenuItem, MenuItemCheckbox } from "@ariakit/react";
-
-//#region src/components/client/Menu/Menu.ItemBase.d.ts
-type MenuItemRootComponent = typeof MenuItem | typeof MenuItemCheckbox;
-interface MenuItemBaseProps extends Omit<PressableProps, 'asChild'>, UniversalMenuItemProps {
-  /** Whether to show the end icon */
-  hideEndIcon?: boolean;
-  /** The component to render as the root */
-  as: MenuItemRootComponent;
-  /** Additional props to pass to the root component */
-  rootProps?: Record<string, unknown>;
-  /** Internal overrides for downstream components. */
-  layerClassNames?: {
-    root?: string;
-    text?: string;
-    startIcon?: string;
-    endIcon?: string;
-  };
-}
-declare const ITEM_CLASS_NAME = "uds-menu-item";
-/**
- * @private This is an internal component shared by [Menu.Item](https://uds.build/docs/components/menu#menu-item) and [Menu.ItemCheckbox](https://uds.build/docs/components/menu#menu-item-checkbox)
- * and may change without notice. Please do not use this component directly.
- */
-declare const MenuItemBase: react49.ForwardRefExoticComponent<MenuItemBaseProps & react49.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { ITEM_CLASS_NAME, MenuItemBase };
-//# sourceMappingURL=Menu.ItemBase.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.ItemBase.d.ts","names":[],"sources":["../../../../src/components/client/Menu/Menu.ItemBase.tsx"],"sourcesContent":[],"mappings":";;;;;;;KAkBK,qBAAA,CAAA,CAAA,QAA+B,kBAAyB;UAEnD,iBAAA,CAAA,OAAA,CAA0B,KAAK,4BAA4B;;;EAFhE,CAAA,CAAA,CAAA,CAAA,GAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA,CAAA,EAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA;EAEK,EAAA,CAAA,CAIJ,qBAJsB;EAAa,CAAA,CAAA,CAAA,CAAA,UAAA,CAAA,KAAA,CAAA,EAAA,CAAA,IAAA,CAAA,EAAA,CAAA,GAAA,CAAA,IAAA,CAAA,SAAA,CAAA,CAAA;EAInC,SAAA,CAAA,CAAA,CAEQ,MAFR,CAAA,MAAA,CAAA,CAAA,OAAA,CAAA;EAEQ,CAAA,CAAA,CAAA,CAAA,QAAA,CAAA,SAAA,CAAA,GAAA,CAAA,UAAA,CAAA,UAAA,CAAA,CAAA,CAAA;EANsB,eAAA,CAAA,CAAA,CAAA;IAAiC,IAAA,CAAA,CAAA,CAAA,MAAA;IAAsB,IAAA,CAAA,CAAA,CAAA,MAAA;IAqBrF,SAAA,CAAA,CAAA,CAAA,MAAe;IAmDf,OAAA,CAAA,CAAA,CAAA,MAwKJ;EAxKgB,CAAA;;cAnDZ,eAAA,CAAA,CAAA,CAmDY,CAAA,GAAA,CAAA,IAAA,CAAA,IAAA,CAAA;;;;;cAAZ,cAAY,OAAA,CAAA,0BAAA,oBAAA,OAAA,CAAA,cAAA"}

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

@@ -1,162 +0,0 @@
-"use client";
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { cx, getStyles } from "../../../styles/styler.js";
-import { HStack } from "../../HStack.js";
-import { IconSlot } from "../../IconSlot.js";
-import { Pressable } from "../Pressable.js";
-import { Children, forwardRef, useMemo } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { AnimatePresence, m } from "motion/react";
-
-//#region src/components/client/Menu/Menu.ItemBase.tsx
-const ITEM_CLASS_NAME = "uds-menu-item";
-const iconAnimationVariants = {
-	visible: {
-		scale: 1,
-		opacity: 1
-	},
-	hidden: {
-		scale: .7,
-		opacity: 0
-	}
-};
-/** Builds the class names for the menu item */
-const buildMenuItemClasses = ({ active, disabled, className }) => {
-	return cx(ITEM_CLASS_NAME, "flex", "focus-visible:text-brand", "focus-visible:bg-brand-secondary", "focus-visible:z-10", "uds-ring", "!-outline-offset-2", active && ["[&:not([aria-checked])]:cursor-default"], disabled && "opacity-25 cursor-not-allowed", "duration-20 transition-[font-variation-settings] ease-in-out", "z-0", className);
-};
-/**
-* @private This is an internal component shared by [Menu.Item](https://uds.build/docs/components/menu#menu-item) and [Menu.ItemCheckbox](https://uds.build/docs/components/menu#menu-item-checkbox)
-* and may change without notice. Please do not use this component directly.
-*/
-const MenuItemBase = forwardRef(function MenuItemBase$1({ spacing = "0", spacingBottom, spacingEnd, spacingHorizontal = "4", spacingStart, spacingTop, spacingVertical = "3.5", columnGap = "2", className, children, endIcon, startIcon, hideEndIcon, active, disabled, as: RootComponent, name, alignItems = "center", justifyContent = "space-between", layerClassNames, slots, rootProps,...props }, ref) {
-	const hasMultipleChildren = Children.count(children) > 1;
-	const menuItemClassName = buildMenuItemClasses({
-		active,
-		disabled,
-		className
-	});
-	/**
-	* Get content styles based on children layout needs
-	*/
-	const contentStyles = getStyles({
-		className: cx(`${ITEM_CLASS_NAME}-content truncate`, layerClassNames?.text),
-		textAlign: "start",
-		...hasMultipleChildren && {
-			columnGap,
-			display: "flex",
-			alignItems: "center",
-			width: "full",
-			justifyContent: "space-between"
-		}
-	});
-	/**
-	* Styles
-	*/
-	const classNames = useMemo(() => ({
-		root: getStyles({
-			menuSizeRoot: "default",
-			flexDirection: "row",
-			spacing,
-			spacingBottom,
-			spacingEnd,
-			spacingHorizontal,
-			spacingStart,
-			spacingTop,
-			spacingVertical,
-			columnGap,
-			alignItems,
-			justifyContent,
-			className: cx(menuItemClassName, layerClassNames?.root)
-		}),
-		startIcon: getStyles({
-			menuSizeStartIcon: "default",
-			className: layerClassNames?.startIcon
-		}),
-		endIcon: getStyles({
-			menuSizeEndIcon: "default",
-			className: layerClassNames?.endIcon
-		})
-	}), [
-		alignItems,
-		columnGap,
-		justifyContent,
-		layerClassNames?.endIcon,
-		layerClassNames?.root,
-		layerClassNames?.startIcon,
-		menuItemClassName,
-		spacing,
-		spacingBottom,
-		spacingEnd,
-		spacingHorizontal,
-		spacingStart,
-		spacingTop,
-		spacingVertical
-	]);
-	const rootRender = slots?.root ?? ((p) => /* @__PURE__ */ jsx(Pressable, {
-		...p,
-		...props,
-		onClick: (e) => {
-			p.onClick?.(e);
-			props.onClick?.(e);
-		}
-	}));
-	return /* @__PURE__ */ jsxs(RootComponent, {
-		ref,
-		name: name ?? "",
-		...rootProps,
-		render: rootRender,
-		disabled,
-		className: classNames.root,
-		children: [/* @__PURE__ */ jsxs(HStack, {
-			gap: columnGap,
-			alignItems: "center",
-			width: "full",
-			children: [/* @__PURE__ */ jsx(AnimatePresence, {
-				initial: false,
-				children: startIcon && /* @__PURE__ */ jsx(m.span, {
-					variants: iconAnimationVariants,
-					initial: "hidden",
-					animate: "visible",
-					exit: "hidden",
-					className: "uds-start-icon",
-					children: /* @__PURE__ */ jsx(IconSlot, {
-						icon: startIcon,
-						className: classNames.startIcon,
-						iconProps: {
-							size: "sm",
-							variant: active ? "fill" : "outline",
-							color: "current"
-						}
-					})
-				})
-			}), /* @__PURE__ */ jsx("span", {
-				className: contentStyles,
-				children
-			})]
-		}), /* @__PURE__ */ jsx(AnimatePresence, {
-			initial: false,
-			mode: "popLayout",
-			children: !hideEndIcon && endIcon && /* @__PURE__ */ jsx(m.span, {
-				variants: iconAnimationVariants,
-				initial: "hidden",
-				animate: "visible",
-				exit: "hidden",
-				className: "uds-end-icon",
-				children: /* @__PURE__ */ jsx(IconSlot, {
-					icon: endIcon,
-					className: classNames.endIcon,
-					iconProps: {
-						size: "sm",
-						variant: active ? "fill" : "outline",
-						color: "current"
-					}
-				})
-			})
-		})]
-	});
-});
-MenuItemBase.displayName = "MenuItemBase";
-
-//#endregion
-export { ITEM_CLASS_NAME, MenuItemBase };
-//# sourceMappingURL=Menu.ItemBase.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.ItemBase.js","names":["MenuItemBase"],"sources":["../../../../src/components/client/Menu/Menu.ItemBase.tsx"],"sourcesContent":["import type {\n  MenuItem as AriakitMenuItem,\n  MenuItemCheckbox as AriakitMenuItemCheckbox,\n} from '@ariakit/react';\nimport type { UniversalMenuItemProps } from '@yahoo/uds/tokens';\nimport { AnimatePresence, m } from 'motion/react';\nimport { Children, forwardRef, useMemo } from 'react';\n\nimport { cx, getStyles } from '../../../styles/styler';\nimport { HStack } from '../../HStack';\nimport { IconSlot } from '../../IconSlot';\nimport type { PressableProps } from '../Pressable';\nimport { Pressable } from '../Pressable';\n\n/* -------------------------------------------------------------------------- */\n/*                              TYPE DEFINITIONS                                */\n/* -------------------------------------------------------------------------- */\n\ntype MenuItemRootComponent = typeof AriakitMenuItem | typeof AriakitMenuItemCheckbox;\n\ninterface MenuItemBaseProps extends Omit<PressableProps, 'asChild'>, UniversalMenuItemProps {\n  /** Whether to show the end icon */\n  hideEndIcon?: boolean;\n  /** The component to render as the root */\n  as: MenuItemRootComponent;\n  /** Additional props to pass to the root component */\n  rootProps?: Record<string, unknown>;\n\n  /** Internal overrides for downstream components. */\n  layerClassNames?: {\n    root?: string;\n    text?: string;\n    startIcon?: string;\n    endIcon?: string;\n  };\n}\n\n/* -------------------------------------------------------------------------- */\n/*                             CONSTANTS & MAPPINGS                             */\n/* -------------------------------------------------------------------------- */\n\nconst ITEM_CLASS_NAME = 'uds-menu-item';\n\nconst iconAnimationVariants = {\n  visible: { scale: 1, opacity: 1 },\n  hidden: { scale: 0.7, opacity: 0 },\n};\n/* -------------------------------------------------------------------------- */\n/*                              HELPER FUNCTIONS                                */\n/* -------------------------------------------------------------------------- */\n\ntype MenuItemClassesProps = Pick<MenuItemBaseProps, 'active' | 'disabled' | 'className'>;\n\n/** Builds the class names for the menu item */\nconst buildMenuItemClasses = ({ active, disabled, className }: MenuItemClassesProps) => {\n  return cx(\n    ITEM_CLASS_NAME,\n    'flex',\n    // hover state - only apply if not active and not disabled\n    // TODO: update hover color to a non-palette color\n    // focus state\n    'focus-visible:text-brand',\n    'focus-visible:bg-brand-secondary',\n    'focus-visible:z-10',\n    'uds-ring',\n    // TODO find a solution that doesn't require !\n    '!-outline-offset-2',\n    // active state\n    active && ['[&:not([aria-checked])]:cursor-default'],\n    // disabled state\n    disabled && 'opacity-25 cursor-not-allowed',\n    // Checked state\n    // 'aria-checked:text-brand',\n    // 'aria-checked:bg-brand-secondary',\n    // 'aria-checked:font-medium',\n    // // TODO: update hover color to a non-palette color\n    // 'aria-checked:hover:bg-purple-2',\n    // Misc\n    'duration-20 transition-[font-variation-settings] ease-in-out',\n    'z-0',\n    className,\n  );\n};\n\n/* -------------------------------------------------------------------------- */\n/*                           MENU ITEM COMPONENT(S)                             */\n/* -------------------------------------------------------------------------- */\n\n/**\n * @private This is an internal component shared by [Menu.Item](https://uds.build/docs/components/menu#menu-item) and [Menu.ItemCheckbox](https://uds.build/docs/components/menu#menu-item-checkbox)\n * and may change without notice. Please do not use this component directly.\n */\nconst MenuItemBase = forwardRef<HTMLDivElement, MenuItemBaseProps>(function MenuItemBase(\n  {\n    spacing = '0',\n    spacingBottom,\n    spacingEnd,\n    spacingHorizontal = '4',\n    spacingStart,\n    spacingTop,\n    spacingVertical = '3.5',\n    columnGap = '2',\n    className,\n    children,\n    endIcon,\n    startIcon,\n    hideEndIcon,\n    active,\n    disabled,\n    as: RootComponent,\n    name,\n    alignItems = 'center',\n    justifyContent = 'space-between',\n    layerClassNames,\n    slots,\n    rootProps,\n    ...props\n  },\n  ref,\n) {\n  const hasMultipleChildren = Children.count(children) > 1;\n  const menuItemClassName = buildMenuItemClasses({ active, disabled, className });\n\n  /**\n   * Get content styles based on children layout needs\n   */\n  const contentStyles = getStyles({\n    // Base styles\n    className: cx(`${ITEM_CLASS_NAME}-content truncate`, layerClassNames?.text),\n    textAlign: 'start',\n    // Layout styles - only apply alignment props if we have multiple children\n    ...(hasMultipleChildren && {\n      columnGap,\n      display: 'flex',\n      alignItems: 'center',\n      width: 'full',\n      justifyContent: 'space-between',\n    }),\n  });\n\n  /**\n   * Styles\n   */\n  const classNames = useMemo(\n    () => ({\n      root: getStyles({\n        menuSizeRoot: 'default',\n        flexDirection: 'row',\n        spacing,\n        spacingBottom,\n        spacingEnd,\n        spacingHorizontal,\n        spacingStart,\n        spacingTop,\n        spacingVertical,\n        columnGap,\n        alignItems,\n        justifyContent,\n        className: cx(menuItemClassName, layerClassNames?.root),\n      }),\n\n      startIcon: getStyles({\n        menuSizeStartIcon: 'default',\n        className: layerClassNames?.startIcon,\n      }),\n\n      endIcon: getStyles({\n        menuSizeEndIcon: 'default',\n        className: layerClassNames?.endIcon,\n      }),\n    }),\n    [\n      alignItems,\n      columnGap,\n      justifyContent,\n      layerClassNames?.endIcon,\n      layerClassNames?.root,\n      layerClassNames?.startIcon,\n      menuItemClassName,\n      spacing,\n      spacingBottom,\n      spacingEnd,\n      spacingHorizontal,\n      spacingStart,\n      spacingTop,\n      spacingVertical,\n    ],\n  );\n\n  // Must follow ariakit extension guidelines:\n  // https://ariakit.org/guide/composition#custom-components-must-be-open-for-extension\n  const rootRender =\n    slots?.root ??\n    ((p) => (\n      <Pressable\n        {...p}\n        {...props}\n        onClick={(e) => {\n          p.onClick?.(e);\n          props.onClick?.(e);\n        }}\n      />\n    ));\n\n  return (\n    <RootComponent\n      ref={ref}\n      name={name ?? ''}\n      {...rootProps}\n      render={rootRender}\n      disabled={disabled}\n      className={classNames.root}\n    >\n      <HStack gap={columnGap} alignItems=\"center\" width=\"full\">\n        <AnimatePresence initial={false}>\n          {startIcon && (\n            <m.span\n              variants={iconAnimationVariants}\n              initial=\"hidden\"\n              animate=\"visible\"\n              exit=\"hidden\"\n              className=\"uds-start-icon\"\n            >\n              <IconSlot\n                icon={startIcon}\n                className={classNames.startIcon}\n                iconProps={{\n                  size: 'sm',\n                  variant: active ? 'fill' : 'outline',\n                  color: 'current',\n                }}\n              />\n            </m.span>\n          )}\n        </AnimatePresence>\n        <span className={contentStyles}>{children}</span>\n      </HStack>\n      <AnimatePresence initial={false} mode=\"popLayout\">\n        {!hideEndIcon && endIcon && (\n          <m.span\n            variants={iconAnimationVariants}\n            initial=\"hidden\"\n            animate=\"visible\"\n            exit=\"hidden\"\n            className=\"uds-end-icon\"\n          >\n            <IconSlot\n              icon={endIcon}\n              className={classNames.endIcon}\n              iconProps={{\n                size: 'sm',\n                variant: active ? 'fill' : 'outline',\n                color: 'current',\n              }}\n            />\n          </m.span>\n        )}\n      </AnimatePresence>\n    </RootComponent>\n  );\n});\n\nMenuItemBase.displayName = 'MenuItemBase';\n\nexport { ITEM_CLASS_NAME, MenuItemBase };\n"],"mappings":";;;;;;;;;;AAyCA,MAAM,kBAAkB;AAExB,MAAM,wBAAwB;CAC5B,SAAS;EAAE,OAAO;EAAG,SAAS;EAAG;CACjC,QAAQ;EAAE,OAAO;EAAK,SAAS;EAAG;CACnC;;AAQD,MAAM,wBAAwB,EAAE,QAAQ,UAAU,gBAAsC;AACtF,QAAO,GACL,iBACA,QAIA,4BACA,oCACA,sBACA,YAEA,sBAEA,UAAU,CAAC,yCAAyC,EAEpD,YAAY,iCAQZ,gEACA,OACA,UACD;;;;;;AAWH,MAAM,eAAe,WAA8C,SAASA,eAC1E,EACE,UAAU,KACV,eACA,YACA,oBAAoB,KACpB,cACA,YACA,kBAAkB,OAClB,YAAY,KACZ,WACA,UACA,SACA,WACA,aACA,QACA,UACA,IAAI,eACJ,MACA,aAAa,UACb,iBAAiB,iBACjB,iBACA,OACA,UACA,GAAG,SAEL,KACA;CACA,MAAM,sBAAsB,SAAS,MAAM,SAAS,GAAG;CACvD,MAAM,oBAAoB,qBAAqB;EAAE;EAAQ;EAAU;EAAW,CAAC;;;;CAK/E,MAAM,gBAAgB,UAAU;EAE9B,WAAW,GAAG,GAAG,gBAAgB,oBAAoB,iBAAiB,KAAK;EAC3E,WAAW;EAEX,GAAI,uBAAuB;GACzB;GACA,SAAS;GACT,YAAY;GACZ,OAAO;GACP,gBAAgB;GACjB;EACF,CAAC;;;;CAKF,MAAM,aAAa,eACV;EACL,MAAM,UAAU;GACd,cAAc;GACd,eAAe;GACf;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA,WAAW,GAAG,mBAAmB,iBAAiB,KAAK;GACxD,CAAC;EAEF,WAAW,UAAU;GACnB,mBAAmB;GACnB,WAAW,iBAAiB;GAC7B,CAAC;EAEF,SAAS,UAAU;GACjB,iBAAiB;GACjB,WAAW,iBAAiB;GAC7B,CAAC;EACH,GACD;EACE;EACA;EACA;EACA,iBAAiB;EACjB,iBAAiB;EACjB,iBAAiB;EACjB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CACF;CAID,MAAM,aACJ,OAAO,UACL,MACA,oBAAC;EACC,GAAI;EACJ,GAAI;EACJ,UAAU,MAAM;AACd,KAAE,UAAU,EAAE;AACd,SAAM,UAAU,EAAE;;GAEpB;AAGN,QACE,qBAAC;EACM;EACL,MAAM,QAAQ;EACd,GAAI;EACJ,QAAQ;EACE;EACV,WAAW,WAAW;aAEtB,qBAAC;GAAO,KAAK;GAAW,YAAW;GAAS,OAAM;cAChD,oBAAC;IAAgB,SAAS;cACvB,aACC,oBAAC,EAAE;KACD,UAAU;KACV,SAAQ;KACR,SAAQ;KACR,MAAK;KACL,WAAU;eAEV,oBAAC;MACC,MAAM;MACN,WAAW,WAAW;MACtB,WAAW;OACT,MAAM;OACN,SAAS,SAAS,SAAS;OAC3B,OAAO;OACR;OACD;MACK;KAEK,EAClB,oBAAC;IAAK,WAAW;IAAgB;KAAgB;IAC1C,EACT,oBAAC;GAAgB,SAAS;GAAO,MAAK;aACnC,CAAC,eAAe,WACf,oBAAC,EAAE;IACD,UAAU;IACV,SAAQ;IACR,SAAQ;IACR,MAAK;IACL,WAAU;cAEV,oBAAC;KACC,MAAM;KACN,WAAW,WAAW;KACtB,WAAW;MACT,MAAM;MACN,SAAS,SAAS,SAAS;MAC3B,OAAO;MACR;MACD;KACK;IAEK;GACJ;EAElB;AAEF,aAAa,cAAc"}