@yahoo/uds 3.135.0 → 3.137.0

package/dist/automated-config/dist/properties.d.cts

@@ -1,5 +1,5 @@
 
-import { ShadowPreset } from "../../types/src/index.cjs";
+import { ShadowPreset } from "../../types/dist/index.cjs";
 import { ArbitraryFixtures, InferArbitraryType } from "../../fixtures/dist/index.cjs";
 import { AllPossibleProperties, PossibleStates } from "./types/ComponentConfig.cjs";
 import { SchemaStateValue } from "./types/ConfigSchema.cjs";

package/dist/automated-config/dist/properties.d.ts

@@ -1,5 +1,5 @@
 
-import { ShadowPreset } from "../../types/src/index.js";
+import { ShadowPreset } from "../../types/dist/index.js";
 import { ArbitraryFixtures, InferArbitraryType } from "../../fixtures/dist/index.js";
 import { AllPossibleProperties, PossibleStates } from "./types/ComponentConfig.js";
 import { SchemaStateValue } from "./types/ConfigSchema.js";

package/dist/automated-config/dist/utils/buildConfigSchema.d.cts

@@ -1,5 +1,5 @@
 
-import { BannerInnerShadowOption, ElevationAlias, ShadowVariant, ShadowVariantConfig, ShadowVariantWithInvert } from "../../../types/src/index.cjs";
+import { BannerInnerShadowOption, ElevationAlias, ShadowVariant, ShadowVariantConfig, ShadowVariantWithInvert } from "../../../types/dist/index.cjs";
 import { ArbitraryFixtures, InferArbitraryType } from "../../../fixtures/dist/index.cjs";
 import { AllPossibleProperties, ComponentConfig, LayerConfig, PossibleStates, VariantConfig, VariantConfigWithComponentStates, VariantConfigWithProperties } from "../types/ComponentConfig.cjs";
 import { SchemaStateValue } from "../types/ConfigSchema.cjs";

package/dist/automated-config/dist/utils/buildConfigSchema.d.ts

@@ -1,5 +1,5 @@
 
-import { BannerInnerShadowOption, ElevationAlias, ShadowVariant, ShadowVariantConfig, ShadowVariantWithInvert } from "../../../types/src/index.js";
+import { BannerInnerShadowOption, ElevationAlias, ShadowVariant, ShadowVariantConfig, ShadowVariantWithInvert } from "../../../types/dist/index.js";
 import { ArbitraryFixtures, InferArbitraryType } from "../../../fixtures/dist/index.js";
 import { AllPossibleProperties, ComponentConfig, LayerConfig, PossibleStates, VariantConfig, VariantConfigWithComponentStates, VariantConfigWithProperties } from "../types/ComponentConfig.js";
 import { SchemaStateValue } from "../types/ConfigSchema.js";

package/dist/cli/runner.cjs

@@ -14,10 +14,6 @@ const require_cli_commands_version = require("./commands/version.cjs");
 let node_path = require("node:path");
 let ts_morph = require("ts-morph");
 //#region src/cli/runner.ts
