@yahoo/uds 3.66.1 → 3.67.0-beta.1

package/dist/index.js

@@ -1 +1,59 @@
-export{Image}from"./chunk-R7SUOHEQ.js";import{DividerInternal as e}from"./chunk-HKI5AZ7O.js";export{HStack,VStack}from"./chunk-VX5NJRUI.js";export{FormLabel}from"./chunk-OPJ5SIFC.js";import{getStyles as t,cx as a,IconSlot as n}from"./chunk-EPEWMEHA.js";export{Box,Icon,Text,cva,cx,getStyles,getStylesCacheKeySymbol}from"./chunk-EPEWMEHA.js";export{DEFAULT_COLOR_MODE,DEFAULT_COLOR_MODE_FOR_APP,DEFAULT_HIGH_CONTRAST_MODE,DEFAULT_REGION_MODE,DEFAULT_SCALE_MODE,DEFAULT_SCALE_MODE_FOR_APP,FONT_DECLARATIONS_MAP,cartesianProduct,coalesceConfigVariant,configurableProperties,createComponentStates,createConfigurableProperty,createLayerConfig,createSubComponentConfig,createVariantConfig,createVariantConfigWithComponentStates,createVariantConfigWithProperties,findFixtureType,fontWeightMap,fromEntries,generateClassName,generateConfigStyles,generateDeclaration,generateDefaultClassName,generateKeyFromFlatConfigPath,generateSchemaKey,generateStyles,getConfigDefaultValue,getConfigPseudoStateVariables,getConfigPseudoStateVariablesWithSetter,getConfigSubcomponents,getConfigVariantComponentStates,getConfigVariantComponentStatesMatrix,getConfigVariantProperties,getConfigVariantPseudoStates,getConfigVariants,isConfigDefaultValue,parseButtonVariantFlat,setConfigPseudoStateVariable,shadow,statePseudoMapDocsMode,toMinimalDbConfigObject}from"./chunk-YZE72XPR.js";export{alwaysPalette,entries,mapValues,parseOpacityStep}from"./chunk-6V7QEDMR.js";export{variants}from"./chunk-LYHJT3E5.js";export{AVATAR_SIZE_PREFIX,BACKGROUND_COLOR_PREFIX,BORDER_RADIUS_PREFIX,BORDER_WIDTH_PREFIX,BUTTON_GAP_VAR,BUTTON_SCALE_EFFECT,BUTTON_SCALE_EFFECT_HOVER,BUTTON_SCALE_EFFECT_PRESSED,BUTTON_SCALE_EFFECT_REST,DARK_COLOR_MODE_CLASSNAME,DEFAULT_COLOR_MODE_CLASSNAME,DEFAULT_SCALE_MODE_CLASSNAME,DROP_SHADOW_PREFIX,FONT_FAMILY_PREFIX,FONT_SIZE_PREFIX,FONT_SLANT_PREFIX,FONT_WEIGHT_PREFIX,FONT_WIDTH_PREFIX,ICON_SIZE_PREFIX,INVERT_COLOR_MODE_CLASSNAME,LARGE_SCALE_MODE_CLASSNAME,LETTER_SPACING_PREFIX,LIGHT_COLOR_MODE_CLASSNAME,LINE_COLOR_PREFIX,LINE_HEIGHT_PREFIX,MEDIUM_SCALE_MODE_CLASSNAME,MOTION_PREFIX,PSEUDO_STYLE_SELECTOR_MAP,SMALL_SCALE_MODE_CLASSNAME,SPECTRUM_COLOR_PREFIX,SYSTEM_COLOR_MODE_CLASSNAME,TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES,TEXT_RESPONSIVE_CLASSNAME,TEXT_TRANSFORM_PREFIX,UDS_PREFIX,XLARGE_SCALE_MODE_CLASSNAME,XSMALL_SCALE_MODE_CLASSNAME,XXLARGE_SCALE_MODE_CLASSNAME,XXXLARGE_SCALE_MODE_CLASSNAME}from"./chunk-WR3CRR6L.js";import{forwardRef as E,useMemo as o}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";export{Avatar,AvatarIcon,AvatarImage,AvatarText,Badge,Button,Checkbox,Chip,ChipButton,ChipDismissible,ChipLink,ChipToggle,IconButton,Input,InputHelpText,Menu,Pressable,Radio,RadioGroupProvider,SpringMotionConfig,Switch}from"@yahoo/uds/client";/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */var _=E(function(t,a){return r(e,{ref:a,...t})});_.displayName="Divider";var S=E(function({variant:e="primary",textVariant:E,startIcon:_,endIcon:S,alwaysUnderline:C=!1,children:A,className:s,...O},L){const R=!E,c=o(()=>{const n=!R&&t({linkTextStyleRoot:E,fontSize:E,fontFamily:E,fontWeight:E,lineHeight:E,textTransform:E});return t({linkVariantRoot:e,display:"inline-flex",alignItems:"center",className:a(n,"uds-ring",C&&"underline",s)})},[C,R,E,e,s]),T=t({linkVariantIconStart:e,linkTextStyleIcon:E,className:a(R&&"w-[0.7em] h-[0.7em]")}),l=t({linkVariantIconEnd:e,linkTextStyleIcon:E,className:a(R&&"w-[0.7em] h-[0.7em]")}),I={variant:"outline",color:"current"};return i("a",{ref:L,className:c,...O,children:[_&&r(n,{className:T,icon:_,iconProps:I,"data-testid":"start-icon"}),A,S&&r(n,{className:l,icon:S,iconProps:I,"data-testid":"end-icon"})]})});S.displayName="Link";export{_ as Divider,S as Link};
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { AVATAR_SIZE_PREFIX, BACKGROUND_COLOR_PREFIX, BORDER_RADIUS_PREFIX, BORDER_WIDTH_PREFIX, BUTTON_GAP_VAR, BUTTON_SCALE_EFFECT, BUTTON_SCALE_EFFECT_HOVER, BUTTON_SCALE_EFFECT_PRESSED, BUTTON_SCALE_EFFECT_REST, DARK_COLOR_MODE_CLASSNAME, DEFAULT_COLOR_MODE_CLASSNAME, DEFAULT_SCALE_MODE_CLASSNAME, DROP_SHADOW_PREFIX, FONT_FAMILY_PREFIX, FONT_SIZE_PREFIX, FONT_SLANT_PREFIX, FONT_WEIGHT_PREFIX, FONT_WIDTH_PREFIX, ICON_SIZE_PREFIX, INVERT_COLOR_MODE_CLASSNAME, LARGE_SCALE_MODE_CLASSNAME, LETTER_SPACING_PREFIX, LIGHT_COLOR_MODE_CLASSNAME, LINE_COLOR_PREFIX, LINE_HEIGHT_PREFIX, MEDIUM_SCALE_MODE_CLASSNAME, MOTION_PREFIX, PSEUDO_STYLE_SELECTOR_MAP, SMALL_SCALE_MODE_CLASSNAME, SPECTRUM_COLOR_PREFIX, SYSTEM_COLOR_MODE_CLASSNAME, TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES, TEXT_RESPONSIVE_CLASSNAME, TEXT_TRANSFORM_PREFIX, UDS_PREFIX, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME } from "./tokens/consts/cssTokens.js";
+import { variants } from "./styles/variants.js";
+import { cva, cx, getStyles, getStylesCacheKeySymbol } from "./styles/styler.js";
+import { Box } from "./components/Box.js";
+import { HStack } from "./components/HStack.js";
+import { Text } from "./components/Text.js";
+import { VStack } from "./components/VStack.js";
+import { Divider } from "./components/Divider/Divider.js";
+import { FormLabel } from "./components/FormLabel.js";
+import { Icon } from "./components/Icon.js";
+import { Image } from "./components/Image.js";
+import { Link } from "./components/Link.js";
+import { AvatarIcon } from "./components/client/Avatar/AvatarIcon.js";
+import { AvatarText } from "./components/client/Avatar/AvatarText.js";
+import { AvatarImage } from "./components/client/Avatar/AvatarImage.js";
+import { Avatar } from "./components/client/Avatar/Avatar.js";
+import { Badge } from "./components/client/Badge.js";
+import { alwaysPalette } from "./tokens/configs/palette.js";
+import { shadow } from "./tokens/configs/shadow.js";
+import { fontWeightMap } from "./tokens/configs/typography.js";
+import { DEFAULT_COLOR_MODE, DEFAULT_COLOR_MODE_FOR_APP, DEFAULT_HIGH_CONTRAST_MODE, DEFAULT_REGION_MODE, DEFAULT_SCALE_MODE, DEFAULT_SCALE_MODE_FOR_APP } from "./tokens/consts/defaultModes.js";
+import { FONT_DECLARATIONS_MAP } from "./tokens/consts/fontDeclarationsMap.js";
+import { parseButtonVariantFlat } from "./tokens/parseButtonVariants.js";
+import { entries } from "./tokens/utils/entries.js";
+import { fromEntries } from "./tokens/utils/fromEntries.js";
+import { mapValues } from "./tokens/utils/mapValues.js";
+import { parseOpacityStep } from "./tokens/utils/opacity.js";
+import { configurableProperties } from "./tokens/automation/properties.js";
+import { generateSchemaKey } from "./tokens/automation/utils/generateSchemaKey.js";
+import { cartesianProduct } from "./tokens/automation/utils/cartesianProduct.js";
+import { coalesceConfigVariant } from "./tokens/automation/utils/coalesceConfigVariant.js";
+import { getConfigDefaultValue, isConfigDefaultValue } from "./tokens/automation/utils/defaults.js";
+import { generateKeyFromFlatConfigPath } from "./tokens/automation/utils/generateKeyFromFlatConfigPath.js";
+import { getConfigVariantComponentStates, getConfigVariantComponentStatesMatrix } from "./tokens/automation/utils/getConfigVariantComponentStatesMatrix.js";
+import { getConfigVariantProperties } from "./tokens/automation/utils/getConfigVariantProperties.js";
+import { getConfigVariantPseudoStates } from "./tokens/automation/utils/getConfigVariantPseudoStates.js";
+import { getConfigSubcomponents } from "./tokens/automation/utils/subcomponents.js";
+import { getConfigVariants } from "./tokens/automation/utils/getConfigVariants.js";
+import { getConfigPseudoStateVariables, getConfigPseudoStateVariablesWithSetter, setConfigPseudoStateVariable } from "./tokens/automation/utils/variableData.js";
+import { createComponentStates, createConfigurableProperty, createLayerConfig, createSubComponentConfig, createVariantConfig, createVariantConfigWithComponentStates, createVariantConfigWithProperties, findFixtureType, generateClassName, generateConfigStyles, generateDeclaration, generateDefaultClassName, generateStyles, statePseudoMapDocsMode, toMinimalDbConfigObject } from "./tokens/automation/utils/index.js";
+import { SpringMotionConfig } from "./components/client/SpringMotionConfig.js";
+import { Button } from "./components/client/Button.js";
+import { Checkbox } from "./components/client/Checkbox.js";
+import { ChipButton } from "./components/client/Chip/ChipButton.js";
+import { Pressable } from "./components/client/Pressable.js";
+import { ChipDismissible } from "./components/client/Chip/ChipDismissible.js";
+import { ChipLink } from "./components/client/Chip/ChipLink.js";
+import { ChipToggle } from "./components/client/Chip/ChipToggle.js";
+import { Chip } from "./components/client/Chip/Chip.js";
+import { IconButton } from "./components/client/IconButton.js";
+import { Input } from "./components/client/Input/Input.js";
+import { InputHelpText } from "./components/client/Input/InputHelpText.js";
+import { Menu_index_exports } from "./components/client/Menu/Menu.index.js";
+import { Radio } from "./components/client/Radio/Radio.js";
+import { RadioGroupProvider } from "./components/client/Radio/RadioGroupProvider.js";
+import { Switch } from "./components/client/Switch.js";
+
+export { AVATAR_SIZE_PREFIX, Avatar, AvatarIcon, AvatarImage, AvatarText, BACKGROUND_COLOR_PREFIX, BORDER_RADIUS_PREFIX, BORDER_WIDTH_PREFIX, BUTTON_GAP_VAR, BUTTON_SCALE_EFFECT, BUTTON_SCALE_EFFECT_HOVER, BUTTON_SCALE_EFFECT_PRESSED, BUTTON_SCALE_EFFECT_REST, Badge, Box, Button, Checkbox, Chip, ChipButton, ChipDismissible, ChipLink, ChipToggle, DARK_COLOR_MODE_CLASSNAME, DEFAULT_COLOR_MODE, DEFAULT_COLOR_MODE_CLASSNAME, DEFAULT_COLOR_MODE_FOR_APP, DEFAULT_HIGH_CONTRAST_MODE, DEFAULT_REGION_MODE, DEFAULT_SCALE_MODE, DEFAULT_SCALE_MODE_CLASSNAME, DEFAULT_SCALE_MODE_FOR_APP, DROP_SHADOW_PREFIX, Divider, FONT_DECLARATIONS_MAP, FONT_FAMILY_PREFIX, FONT_SIZE_PREFIX, FONT_SLANT_PREFIX, FONT_WEIGHT_PREFIX, FONT_WIDTH_PREFIX, FormLabel, HStack, ICON_SIZE_PREFIX, INVERT_COLOR_MODE_CLASSNAME, Icon, IconButton, Image, Input, InputHelpText, LARGE_SCALE_MODE_CLASSNAME, LETTER_SPACING_PREFIX, LIGHT_COLOR_MODE_CLASSNAME, LINE_COLOR_PREFIX, LINE_HEIGHT_PREFIX, Link, MEDIUM_SCALE_MODE_CLASSNAME, MOTION_PREFIX, Menu_index_exports as Menu, PSEUDO_STYLE_SELECTOR_MAP, Pressable, Radio, RadioGroupProvider, SMALL_SCALE_MODE_CLASSNAME, SPECTRUM_COLOR_PREFIX, SYSTEM_COLOR_MODE_CLASSNAME, SpringMotionConfig, Switch, TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES, TEXT_RESPONSIVE_CLASSNAME, TEXT_TRANSFORM_PREFIX, Text, UDS_PREFIX, VStack, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME, alwaysPalette, cartesianProduct, coalesceConfigVariant, configurableProperties, createComponentStates, createConfigurableProperty, createLayerConfig, createSubComponentConfig, createVariantConfig, createVariantConfigWithComponentStates, createVariantConfigWithProperties, cva, cx, entries, findFixtureType, fontWeightMap, fromEntries, generateClassName, generateConfigStyles, generateDeclaration, generateDefaultClassName, generateKeyFromFlatConfigPath, generateSchemaKey, generateStyles, getConfigDefaultValue, getConfigPseudoStateVariables, getConfigPseudoStateVariablesWithSetter, getConfigSubcomponents, getConfigVariantComponentStates, getConfigVariantComponentStatesMatrix, getConfigVariantProperties, getConfigVariantPseudoStates, getConfigVariants, getStyles, getStylesCacheKeySymbol, isConfigDefaultValue, mapValues, parseButtonVariantFlat, parseOpacityStep, setConfigPseudoStateVariable, shadow, statePseudoMapDocsMode, toMinimalDbConfigObject, variants };

