npm - @yahoo/uds - Versions diffs - 2.11.0 → 3.0.0-beta.1 - Mend

@yahoo/uds 2.11.0 → 3.0.0-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (111) hide show

package/cli/bin/uds-darwin-arm64-baseline +0 -0
package/cli/bin/uds-linux-arm64 +0 -0
package/cli/bin/uds-linux-x64-baseline +0 -0
package/cli/cli.ts +1 -1
package/cli/codemods/addCommentAboveComponents.ts +1 -1
package/cli/codemods/flattenButtonVariant.ts +143 -0
package/cli/codemods/utils/index.ts +1 -1
package/cli/commands/codemod/flattenButtonVariant.ts +16 -0
package/cli/tailwindcss.d.ts +2 -0
package/cli/tsconfig.json +30 -8
package/cli/utils/configWorker.ts +1 -1
package/cli/utils/purgeCSS.ts +3 -3
package/cli/utils/sortKeys.ts +5 -0
package/dist/{Text-UCDorZDD.d.cts → Text-DC5H-ljU.d.cts} +29 -68
package/dist/{Text-UCDorZDD.d.ts → Text-DC5H-ljU.d.ts} +29 -68
package/dist/VStack-dsjTgotn.d.ts +145 -0
package/dist/VStack-lZcVQtuR.d.cts +145 -0
package/dist/analytics/server.js +1 -1
package/dist/chunk-3R4CMTF2.js +2 -0
package/dist/chunk-COT7GQ26.js +2 -0
package/dist/chunk-DIZ6AEFQ.cjs +3 -0
package/dist/chunk-GWUSJOIP.js +2 -0
package/dist/chunk-GXWRHF26.cjs +1 -0
package/dist/chunk-H35WDIEH.cjs +1 -0
package/dist/chunk-IGRY2O2E.js +2 -0
package/dist/chunk-IQXT3UML.cjs +2 -0
package/dist/chunk-PLVCO2Q2.cjs +1 -0
package/dist/chunk-RCTE4OK2.cjs +1 -0
package/dist/chunk-ROCVTVD4.js +2 -0
package/dist/chunk-SWTZ62RF.js +3 -0
package/dist/chunk-TYCIDVTR.js +2 -0
package/dist/chunk-UWAIMWW7.cjs +1 -0
package/dist/client/index.cjs +2 -2
package/dist/client/index.d.cts +913 -21
package/dist/client/index.d.ts +913 -21
package/dist/client/index.js +3 -3
package/dist/experimental/client/index.cjs +2 -2
package/dist/experimental/client/index.d.cts +14 -49
package/dist/experimental/client/index.d.ts +14 -49
package/dist/experimental/client/index.js +2 -2
package/dist/experimental/index.cjs +2 -2
package/dist/experimental/index.d.cts +4 -55
package/dist/experimental/index.d.ts +4 -55
package/dist/experimental/index.js +1 -1
package/dist/fixtures.cjs +1544 -54
package/dist/fixtures.d.cts +33 -14
package/dist/fixtures.d.ts +33 -14
package/dist/fixtures.js +1517 -48
package/dist/flags.cjs +1 -1
package/dist/flags.js +1 -1
package/dist/index-B1ZHRmSN.d.ts +202 -0
package/dist/index-By9VJ9yq.d.cts +202 -0
package/dist/index.cjs +1 -1
package/dist/index.d.cts +245 -128
package/dist/index.d.ts +245 -128
package/dist/index.js +1 -1
package/dist/metafile-cjs.json +1 -1
package/dist/metafile-esm.json +1 -1
package/dist/tailwind/plugin.cjs +1 -2
package/dist/tailwind/plugin.d.cts +14 -5
package/dist/tailwind/plugin.d.ts +14 -5
package/dist/tailwind/plugin.js +2 -2
package/dist/tailwind/purger.cjs +2 -2
package/dist/tailwind/purger.js +3 -3
package/dist/tailwind/tsMorph.cjs +1 -1
package/dist/tailwind/tsMorph.js +1 -1
package/dist/tailwind/utils.cjs +1 -1
package/dist/tailwind/utils.d.cts +80 -28
package/dist/tailwind/utils.d.ts +80 -28
package/dist/tailwind/utils.js +1 -1
package/dist/tokens/automation/configs.cjs +1 -0
package/dist/tokens/automation/configs.d.cts +110 -0
package/dist/tokens/automation/configs.d.ts +110 -0
package/dist/tokens/automation/configs.js +1 -0
package/dist/tokens/automation/properties.cjs +1 -0
package/dist/tokens/automation/properties.d.cts +7 -0
package/dist/tokens/automation/properties.d.ts +7 -0
package/dist/tokens/automation/properties.js +1 -0
package/dist/tokens/index.cjs +1 -1
package/dist/tokens/index.d.cts +9355 -15
package/dist/tokens/index.d.ts +9355 -15
package/dist/tokens/index.js +1 -1
package/dist/tokens/parseTokens.cjs +1 -1
package/dist/tokens/parseTokens.d.cts +7 -23
package/dist/tokens/parseTokens.d.ts +7 -23
package/dist/tokens/parseTokens.js +1 -1
package/dist/types-oxQ-ciqn.d.cts +10237 -0
package/dist/types-oxQ-ciqn.d.ts +10237 -0
package/package.json +15 -2
package/dist/chunk-3G7IRLGN.js +0 -2
package/dist/chunk-5WBROFT5.cjs +0 -1
package/dist/chunk-6453EQCC.cjs +0 -1
package/dist/chunk-7QHJ6LHA.js +0 -1
package/dist/chunk-EYFQOFYW.cjs +0 -1
package/dist/chunk-FWF2C6TL.cjs +0 -1
package/dist/chunk-FYVGDNGL.js +0 -2
package/dist/chunk-GIJ2FHY5.cjs +0 -1
package/dist/chunk-GL5JI7EX.cjs +0 -2
package/dist/chunk-MOUM7BAW.js +0 -2
package/dist/chunk-PE2P7J44.js +0 -2
package/dist/chunk-RXSJCGB3.cjs +0 -1
package/dist/chunk-SUASN3GG.js +0 -2
package/dist/chunk-U2K4DT7E.js +0 -3
package/dist/chunk-VPR62GYQ.js +0 -2
package/dist/chunk-WJ55DEUW.cjs +0 -2
package/dist/chunk-X6F5UEQ5.js +0 -2
package/dist/chunk-XZCEFUNX.cjs +0 -2
package/dist/types-DPT0rst4.d.cts +0 -991
package/dist/types-DPT0rst4.d.ts +0 -991
/package/dist/{motionFeatures-PRT45UQH.js → motionFeatures-25DAPVNO.js} +0 -0
/package/dist/{motionFeatures-HQUM526D.cjs → motionFeatures-II2BNXF5.cjs} +0 -0

package/dist/tailwind/utils.d.cts CHANGED Viewed

@@ -1,33 +1,10 @@
-import { M as MotionVariant, h as MotionVariantSpeed, l as MotionSpringConfigOptions, m as MotionConfig, n as FontID, o as FontDeclarationConfig, p as FontConfig } from '../types-DPT0rst4.cjs';
 import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { F as FontID, l as FontDeclarationItemConfig, m as FontConfig, M as MotionVariant, n as MotionVariantSpeed, o as MotionSpringConfigOptions, p as MotionConfig, d as ShadowPreset, q as ShadowType, U as UniversalTokensConfig } from '../types-oxQ-ciqn.cjs';
 import { WebTokens } from '../tokens/parseTokens.cjs';
 import '@yahoo/uds-icons/types';
 import 'motion/react';
 import 'react';
