@yahoo/uds 3.59.0-beta.1 → 3.60.0

package/dist/components/HStack.d.cts

@@ -1,40 +0,0 @@
-import { UniversalStackProps } from "../tokens/types.cjs";
-import "../tokens/index.cjs";
-import { DivProps } from "./Box.cjs";
-import * as react1 from "react";
-
-//#region src/components/HStack.d.ts
-interface HStackProps extends UniversalStackProps, DivProps {}
-/**
- * **📏 A layout component that arranges its children in columns using flexbox**
- *
- * @description
- * HStack is a layout primitive that arranges its children in a columns [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)
- * and can be used to compose larger layouts. HStack is similar to [Box](./box) but provides additional features like a `gap` property to
- * add spacing between children.
- *
- * @example
- * ```tsx
- * import { HStack, Text } from '@yahoo/uds';
-
- * <HStack gap="6">
- *   <Text variant="body1" color="primary">First</Text>
- *   <Text variant="body1" color="primary">Second</Text>
- *   <Text variant="body1" color="primary">Third</Text>
- * </HStack>
- * ```
- *
- * @usage
- * - Create a row of items, optionally with gaps between items.
- * - Create columns that are sized to their content.
- * - Create columns that fill the available space within the parent container.
- * - Create columns of proportionate size to each other (also known as a ratio-based layout).
- *
- * @see The {@link https://uds.build/docs/components/h-stack HStack Docs} for more info
- *
- * @related [Box](https://uds.build/docs/components/box), [VStack](https://uds.build/docs/components/v-stack)
- **/
-declare const HStack: react1.ForwardRefExoticComponent<HStackProps & react1.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { HStack, type HStackProps };
-//# sourceMappingURL=HStack.d.cts.map

package/dist/components/HStack.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"HStack.d.cts","names":[],"sources":["../../src/components/HStack.tsx"],"sourcesContent":[],"mappings":";;;;;;UAOU,WAAA,CAAA,OAAA,CAAoB,qBAAqB;;;AAHb,CAAA;AAGqB,CAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;cA+BrD,QAAM,MAAA,CAAA,0BAAA,cAAA,MAAA,CAAA,cAAA"}

package/dist/components/HStack.d.ts

@@ -1,40 +0,0 @@
-import { UniversalStackProps } from "../tokens/types.js";
-import "../tokens/index.js";
-import { DivProps } from "./Box.js";
-import * as react4 from "react";
-
-//#region src/components/HStack.d.ts
-interface HStackProps extends UniversalStackProps, DivProps {}
-/**
- * **📏 A layout component that arranges its children in columns using flexbox**
- *
- * @description
- * HStack is a layout primitive that arranges its children in a columns [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)
- * and can be used to compose larger layouts. HStack is similar to [Box](./box) but provides additional features like a `gap` property to
- * add spacing between children.
- *
- * @example
- * ```tsx
- * import { HStack, Text } from '@yahoo/uds';
-
- * <HStack gap="6">
- *   <Text variant="body1" color="primary">First</Text>
- *   <Text variant="body1" color="primary">Second</Text>
- *   <Text variant="body1" color="primary">Third</Text>
- * </HStack>
- * ```
- *
- * @usage
- * - Create a row of items, optionally with gaps between items.
- * - Create columns that are sized to their content.
- * - Create columns that fill the available space within the parent container.
- * - Create columns of proportionate size to each other (also known as a ratio-based layout).
- *
- * @see The {@link https://uds.build/docs/components/h-stack HStack Docs} for more info
- *
- * @related [Box](https://uds.build/docs/components/box), [VStack](https://uds.build/docs/components/v-stack)
- **/
-declare const HStack: react4.ForwardRefExoticComponent<HStackProps & react4.RefAttributes<HTMLDivElement>>;
-//#endregion
-export { HStack, type HStackProps };
-//# sourceMappingURL=HStack.d.ts.map

package/dist/components/HStack.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"HStack.d.ts","names":[],"sources":["../../src/components/HStack.tsx"],"sourcesContent":[],"mappings":";;;;;;UAOU,WAAA,CAAA,OAAA,CAAoB,qBAAqB;;;AAHb,CAAA;AAGqB,CAAA,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;cA+BrD,QAAM,MAAA,CAAA,0BAAA,cAAA,MAAA,CAAA,cAAA"}

package/dist/components/HStack.js