package/dist/providers/ColorModeProvider.cjs

@@ -0,0 +1,23 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_tokens_consts_defaultModes = require('../tokens/consts/defaultModes.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/providers/ColorModeProvider.tsx
+const ColorModeContext = (0, react.createContext)(require_tokens_consts_defaultModes.DEFAULT_COLOR_MODE);
+function useColorMode() {
+	return (0, react.useContext)(ColorModeContext);
+}
+function ColorModeProvider({ value = require_tokens_consts_defaultModes.DEFAULT_COLOR_MODE, children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ColorModeContext.Provider, {
+		value,
+		children
+	});
+}
+ColorModeProvider.displayName = "ColorModeProvider";
+
+//#endregion
+exports.ColorModeContext = ColorModeContext;
+exports.ColorModeProvider = ColorModeProvider;
+exports.useColorMode = useColorMode;

package/dist/providers/ColorModeProvider.d.cts

@@ -0,0 +1,20 @@
+import { ColorMode } from "../tokens/types.cjs";
+import "../tokens/index.cjs";
+import * as react23 from "react";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/providers/ColorModeProvider.d.ts
+interface ColorModeProviderProps extends React.PropsWithChildren {
+  value?: ColorMode;
+}
+declare const ColorModeContext: react23.Context<ColorMode>;
+declare function useColorMode(): ColorMode;
+declare function ColorModeProvider({
+  value,
+  children
+}: ColorModeProviderProps): react_jsx_runtime1.JSX.Element;
+declare namespace ColorModeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ColorModeContext, ColorModeProvider, type ColorModeProviderProps, useColorMode };