-const isMissingIconsPackageError = (error) => {
-	const message = error instanceof Error ? error.message : String(error);
-	return message.includes("@yahoo/uds-icons/cli") || message.includes("Cannot find package") || message.includes("ERR_MODULE_NOT_FOUND");
-};
 require_cli.run([
 	require_cli_commands_version.versionCommand,
 	require_purge.makePurgeCommand(async () => {
@@ -56,42 +52,6 @@ require_cli.run([
 			componentData
 		};
 	}),
-	{
-		name: "create-icons",
-		description: "Create grouped IconDefinition modules from SVG assets directory",
-		run: async (props) => {
-			const commandModulePath = ["@yahoo/uds-icons", "cli"].join("/");
-			try {
-				const makeCreateIconsCommand = (await import(commandModulePath)).makeCreateIconsCommand;
-				if (typeof makeCreateIconsCommand !== "function") {
-					console.log("The @yahoo/uds-icons package is missing create-icons support. Please install or update @yahoo/uds-icons to use this command.");
-					return;
-				}
-				await makeCreateIconsCommand().run(props);
-			} catch (error) {
-				if (isMissingIconsPackageError(error)) {
-					try {
-						const makeCreateIconsCommand = (await import([
-							"..",
-							"..",
-							"..",
-							"icons",
-							"src",
-							"cli",
-							"index.ts"
-						].join("/"))).makeCreateIconsCommand;
-						if (typeof makeCreateIconsCommand === "function") {
-							await makeCreateIconsCommand().run(props);
-							return;
-						}
-					} catch {}
-					console.log("Install @yahoo/uds-icons to use `uds create-icons` (for example: bun add -d @yahoo/uds-icons).");
-					return;
-				}
-				throw error;
-			}
-		}
-	},
 	require_cli_commands_sync.syncCommand
 ]);
 //#endregion

package/dist/cli/runner.js

@@ -13,10 +13,6 @@ import { versionCommand } from "./commands/version.js";
 import { join } from "node:path";
 import { Project } from "ts-morph";
 //#region src/cli/runner.ts
-const isMissingIconsPackageError = (error) => {
-	const message = error instanceof Error ? error.message : String(error);
-	return message.includes("@yahoo/uds-icons/cli") || message.includes("Cannot find package") || message.includes("ERR_MODULE_NOT_FOUND");
-};
 run([
 	versionCommand,
 	makePurgeCommand(async () => {
@@ -55,42 +51,6 @@ run([
 			componentData
 		};
 	}),
-	{
-		name: "create-icons",
-		description: "Create grouped IconDefinition modules from SVG assets directory",
-		run: async (props) => {
-			const commandModulePath = ["@yahoo/uds-icons", "cli"].join("/");
-			try {
-				const makeCreateIconsCommand = (await import(commandModulePath)).makeCreateIconsCommand;
-				if (typeof makeCreateIconsCommand !== "function") {
-					console.log("The @yahoo/uds-icons package is missing create-icons support. Please install or update @yahoo/uds-icons to use this command.");
-					return;
-				}
-				await makeCreateIconsCommand().run(props);
-			} catch (error) {
-				if (isMissingIconsPackageError(error)) {
-					try {
-						const makeCreateIconsCommand = (await import([
-							"..",
-							"..",
-							"..",
-							"icons",
-							"src",
-							"cli",
-							"index.ts"
-						].join("/"))).makeCreateIconsCommand;
-						if (typeof makeCreateIconsCommand === "function") {
-							await makeCreateIconsCommand().run(props);
-							return;
-						}
-					} catch {}
-					console.log("Install @yahoo/uds-icons to use `uds create-icons` (for example: bun add -d @yahoo/uds-icons).");
-					return;
-				}
-				throw error;
-			}
-		}
-	},
 	syncCommand
 ]);
 //#endregion

package/dist/components/Banner/Banner.cjs

@@ -2,12 +2,12 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../../_virtual/_rolldown/runtime.cjs");
 const require_styles_styler = require("../../styles/styler.cjs");
+const require_components_client_Pressable = require("../client/Pressable.cjs");
 const require_components_IconSlot = require("../IconSlot.cjs");
 const require_components_Text = require("../Text.cjs");
-const require_components_client_Pressable = require("../client/Pressable.cjs");
 const require_components_Banner_utils = require("./utils.cjs");
-let react = require("react");
 let _yahoo_uds_icons = require("@yahoo/uds-icons");
+let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 //#region src/components/Banner/Banner.tsx
 const BASE_CLASS = "uds-banner";

package/dist/components/Banner/Banner.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalBannerProps } from "../../types/src/index.cjs";
+import { UniversalBannerProps } from "../../types/dist/index.cjs";
 import * as _$react from "react";
 
 //#region src/components/Banner/Banner.d.ts

package/dist/components/Banner/Banner.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalBannerProps } from "../../types/src/index.js";
+import { UniversalBannerProps } from "../../types/dist/index.js";
 import * as _$react from "react";
 
 //#region src/components/Banner/Banner.d.ts

package/dist/components/Banner/Banner.js

@@ -1,11 +1,11 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 import { cx, getStyles } from "../../styles/styler.js";
+import { Pressable } from "../client/Pressable.js";
 import { IconSlot } from "../IconSlot.js";
 import { Text } from "../Text.js";
-import { Pressable } from "../client/Pressable.js";
 import { BANNER_TO_BUTTON_VARIANT, hasDisplayName, separateChildren } from "./utils.js";
-import { cloneElement, forwardRef, isValidElement } from "react";
 import { Cross } from "@yahoo/uds-icons";
+import { cloneElement, forwardRef, isValidElement } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/Banner/Banner.tsx
 const BASE_CLASS = "uds-banner";