@@ -1,51 +0,0 @@
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { Box } from "./Box.js";
-import { intersperseReactChildren } from "../utils/intersperse.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/HStack.tsx
-/**
-* **📏 A layout component that arranges its children in columns using flexbox** 
-* 
-* @description
-* HStack is a layout primitive that arranges its children in a columns [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)
-* and can be used to compose larger layouts. HStack is similar to [Box](./box) but provides additional features like a `gap` property to
-* add spacing between children.
-*
-* @example
-* ```tsx
-* import { HStack, Text } from '@yahoo/uds';
-
-* <HStack gap="6">
-*   <Text variant="body1" color="primary">First</Text>
-*   <Text variant="body1" color="primary">Second</Text>
-*   <Text variant="body1" color="primary">Third</Text>
-* </HStack>
-* ```
-* 
-* @usage
-* - Create a row of items, optionally with gaps between items.
-* - Create columns that are sized to their content.
-* - Create columns that fill the available space within the parent container.
-* - Create columns of proportionate size to each other (also known as a ratio-based layout).
-*
-* @see The {@link https://uds.build/docs/components/h-stack HStack Docs} for more info
-*
-* @related [Box](https://uds.build/docs/components/box), [VStack](https://uds.build/docs/components/v-stack)
-**/
-const HStack = forwardRef(function HStack$1({ gap, children, separator,...props }, ref) {
-	return /* @__PURE__ */ jsx(Box, {
-		ref,
-		flexDirection: "row",
-		rowGap: gap,
-		columnGap: gap,
-		...props,
-		children: separator ? intersperseReactChildren(children, separator) : children
-	});
-});
-HStack.displayName = "HStack";
-
-//#endregion
-export { HStack };
-//# sourceMappingURL=HStack.js.map

package/dist/components/HStack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HStack.js","names":["HStack"],"sources":["../../src/components/HStack.tsx"],"sourcesContent":["import type { UniversalStackProps } from '@yahoo/uds/tokens';\nimport { forwardRef } from 'react';\n\nimport { intersperseReactChildren } from '../utils/intersperse';\nimport type { DivProps } from './Box';\nimport { Box } from './Box';\n\ninterface HStackProps extends UniversalStackProps, DivProps {}\n\n/**\n * **📏 A layout component that arranges its children in columns using flexbox** \n * \n * @description\n * HStack is a layout primitive that arranges its children in a columns [flexbox](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)\n * and can be used to compose larger layouts. HStack is similar to [Box](./box) but provides additional features like a `gap` property to\n * add spacing between children.\n *\n * @example\n * ```tsx\n * import { HStack, Text } from '@yahoo/uds';\n\n * <HStack gap=\"6\">\n *   <Text variant=\"body1\" color=\"primary\">First</Text>\n *   <Text variant=\"body1\" color=\"primary\">Second</Text>\n *   <Text variant=\"body1\" color=\"primary\">Third</Text>\n * </HStack>\n * ```\n * \n * @usage\n * - Create a row of items, optionally with gaps between items.\n * - Create columns that are sized to their content.\n * - Create columns that fill the available space within the parent container.\n * - Create columns of proportionate size to each other (also known as a ratio-based layout).\n *\n * @see The {@link https://uds.build/docs/components/h-stack HStack Docs} for more info\n *\n * @related [Box](https://uds.build/docs/components/box), [VStack](https://uds.build/docs/components/v-stack)\n **/\nconst HStack = forwardRef<HTMLDivElement, HStackProps>(function HStack(\n  { gap, children, separator, ...props }: HStackProps,\n  ref,\n) {\n  return (\n    <Box ref={ref} flexDirection=\"row\" rowGap={gap} columnGap={gap} {...props}>\n      {separator ? intersperseReactChildren(children, separator) : children}\n    </Box>\n  );\n});\n\n// Need to re-set this because of the forwardRef wrapper\nHStack.displayName = 'HStack';\n\nexport { HStack, type HStackProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,MAAM,SAAS,WAAwC,SAASA,SAC9D,EAAE,KAAK,UAAU,UAAW,GAAG,SAC/B,KACA;AACA,QACE,oBAAC;EAAS;EAAK,eAAc;EAAM,QAAQ;EAAK,WAAW;EAAK,GAAI;YACjE,YAAY,yBAAyB,UAAU,UAAU,GAAG;GACzD;EAER;AAGF,OAAO,cAAc"}

package/dist/components/Icon.cjs

@@ -1,67 +0,0 @@
-/*! © 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_tokens_configs_sizes = require('../tokens/configs/sizes.cjs');
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-
-//#region src/components/Icon.tsx
-/**
-* **🎨 A component for displaying icons**
-*
-* @description
-* [Iconography](https://uds.build/docs/core-concepts/icons) contains small symbols for actions or
-* other items. They are available in four different sizes: `xs`, `sm`, `md`, and
-* `lg`. Each size also supports an outline and fill variant. Icons can be
-* colored using the `color` prop.
-*
-* The component is available in the `@yahoo/uds` package but is meant to be used
-* with the assets in `@yahoo/uds-icons`. You will need both packages to use icons.
-* A separate package provides modularity from the core library, better
-* versioning strategies, and tree shakeability.
-*
-* @example
-* ```tsx
-* import { Icon } from '@yahoo/uds';
-* import { AddFolder } from '@yahoo/uds-icons';
-*
-* <Icon name={AddFolder} variant="fill" size="sm" />
-* ```
-*
-* @usage
-* - If you need to display an icon.
-*
-* @see The {@link https://uds.build/docs/components/icon Icon Docs} for more info
-*
-* @related [IconButton](https://uds.build/docs/components/icon-button)
-*/
-const Icon = (0, react.forwardRef)(function BaseIcon({ name: SVGIcon, size = "md", variant = "outline", color = "primary", className,...props }, ref) {
-	const availableVariants = SVGIcon.metadata?.variants ?? [];
-	const effectiveVariant = availableVariants.includes(variant) ? variant : availableVariants[0] ?? "fill";
-	const isMulticolor = effectiveVariant === "multicolor";
-	const styles = require_styles_styler.getStyles({
-		flex: "none",
-		color: isMulticolor ? void 0 : color,
-		className: require_styles_styler.cx(className, !isMulticolor && "[&_path]:fill-current")
-	});
-	const sizePx = require_tokens_configs_sizes.normalIconSizes[size];
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
-		ref,
-		xmlns: "http://www.w3.org/2000/svg",
-		width: sizePx,
-		height: sizePx,
-		viewBox: `0 0 ${sizePx} ${sizePx}`,
-		"aria-hidden": "true",
-		focusable: "false",
-		className: styles,
-		...props,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SVGIcon, {
-			size,
-			variant: effectiveVariant
-		})
-	});
-});
-Icon.displayName = "Icon";
-
-//#endregion
-exports.Icon = Icon;