package/dist/providers/ColorModeProvider.d.ts

@@ -0,0 +1,20 @@
+import { ColorMode } from "../tokens/types.js";
+import "../tokens/index.js";
+import * as react29 from "react";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
+
+//#region src/providers/ColorModeProvider.d.ts
+interface ColorModeProviderProps extends React.PropsWithChildren {
+  value?: ColorMode;
+}
+declare const ColorModeContext: react29.Context<ColorMode>;
+declare function useColorMode(): ColorMode;
+declare function ColorModeProvider({
+  value,
+  children
+}: ColorModeProviderProps): react_jsx_runtime4.JSX.Element;
+declare namespace ColorModeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ColorModeContext, ColorModeProvider, type ColorModeProviderProps, useColorMode };

package/dist/providers/ColorModeProvider.js

@@ -0,0 +1,20 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { DEFAULT_COLOR_MODE } from "../tokens/consts/defaultModes.js";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/providers/ColorModeProvider.tsx
+const ColorModeContext = createContext(DEFAULT_COLOR_MODE);
+function useColorMode() {
+	return useContext(ColorModeContext);
+}
+function ColorModeProvider({ value = DEFAULT_COLOR_MODE, children }) {
+	return /* @__PURE__ */ jsx(ColorModeContext.Provider, {
+		value,
+		children
+	});
+}
+ColorModeProvider.displayName = "ColorModeProvider";
+
+//#endregion
+export { ColorModeContext, ColorModeProvider, useColorMode };