package/dist/components/Banner/utils.d.cts

@@ -1,5 +1,5 @@
 
-import { BannerVariant } from "../../types/src/index.cjs";
+import { BannerVariant } from "../../types/dist/index.cjs";
 import { ReactNode } from "react";
 
 //#region src/components/Banner/utils.d.ts

package/dist/components/Banner/utils.d.ts

@@ -1,5 +1,5 @@
 
-import { BannerVariant } from "../../types/src/index.js";
+import { BannerVariant } from "../../types/dist/index.js";
 import { ReactNode } from "react";
 
 //#region src/components/Banner/utils.d.ts

package/dist/components/Box.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalBoxProps } from "../types/src/index.cjs";
+import { UniversalBoxProps } from "../types/dist/index.cjs";
 import * as _$react from "react";
 
 //#region src/components/Box.d.ts

package/dist/components/Box.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalBoxProps } from "../types/src/index.js";
+import { UniversalBoxProps } from "../types/dist/index.js";
 import * as _$react from "react";
 
 //#region src/components/Box.d.ts

package/dist/components/Divider/DividerCore.cjs

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 require("../../_virtual/_rolldown/runtime.cjs");
 const require_styles_styler = require("../../styles/styler.cjs");
-const require_components_Box = require("../Box.cjs");
 const require_components_Text = require("../Text.cjs");
+const require_components_Box = require("../Box.cjs");
 const require_components_HStack = require("../HStack.cjs");
 const require_components_VStack = require("../VStack.cjs");
 let react = require("react");

package/dist/components/Divider/DividerCore.d.cts

@@ -1,7 +1,7 @@
 
-import { UniversalDividerProps, UniversalStackProps } from "../../types/src/index.cjs";
-import { Text } from "../Text.cjs";
+import { UniversalDividerProps, UniversalStackProps } from "../../types/dist/index.cjs";
 import { BoxProps } from "../Box.cjs";
+import { Text } from "../Text.cjs";
 import * as _$react from "react";
 import { ComponentProps, HTMLAttributes } from "react";
 

package/dist/components/Divider/DividerCore.d.ts

@@ -1,7 +1,7 @@
 
-import { UniversalDividerProps, UniversalStackProps } from "../../types/src/index.js";
-import { Text } from "../Text.js";
+import { UniversalDividerProps, UniversalStackProps } from "../../types/dist/index.js";
 import { BoxProps } from "../Box.js";
+import { Text } from "../Text.js";
 import * as _$react from "react";
 import { ComponentProps, HTMLAttributes } from "react";
 

package/dist/components/Divider/DividerCore.js

@@ -1,7 +1,7 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 import { cx } from "../../styles/styler.js";
-import { Box } from "../Box.js";
 import { Text } from "../Text.js";
+import { Box } from "../Box.js";
 import { HStack } from "../HStack.js";
 import { VStack } from "../VStack.js";
 import { forwardRef, useMemo } from "react";

package/dist/components/Divider/DividerInternal.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalDividerProps } from "../../types/src/index.cjs";
+import { UniversalDividerProps } from "../../types/dist/index.cjs";
 import { DividerCoreProps } from "./DividerCore.cjs";
 import * as _$react from "react";
 

package/dist/components/Divider/DividerInternal.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalDividerProps } from "../../types/src/index.js";
+import { UniversalDividerProps } from "../../types/dist/index.js";
 import { DividerCoreProps } from "./DividerCore.js";
 import * as _$react from "react";
 

package/dist/components/FormLabel.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalFormLabelProps } from "../types/src/index.cjs";
+import { UniversalFormLabelProps } from "../types/dist/index.cjs";
 import * as _$react from "react";
 import { PropsWithChildren } from "react";
 

package/dist/components/FormLabel.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalFormLabelProps } from "../types/src/index.js";
+import { UniversalFormLabelProps } from "../types/dist/index.js";
 import * as _$react from "react";
 import { PropsWithChildren } from "react";
 

package/dist/components/HStack.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalStackProps } from "../types/src/index.cjs";
+import { UniversalStackProps } from "../types/dist/index.cjs";
 import { DivProps } from "./Box.cjs";
 import * as _$react from "react";
 

package/dist/components/HStack.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalStackProps } from "../types/src/index.js";
+import { UniversalStackProps } from "../types/dist/index.js";
 import { DivProps } from "./Box.js";
 import * as _$react from "react";
 