package/dist/components/Icon.d.cts

@@ -1,39 +0,0 @@
-import { IconPropsWithSVGProps } from "../tokens/types.cjs";
-import "../tokens/index.cjs";
-import * as react3 from "react";
-
-//#region src/components/Icon.d.ts
-
-/**
- * **🎨 A component for displaying icons**
- *
- * @description
- * [Iconography](https://uds.build/docs/core-concepts/icons) contains small symbols for actions or
- * other items. They are available in four different sizes: `xs`, `sm`, `md`, and
- * `lg`. Each size also supports an outline and fill variant. Icons can be
- * colored using the `color` prop.
- *
- * The component is available in the `@yahoo/uds` package but is meant to be used
- * with the assets in `@yahoo/uds-icons`. You will need both packages to use icons.
- * A separate package provides modularity from the core library, better
- * versioning strategies, and tree shakeability.
- *
- * @example
- * ```tsx
- * import { Icon } from '@yahoo/uds';
- * import { AddFolder } from '@yahoo/uds-icons';
- *
- * <Icon name={AddFolder} variant="fill" size="sm" />
- * ```
- *
- * @usage
- * - If you need to display an icon.
- *
- * @see The {@link https://uds.build/docs/components/icon Icon Docs} for more info
- *
- * @related [IconButton](https://uds.build/docs/components/icon-button)
- */
-declare const Icon: react3.ForwardRefExoticComponent<IconPropsWithSVGProps & react3.RefAttributes<SVGSVGElement>>;
-//#endregion
-export { Icon, type IconPropsWithSVGProps as IconProps };
-//# sourceMappingURL=Icon.d.cts.map

package/dist/components/Icon.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Icon.d.cts","names":[],"sources":["../../src/components/Icon.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;AAGoE,CAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,CAAA,IAAA,CAAA,IAAA,CAAA,QAAA,CAAA,KAAA,CAAA,CAAA,QAAA,CAAA,KAAA,CAAA,OAAA,CAAA,GAAA,CAAA,OAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;cAiC9D,MAAI,MAAA,CAAA,0BAAA,wBAAA,MAAA,CAAA,cAAA"}

package/dist/components/Icon.d.ts