package/dist/providers/ScaleModeProvider.cjs

@@ -0,0 +1,26 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
+const require_tokens_consts_defaultModes = require('../tokens/consts/defaultModes.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/providers/ScaleModeProvider.tsx
+const ScaleModeContext = (0, react.createContext)(require_tokens_consts_defaultModes.DEFAULT_SCALE_MODE);
+function useScaleMode() {
+	const context = (0, react.useContext)(ScaleModeContext);
+	if (!context) return require_tokens_consts_defaultModes.DEFAULT_SCALE_MODE;
+	return context;
+}
+function ScaleModeProvider({ value, children }) {
+	const scaleMode = useScaleMode();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScaleModeContext.Provider, {
+		value: value ?? scaleMode,
+		children
+	});
+}
+ScaleModeProvider.displayName = "ScaleModeProvider";
+
+//#endregion
+exports.ScaleModeContext = ScaleModeContext;
+exports.ScaleModeProvider = ScaleModeProvider;
+exports.useScaleMode = useScaleMode;

package/dist/providers/ScaleModeProvider.d.cts

@@ -0,0 +1,20 @@
+import { ScaleMode } from "../tokens/types.cjs";
+import "../tokens/index.cjs";
+import * as react24 from "react";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
+
+//#region src/providers/ScaleModeProvider.d.ts
+interface ScaleModeProviderProps extends React.PropsWithChildren {
+  value?: ScaleMode;
+}
+declare const ScaleModeContext: react24.Context<ScaleMode>;
+declare function useScaleMode(): ScaleMode;
+declare function ScaleModeProvider({
+  value,
+  children
+}: ScaleModeProviderProps): react_jsx_runtime2.JSX.Element;
+declare namespace ScaleModeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ScaleModeContext, ScaleModeProvider, type ScaleModeProviderProps, useScaleMode };