-interface GetMotionVarParams {
-    variant: MotionVariant;
-    speed: MotionVariantSpeed;
-    control: MotionSpringConfigOptions;
-}
-declare function getMotionVar({ variant, speed, control }: GetMotionVarParams): string;
-/**
- * Return CSS variables object based on the motion config.
- * i.e. { --uds-motion-damped-1--damping: '20.585796264350424' }
- *
- * @example
- * // 1. Use return value in style prop of an html element to assign motion variables at runtime
- *
- * const motionVars = getMotionStyles(motionConfig);
- * <body style={motionVars}> {...} </body>
- *
- * // 2. Generate CSS at build time in tailwind plugin via Tailwind's addBase or addComponent.
- *
- * const motionVars = getMotionStyles(motionConfig);
- * addBase({ ':root': motionVars });
- *
- */
-declare function getMotionStyles(motionConfig: MotionConfig): Record<"--uds-motion-damped-1-damping" | "--uds-motion-damped-1-stiffness" | "--uds-motion-damped-2-damping" | "--uds-motion-damped-2-stiffness" | "--uds-motion-damped-3-damping" | "--uds-motion-damped-3-stiffness" | "--uds-motion-damped-4-damping" | "--uds-motion-damped-4-stiffness" | "--uds-motion-smooth-1-damping" | "--uds-motion-smooth-1-stiffness" | "--uds-motion-smooth-2-damping" | "--uds-motion-smooth-2-stiffness" | "--uds-motion-smooth-3-damping" | "--uds-motion-smooth-3-stiffness" | "--uds-motion-smooth-4-damping" | "--uds-motion-smooth-4-stiffness" | "--uds-motion-subtle-1-damping" | "--uds-motion-subtle-1-stiffness" | "--uds-motion-subtle-2-damping" | "--uds-motion-subtle-2-stiffness" | "--uds-motion-subtle-3-damping" | "--uds-motion-subtle-3-stiffness" | "--uds-motion-subtle-4-damping" | "--uds-motion-subtle-4-stiffness" | "--uds-motion-bouncy-1-damping" | "--uds-motion-bouncy-1-stiffness" | "--uds-motion-bouncy-2-damping" | "--uds-motion-bouncy-2-stiffness" | "--uds-motion-bouncy-3-damping" | "--uds-motion-bouncy-3-stiffness" | "--uds-motion-bouncy-4-damping" | "--uds-motion-bouncy-4-stiffness" | "--uds-motion-veryBouncy-1-damping" | "--uds-motion-veryBouncy-1-stiffness" | "--uds-motion-veryBouncy-2-damping" | "--uds-motion-veryBouncy-2-stiffness" | "--uds-motion-veryBouncy-3-damping" | "--uds-motion-veryBouncy-3-stiffness" | "--uds-motion-veryBouncy-4-damping" | "--uds-motion-veryBouncy-4-stiffness", string>;
+import 'type-fest';
 interface AddFontsPluginOptions {
     fontIds: FontID[];
@@ -52,7 +29,7 @@ declare function getColorModeStyles(tokens: WebTokens): {
 /**
  * Get all font face declarations for a given set of font IDs.
  */
-declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationConfig[];
+declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationItemConfig[];
 /**
  * Return CSS variables object based on font config.
@@ -70,7 +47,31 @@ declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationConf
  * addBase({ ':root': fontVars });
  *
  */
-declare function getFontStyles(fontConfig: FontConfig): Record<"--uds-font-sans" | "--uds-font-sans-alt" | "--uds-font-serif" | "--uds-font-serif-alt" | "--uds-font-mono", string>;
+declare function getFontStyles(fontConfig: FontConfig): Record<"--uds-font-serif" | "--uds-font-sans" | "--uds-font-mono" | "--uds-font-sans-alt" | "--uds-font-serif-alt", string>;
+interface GetMotionVarParams {
+    variant: MotionVariant;
+    speed: MotionVariantSpeed;
+    control: MotionSpringConfigOptions;
+}
+declare function getMotionVar({ variant, speed, control }: GetMotionVarParams): string;
+/**
+ * Return CSS variables object based on the motion config.
+ * i.e. { --uds-motion-damped-1--damping: '20.585796264350424' }
+ *
+ * @example
+ * // 1. Use return value in style prop of an html element to assign motion variables at runtime
+ *
+ * const motionVars = getMotionStyles(motionConfig);
+ * <body style={motionVars}> {...} </body>
+ *
+ * // 2. Generate CSS at build time in tailwind plugin via Tailwind's addBase or addComponent.
+ *
+ * const motionVars = getMotionStyles(motionConfig);
+ * addBase({ ':root': motionVars });
+ *
+ */
+declare function getMotionStyles(motionConfig: MotionConfig): Record<"--uds-motion-damped-2-damping" | "--uds-motion-damped-2-stiffness" | "--uds-motion-damped-4-damping" | "--uds-motion-damped-4-stiffness" | "--uds-motion-damped-3-damping" | "--uds-motion-damped-3-stiffness" | "--uds-motion-damped-1-damping" | "--uds-motion-damped-1-stiffness" | "--uds-motion-smooth-2-damping" | "--uds-motion-smooth-2-stiffness" | "--uds-motion-smooth-4-damping" | "--uds-motion-smooth-4-stiffness" | "--uds-motion-smooth-3-damping" | "--uds-motion-smooth-3-stiffness" | "--uds-motion-smooth-1-damping" | "--uds-motion-smooth-1-stiffness" | "--uds-motion-subtle-2-damping" | "--uds-motion-subtle-2-stiffness" | "--uds-motion-subtle-4-damping" | "--uds-motion-subtle-4-stiffness" | "--uds-motion-subtle-3-damping" | "--uds-motion-subtle-3-stiffness" | "--uds-motion-subtle-1-damping" | "--uds-motion-subtle-1-stiffness" | "--uds-motion-bouncy-2-damping" | "--uds-motion-bouncy-2-stiffness" | "--uds-motion-bouncy-4-damping" | "--uds-motion-bouncy-4-stiffness" | "--uds-motion-bouncy-3-damping" | "--uds-motion-bouncy-3-stiffness" | "--uds-motion-bouncy-1-damping" | "--uds-motion-bouncy-1-stiffness" | "--uds-motion-veryBouncy-2-damping" | "--uds-motion-veryBouncy-2-stiffness" | "--uds-motion-veryBouncy-4-damping" | "--uds-motion-veryBouncy-4-stiffness" | "--uds-motion-veryBouncy-3-damping" | "--uds-motion-veryBouncy-3-stiffness" | "--uds-motion-veryBouncy-1-damping" | "--uds-motion-veryBouncy-1-stiffness", string>;
 declare function getScaleModeStyles(tokens: WebTokens): {
     xSmall: {
@@ -96,4 +97,55 @@ declare function getScaleModeStyles(tokens: WebTokens): {
     };
 };
-export { type AddFontsPluginOptions, type GetMotionVarParams, addFontsPlugin, getColorModeStyles, getFontFaceDeclarations, getFontStyles, getMotionStyles, getMotionVar, getScaleModeStyles };
+/**
+ * Generate a single shadow value from a shadow preset configuration
+ *
+ * @param preset - The shadow preset configuration
+ * @param index - Optional index for numbered shadows (2-5)
+ * @param shadowType - The type of shadow (drop or inset)
+ * @returns A CSS box-shadow value string
+ */
+declare function getShadowLayerValue({ preset, prefix, shadowType, }: {
+    preset: ShadowPreset;
+    prefix?: string;
+    shadowType: ShadowType;
+}): string;
+/**
+ * Generate shadow values from the shadow config presets.
+ * Each size can have multiple shadow presets that are combined into a single box-shadow.
+ *
+ * For regular shadows:
+ * - Uses the outer shadow configuration from the shadow config
+ * - Uses CSS variables with the --uds-shadow-* prefix for shadow properties
+ * - The first shadow uses default variable names, subsequent shadows are numbered (e.g. --uds-shadow-2-*)
+ * - Shadow colors are scoped to the element, allowing for instance-specific colors
+ *
+ * For inset shadows:
+ * - Uses the inner shadow configuration from the shadow config
+ * - Uses CSS variables with the --uds-inset-shadow-* prefix for shadow properties
+ * - Adds the 'inset' keyword to each shadow value
+ * - Shadow colors are scoped to the element, allowing for instance-specific colors
+ *
+ * This approach ensures that both regular and inset shadows use the correct CSS variables
+ * set by the shadow utilities, while allowing for instance-specific color customization.
+ * The separation of variable namespaces allows both shadow types to be used together on the same element.
+ *
+ * When both shadow and inset-shadow utilities are used together on an element,
+ * they combine to create a box-shadow with both outer and inner shadows.
+ *
+ * @returns A record of shadow values by size (xs, sm, md, etc.)
+ */
+declare function getShadowPresetValues({ config, shadowType, }: {
+    config: UniversalTokensConfig;
+    shadowType: ShadowType;
+}): Record<string, string>;
+declare function getShadowStyles({ config, shadowType, }: {
+    config: UniversalTokensConfig;
+    shadowType: ShadowType;
+}): Record<".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none", {
+    readonly [x: string]: "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
+    readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
+}>;
+export { type AddFontsPluginOptions, type GetMotionVarParams, addFontsPlugin, getColorModeStyles, getFontFaceDeclarations, getFontStyles, getMotionStyles, getMotionVar, getScaleModeStyles, getShadowLayerValue, getShadowPresetValues, getShadowStyles };

package/dist/tailwind/utils.d.ts CHANGED Viewed

@@ -1,33 +1,10 @@
-import { M as MotionVariant, h as MotionVariantSpeed, l as MotionSpringConfigOptions, m as MotionConfig, n as FontID, o as FontDeclarationConfig, p as FontConfig } from '../types-DPT0rst4.js';
 import * as tailwindcss_types_config from 'tailwindcss/types/config';
+import { F as FontID, l as FontDeclarationItemConfig, m as FontConfig, M as MotionVariant, n as MotionVariantSpeed, o as MotionSpringConfigOptions, p as MotionConfig, d as ShadowPreset, q as ShadowType, U as UniversalTokensConfig } from '../types-oxQ-ciqn.js';
 import { WebTokens } from '../tokens/parseTokens.js';
 import '@yahoo/uds-icons/types';
 import 'motion/react';
 import 'react';
-interface GetMotionVarParams {
-    variant: MotionVariant;
-    speed: MotionVariantSpeed;
-    control: MotionSpringConfigOptions;
-}
-declare function getMotionVar({ variant, speed, control }: GetMotionVarParams): string;
-/**
- * Return CSS variables object based on the motion config.
- * i.e. { --uds-motion-damped-1--damping: '20.585796264350424' }
- *
- * @example
- * // 1. Use return value in style prop of an html element to assign motion variables at runtime
- *
- * const motionVars = getMotionStyles(motionConfig);
- * <body style={motionVars}> {...} </body>
- *
- * // 2. Generate CSS at build time in tailwind plugin via Tailwind's addBase or addComponent.
- *
- * const motionVars = getMotionStyles(motionConfig);
- * addBase({ ':root': motionVars });
- *
- */
-declare function getMotionStyles(motionConfig: MotionConfig): Record<"--uds-motion-damped-1-damping" | "--uds-motion-damped-1-stiffness" | "--uds-motion-damped-2-damping" | "--uds-motion-damped-2-stiffness" | "--uds-motion-damped-3-damping" | "--uds-motion-damped-3-stiffness" | "--uds-motion-damped-4-damping" | "--uds-motion-damped-4-stiffness" | "--uds-motion-smooth-1-damping" | "--uds-motion-smooth-1-stiffness" | "--uds-motion-smooth-2-damping" | "--uds-motion-smooth-2-stiffness" | "--uds-motion-smooth-3-damping" | "--uds-motion-smooth-3-stiffness" | "--uds-motion-smooth-4-damping" | "--uds-motion-smooth-4-stiffness" | "--uds-motion-subtle-1-damping" | "--uds-motion-subtle-1-stiffness" | "--uds-motion-subtle-2-damping" | "--uds-motion-subtle-2-stiffness" | "--uds-motion-subtle-3-damping" | "--uds-motion-subtle-3-stiffness" | "--uds-motion-subtle-4-damping" | "--uds-motion-subtle-4-stiffness" | "--uds-motion-bouncy-1-damping" | "--uds-motion-bouncy-1-stiffness" | "--uds-motion-bouncy-2-damping" | "--uds-motion-bouncy-2-stiffness" | "--uds-motion-bouncy-3-damping" | "--uds-motion-bouncy-3-stiffness" | "--uds-motion-bouncy-4-damping" | "--uds-motion-bouncy-4-stiffness" | "--uds-motion-veryBouncy-1-damping" | "--uds-motion-veryBouncy-1-stiffness" | "--uds-motion-veryBouncy-2-damping" | "--uds-motion-veryBouncy-2-stiffness" | "--uds-motion-veryBouncy-3-damping" | "--uds-motion-veryBouncy-3-stiffness" | "--uds-motion-veryBouncy-4-damping" | "--uds-motion-veryBouncy-4-stiffness", string>;
+import 'type-fest';
 interface AddFontsPluginOptions {
     fontIds: FontID[];
@@ -52,7 +29,7 @@ declare function getColorModeStyles(tokens: WebTokens): {
 /**
  * Get all font face declarations for a given set of font IDs.
  */
-declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationConfig[];
+declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationItemConfig[];
 /**
  * Return CSS variables object based on font config.
@@ -70,7 +47,31 @@ declare function getFontFaceDeclarations(fontIds: FontID[]): FontDeclarationConf
  * addBase({ ':root': fontVars });
  *
  */
-declare function getFontStyles(fontConfig: FontConfig): Record<"--uds-font-sans" | "--uds-font-sans-alt" | "--uds-font-serif" | "--uds-font-serif-alt" | "--uds-font-mono", string>;
+declare function getFontStyles(fontConfig: FontConfig): Record<"--uds-font-serif" | "--uds-font-sans" | "--uds-font-mono" | "--uds-font-sans-alt" | "--uds-font-serif-alt", string>;
+interface GetMotionVarParams {
+    variant: MotionVariant;
+    speed: MotionVariantSpeed;
+    control: MotionSpringConfigOptions;
+}
+declare function getMotionVar({ variant, speed, control }: GetMotionVarParams): string;
+/**
+ * Return CSS variables object based on the motion config.
+ * i.e. { --uds-motion-damped-1--damping: '20.585796264350424' }
+ *
+ * @example
+ * // 1. Use return value in style prop of an html element to assign motion variables at runtime
+ *
+ * const motionVars = getMotionStyles(motionConfig);
+ * <body style={motionVars}> {...} </body>
+ *
+ * // 2. Generate CSS at build time in tailwind plugin via Tailwind's addBase or addComponent.
+ *
+ * const motionVars = getMotionStyles(motionConfig);
+ * addBase({ ':root': motionVars });
+ *
+ */
+declare function getMotionStyles(motionConfig: MotionConfig): Record<"--uds-motion-damped-2-damping" | "--uds-motion-damped-2-stiffness" | "--uds-motion-damped-4-damping" | "--uds-motion-damped-4-stiffness" | "--uds-motion-damped-3-damping" | "--uds-motion-damped-3-stiffness" | "--uds-motion-damped-1-damping" | "--uds-motion-damped-1-stiffness" | "--uds-motion-smooth-2-damping" | "--uds-motion-smooth-2-stiffness" | "--uds-motion-smooth-4-damping" | "--uds-motion-smooth-4-stiffness" | "--uds-motion-smooth-3-damping" | "--uds-motion-smooth-3-stiffness" | "--uds-motion-smooth-1-damping" | "--uds-motion-smooth-1-stiffness" | "--uds-motion-subtle-2-damping" | "--uds-motion-subtle-2-stiffness" | "--uds-motion-subtle-4-damping" | "--uds-motion-subtle-4-stiffness" | "--uds-motion-subtle-3-damping" | "--uds-motion-subtle-3-stiffness" | "--uds-motion-subtle-1-damping" | "--uds-motion-subtle-1-stiffness" | "--uds-motion-bouncy-2-damping" | "--uds-motion-bouncy-2-stiffness" | "--uds-motion-bouncy-4-damping" | "--uds-motion-bouncy-4-stiffness" | "--uds-motion-bouncy-3-damping" | "--uds-motion-bouncy-3-stiffness" | "--uds-motion-bouncy-1-damping" | "--uds-motion-bouncy-1-stiffness" | "--uds-motion-veryBouncy-2-damping" | "--uds-motion-veryBouncy-2-stiffness" | "--uds-motion-veryBouncy-4-damping" | "--uds-motion-veryBouncy-4-stiffness" | "--uds-motion-veryBouncy-3-damping" | "--uds-motion-veryBouncy-3-stiffness" | "--uds-motion-veryBouncy-1-damping" | "--uds-motion-veryBouncy-1-stiffness", string>;
 declare function getScaleModeStyles(tokens: WebTokens): {
     xSmall: {
@@ -96,4 +97,55 @@ declare function getScaleModeStyles(tokens: WebTokens): {
     };
 };
-export { type AddFontsPluginOptions, type GetMotionVarParams, addFontsPlugin, getColorModeStyles, getFontFaceDeclarations, getFontStyles, getMotionStyles, getMotionVar, getScaleModeStyles };
+/**
+ * Generate a single shadow value from a shadow preset configuration
+ *
+ * @param preset - The shadow preset configuration
+ * @param index - Optional index for numbered shadows (2-5)
+ * @param shadowType - The type of shadow (drop or inset)
+ * @returns A CSS box-shadow value string
+ */
+declare function getShadowLayerValue({ preset, prefix, shadowType, }: {
+    preset: ShadowPreset;
+    prefix?: string;
+    shadowType: ShadowType;
+}): string;
+/**
+ * Generate shadow values from the shadow config presets.
+ * Each size can have multiple shadow presets that are combined into a single box-shadow.
+ *
+ * For regular shadows:
+ * - Uses the outer shadow configuration from the shadow config
+ * - Uses CSS variables with the --uds-shadow-* prefix for shadow properties
+ * - The first shadow uses default variable names, subsequent shadows are numbered (e.g. --uds-shadow-2-*)
+ * - Shadow colors are scoped to the element, allowing for instance-specific colors
+ *
+ * For inset shadows:
+ * - Uses the inner shadow configuration from the shadow config
+ * - Uses CSS variables with the --uds-inset-shadow-* prefix for shadow properties
+ * - Adds the 'inset' keyword to each shadow value
+ * - Shadow colors are scoped to the element, allowing for instance-specific colors
+ *
+ * This approach ensures that both regular and inset shadows use the correct CSS variables
+ * set by the shadow utilities, while allowing for instance-specific color customization.
+ * The separation of variable namespaces allows both shadow types to be used together on the same element.
+ *
+ * When both shadow and inset-shadow utilities are used together on an element,
+ * they combine to create a box-shadow with both outer and inner shadows.
+ *
+ * @returns A record of shadow values by size (xs, sm, md, etc.)
+ */
+declare function getShadowPresetValues({ config, shadowType, }: {
+    config: UniversalTokensConfig;
+    shadowType: ShadowType;
+}): Record<string, string>;
+declare function getShadowStyles({ config, shadowType, }: {
+    config: UniversalTokensConfig;
+    shadowType: ShadowType;
+}): Record<".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none", {
+    readonly [x: string]: "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
+    readonly boxShadow: "var(--uds-drop-shadow, 0 0 transparent), var(--uds-inset-shadow, 0 0 transparent), var(--tw-ring-offset-shadow, 0 0 transparent), var(--tw-ring-shadow, 0 0 transparent), var(--tw-shadow, 0 0 transparent)";
+}>;
+export { type AddFontsPluginOptions, type GetMotionVarParams, addFontsPlugin, getColorModeStyles, getFontFaceDeclarations, getFontStyles, getMotionStyles, getMotionVar, getScaleModeStyles, getShadowLayerValue, getShadowPresetValues, getShadowStyles };

package/dist/tailwind/utils.js CHANGED Viewed

	@@ -1 +1 @@
1	- export{addFontsPlugin,getColorModeStyles,getFontFaceDeclarations,getFontStyles,~~getScaleModeStyles}from"../chunk-FYVGDNGL.js";export{~~getMotionStyles,getMotionVar}from"../chunk-~~7QHJ6LHA~~.js";
1	+ export{addFontsPlugin,getColorModeStyles,getFontFaceDeclarations,getFontStyles,getMotionStyles,getMotionVar,getScaleModeStyles,getShadowLayerValue,getShadowPresetValues,getShadowStyles}from"../chunk-SWTZ62RF.js";

package/dist/tokens/automation/configs.cjs ADDED Viewed

@@ -0,0 +1 @@

+ "use strict";var e=require("../../chunk-DIZ6AEFQ.cjs"),a=require("@yahoo/uds/fixtures");/*! © 2025 Yahoo, Inc. UDS v3.0.0-development */var r={label:"Avatar",description:"An avatar is a visual element that represents a user or entity, usually shown as a circle or square with an image, icon, or initials. It's commonly used in profiles, comments, or messages to help identify people.",variants:{size:e.createVariantConfigWithProperties({label:"Size",description:"These sizes will apply across all variants",isConfigurable:!0,default:"md",options:["xs","sm","md","lg","xl"],layers:{root:e.createLayerConfig({label:"root",properties:{height:e.createConfigurableProperty({name:"height",label:"Height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{xs:"6",sm:"7",md:"10",lg:"12",xl:"16"}}),width:e.createConfigurableProperty({name:"width",label:"Width",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{xs:"6",sm:"7",md:"10",lg:"12",xl:"16"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],defaults:{xs:"thin",sm:"thin",md:"thin",lg:"thin",xl:"thin"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{xs:"caption1",sm:"caption2",md:"headline1",lg:"title4",xl:"title3"}})}}),icon:e.createLayerConfig({label:"icon",properties:{iconSize:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{xs:"sm",sm:"sm",md:"md",lg:"lg",xl:"lg"}})}})}})},subComponents:{text:e.createSubComponentConfig({label:"Text",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",isConfigurable:!0,options:["primary","secondary"],default:"primary",layers:{root:e.createLayerConfig({label:"root",properties:{color:e.createConfigurableProperty({name:"color",label:"text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"brand",secondary:"secondary"}}),backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{primary:"brand",secondary:"secondary"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"Border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{primary:"full",secondary:"sm"}})}})}})}}),image:e.createSubComponentConfig({label:"Image",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",isConfigurable:!0,options:["primary","secondary"],default:"primary",layers:{root:e.createLayerConfig({label:"root",properties:{borderColor:e.createConfigurableProperty({name:"borderColor",label:"border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{primary:"muted",secondary:"muted"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{primary:"full",secondary:"sm"}})}})}})}}),icon:e.createSubComponentConfig({label:"Icon",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",isConfigurable:!0,options:["primary","secondary"],default:"primary",layers:{root:e.createLayerConfig({label:"root",properties:{color:e.createConfigurableProperty({name:"color",label:"icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"muted",secondary:"muted"}}),backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"secondary",secondary:"secondary"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"primary"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{primary:"full",secondary:"sm"}})}})}})}})}};var t={label:"Badge",description:"Component for demo purposes and testing the automation",variants:{size:e.createVariantConfigWithProperties({label:"Size",description:"These sizes will apply across all variants",isConfigurable:!0,default:"md",options:["xs","sm","md","lg"],layers:{root:e.createLayerConfig({label:"root",properties:{spacingHorizontal:e.createConfigurableProperty({name:"spacingHorizontal",label:"Spacing horizontal",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{xs:"2",sm:"4",md:"6",lg:"8"}}),spacingVertical:e.createConfigurableProperty({name:"spacingVertical",label:"Spacing vertical",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{xs:"0.5",sm:"1",md:"1.5",lg:"2"}}),gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{xs:"2",sm:"4",md:"6",lg:"8"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{xs:"label4",sm:"label3",md:"label2",lg:"label1"}})}}),icon:e.createLayerConfig({label:"icon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{xs:"sm",sm:"sm",md:"md",lg:"lg"}})}})}}),variant:e.createVariantConfigWithProperties({label:"Variants",description:"",isConfigurable:!0,default:"primary",options:["primary","secondary","brand","brand-secondary","alert","alert-secondary","warning","warning-secondary","positive","positive-secondary","info","info-secondary"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary",alert:"alert","alert-secondary":"alert-secondary",warning:"warning","warning-secondary":"warning-secondary",positive:"positive","positive-secondary":"positive-secondary",info:"info","info-secondary":"info-secondary"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary",alert:"alert","alert-secondary":"alert-secondary",warning:"warning","warning-secondary":"warning-secondary",positive:"positive","positive-secondary":"positive-secondary",info:"info","info-secondary":"info-secondary"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],defaults:{primary:"thin",secondary:"none",brand:"none","brand-secondary":"none",alert:"none","alert-secondary":"none",warning:"none","warning-secondary":"none",positive:"none","positive-secondary":"none",info:"none","info-secondary":"none"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary",alert:"alert","alert-secondary":"alert-secondary",warning:"warning","warning-secondary":"warning-secondary",positive:"positive","positive-secondary":"positive-secondary",info:"info","info-secondary":"info-secondary"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"Border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{primary:"sm",secondary:"sm",brand:"sm","brand-secondary":"sm",alert:"sm","alert-secondary":"sm",warning:"sm","warning-secondary":"sm",positive:"sm","positive-secondary":"sm",info:"sm","info-secondary":"sm"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],defaults:{primary:"2xl",secondary:"xl",brand:"md","brand-secondary":"xl",alert:"xl","alert-secondary":"xl",warning:"xl","warning-secondary":"xl",positive:"xl","positive-secondary":"xl",info:"xl","info-secondary":"sm"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],defaults:{primary:"2xl-invert",secondary:"md-invert",brand:"md","brand-secondary":"xl",alert:"xl","alert-secondary":"xl-invert",warning:"xl","warning-secondary":"xl",positive:"xl","positive-secondary":"xl",info:"xl","info-secondary":"sm"}})}}),icon:e.createLayerConfig({label:"icon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary",alert:"alert","alert-secondary":"alert-secondary",warning:"warning","warning-secondary":"warning-secondary",positive:"positive","positive-secondary":"positive-secondary",info:"info","info-secondary":"info-secondary"}})}})}})}};var o={label:"Checkbox",description:"A checkbox is a small, interactive element that lets users select one or more options from a list.",variants:{size:e.createVariantConfigWithProperties({label:"size",isConfigurable:!0,options:["sm","md"],default:"md",description:"",layers:{root:e.createLayerConfig({label:"root",properties:{gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"2",md:"2.5"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{sm:"label4",md:"label2"}})}}),checkbox:e.createLayerConfig({label:"checkbox",properties:{borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Checkbox border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],defaults:{sm:"thin",md:"thin"}}),height:e.createConfigurableProperty({name:"height",label:"Checkbox height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"5"}}),width:e.createConfigurableProperty({name:"width",label:"Checkbox width",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"5"}})}})}}),variant:e.createVariantConfigWithComponentStates({label:"variant",description:"",isConfigurable:!0,options:["primary","secondary","alert","alert-secondary"],default:"primary",componentStates:{value:e.createComponentStates({label:"value",options:["checked","unchecked","indeterminate"],layers:{root:e.createLayerConfig({label:"root",properties:{color:e.createConfigurableProperty({name:"color",label:"Label color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"primary",secondary:"primary",alert:"primary","alert-secondary":"primary"}})}}),checkbox:e.createLayerConfig({label:"checkbox",properties:{borderColor:e.createConfigurableProperty({name:"borderColor",label:"border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"tertiary",secondary:"tertiary",alert:"tertiary","alert-secondary":"tertiary"}}),backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Checkbox background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"secondary",secondary:"secondary",alert:"secondary","alert-secondary":"secondary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"none",secondary:"none",alert:"md","alert-secondary":"none"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"2xl-invert",secondary:"md-invert",alert:"md","alert-secondary":"xl"}})}}),checkboxIcon:e.createLayerConfig({label:"checkboxIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","disabled"],defaults:{primary:"primary",secondary:"primary",alert:"primary","alert-secondary":"primary"}})}})}})}})}};var l={label:"Chip",description:"A chip is a small, interactive element that presents information, actions, or selections in a compact form — commonly used for tags, filters, or user input.",subComponents:{toggle:e.createSubComponentConfig({label:"Toggle",description:"",variants:{variant:e.createVariantConfigWithComponentStates({label:"Variant",description:"",isConfigurable:!0,default:"primary",options:["primary","secondary","brand","brand-secondary"],componentStates:{active:e.createComponentStates({label:"active",options:["on","off"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"secondary","brand-secondary":"secondary"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"secondary","brand-secondary":"secondary"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],pseudoStates:["hover","pressed"],values:[a.borderWidths],defaults:{primary:"thin",secondary:"none",brand:"none","brand-secondary":"none"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"Border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover","pressed"],defaults:{primary:"2xl",secondary:"xl",brand:"md","brand-secondary":"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover","pressed"],defaults:{primary:"2xl-invert",secondary:"md-invert",brand:"md","brand-secondary":"xl"}})}}),icon:e.createLayerConfig({label:"icon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],pseudoStates:["hover","pressed"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}})}})}})}})}}),dismissible:e.createSubComponentConfig({label:"Dismissible",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"",isConfigurable:!0,default:"primary",options:["primary","secondary","brand","brand-secondary"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"gray-4",secondary:"blue-4",brand:"red-4","brand-secondary":"purple-4"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"gray-9",secondary:"blue-9",brand:"red-9","brand-secondary":"red-4"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],pseudoStates:["hover","pressed"],values:[a.borderWidths],defaults:{primary:"thin",secondary:"none",brand:"none","brand-secondary":"none"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"Border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover","pressed"],defaults:{primary:"2xl",secondary:"xl",brand:"md","brand-secondary":"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover","pressed"],defaults:{primary:"2xl-invert",secondary:"md-invert",brand:"md","brand-secondary":"xl"}})}}),icon:e.createLayerConfig({label:"icon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}})}})}})}}),link:e.createSubComponentConfig({label:"Link",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"",isConfigurable:!0,default:"primary",options:["primary","secondary","brand","brand-secondary"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"secondary","brand-secondary":"secondary"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"secondary","brand-secondary":"secondary"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],pseudoStates:["hover","pressed"],defaults:{primary:"thin",secondary:"none",brand:"none","brand-secondary":"none"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"Border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover","pressed"],defaults:{primary:"2xl",secondary:"xl",brand:"md","brand-secondary":"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover","pressed"],defaults:{primary:"2xl-invert",secondary:"md-invert",brand:"md","brand-secondary":"xl"}})}}),icon:e.createLayerConfig({label:"icon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",brand:"brand","brand-secondary":"brand-secondary"}})}})}})}})},variants:{size:e.createVariantConfigWithProperties({label:"Size",description:"These sizes will apply across all variants",isConfigurable:!0,default:"md",options:["sm","md"],layers:{root:e.createLayerConfig({label:"root",properties:{spacingHorizontal:e.createConfigurableProperty({name:"spacingHorizontal",label:"Spacing horizontal",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"3",md:"3"}}),spacingVertical:e.createConfigurableProperty({name:"spacingVertical",label:"Spacing vertical",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"1",md:"1.5"}}),gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"2",md:"2"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{sm:"label1",md:"label1"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"Border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{sm:"full",md:"full"}})}})}})}};var s={label:"Divider",description:"Divider lines are purely decorative and non-interactive, serving as a visual guide. Use as horizontal and vertical lines.",variants:{variant:e.createVariantConfigWithProperties({label:"Variant",description:"",isConfigurable:!0,default:"primary",options:["primary","secondary","tertiary","muted"],layers:{root:e.createLayerConfig({label:"root",properties:{gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{primary:"2",secondary:"2",tertiary:"2",muted:"2"}})}}),line:e.createLayerConfig({label:"line",properties:{borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Thickness",typeOfFixture:["borderWidths"],values:[a.borderWidths.filter((e=>"none"!==e))],defaults:{primary:"thin",secondary:"thin",tertiary:"thin",muted:"thin"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"Border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",tertiary:"tertiary",muted:"muted"}})}}),label:e.createLayerConfig({label:"label",properties:{textVariant:e.createConfigurableProperty({name:"textVariant",label:"text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{primary:"label3",secondary:"label3",tertiary:"label3",muted:"label3"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",tertiary:"tertiary",muted:"muted"}})}})}})}};var i={label:"input",description:"An input field is a box where users can type or select information. It can also open a dropdown menu to show options or help collect data.",variants:{size:e.createVariantConfigWithProperties({label:"size",isConfigurable:!0,options:["md","lg"],default:"md",description:"",layers:{root:e.createLayerConfig({label:"root",properties:{}}),inputWrapper:e.createLayerConfig({label:"inputWrapper",properties:{spacingHorizontal:e.createConfigurableProperty({name:"spacingHorizontal",label:"Spacing horizontal",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{md:"3.5",lg:"4"}}),spacingVertical:e.createConfigurableProperty({name:"spacingVertical",label:"Spacing vertical",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{md:"2",lg:"3.5"}}),gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{md:"3",lg:"3"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],pseudoStates:["pressed","invalid"],defaults:{md:"thin",lg:"thin"}}),borderRadius:e.createConfigurableProperty({name:"borderRadius",label:"Border radius",typeOfFixture:["borderRadii"],values:[a.borderRadii],defaults:{md:"md",lg:"md"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Input text style",typeOfFixture:["textVariants"],pseudoStates:["hover"],values:[a.textVariants],defaults:{md:"label2",lg:"label2"}})}}),input:e.createLayerConfig({label:"input",properties:{height:e.createConfigurableProperty({name:"height",label:"Input element height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{md:"6",lg:"6"}})}}),startIcon:e.createLayerConfig({label:"startIcon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Start icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{md:"md",lg:"md"}})}}),endIcon:e.createLayerConfig({label:"endIcon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"End icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{md:"md",lg:"md"}})}}),label:e.createLayerConfig({label:"label",properties:{textVariant:e.createConfigurableProperty({name:"textVariant",label:"Label text style",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{md:"label4",lg:"label4"}})}}),helperIcon:e.createLayerConfig({label:"helperIcon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Helper text icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{md:"sm",lg:"sm"}})}}),helperText:e.createLayerConfig({label:"helperText",properties:{textVariant:e.createConfigurableProperty({name:"textVariant",label:"Label text style",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{md:"label4",lg:"label4"}})}})}}),variant:e.createVariantConfigWithComponentStates({label:"variant",description:"",isConfigurable:!0,options:["default"],default:"default",componentStates:{value:e.createComponentStates({label:"value",options:["filled","empty"],layers:{root:e.createLayerConfig({label:"root",properties:{}}),inputWrapper:e.createLayerConfig({label:"input",properties:{borderColor:e.createConfigurableProperty({name:"borderColor",label:"Border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"tertiary"}}),backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"primary"}})}}),input:e.createLayerConfig({label:"input",properties:{color:e.createConfigurableProperty({name:"color",label:"Input text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),inputPlaceholder:e.createLayerConfig({label:"inputPlaceholder",pseudoSelector:"::placeholder",properties:{color:e.createConfigurableProperty({name:"color",label:"Input text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),startIcon:e.createLayerConfig({label:"startIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Start icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),endIcon:e.createLayerConfig({label:"endIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"End icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),label:e.createLayerConfig({label:"label",properties:{color:e.createConfigurableProperty({name:"color",label:"Label color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),labelRequired:e.createLayerConfig({label:"labelRequired",properties:{color:e.createConfigurableProperty({name:"color",label:"Required color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),helperIcon:e.createLayerConfig({label:"helperIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Helper icon color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"muted"}})}}),helperText:e.createLayerConfig({label:"helpText",properties:{color:e.createConfigurableProperty({name:"color",label:"Helper text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed","focus-within","invalid","invalid&hover","invalid&pressed","readonly","disabled"],defaults:{default:"brand"}})}})}})}})}};var n={label:"Link",description:"Customizing your own buttons involves adjusting text styles, icon sizes, and spacing values to create a personalized button.",variants:{textStyle:e.createVariantConfigWithProperties({label:"Text Style",description:"",isConfigurable:!0,default:"title1",options:a.textVariants,layers:{root:e.createLayerConfig({label:"root",properties:{gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{display1:"2",display2:"2",display3:"2",title1:"2",title2:"2",title3:"2",title4:"2",headline1:"2",body1:"2",label1:"2",label2:"2",label3:"2",label4:"2",caption1:"2",caption2:"2",legal1:"2"}})}}),icon:e.createLayerConfig({label:"icon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{display1:"lg",display2:"lg",display3:"lg",title1:"md",title2:"md",title3:"md",title4:"md",headline1:"md",body1:"md",label1:"md",label2:"md",label3:"md",label4:"sm",caption1:"md",caption2:"sm",legal1:"md"}})}})}}),variant:e.createVariantConfigWithProperties({label:"Variants",description:"Variants",isConfigurable:!0,default:"primary",options:["primary","secondary","tertiary","on-color"],layers:{root:e.createLayerConfig({label:"root",properties:{color:e.createConfigurableProperty({name:"color",label:"Text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",tertiary:"tertiary","on-color":"on-color"}})}}),iconStart:e.createLayerConfig({label:"iconStart",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon start color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],pseudoStates:["hover","pressed"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",tertiary:"tertiary","on-color":"on-color"}})}}),iconEnd:e.createLayerConfig({label:"iconEnd",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon end color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],pseudoStates:["hover","pressed"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{primary:"primary",secondary:"secondary",tertiary:"tertiary","on-color":"on-color"}})}})}})}};var d={label:"Menu",description:"A menu is a component that offers a list of choices to the user, such as a set of actions or functions. ",variants:{size:e.createVariantConfigWithProperties({label:"size",description:"",isConfigurable:!0,options:["default"],default:"default",layers:{root:e.createLayerConfig({label:"root",properties:{}}),startIcon:e.createLayerConfig({label:"startIcon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{default:"sm"}})}}),endIcon:e.createLayerConfig({label:"endIcon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{default:"sm"}})}})}})},subComponents:{item:e.createSubComponentConfig({label:"Item",description:"",variants:{variant:e.createVariantConfigWithComponentStates({label:"variant",description:"",isConfigurable:!0,options:["default"],default:"default",componentStates:{active:e.createComponentStates({label:"active",options:["on","off"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",pseudoStates:["hover","focused"],label:"background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand-secondary"}})}}),text:e.createLayerConfig({label:"text",properties:{color:e.createConfigurableProperty({name:"color",label:"Text color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{default:"label2"}})}}),icon:e.createLayerConfig({label:"icon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}})}})}})}})}}),itemCheckbox:e.createSubComponentConfig({label:"ItemCheckbox",description:"",variants:{variant:e.createVariantConfigWithComponentStates({label:"variant",description:"",isConfigurable:!0,options:["default"],default:"default",componentStates:{active:e.createComponentStates({label:"active",options:["on","off"],layers:{root:e.createLayerConfig({label:"root",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"background color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand-secondary"}})}}),text:e.createLayerConfig({label:"text",properties:{textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{default:"label2"}}),color:e.createConfigurableProperty({name:"color",label:"Text color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}})}}),startIcon:e.createLayerConfig({label:"startIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}})}}),endIcon:e.createLayerConfig({label:"endIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",pseudoStates:["hover","focused"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}})}})}})}})}}),divider:e.createSubComponentConfig({label:"divider",description:"",variants:{variant:e.createVariantConfigWithProperties({label:"variant",description:"",isConfigurable:!0,options:["default"],default:"default",layers:{root:e.createLayerConfig({label:"root",properties:{}}),text:e.createLayerConfig({label:"text",properties:{color:e.createConfigurableProperty({name:"color",label:"group label text color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"muted"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Group label",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{default:"label3"}})}})}})}})}};var p={label:"Radio",description:"Component for demo purposes and testing the automation",variants:{variant:e.createVariantConfigWithComponentStates({label:"Variant",description:"Preview the colors, spacing values, and motion effects of your component at their default size.",isConfigurable:!0,options:["primary","secondary","alert","alert-secondary"],default:"primary",componentStates:{value:e.createComponentStates({label:"value",options:["checked","unchecked"],layers:{root:e.createLayerConfig({label:"root",properties:{color:e.createConfigurableProperty({name:"color",label:"Label color",typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"primary",secondary:"secondary",alert:"alert","alert-secondary":"alert-secondary"}})}}),radio:e.createLayerConfig({label:"radio",properties:{borderColor:e.createConfigurableProperty({name:"borderColor",label:"Radio border color",typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"tertiary",secondary:"secondary",alert:"alert","alert-secondary":"alert-secondary"}}),backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Radio background color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"secondary",secondary:"secondary",alert:"secondary","alert-secondary":"secondary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover","pressed"],defaults:{primary:"2xl",secondary:"xl",alert:"xl","alert-secondary":"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover","pressed"],defaults:{primary:"2xl-invert",secondary:"md-invert",alert:"xl","alert-secondary":"xl-invert"}})}}),radioCircle:e.createLayerConfig({label:"radioCircle",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Radio circle color",typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],pseudoStates:["hover","pressed"],defaults:{primary:"brand",secondary:"brand-secondary",alert:"alert","alert-secondary":"alert-secondary"}})}})}})}}),size:e.createVariantConfigWithProperties({label:"Size",description:"These sizes will apply across all variants",isConfigurable:!0,default:"sm",options:["sm","md"],layers:{root:e.createLayerConfig({label:"root",properties:{gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"2",md:"2.5"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{sm:"label4",md:"label2"}})}}),radio:e.createLayerConfig({label:"radio",properties:{borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Radio border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],defaults:{sm:"thin",md:"thin"}}),height:e.createConfigurableProperty({name:"height",label:"Radio height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"5"}}),width:e.createConfigurableProperty({name:"width",label:"Radio width",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"5"}})}})}})}};var c={label:"Switch",description:"A switch is a toggle control that lets users turn a setting on or off. It’s commonly used for binary actions like enabling or disabling a feature.",variants:{variant:e.createVariantConfigWithComponentStates({label:"Variant",description:"A switch is a toggle control that lets users turn a setting on or off. It’s commonly used for binary actions like enabling or disabling a feature.",default:"default",options:["default"],isConfigurable:!0,componentStates:{active:e.createComponentStates({label:"active",options:["on","off"],layers:{root:e.createLayerConfig({label:"root",properties:{labelColor:e.createConfigurableProperty({name:"color",label:"Label color",pseudoStates:["hover"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"secondary"}})}}),switch:e.createLayerConfig({label:"switch",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Track background color",pseudoStates:["hover"],typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}}),borderColor:e.createConfigurableProperty({name:"borderColor",label:"Track border color",pseudoStates:["hover"],typeOfFixture:["spectrumColors","linePaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.linePaletteColors,a.alwaysPaletteAliases],defaults:{default:"brand"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover"],defaults:{default:"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover"],defaults:{default:"2xl-invert"}})}}),handle:e.createLayerConfig({label:"handle",properties:{backgroundColor:e.createConfigurableProperty({name:"backgroundColor",label:"Handle color",pseudoStates:["hover"],typeOfFixture:["spectrumColors","backgroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.backgroundPaletteColors,a.alwaysPaletteAliases],defaults:{default:"primary"}}),shadow:e.createConfigurableProperty({name:"shadow",label:"Drop shadow",typeOfFixture:["shadowVariants"],supportsCustom:!0,values:[a.shadowVariants],pseudoStates:["hover"],defaults:{default:"xl"}}),insetShadow:e.createConfigurableProperty({name:"insetShadow",label:"Inset shadow",typeOfFixture:["shadowVariantsWithInvert"],supportsCustom:!0,values:[a.shadowVariantsWithInvert],pseudoStates:["hover"],defaults:{default:"2xl-invert"}})}}),handleIcon:e.createLayerConfig({label:"handleIcon",properties:{color:e.createConfigurableProperty({name:"color",label:"Icon color",pseudoStates:["hover"],typeOfFixture:["spectrumColors","foregroundPaletteColors","alwaysPaletteAliases"],values:[a.spectrumColors,a.foregroundPaletteColors],defaults:{default:"brand"}})}})}})}}),size:e.createVariantConfigWithProperties({label:"Size",description:"These sizes will apply across all variants",isConfigurable:!0,default:"md",options:["sm","md"],layers:{root:e.createLayerConfig({label:"root",properties:{spacingHorizontal:e.createConfigurableProperty({name:"spacingHorizontal",label:"Spacing horizontal",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"0",md:"0"}}),spacingVertical:e.createConfigurableProperty({name:"spacingVertical",label:"Spacing vertical",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"1",md:"1.5"}}),gap:e.createConfigurableProperty({name:"gap",label:"Gap",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"2",md:"2"}}),textVariant:e.createConfigurableProperty({name:"textVariant",label:"Text variant",typeOfFixture:["textVariants"],values:[a.textVariants],defaults:{sm:"label4",md:"label2"}})}}),switch:e.createLayerConfig({label:"switch",properties:{height:e.createConfigurableProperty({name:"height",label:"Track height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"5",md:"7"}}),width:e.createConfigurableProperty({name:"width",label:"Track width",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"8",md:"12"}}),borderWidth:e.createConfigurableProperty({name:"borderWidth",label:"Track border width",typeOfFixture:["borderWidths"],values:[a.borderWidths],defaults:{sm:"none",md:"none"}}),padding:e.createConfigurableProperty({name:"padding",label:"Track padding",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"0.5",md:"0.5"}})}}),handle:e.createLayerConfig({label:"Handle",properties:{height:e.createConfigurableProperty({name:"height",label:"Track height",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"6"}}),width:e.createConfigurableProperty({name:"width",label:"Track width",typeOfFixture:["spacingAliases"],values:[a.spacingAliases],defaults:{sm:"4",md:"6"}})}}),handleIcon:e.createLayerConfig({label:"Icon",properties:{size:e.createConfigurableProperty({name:"iconSize",label:"Icon size",typeOfFixture:["iconSizes"],values:[a.iconSizes],defaults:{sm:"sm",md:"sm"}})}})}})}};exports.AvatarConfig=r,exports.BadgeConfig=t,exports.CheckboxConfig=o,exports.ChipConfig=l,exports.DividerConfig=s,exports.InputConfig=i,exports.LinkConfig=n,exports.MenuConfig=d,exports.RadioConfig=p,exports.SwitchConfig=c;