@@ -1,39 +0,0 @@
-import { IconPropsWithSVGProps } from "../tokens/types.js";
-import "../tokens/index.js";
-import * as react6 from "react";
-
-//#region src/components/Icon.d.ts
-
-/**
- * **🎨 A component for displaying icons**
- *
- * @description
- * [Iconography](https://uds.build/docs/core-concepts/icons) contains small symbols for actions or
- * other items. They are available in four different sizes: `xs`, `sm`, `md`, and
- * `lg`. Each size also supports an outline and fill variant. Icons can be
- * colored using the `color` prop.
- *
- * The component is available in the `@yahoo/uds` package but is meant to be used
- * with the assets in `@yahoo/uds-icons`. You will need both packages to use icons.
- * A separate package provides modularity from the core library, better
- * versioning strategies, and tree shakeability.
- *
- * @example
- * ```tsx
- * import { Icon } from '@yahoo/uds';
- * import { AddFolder } from '@yahoo/uds-icons';
- *
- * <Icon name={AddFolder} variant="fill" size="sm" />
- * ```
- *
- * @usage
- * - If you need to display an icon.
- *
- * @see The {@link https://uds.build/docs/components/icon Icon Docs} for more info
- *
- * @related [IconButton](https://uds.build/docs/components/icon-button)
- */
-declare const Icon: react6.ForwardRefExoticComponent<IconPropsWithSVGProps & react6.RefAttributes<SVGSVGElement>>;
-//#endregion
-export { Icon, type IconPropsWithSVGProps as IconProps };
-//# sourceMappingURL=Icon.d.ts.map

package/dist/components/Icon.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Icon.d.ts","names":[],"sources":["../../src/components/Icon.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;;AAGoE,CAAA,CAAA,CAAA,CAAA,WAAA,CAAA,CAAA,KAAA,CAAA,CAAA,CAAA,GAAA,CAAA,KAAA,CAAA,IAAA,CAAA,IAAA,CAAA,QAAA,CAAA,KAAA,CAAA,CAAA,QAAA,CAAA,KAAA,CAAA,OAAA,CAAA,GAAA,CAAA,OAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;cAiC9D,MAAI,MAAA,CAAA,0BAAA,wBAAA,MAAA,CAAA,cAAA"}

package/dist/components/Icon.js

@@ -1,67 +0,0 @@
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { cx, getStyles } from "../styles/styler.js";
-import { normalIconSizes } from "../tokens/configs/sizes.js";
-import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/components/Icon.tsx
-/**
-* **🎨 A component for displaying icons**
-*
-* @description
-* [Iconography](https://uds.build/docs/core-concepts/icons) contains small symbols for actions or
-* other items. They are available in four different sizes: `xs`, `sm`, `md`, and
-* `lg`. Each size also supports an outline and fill variant. Icons can be
-* colored using the `color` prop.
-*
-* The component is available in the `@yahoo/uds` package but is meant to be used
-* with the assets in `@yahoo/uds-icons`. You will need both packages to use icons.
-* A separate package provides modularity from the core library, better
-* versioning strategies, and tree shakeability.
-*
-* @example
-* ```tsx
-* import { Icon } from '@yahoo/uds';
-* import { AddFolder } from '@yahoo/uds-icons';
-*
-* <Icon name={AddFolder} variant="fill" size="sm" />
-* ```
-*
-* @usage
-* - If you need to display an icon.
-*
-* @see The {@link https://uds.build/docs/components/icon Icon Docs} for more info
-*
-* @related [IconButton](https://uds.build/docs/components/icon-button)
-*/
-const Icon = forwardRef(function BaseIcon({ name: SVGIcon, size = "md", variant = "outline", color = "primary", className,...props }, ref) {
-	const availableVariants = SVGIcon.metadata?.variants ?? [];
-	const effectiveVariant = availableVariants.includes(variant) ? variant : availableVariants[0] ?? "fill";
-	const isMulticolor = effectiveVariant === "multicolor";
-	const styles = getStyles({
-		flex: "none",
-		color: isMulticolor ? void 0 : color,
-		className: cx(className, !isMulticolor && "[&_path]:fill-current")
-	});
-	const sizePx = normalIconSizes[size];
-	return /* @__PURE__ */ jsx("svg", {
-		ref,
-		xmlns: "http://www.w3.org/2000/svg",
-		width: sizePx,
-		height: sizePx,
-		viewBox: `0 0 ${sizePx} ${sizePx}`,
-		"aria-hidden": "true",
-		focusable: "false",
-		className: styles,
-		...props,
-		children: /* @__PURE__ */ jsx(SVGIcon, {
-			size,
-			variant: effectiveVariant
-		})
-	});
-});
-Icon.displayName = "Icon";
-
-//#endregion
-export { Icon };
-//# sourceMappingURL=Icon.js.map