package/dist/providers/ScaleModeProvider.d.ts

@@ -0,0 +1,20 @@
+import { ScaleMode } from "../tokens/types.js";
+import "../tokens/index.js";
+import * as react30 from "react";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
+
+//#region src/providers/ScaleModeProvider.d.ts
+interface ScaleModeProviderProps extends React.PropsWithChildren {
+  value?: ScaleMode;
+}
+declare const ScaleModeContext: react30.Context<ScaleMode>;
+declare function useScaleMode(): ScaleMode;
+declare function ScaleModeProvider({
+  value,
+  children
+}: ScaleModeProviderProps): react_jsx_runtime5.JSX.Element;
+declare namespace ScaleModeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ScaleModeContext, ScaleModeProvider, type ScaleModeProviderProps, useScaleMode };

package/dist/providers/ScaleModeProvider.js

@@ -0,0 +1,23 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { DEFAULT_SCALE_MODE } from "../tokens/consts/defaultModes.js";
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/providers/ScaleModeProvider.tsx
+const ScaleModeContext = createContext(DEFAULT_SCALE_MODE);
+function useScaleMode() {
+	const context = useContext(ScaleModeContext);
+	if (!context) return DEFAULT_SCALE_MODE;
+	return context;
+}
+function ScaleModeProvider({ value, children }) {
+	const scaleMode = useScaleMode();
+	return /* @__PURE__ */ jsx(ScaleModeContext.Provider, {
+		value: value ?? scaleMode,
+		children
+	});
+}
+ScaleModeProvider.displayName = "ScaleModeProvider";
+
+//#endregion
+export { ScaleModeContext, ScaleModeProvider, useScaleMode };

package/dist/providers/ThemeProvider.cjs