package/dist/components/Icon.cjs

@@ -5,7 +5,6 @@ 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");
-let _yahoo_uds_icons_utils = require("@yahoo/uds-icons/utils");
 //#region src/components/Icon.tsx
 /**
 * **🎨 A component for displaying icons**
@@ -36,10 +35,8 @@ let _yahoo_uds_icons_utils = require("@yahoo/uds-icons/utils");
 *
 * @related [IconButton](https://uds.build/docs/components/icon-button)
 */
-const Icon = (0, react.forwardRef)(function BaseIcon({ name: iconName, size = "md", variant = "outline", color = "primary", className, ...props }, ref) {
-	const iconDefinition = (0, _yahoo_uds_icons_utils.isIconDefinition)(iconName) ? iconName : void 0;
-	const iconComponent = typeof iconName === "function" ? iconName : void 0;
-	const availableVariants = iconDefinition ? (0, _yahoo_uds_icons_utils.getIconVariants)(iconDefinition) : [];
+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({
@@ -48,14 +45,6 @@ const Icon = (0, react.forwardRef)(function BaseIcon({ name: iconName, size = "m
 		className: require_styles_styler.cx(className, !isMulticolor && "[&_path]:fill-current")
 	});
 	const sizePx = require_tokens_configs_sizes.normalIconSizes[size];
-	const renderedMarkup = iconDefinition ? (0, _yahoo_uds_icons_utils.getIconMarkup)(iconDefinition, size, effectiveVariant) : null;
-	const renderedIcon = renderedMarkup ? null : (0, react.isValidElement)(iconName) ? (0, react.cloneElement)(iconName, {
-		size,
-		variant: effectiveVariant
-	}) : iconComponent ? iconComponent({
-		size,
-		variant: effectiveVariant
-	}) : null;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("svg", {
 		ref,
 		xmlns: "http://www.w3.org/2000/svg",
@@ -65,9 +54,11 @@ const Icon = (0, react.forwardRef)(function BaseIcon({ name: iconName, size = "m
 		"aria-hidden": "true",
 		focusable: "false",
 		className: styles,
-		dangerouslySetInnerHTML: renderedMarkup ? { __html: renderedMarkup } : void 0,
 		...props,
-		children: renderedIcon
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SVGIcon, {
+			size,
+			variant: effectiveVariant
+		})
 	});
 });
 Icon.displayName = "Icon";

package/dist/components/Icon.d.cts

@@ -5,6 +5,7 @@ import * as _$react from "react";
 //#region src/components/Icon.d.ts
 /**
  * Props for the Icon component.
+ * @see IconPropsWithSVGProps
  */
 type IconProps = IconPropsWithSVGProps;
 /**

package/dist/components/Icon.d.ts

@@ -5,6 +5,7 @@ import * as _$react from "react";
 //#region src/components/Icon.d.ts
 /**
  * Props for the Icon component.
+ * @see IconPropsWithSVGProps
  */
 type IconProps = IconPropsWithSVGProps;
 /**

package/dist/components/Icon.js

@@ -1,9 +1,8 @@
 /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
 import { cx, getStyles } from "../styles/styler.js";
 import { normalIconSizes } from "../tokens/configs/sizes.js";
-import { cloneElement, forwardRef, isValidElement } from "react";
+import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-import { getIconMarkup, getIconVariants, isIconDefinition } from "@yahoo/uds-icons/utils";
 //#region src/components/Icon.tsx
 /**
 * **🎨 A component for displaying icons**
@@ -34,10 +33,8 @@ import { getIconMarkup, getIconVariants, isIconDefinition } from "@yahoo/uds-ico
 *
 * @related [IconButton](https://uds.build/docs/components/icon-button)
 */
-const Icon = forwardRef(function BaseIcon({ name: iconName, size = "md", variant = "outline", color = "primary", className, ...props }, ref) {
-	const iconDefinition = isIconDefinition(iconName) ? iconName : void 0;
-	const iconComponent = typeof iconName === "function" ? iconName : void 0;
-	const availableVariants = iconDefinition ? getIconVariants(iconDefinition) : [];
+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({
@@ -46,14 +43,6 @@ const Icon = forwardRef(function BaseIcon({ name: iconName, size = "md", variant
 		className: cx(className, !isMulticolor && "[&_path]:fill-current")
 	});
 	const sizePx = normalIconSizes[size];
-	const renderedMarkup = iconDefinition ? getIconMarkup(iconDefinition, size, effectiveVariant) : null;
-	const renderedIcon = renderedMarkup ? null : isValidElement(iconName) ? cloneElement(iconName, {
-		size,
-		variant: effectiveVariant
-	}) : iconComponent ? iconComponent({
-		size,
-		variant: effectiveVariant
-	}) : null;
 	return /* @__PURE__ */ jsx("svg", {
 		ref,
 		xmlns: "http://www.w3.org/2000/svg",
@@ -63,9 +52,11 @@ const Icon = forwardRef(function BaseIcon({ name: iconName, size = "md", variant
 		"aria-hidden": "true",
 		focusable: "false",
 		className: styles,
-		dangerouslySetInnerHTML: renderedMarkup ? { __html: renderedMarkup } : void 0,
 		...props,
-		children: renderedIcon
+		children: /* @__PURE__ */ jsx(SVGIcon, {
+			size,
+			variant: effectiveVariant
+		})
 	});
 });
 Icon.displayName = "Icon";

package/dist/components/IconSlot.cjs

@@ -6,11 +6,9 @@ const require_components_Icon = require("./Icon.cjs");
 let react = require("react");
 react = require_runtime.__toESM(react);
 let react_jsx_runtime = require("react/jsx-runtime");
-let _yahoo_uds_icons_utils = require("@yahoo/uds-icons/utils");
+let lodash_isFunction_js = require("lodash/isFunction.js");
+lodash_isFunction_js = require_runtime.__toESM(lodash_isFunction_js);
 //#region src/components/IconSlot.tsx
-function isIconRenderOutput(icon) {
-	return (0, react.isValidElement)(icon) && (icon.type === react.default.Fragment || typeof icon.type === "string");
-}
 /**
 * A helper container to render a SvgIcon, Icon component, or ReactNode.
 *
@@ -31,38 +29,21 @@ const IconSlot = (0, react.memo)(function IconSlot({ icon, iconProps, className:
 	if (!icon) return null;
 	const { className: iconPropsClassName, ...props } = iconProps || {};
 	const mergedClassName = require_styles_styler.cx(slotClassName, iconPropsClassName);
-	if ((0, _yahoo_uds_icons_utils.isIconDefinition)(icon)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
-		name: icon,
+	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 (typeof icon === "function") {
+	if ((0, lodash_isFunction_js.default)(icon)) {
 		const iconEl = icon(iconProps || {});
-		if ((0, _yahoo_uds_icons_utils.isIconDefinition)(iconEl)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
-			name: iconEl,
-			...props,
-			...rest,
-			className: mergedClassName
-		});
-		if (isIconRenderOutput(iconEl)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
-			name: icon,
-			...props,
-			...rest,
-			className: mergedClassName
-		});
 		const elProps = iconEl?.props;
 		return (0, react.isValidElement)(iconEl) && (0, react.cloneElement)(iconEl, {
 			...rest,
 			className: require_styles_styler.cx(mergedClassName, elProps?.className)
 		});
 	}
-	if (isIconRenderOutput(icon)) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Icon.Icon, {
-		name: ((svgIconProps) => (0, react.cloneElement)(icon, svgIconProps)),
-		...props,
-		...rest,
-		className: mergedClassName
-	});
 	const elProps = icon.props;
 	return (0, react.isValidElement)(icon) && (0, react.cloneElement)(icon, {
 		...props,

package/dist/components/IconSlot.d.cts

@@ -1,13 +1,12 @@
 
-import { UniversalIconSlot } from "../types/src/index.cjs";
+import { UniversalIconSlot } from "../types/dist/index.cjs";
 import { IconPropsWithSVGProps } from "../tokens/types.cjs";
 import React from "react";
-import { IconDefinition } from "@yahoo/uds-icons/types";
 
 //#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<IconDefinition>;
+  icon?: UniversalIconSlot;
   /** Props to spread onto the icon. */
   iconProps?: Omit<IconPropsWithSVGProps, 'name'>;
   className?: string;

package/dist/components/IconSlot.d.ts

@@ -1,13 +1,12 @@
 
-import { UniversalIconSlot } from "../types/src/index.js";
+import { UniversalIconSlot } from "../types/dist/index.js";
 import { IconPropsWithSVGProps } from "../tokens/types.js";
 import React from "react";
-import { IconDefinition } from "@yahoo/uds-icons/types";
 
 //#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<IconDefinition>;
+  icon?: UniversalIconSlot;
   /** Props to spread onto the icon. */
   iconProps?: Omit<IconPropsWithSVGProps, 'name'>;
   className?: string;

package/dist/components/IconSlot.js

@@ -1,13 +1,10 @@
 /*! © 2026 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 { cloneElement, isValidElement, memo } from "react";
 import { jsx } from "react/jsx-runtime";
-import { isIconDefinition } from "@yahoo/uds-icons/utils";
+import { isFunction } from "lodash-es";
 //#region src/components/IconSlot.tsx
-function isIconRenderOutput(icon) {
-	return isValidElement(icon) && (icon.type === React.Fragment || typeof icon.type === "string");
-}
 /**
 * A helper container to render a SvgIcon, Icon component, or ReactNode.
 *
@@ -28,38 +25,21 @@ const IconSlot = memo(function IconSlot({ icon, iconProps, className: slotClassN
 	if (!icon) return null;
 	const { className: iconPropsClassName, ...props } = iconProps || {};
 	const mergedClassName = cx(slotClassName, iconPropsClassName);
-	if (isIconDefinition(icon)) return /* @__PURE__ */ jsx(Icon, {
-		name: icon,
+	const svgIcon = icon;
+	if (svgIcon.metadata?.isSvgIcon) return /* @__PURE__ */ jsx(Icon, {
+		name: svgIcon,
 		...props,
 		...rest,
 		className: mergedClassName
 	});
-	if (typeof icon === "function") {
+	if (isFunction(icon)) {
 		const iconEl = icon(iconProps || {});
-		if (isIconDefinition(iconEl)) return /* @__PURE__ */ jsx(Icon, {
-			name: iconEl,
-			...props,
-			...rest,
-			className: mergedClassName
-		});
-		if (isIconRenderOutput(iconEl)) return /* @__PURE__ */ jsx(Icon, {
-			name: icon,
-			...props,
-			...rest,
-			className: mergedClassName
-		});
 		const elProps = iconEl?.props;
 		return isValidElement(iconEl) && cloneElement(iconEl, {
 			...rest,
 			className: cx(mergedClassName, elProps?.className)
 		});
 	}
-	if (isIconRenderOutput(icon)) return /* @__PURE__ */ jsx(Icon, {
-		name: ((svgIconProps) => cloneElement(icon, svgIconProps)),
-		...props,
-		...rest,
-		className: mergedClassName
-	});
 	const elProps = icon.props;
 	return isValidElement(icon) && cloneElement(icon, {
 		...props,

package/dist/components/Image.d.cts

@@ -1,5 +1,5 @@
 
-import { ImagePropsWithImgProps } from "../types/src/index.cjs";
+import { ImagePropsWithImgProps } from "../types/dist/index.cjs";
 import * as _$react from "react";
 
 //#region src/components/Image.d.ts

package/dist/components/Image.d.ts

@@ -1,5 +1,5 @@
 
-import { ImagePropsWithImgProps } from "../types/src/index.js";
+import { ImagePropsWithImgProps } from "../types/dist/index.js";
 import * as _$react from "react";
 
 //#region src/components/Image.d.ts

package/dist/components/Link.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalLinkProps } from "../types/src/index.cjs";
+import { UniversalLinkProps } from "../types/dist/index.cjs";
 import { IconPropsWithSVGProps } from "../tokens/types.cjs";
 import * as _$react from "react";
 

package/dist/components/Link.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalLinkProps } from "../types/src/index.js";
+import { UniversalLinkProps } from "../types/dist/index.js";
 import { IconPropsWithSVGProps } from "../tokens/types.js";
 import * as _$react from "react";
 

package/dist/components/Text.d.cts

@@ -1,5 +1,5 @@
 
-import { UniversalTextProps } from "../types/src/index.cjs";
+import { UniversalTextProps } from "../types/dist/index.cjs";
 import * as _$react from "react";
 import { JSX, ReactNode, Ref } from "react";
 

package/dist/components/Text.d.ts

@@ -1,5 +1,5 @@
 
-import { UniversalTextProps } from "../types/src/index.js";
+import { UniversalTextProps } from "../types/dist/index.js";
 import * as _$react from "react";
 import { JSX, ReactNode, Ref } from "react";