package/dist/tokens/automation/configs.d.cts ADDED Viewed

@@ -0,0 +1,110 @@
+import { e as VariantConfigWithProperties, d as SubComponentConfig, f as VariantConfigWithComponentStates } from '../../index-By9VJ9yq.cjs';
+import '@yahoo/uds/fixtures';
+import '../../types-oxQ-ciqn.cjs';
+import '@yahoo/uds-icons/types';
+import 'motion/react';
+import 'react';
+import 'type-fest';
+declare const AvatarConfig: {
+    label: string;
+    description: string;
+    variants: {
+        size: VariantConfigWithProperties<string>;
+    };
+    subComponents: {
+        text: SubComponentConfig;
+        image: SubComponentConfig;
+        icon: SubComponentConfig;
+    };
+};
+declare const BadgeConfig: {
+    label: string;
+    description: string;
+    variants: {
+        size: VariantConfigWithProperties<string>;
+        variant: VariantConfigWithProperties<string>;
+    };
+};
+declare const CheckboxConfig: {
+    label: string;
+    description: string;
+    variants: {
+        size: VariantConfigWithProperties<string>;
+        variant: VariantConfigWithComponentStates<string>;
+    };
+};
+declare const ChipConfig: {
+    label: string;
+    description: string;
+    subComponents: {
+        toggle: SubComponentConfig;
+        dismissible: SubComponentConfig;
+        link: SubComponentConfig;
+    };
+    variants: {
+        size: VariantConfigWithProperties<string>;
+    };
+};
+declare const DividerConfig: {
+    label: string;
+    description: string;
+    variants: {
+        variant: VariantConfigWithProperties<string>;
+    };
+};
+declare const InputConfig: {
+    label: string;
+    description: string;
+    variants: {
+        size: VariantConfigWithProperties<string>;
+        variant: VariantConfigWithComponentStates<string>;
+    };
+};
+declare const LinkConfig: {
+    label: string;
+    description: string;
+    variants: {
+        textStyle: VariantConfigWithProperties<string>;
+        variant: VariantConfigWithProperties<string>;
+    };
+};
+declare const MenuConfig: {
+    label: string;
+    description: string;
+    variants: {
+        size: VariantConfigWithProperties<string>;
+    };
+    subComponents: {
+        item: SubComponentConfig;
+        itemCheckbox: SubComponentConfig;
+        divider: SubComponentConfig;
+    };
+};
+declare const RadioConfig: {
+    label: string;
+    description: string;
+    variants: {
+        variant: VariantConfigWithComponentStates<string>;
+        size: VariantConfigWithProperties<string>;
+    };
+};
+declare const SwitchConfig: {
+    label: string;
+    description: string;
+    variants: {
+        variant: VariantConfigWithComponentStates<string>;
+        size: VariantConfigWithProperties<string>;
+    };
+};
+export { AvatarConfig, BadgeConfig, CheckboxConfig, ChipConfig, DividerConfig, InputConfig, LinkConfig, MenuConfig, RadioConfig, SwitchConfig };