@@ -0,0 +1,21 @@
+/*! © 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_consts_defaultModes = require('../tokens/consts/defaultModes.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/providers/ThemeProvider.tsx
+function ThemeProvider({ children, colorMode = require_tokens_consts_defaultModes.DEFAULT_COLOR_MODE, scaleMode = require_tokens_consts_defaultModes.DEFAULT_SCALE_MODE }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: require_styles_styler.cx("contents", require_styles_styler.getStyles({
+			colorMode,
+			scaleMode,
+			backgroundColor: "primary"
+		})),
+		children
+	});
+}
+ThemeProvider.displayName = "ThemeProvider";
+
+//#endregion
+exports.ThemeProvider = ThemeProvider;

package/dist/providers/ThemeProvider.d.cts

@@ -0,0 +1,19 @@
+import { ColorMode, ScaleMode } from "../tokens/types.cjs";
+import "../tokens/index.cjs";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
+
+//#region src/providers/ThemeProvider.d.ts
+interface ThemeProviderProps extends React.PropsWithChildren {
+  colorMode?: ColorMode;
+  scaleMode?: ScaleMode;
+}
+declare function ThemeProvider({
+  children,
+  colorMode,
+  scaleMode
+}: ThemeProviderProps): react_jsx_runtime3.JSX.Element;
+declare namespace ThemeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ThemeProvider, type ThemeProviderProps };

package/dist/providers/ThemeProvider.d.ts

@@ -0,0 +1,19 @@
+import { ColorMode, ScaleMode } from "../tokens/types.js";
+import "../tokens/index.js";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
+
+//#region src/providers/ThemeProvider.d.ts
+interface ThemeProviderProps extends React.PropsWithChildren {
+  colorMode?: ColorMode;
+  scaleMode?: ScaleMode;
+}
+declare function ThemeProvider({
+  children,
+  colorMode,
+  scaleMode
+}: ThemeProviderProps): react_jsx_runtime6.JSX.Element;
+declare namespace ThemeProvider {
+  var displayName: string;
+}
+//#endregion
+export { ThemeProvider, type ThemeProviderProps };

package/dist/providers/ThemeProvider.js

@@ -0,0 +1,20 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { cx, getStyles } from "../styles/styler.js";
+import { DEFAULT_COLOR_MODE, DEFAULT_SCALE_MODE } from "../tokens/consts/defaultModes.js";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/providers/ThemeProvider.tsx
+function ThemeProvider({ children, colorMode = DEFAULT_COLOR_MODE, scaleMode = DEFAULT_SCALE_MODE }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cx("contents", getStyles({
+			colorMode,
+			scaleMode,
+			backgroundColor: "primary"
+		})),
+		children
+	});
+}
+ThemeProvider.displayName = "ThemeProvider";
+
+//#endregion
+export { ThemeProvider };

package/dist/scripts/utils/tsMorph.cjs

@@ -0,0 +1,140 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_styles_variants = require('../../styles/variants.cjs');
+let lodash_camelCase_js = require("lodash/camelCase.js");
+lodash_camelCase_js = require_rolldown_runtime.__toESM(lodash_camelCase_js);
+let lodash_isEmpty_js = require("lodash/isEmpty.js");
+lodash_isEmpty_js = require_rolldown_runtime.__toESM(lodash_isEmpty_js);
+let ts_morph = require("ts-morph");
+
+//#region scripts/utils/tsMorph.ts
+/** Determines if an expression is using React.forwardRef. */
+function isForwardRefExpression(node) {
+	if (ts_morph.Node.isCallExpression(node)) {
+		const expression = node.getExpression();
+		/**
+		* forwardRef(() => <Component />)
+		*/
+		if (ts_morph.Node.isIdentifier(expression) && expression.getText() === "forwardRef") return true;
+		/**
+		* React.forwardRef(() => <Component />)
+		*/
+		if (ts_morph.Node.isPropertyAccessExpression(expression) && expression.getText() === "React.forwardRef") return true;
+	}
+	return false;
+}
+/** Determines if a node is a JSX component. */
+function isJsxComponent(node) {
+	let name;
+	if (ts_morph.Node.isVariableDeclaration(node) || ts_morph.Node.isFunctionDeclaration(node) || ts_morph.Node.isClassDeclaration(node)) name = node.getName();
+	else if (ts_morph.Node.isFunctionExpression(node) || ts_morph.Node.isArrowFunction(node)) name = node.getFirstAncestorByKind(ts_morph.SyntaxKind.VariableDeclaration)?.getName();
+	return name ? /[A-Z]/.test(name.charAt(0)) : false;
+}
+/** Returns a functional component declaration, unwrapping forwardRef if needed. */
+function getReactFunctionDeclaration(declaration) {
+	if (isJsxComponent(declaration)) {
+		if (ts_morph.Node.isFunctionDeclaration(declaration)) return declaration;
+		if (ts_morph.Node.isVariableDeclaration(declaration)) {
+			const initializer = declaration.getInitializer();
+			if (initializer) {
+				if (isForwardRefExpression(initializer)) {
+					const [initializerDeclaration] = initializer.getArguments();
+					if (ts_morph.Node.isFunctionDeclaration(initializerDeclaration) || ts_morph.Node.isFunctionExpression(initializerDeclaration) || ts_morph.Node.isArrowFunction(initializerDeclaration)) return initializerDeclaration;
+				} else if (ts_morph.Node.isFunctionDeclaration(initializer) || ts_morph.Node.isFunctionExpression(initializer) || ts_morph.Node.isArrowFunction(initializer)) return initializer;
+			}
+		}
+	}
+	return null;
+}
+/** Get the first descendant JsxElement based on the identifier. */
+function getJsxElement(node, name) {
+	return getJsxElements(node).find((node$1) => node$1.getFirstDescendantByKindOrThrow(ts_morph.SyntaxKind.Identifier).getText() === name);
+}
+/** Get all descendant JsxElement nodes. */
+function getJsxElements(node) {
+	return node.getDescendants().filter((node$1) => ts_morph.Node.isJsxElement(node$1) || ts_morph.Node.isJsxSelfClosingElement(node$1));
+}
+/**
+* Traces component references.
+*
+* This is similar to `findReferencesAsNodes` but returns JsxSelfClosingElement and JsxElement nodes.
+* Note, this currently does not account for cases where the component is used as a prop or is renamed.
+*/
+function findReferencesAsJsxElements(identifer) {
+	const jsxElements = [];
+	for (const reference of identifer.findReferencesAsNodes()) {
+		const node = reference.getFirstAncestor((node$1) => {
+			return ts_morph.Node.isJsxOpeningElement(node$1) || ts_morph.Node.isJsxSelfClosingElement(node$1);
+		});
+		if (node) jsxElements.push(node);
+	}
+	return jsxElements;
+}
+/**
+* Given a Jsx Reference, this function finds the parent of that reference,
+* looks at the props, and returns the name used either for spread operator rest or
+* the prop name if there's no spread operator
+*/
+const getParentSpreadOrParamIdentifier = (reference) => {
+	const blockParent = reference.getParentWhile((parent) => {
+		return !getReactFunctionDeclaration(parent);
+	}).getParent();
+	if (!blockParent) return;
+	const reactComponent = getReactFunctionDeclaration(blockParent);
+	if (reactComponent) {
+		const parameters = reactComponent.getParameters();
+		for (let i = 0; i < parameters.length; i++) {
+			const parameter = parameters[i];
+			const objectBindingPattern = parameter.getChildrenOfKind(ts_morph.SyntaxKind.ObjectBindingPattern)[0];
+			const identifier = parameter.getChildrenOfKind(ts_morph.SyntaxKind.Identifier)[0];
+			if (objectBindingPattern) {
+				const dotDotToken = objectBindingPattern.getFirstDescendantByKind(ts_morph.SyntaxKind.DotDotDotToken);
+				if (dotDotToken !== void 0) return dotDotToken?.getParent()?.getFirstChildByKindOrThrow(ts_morph.SyntaxKind.Identifier).getText();
+			} else if (identifier) return identifier.getText();
+		}
+	}
+};
+/**
+* Get used props on a reference.
+*/
+const getUsedPropsInReference = (reference) => {
+	const attributes = reference.getAttributes();
+	const res = [];
+	attributes.forEach((attribute) => {
+		if (ts_morph.Node.isJsxAttribute(attribute)) {
+			const attributeName = attribute.getNameNode().getText();
+			const stringLiterals = attribute.getDescendantsOfKind(ts_morph.SyntaxKind.StringLiteral);
+			const values = [];
+			if (stringLiterals.length !== 0) stringLiterals.forEach((stringLiteral) => values.push(stringLiteral.getLiteralText()));
+			const typeName = attribute.getFirstChildByKindOrThrow(ts_morph.SyntaxKind.Identifier).getDefinitions().map((d) => d.getDeclarationNode()?.getChildrenOfKind(ts_morph.SyntaxKind.TypeReference).pop()?.getText()).pop();
+			if (!typeName && !(0, lodash_isEmpty_js.default)(attributeName)) res.push([attributeName, values]);
+			else if (require_styles_variants.variants[(0, lodash_camelCase_js.default)(typeName)] && !(0, lodash_isEmpty_js.default)(typeName)) res.push([(0, lodash_camelCase_js.default)(typeName), values]);
+			else if (!(0, lodash_isEmpty_js.default)(attributeName)) res.push([attributeName, values]);
+		}
+		if (ts_morph.Node.isJsxSpreadAttribute(attribute)) {
+			const componentPropsSpreadIdentifier = getParentSpreadOrParamIdentifier(reference);
+			const children = attribute.getExpression().getChildren();
+			const lastIdentifier = children.length === 0 ? attribute.getExpression() : children.pop();
+			if (!lastIdentifier || lastIdentifier?.getText() === componentPropsSpreadIdentifier) return [];
+			lastIdentifier.getType().getProperties().forEach((property) => {
+				const propertyNameFromType = property.getDeclarations().map((declaration) => {
+					return (0, lodash_camelCase_js.default)(declaration.getChildrenOfKind(ts_morph.SyntaxKind.TypeReference)[0]?.getText() ?? "");
+				})[0];
+				if (!(0, lodash_isEmpty_js.default)(property.getName())) res.push([property.getName(), []]);
+				if (!(0, lodash_isEmpty_js.default)(propertyNameFromType)) res.push([propertyNameFromType, []]);
+			});
+		}
+		return [];
+	});
+	return res;
+};
+
+//#endregion
+exports.findReferencesAsJsxElements = findReferencesAsJsxElements;
+exports.getJsxElement = getJsxElement;
+exports.getJsxElements = getJsxElements;
+exports.getParentSpreadOrParamIdentifier = getParentSpreadOrParamIdentifier;
+exports.getReactFunctionDeclaration = getReactFunctionDeclaration;
+exports.getUsedPropsInReference = getUsedPropsInReference;
+exports.isForwardRefExpression = isForwardRefExpression;
+exports.isJsxComponent = isJsxComponent;