package/dist/components/Icon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Icon.js","names":[],"sources":["../../src/components/Icon.tsx"],"sourcesContent":["import { forwardRef } from 'react';\n\nimport { cx, getStyles } from '../styles/styler';\nimport type { IconPropsWithSVGProps as IconProps } from '../tokens';\nimport { normalIconSizes } from '../tokens/configs/sizes';\n\n/**\n * **🎨 A component for displaying icons**\n *\n * @description\n * [Iconography](https://uds.build/docs/core-concepts/icons) contains small symbols for actions or\n * other items. They are available in four different sizes: `xs`, `sm`, `md`, and\n * `lg`. Each size also supports an outline and fill variant. Icons can be\n * colored using the `color` prop.\n *\n * The component is available in the `@yahoo/uds` package but is meant to be used\n * with the assets in `@yahoo/uds-icons`. You will need both packages to use icons.\n * A separate package provides modularity from the core library, better\n * versioning strategies, and tree shakeability.\n *\n * @example\n * ```tsx\n * import { Icon } from '@yahoo/uds';\n * import { AddFolder } from '@yahoo/uds-icons';\n *\n * <Icon name={AddFolder} variant=\"fill\" size=\"sm\" />\n * ```\n *\n * @usage\n * - If you need to display an icon.\n *\n * @see The {@link https://uds.build/docs/components/icon Icon Docs} for more info\n *\n * @related [IconButton](https://uds.build/docs/components/icon-button)\n */\n\nconst Icon = forwardRef<SVGSVGElement, IconProps>(function BaseIcon(\n  {\n    name: SVGIcon,\n    size = 'md',\n    variant = 'outline',\n    color = 'primary',\n    className,\n    ...props\n  }: IconProps,\n  ref,\n) {\n  // Check if the requested variant is available\n  const availableVariants = SVGIcon.metadata?.variants ?? [];\n  const effectiveVariant = availableVariants.includes(variant)\n    ? variant\n    : (availableVariants[0] ?? 'fill');\n\n  const isMulticolor = effectiveVariant === 'multicolor';\n  const styles = getStyles({\n    flex: 'none',\n    color: isMulticolor ? undefined : color,\n    className: cx(className, !isMulticolor && '[&_path]:fill-current'),\n  });\n  const sizePx = normalIconSizes[size]; // TODO: use scale modes when they are available.\n\n  return (\n    <svg\n      ref={ref}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={sizePx}\n      height={sizePx}\n      viewBox={`0 0 ${sizePx} ${sizePx}`}\n      aria-hidden=\"true\"\n      focusable=\"false\"\n      className={styles}\n      {...props}\n    >\n      <SVGIcon size={size} variant={effectiveVariant} />\n    </svg>\n  );\n});\n\n// Need to re-set this because of the forwardRef wrapper\nIcon.displayName = 'Icon';\n\nexport { Icon, type IconProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,MAAM,OAAO,WAAqC,SAAS,SACzD,EACE,MAAM,SACN,OAAO,MACP,UAAU,WACV,QAAQ,WACR,UACA,GAAG,SAEL,KACA;CAEA,MAAM,oBAAoB,QAAQ,UAAU,YAAY,EAAE;CAC1D,MAAM,mBAAmB,kBAAkB,SAAS,QAAQ,GACxD,UACC,kBAAkB,MAAM;CAE7B,MAAM,eAAe,qBAAqB;CAC1C,MAAM,SAAS,UAAU;EACvB,MAAM;EACN,OAAO,eAAe,SAAY;EAClC,WAAW,GAAG,WAAW,CAAC,gBAAgB,wBAAwB;EACnE,CAAC;CACF,MAAM,SAAS,gBAAgB;AAE/B,QACE,oBAAC;EACM;EACL,OAAM;EACN,OAAO;EACP,QAAQ;EACR,SAAS,OAAO,OAAO,GAAG;EAC1B,eAAY;EACZ,WAAU;EACV,WAAW;EACX,GAAI;YAEJ,oBAAC;GAAc;GAAM,SAAS;IAAoB;GAC9C;EAER;AAGF,KAAK,cAAc"}

package/dist/components/IconSlot.cjs

@@ -1,57 +0,0 @@
-/*! © 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_Icon = require('./Icon.cjs');
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-let lodash_isFunction_js = require("lodash/isFunction.js");
-lodash_isFunction_js = require_rolldown_runtime.__toESM(lodash_isFunction_js);
-
-//#region src/components/IconSlot.tsx
-/**
-* A helper container to render a SvgIcon, Icon component, or ReactNode.
-*
-* Useful in components that use icons and have a startIcon and endIcon. It allows
-* consumers to pass in a standard UDS icon (`SvgIcon`) or a ReactNode if they
-* need to override props on the icon. For example, pass an `<Icon>` to override
-* the icon variant. Pass a `<IconButton>` to support interactivity on an icon slot.
-*
-* Examples:
-* ```
-* <Input startIcon={Info} />
-* <Input startIcon={<Icon name={Info} variant="fill" />} />
-* <Input startIcon={() => <Icon name={Info} variant="fill" />} />
-* <Input endIcon={() => <IconButton name={Info} aria-label="My label" />} />
-* ```
-*/
-const IconSlot = (0, react.memo)(function IconSlot$1({ icon, iconProps, className: slotClassName,...rest }) {
-	if (!icon) return null;
-	const { className: iconPropsClassName,...props } = iconProps || {};
-	const mergedClassName = require_styles_styler.cx(slotClassName, iconPropsClassName);
-	const svgIcon = icon;
-	if (svgIcon.metadata?.isSvgIcon) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
-		name: svgIcon,
-		...props,
-		...rest,
-		className: mergedClassName
-	});
-	if ((0, lodash_isFunction_js.default)(icon)) {
-		const iconEl = icon(iconProps || {});
-		const renderedElementClassName = iconEl?.props.className;
-		return (0, react.isValidElement)(iconEl) && (0, react.cloneElement)(iconEl, {
-			...rest,
-			className: require_styles_styler.cx(mergedClassName, renderedElementClassName)
-		});
-	}
-	return (0, react.isValidElement)(icon) && (0, react.cloneElement)(icon, {
-		...props,
-		...icon.props,
-		...rest,
-		className: require_styles_styler.cx(mergedClassName, icon.props.className)
-	});
-});
-IconSlot.displayName = "IconSlot";
-
-//#endregion
-exports.IconSlot = IconSlot;