package/dist/scripts/utils/tsMorph.d.cts

@@ -0,0 +1,32 @@
+import { ArrowFunction, CallExpression, ClassDeclaration, FunctionDeclaration, FunctionExpression, Identifier, JsxElement, JsxOpeningElement, JsxSelfClosingElement, Node, VariableDeclaration } from "ts-morph";
+
+//#region scripts/utils/tsMorph.d.ts
+/** Determines if an expression is using React.forwardRef. */
+declare function isForwardRefExpression(node: Node): node is CallExpression;
+/** Determines if a node is a JSX component. */
+declare function isJsxComponent(node: Node): node is VariableDeclaration | FunctionDeclaration | FunctionExpression | ArrowFunction | ClassDeclaration;
+/** Returns a functional component declaration, unwrapping forwardRef if needed. */
+declare function getReactFunctionDeclaration(declaration: Node): ArrowFunction | FunctionDeclaration | FunctionExpression | null;
+/** Get the first descendant JsxElement based on the identifier. */
+declare function getJsxElement(node: Node, name: string): JsxElement | JsxSelfClosingElement | undefined;
+/** Get all descendant JsxElement nodes. */
+declare function getJsxElements(node: Node): (JsxElement | JsxSelfClosingElement)[];
+/**
+ * Traces component references.
+ *
+ * This is similar to `findReferencesAsNodes` but returns JsxSelfClosingElement and JsxElement nodes.
+ * Note, this currently does not account for cases where the component is used as a prop or is renamed.
+ */
+declare function findReferencesAsJsxElements(identifer: Identifier): (JsxOpeningElement | JsxSelfClosingElement)[];
+/**
+ * Given a Jsx Reference, this function finds the parent of that reference,
+ * looks at the props, and returns the name used either for spread operator rest or
+ * the prop name if there's no spread operator
+ */
+declare const getParentSpreadOrParamIdentifier: (reference: JsxOpeningElement | JsxSelfClosingElement) => string | undefined;
+/**
+ * Get used props on a reference.
+ */
+declare const getUsedPropsInReference: (reference: JsxOpeningElement | JsxSelfClosingElement) => Array<[string, string[]]>;
+//#endregion
+export { findReferencesAsJsxElements, getJsxElement, getJsxElements, getParentSpreadOrParamIdentifier, getReactFunctionDeclaration, getUsedPropsInReference, isForwardRefExpression, isJsxComponent };