package/dist/components/IconSlot.d.cts

@@ -1,32 +0,0 @@
-import { IconPropsWithSVGProps, UniversalIconSlot } from "../tokens/types.cjs";
-import "../tokens/index.cjs";
-import React from "react";
-
-//#region src/components/IconSlot.d.ts
-interface IconSlotProps {
-  /** The icon to render. Can be a UDS icon, an Icon component, ReactNode, or a function that a ReactNode. */
-  icon?: UniversalIconSlot;
-  /** Props to spread onto the icon. */
-  iconProps?: Omit<IconPropsWithSVGProps, 'name'>;
-  className?: string;
-}
-/**
- * A helper container to render a SvgIcon, Icon component, or ReactNode.
- *
- * Useful in components that use icons and have a startIcon and endIcon. It allows
- * consumers to pass in a standard UDS icon (`SvgIcon`) or a ReactNode if they
- * need to override props on the icon. For example, pass an `<Icon>` to override
- * the icon variant. Pass a `<IconButton>` to support interactivity on an icon slot.
- *
- * Examples:
- * ```
- * <Input startIcon={Info} />
- * <Input startIcon={<Icon name={Info} variant="fill" />} />
- * <Input startIcon={() => <Icon name={Info} variant="fill" />} />
- * <Input endIcon={() => <IconButton name={Info} aria-label="My label" />} />
- * ```
- */
-declare const IconSlot: React.NamedExoticComponent<IconSlotProps>;
-//#endregion
-export { IconSlot, type IconSlotProps };
-//# sourceMappingURL=IconSlot.d.cts.map

package/dist/components/IconSlot.d.cts.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconSlot.d.cts","names":[],"sources":["../../src/components/IconSlot.tsx"],"sourcesContent":[],"mappings":";;;;;UASU,aAAA;;SAED;EAFC,CAAA,CAAA,CAAA,CAAA,KAAA,CAAA,EAAA,CAAA,MAAA,CAAA,IAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,CAAA;EAED,SAAA,CAAA,CAAA,CAEK,IAFL,CAEU,qBAFV,CAAA,CAAA,CAAA,IAAA,CAAA,CAAA;EAEU,SAAA,CAAA,CAAA,CAAA,MAAA;;;AAAD,CAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA,CAAA,CAAA,CAAA,OAAA,CAAA,CAAA,IAAA,CAAA,SAAA,CAAA,CAAA,EAAA,CAAA,SAAA;;;;;;;;;;;;;;;cAoBZ,UAAQ,KAAA,CAAA,qBAAA"}

package/dist/components/IconSlot.d.ts

@@ -1,32 +0,0 @@
-import { IconPropsWithSVGProps, UniversalIconSlot } from "../tokens/types.js";
-import "../tokens/index.js";
-import React from "react";
-
-//#region src/components/IconSlot.d.ts
-interface IconSlotProps {
-  /** The icon to render. Can be a UDS icon, an Icon component, ReactNode, or a function that a ReactNode. */
-  icon?: UniversalIconSlot;
-  /** Props to spread onto the icon. */
-  iconProps?: Omit<IconPropsWithSVGProps, 'name'>;
-  className?: string;
-}
-/**
- * A helper container to render a SvgIcon, Icon component, or ReactNode.
- *
- * Useful in components that use icons and have a startIcon and endIcon. It allows
- * consumers to pass in a standard UDS icon (`SvgIcon`) or a ReactNode if they
- * need to override props on the icon. For example, pass an `<Icon>` to override
- * the icon variant. Pass a `<IconButton>` to support interactivity on an icon slot.
- *
- * Examples:
- * ```
- * <Input startIcon={Info} />
- * <Input startIcon={<Icon name={Info} variant="fill" />} />
- * <Input startIcon={() => <Icon name={Info} variant="fill" />} />
- * <Input endIcon={() => <IconButton name={Info} aria-label="My label" />} />
- * ```
- */
-declare const IconSlot: React.NamedExoticComponent<IconSlotProps>;
-//#endregion
-export { IconSlot, type IconSlotProps };
-//# sourceMappingURL=IconSlot.d.ts.map

package/dist/components/IconSlot.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconSlot.d.ts","names":[],"sources":["../../src/components/IconSlot.tsx"],"sourcesContent":[],"mappings":";;;;;UASU,aAAA;;SAED;EAFC,CAAA,CAAA,CAAA,CAAA,KAAA,CAAA,EAAA,CAAA,MAAA,CAAA,IAAA,CAAA,GAAA,CAAA,IAAA,CAAA,CAAA,CAAA;EAED,SAAA,CAAA,CAAA,CAEK,IAFL,CAEU,qBAFV,CAAA,CAAA,CAAA,IAAA,CAAA,CAAA;EAEU,SAAA,CAAA,CAAA,CAAA,MAAA;;;AAAD,CAAA,CAAA,CAAA,CAAA,CAAA,MAAA,CAAA,SAAA,CAAA,EAAA,CAAA,MAAA,CAAA,CAAA,CAAA,OAAA,CAAA,CAAA,IAAA,CAAA,SAAA,CAAA,CAAA,EAAA,CAAA,SAAA;;;;;;;;;;;;;;;cAoBZ,UAAQ,KAAA,CAAA,qBAAA"}

package/dist/components/IconSlot.js

@@ -1,55 +0,0 @@
-/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
-import { cx } from "../styles/styler.js";
-import { Icon } from "./Icon.js";
-import React, { cloneElement, isValidElement, memo } from "react";
-import { jsx } from "react/jsx-runtime";
-import { isFunction } from "lodash-es";
-
-//#region src/components/IconSlot.tsx
-/**
-* A helper container to render a SvgIcon, Icon component, or ReactNode.
-*
-* Useful in components that use icons and have a startIcon and endIcon. It allows
-* consumers to pass in a standard UDS icon (`SvgIcon`) or a ReactNode if they
-* need to override props on the icon. For example, pass an `<Icon>` to override
-* the icon variant. Pass a `<IconButton>` to support interactivity on an icon slot.
-*
-* Examples:
-* ```
-* <Input startIcon={Info} />
-* <Input startIcon={<Icon name={Info} variant="fill" />} />
-* <Input startIcon={() => <Icon name={Info} variant="fill" />} />
-* <Input endIcon={() => <IconButton name={Info} aria-label="My label" />} />
-* ```
-*/
-const IconSlot = memo(function IconSlot$1({ icon, iconProps, className: slotClassName,...rest }) {
-	if (!icon) return null;
-	const { className: iconPropsClassName,...props } = iconProps || {};
-	const mergedClassName = cx(slotClassName, iconPropsClassName);
-	const svgIcon = icon;
-	if (svgIcon.metadata?.isSvgIcon) return /* @__PURE__ */ jsx(Icon, {
-		name: svgIcon,
-		...props,
-		...rest,
-		className: mergedClassName
-	});
-	if (isFunction(icon)) {
-		const iconEl = icon(iconProps || {});
-		const renderedElementClassName = iconEl?.props.className;
-		return isValidElement(iconEl) && cloneElement(iconEl, {
-			...rest,
-			className: cx(mergedClassName, renderedElementClassName)
-		});
-	}
-	return isValidElement(icon) && cloneElement(icon, {
-		...props,
-		...icon.props,
-		...rest,
-		className: cx(mergedClassName, icon.props.className)
-	});
-});
-IconSlot.displayName = "IconSlot";
-
-//#endregion
-export { IconSlot };
-//# sourceMappingURL=IconSlot.js.map