package/dist/scripts/utils/tsMorph.d.ts

@@ -0,0 +1,32 @@
+import { ArrowFunction, CallExpression, ClassDeclaration, FunctionDeclaration, FunctionExpression, Identifier, JsxElement, JsxOpeningElement, JsxSelfClosingElement, Node, VariableDeclaration } from "ts-morph";
+
+//#region scripts/utils/tsMorph.d.ts
+/** Determines if an expression is using React.forwardRef. */
+declare function isForwardRefExpression(node: Node): node is CallExpression;
+/** Determines if a node is a JSX component. */
+declare function isJsxComponent(node: Node): node is VariableDeclaration | FunctionDeclaration | FunctionExpression | ArrowFunction | ClassDeclaration;
+/** Returns a functional component declaration, unwrapping forwardRef if needed. */
+declare function getReactFunctionDeclaration(declaration: Node): ArrowFunction | FunctionDeclaration | FunctionExpression | null;
+/** Get the first descendant JsxElement based on the identifier. */
+declare function getJsxElement(node: Node, name: string): JsxElement | JsxSelfClosingElement | undefined;
+/** Get all descendant JsxElement nodes. */
+declare function getJsxElements(node: Node): (JsxElement | JsxSelfClosingElement)[];
+/**
+ * Traces component references.
+ *
+ * This is similar to `findReferencesAsNodes` but returns JsxSelfClosingElement and JsxElement nodes.
+ * Note, this currently does not account for cases where the component is used as a prop or is renamed.
+ */
+declare function findReferencesAsJsxElements(identifer: Identifier): (JsxOpeningElement | JsxSelfClosingElement)[];
+/**
+ * Given a Jsx Reference, this function finds the parent of that reference,
+ * looks at the props, and returns the name used either for spread operator rest or
+ * the prop name if there's no spread operator
+ */
+declare const getParentSpreadOrParamIdentifier: (reference: JsxOpeningElement | JsxSelfClosingElement) => string | undefined;
+/**
+ * Get used props on a reference.
+ */
+declare const getUsedPropsInReference: (reference: JsxOpeningElement | JsxSelfClosingElement) => Array<[string, string[]]>;
+//#endregion
+export { findReferencesAsJsxElements, getJsxElement, getJsxElements, getParentSpreadOrParamIdentifier, getReactFunctionDeclaration, getUsedPropsInReference, isForwardRefExpression, isJsxComponent };