package/dist/components/IconSlot.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"IconSlot.js","names":[],"sources":["../../src/components/IconSlot.tsx"],"sourcesContent":["import type { SvgIcon } from '@yahoo/uds-icons/types';\nimport { isFunction } from 'lodash';\nimport type { ReactElement } from 'react';\nimport React, { cloneElement, isValidElement, memo } from 'react';\n\nimport { cx } from '../styles/styler';\nimport type { IconPropsWithSVGProps, UniversalIconSlot } from '../tokens';\nimport { Icon } from './Icon';\n\ninterface IconSlotProps {\n  /** The icon to render. Can be a UDS icon, an Icon component, ReactNode, or a function that a ReactNode. */\n  icon?: UniversalIconSlot;\n  /** Props to spread onto the icon. */\n  iconProps?: Omit<IconPropsWithSVGProps, 'name'>;\n  className?: string;\n}\n\n/**\n * A helper container to render a SvgIcon, Icon component, or ReactNode.\n *\n * Useful in components that use icons and have a startIcon and endIcon. It allows\n * consumers to pass in a standard UDS icon (`SvgIcon`) or a ReactNode if they\n * need to override props on the icon. For example, pass an `<Icon>` to override\n * the icon variant. Pass a `<IconButton>` to support interactivity on an icon slot.\n *\n * Examples:\n * ```\n * <Input startIcon={Info} />\n * <Input startIcon={<Icon name={Info} variant=\"fill\" />} />\n * <Input startIcon={() => <Icon name={Info} variant=\"fill\" />} />\n * <Input endIcon={() => <IconButton name={Info} aria-label=\"My label\" />} />\n * ```\n */\nconst IconSlot = memo(function IconSlot({\n  icon,\n  iconProps,\n  className: slotClassName,\n  ...rest\n}: IconSlotProps) {\n  if (!icon) {\n    return null;\n  }\n\n  const { className: iconPropsClassName, ...props } = iconProps || {};\n\n  const mergedClassName = cx(slotClassName, iconPropsClassName);\n\n  // Try as UDS SvgIcon first\n  const svgIcon = icon as SvgIcon;\n  if (svgIcon.metadata?.isSvgIcon) {\n    return <Icon name={svgIcon} {...props} {...rest} className={mergedClassName} />;\n  }\n\n  if (isFunction(icon)) {\n    const iconEl = icon(iconProps || {}) as ReactElement;\n    const renderedElementClassName = iconEl?.props.className;\n\n    return (\n      isValidElement(iconEl) &&\n      cloneElement(iconEl, {\n        ...rest,\n        className: cx(mergedClassName, renderedElementClassName),\n\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      } as any)\n    );\n  }\n\n  return (\n    isValidElement(icon) &&\n    cloneElement(icon, {\n      ...props, // default icons props from input\n      ...(icon as ReactElement).props, // user's props on <Icon>\n      ...rest, // anything else\n      className: cx(mergedClassName, (icon as ReactElement).props.className),\n    })\n  );\n});\n\nIconSlot.displayName = 'IconSlot';\n\nexport { IconSlot, type IconSlotProps };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAiCA,MAAM,WAAW,KAAK,SAAS,WAAS,EACtC,MACA,WACA,WAAW,cACX,GAAG,QACa;AAChB,KAAI,CAAC,KACH,QAAO;CAGT,MAAM,EAAE,WAAW,mBAAoB,GAAG,UAAU,aAAa,EAAE;CAEnE,MAAM,kBAAkB,GAAG,eAAe,mBAAmB;CAG7D,MAAM,UAAU;AAChB,KAAI,QAAQ,UAAU,UACpB,QAAO,oBAAC;EAAK,MAAM;EAAS,GAAI;EAAO,GAAI;EAAM,WAAW;GAAmB;AAGjF,KAAI,WAAW,KAAK,EAAE;EACpB,MAAM,SAAS,KAAK,aAAa,EAAE,CAAC;EACpC,MAAM,2BAA2B,QAAQ,MAAM;AAE/C,SACE,eAAe,OAAO,IACtB,aAAa,QAAQ;GACnB,GAAG;GACH,WAAW,GAAG,iBAAiB,yBAAyB;GAGzD,CAAO;;AAIZ,QACE,eAAe,KAAK,IACpB,aAAa,MAAM;EACjB,GAAG;EACH,GAAI,KAAsB;EAC1B,GAAG;EACH,WAAW,GAAG,iBAAkB,KAAsB,MAAM,UAAU;EACvE,CAAA;EAEH;AAEF,SAAS,cAAc"}