@yahoo/uds 3.66.1 → 3.67.0-beta.2

package/dist/tokens/automation/configs/chip.js

@@ -0,0 +1,551 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { createComponentStates, createConfigurableProperty, createLayerConfig, createSubComponentConfig, createVariantConfigWithComponentStates, createVariantConfigWithProperties } from "../utils/index.js";
+import { alwaysPaletteAliases, backgroundPaletteColors, borderRadii, borderWidths, foregroundPaletteColors, iconSizes, linePaletteColors, shadowVariants, shadowVariantsWithInvert, spacingAliases, spectrumColors, textVariants } from "@yahoo/uds/fixtures";
+
+//#region src/tokens/automation/configs/chip.ts
+function defineComponentConfig(config) {
+	return config;
+}
+const ChipConfig = defineComponentConfig({
+	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: createSubComponentConfig({
+			label: "Toggle",
+			description: "",
+			variants: { variant: createVariantConfigWithComponentStates({
+				label: "Variant",
+				description: "",
+				isConfigurable: true,
+				default: "primary",
+				options: [
+					"primary",
+					"secondary",
+					"brand",
+					"brand-secondary"
+				],
+				componentStates: { active: createComponentStates({
+					label: "active",
+					options: ["on", "off"],
+					layers: {
+						root: createLayerConfig({
+							label: "root",
+							properties: {
+								backgroundColor: createConfigurableProperty({
+									name: "backgroundColor",
+									label: "Background color",
+									typeOfFixture: [
+										"spectrumColors",
+										"backgroundPaletteColors",
+										"alwaysPaletteAliases"
+									],
+									values: [
+										spectrumColors,
+										backgroundPaletteColors,
+										alwaysPaletteAliases
+									],
+									pseudoStates: ["hover", "pressed"],
+									defaults: {
+										primary: "primary",
+										secondary: "secondary",
+										brand: "secondary",
+										"brand-secondary": "secondary"
+									}
+								}),
+								color: createConfigurableProperty({
+									name: "color",
+									label: "Text color",
+									typeOfFixture: [
+										"spectrumColors",
+										"foregroundPaletteColors",
+										"alwaysPaletteAliases"
+									],
+									values: [
+										spectrumColors,
+										foregroundPaletteColors,
+										alwaysPaletteAliases
+									],
+									pseudoStates: ["hover", "pressed"],
+									defaults: {
+										primary: "primary",
+										secondary: "secondary",
+										brand: "secondary",
+										"brand-secondary": "secondary"
+									}
+								}),
+								borderWidth: createConfigurableProperty({
+									name: "borderWidth",
+									label: "Border width",
+									typeOfFixture: ["borderWidths"],
+									pseudoStates: ["hover", "pressed"],
+									values: [borderWidths],
+									defaults: {
+										primary: "thin",
+										secondary: "none",
+										brand: "none",
+										"brand-secondary": "none"
+									}
+								}),
+								borderColor: createConfigurableProperty({
+									name: "borderColor",
+									label: "Border color",
+									typeOfFixture: [
+										"spectrumColors",
+										"linePaletteColors",
+										"alwaysPaletteAliases"
+									],
+									values: [
+										spectrumColors,
+										linePaletteColors,
+										alwaysPaletteAliases
+									],
+									pseudoStates: ["hover", "pressed"],
+									defaults: {
+										primary: "primary",
+										secondary: "secondary",
+										brand: "brand",
+										"brand-secondary": "brand-secondary"
+									}
+								}),
+								shadow: createConfigurableProperty({
+									name: "shadow",
+									label: "Drop shadow",
+									typeOfFixture: ["shadowVariants"],
+									supportsCustom: true,
+									values: [shadowVariants],
+									pseudoStates: ["hover", "pressed"],
+									defaults: {
+										primary: "2xl",
+										secondary: "xl",
+										brand: "md",
+										"brand-secondary": "xl"
+									}
+								}),
+								insetShadow: createConfigurableProperty({
+									name: "insetShadow",
+									label: "Inset shadow",
+									typeOfFixture: ["shadowVariantsWithInvert"],
+									supportsCustom: true,
+									values: [shadowVariantsWithInvert],
+									pseudoStates: ["hover", "pressed"],
+									defaults: {
+										primary: "2xl-invert",
+										secondary: "md-invert",
+										brand: "md",
+										"brand-secondary": "xl"
+									}
+								})
+							}
+						}),
+						icon: createLayerConfig({
+							label: "icon",
+							properties: { color: createConfigurableProperty({
+								name: "color",
+								label: "Icon color",
+								typeOfFixture: [
+									"spectrumColors",
+									"foregroundPaletteColors",
+									"alwaysPaletteAliases"
+								],
+								pseudoStates: ["hover", "pressed"],
+								values: [
+									spectrumColors,
+									foregroundPaletteColors,
+									alwaysPaletteAliases
+								],
+								defaults: {
+									primary: "primary",
+									secondary: "secondary",
+									brand: "brand",
+									"brand-secondary": "brand-secondary"
+								}
+							}) }
+						})
+					}
+				}) }
+			}) }
+		}),
+		dismissible: createSubComponentConfig({
+			label: "Dismissible",
+			description: "",
+			variants: { variant: createVariantConfigWithProperties({
+				label: "Variant",
+				description: "",
+				isConfigurable: true,
+				default: "primary",
+				options: [
+					"primary",
+					"secondary",
+					"brand",
+					"brand-secondary"
+				],
+				layers: {
+					root: createLayerConfig({
+						label: "root",
+						properties: {
+							backgroundColor: createConfigurableProperty({
+								name: "backgroundColor",
+								label: "Background color",
+								typeOfFixture: [
+									"spectrumColors",
+									"backgroundPaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									backgroundPaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "gray-4",
+									secondary: "blue-4",
+									brand: "red-4",
+									"brand-secondary": "purple-4"
+								}
+							}),
+							color: createConfigurableProperty({
+								name: "color",
+								label: "Text color",
+								typeOfFixture: [
+									"spectrumColors",
+									"foregroundPaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									foregroundPaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "gray-9",
+									secondary: "blue-9",
+									brand: "red-9",
+									"brand-secondary": "red-4"
+								}
+							}),
+							borderWidth: createConfigurableProperty({
+								name: "borderWidth",
+								label: "Border width",
+								typeOfFixture: ["borderWidths"],
+								pseudoStates: ["hover", "pressed"],
+								values: [borderWidths],
+								defaults: {
+									primary: "thin",
+									secondary: "none",
+									brand: "none",
+									"brand-secondary": "none"
+								}
+							}),
+							borderColor: createConfigurableProperty({
+								name: "borderColor",
+								label: "Border color",
+								typeOfFixture: [
+									"spectrumColors",
+									"linePaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									linePaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "primary",
+									secondary: "secondary",
+									brand: "brand",
+									"brand-secondary": "brand-secondary"
+								}
+							}),
+							shadow: createConfigurableProperty({
+								name: "shadow",
+								label: "Drop shadow",
+								typeOfFixture: ["shadowVariants"],
+								supportsCustom: true,
+								values: [shadowVariants],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "2xl",
+									secondary: "xl",
+									brand: "md",
+									"brand-secondary": "xl"
+								}
+							}),
+							insetShadow: createConfigurableProperty({
+								name: "insetShadow",
+								label: "Inset shadow",
+								typeOfFixture: ["shadowVariantsWithInvert"],
+								supportsCustom: true,
+								values: [shadowVariantsWithInvert],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "2xl-invert",
+									secondary: "md-invert",
+									brand: "md",
+									"brand-secondary": "xl"
+								}
+							})
+						}
+					}),
+					icon: createLayerConfig({
+						label: "icon",
+						properties: { color: createConfigurableProperty({
+							name: "color",
+							label: "Icon color",
+							typeOfFixture: [
+								"spectrumColors",
+								"foregroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								foregroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							pseudoStates: ["hover", "pressed"],
+							defaults: {
+								primary: "primary",
+								secondary: "secondary",
+								brand: "brand",
+								"brand-secondary": "brand-secondary"
+							}
+						}) }
+					})
+				}
+			}) }
+		}),
+		link: createSubComponentConfig({
+			label: "Link",
+			description: "",
+			variants: { variant: createVariantConfigWithProperties({
+				label: "Variant",
+				description: "",
+				isConfigurable: true,
+				default: "primary",
+				options: [
+					"primary",
+					"secondary",
+					"brand",
+					"brand-secondary"
+				],
+				layers: {
+					root: createLayerConfig({
+						label: "root",
+						properties: {
+							backgroundColor: createConfigurableProperty({
+								name: "backgroundColor",
+								label: "Background color",
+								typeOfFixture: [
+									"spectrumColors",
+									"backgroundPaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									backgroundPaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "primary",
+									secondary: "secondary",
+									brand: "secondary",
+									"brand-secondary": "secondary"
+								}
+							}),
+							color: createConfigurableProperty({
+								name: "color",
+								label: "Text color",
+								typeOfFixture: [
+									"spectrumColors",
+									"foregroundPaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									foregroundPaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "primary",
+									secondary: "secondary",
+									brand: "secondary",
+									"brand-secondary": "secondary"
+								}
+							}),
+							borderWidth: createConfigurableProperty({
+								name: "borderWidth",
+								label: "Border width",
+								typeOfFixture: ["borderWidths"],
+								values: [borderWidths],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "thin",
+									secondary: "none",
+									brand: "none",
+									"brand-secondary": "none"
+								}
+							}),
+							borderColor: createConfigurableProperty({
+								name: "borderColor",
+								label: "Border color",
+								typeOfFixture: [
+									"spectrumColors",
+									"linePaletteColors",
+									"alwaysPaletteAliases"
+								],
+								values: [
+									spectrumColors,
+									linePaletteColors,
+									alwaysPaletteAliases
+								],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "primary",
+									secondary: "secondary",
+									brand: "brand",
+									"brand-secondary": "brand-secondary"
+								}
+							}),
+							shadow: createConfigurableProperty({
+								name: "shadow",
+								label: "Drop shadow",
+								typeOfFixture: ["shadowVariants"],
+								supportsCustom: true,
+								values: [shadowVariants],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "2xl",
+									secondary: "xl",
+									brand: "md",
+									"brand-secondary": "xl"
+								}
+							}),
+							insetShadow: createConfigurableProperty({
+								name: "insetShadow",
+								label: "Inset shadow",
+								typeOfFixture: ["shadowVariantsWithInvert"],
+								supportsCustom: true,
+								values: [shadowVariantsWithInvert],
+								pseudoStates: ["hover", "pressed"],
+								defaults: {
+									primary: "2xl-invert",
+									secondary: "md-invert",
+									brand: "md",
+									"brand-secondary": "xl"
+								}
+							})
+						}
+					}),
+					icon: createLayerConfig({
+						label: "icon",
+						properties: { color: createConfigurableProperty({
+							name: "color",
+							label: "Icon color",
+							typeOfFixture: [
+								"spectrumColors",
+								"foregroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								foregroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							pseudoStates: ["hover", "pressed"],
+							defaults: {
+								primary: "primary",
+								secondary: "secondary",
+								brand: "brand",
+								"brand-secondary": "brand-secondary"
+							}
+						}) }
+					})
+				}
+			}) }
+		})
+	},
+	variants: { size: createVariantConfigWithProperties({
+		label: "Size",
+		description: "These sizes will apply across all variants",
+		isConfigurable: true,
+		default: "md",
+		options: ["sm", "md"],
+		layers: {
+			root: createLayerConfig({
+				label: "root",
+				properties: {
+					spacingHorizontal: createConfigurableProperty({
+						name: "spacingHorizontal",
+						label: "Spacing horizontal",
+						typeOfFixture: ["spacingAliases"],
+						values: [spacingAliases],
+						defaults: {
+							sm: "3",
+							md: "3"
+						}
+					}),
+					spacingVertical: createConfigurableProperty({
+						name: "spacingVertical",
+						label: "Spacing vertical",
+						typeOfFixture: ["spacingAliases"],
+						values: [spacingAliases],
+						defaults: {
+							sm: "1",
+							md: "1.5"
+						}
+					}),
+					gap: createConfigurableProperty({
+						name: "gap",
+						label: "Gap",
+						typeOfFixture: ["spacingAliases"],
+						values: [spacingAliases],
+						defaults: {
+							sm: "2",
+							md: "2"
+						}
+					}),
+					textVariant: createConfigurableProperty({
+						name: "textVariant",
+						label: "Text variant",
+						typeOfFixture: ["textVariants"],
+						values: [textVariants],
+						defaults: {
+							sm: "label1",
+							md: "label1"
+						}
+					}),
+					borderRadius: createConfigurableProperty({
+						name: "borderRadius",
+						label: "Border radius",
+						typeOfFixture: ["borderRadii"],
+						values: [borderRadii],
+						defaults: {
+							sm: "full",
+							md: "full"
+						}
+					})
+				}
+			}),
+			icon: createLayerConfig({
+				label: "icon",
+				properties: { size: createConfigurableProperty({
+					name: "iconSize",
+					label: "Icon size",
+					typeOfFixture: ["iconSizes"],
+					values: [iconSizes],
+					defaults: {
+						sm: "sm",
+						md: "md"
+					}
+				}) }
+			})
+		}
+	}) }
+});
+
+//#endregion
+export { ChipConfig };

package/dist/tokens/automation/configs/divider.cjs

@@ -0,0 +1,119 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
+const require_tokens_automation_utils_index = require('../utils/index.cjs');
+let __yahoo_uds_fixtures = require("@yahoo/uds/fixtures");
+
+//#region src/tokens/automation/configs/divider.ts
+function defineComponentConfig(config) {
+	return config;
+}
+const DividerConfig = defineComponentConfig({
+	label: "Divider",
+	description: "Divider lines are purely decorative and non-interactive, serving as a visual guide. Use as horizontal and vertical lines.",
+	variants: { variant: require_tokens_automation_utils_index.createVariantConfigWithProperties({
+		label: "Variant",
+		description: "",
+		isConfigurable: true,
+		default: "primary",
+		options: [
+			"primary",
+			"secondary",
+			"tertiary",
+			"muted"
+		],
+		layers: {
+			root: require_tokens_automation_utils_index.createLayerConfig({
+				label: "root",
+				properties: { gap: require_tokens_automation_utils_index.createConfigurableProperty({
+					name: "gap",
+					label: "Gap",
+					typeOfFixture: ["spacingAliases"],
+					values: [__yahoo_uds_fixtures.spacingAliases],
+					defaults: {
+						primary: "2",
+						secondary: "2",
+						tertiary: "2",
+						muted: "2"
+					}
+				}) }
+			}),
+			line: require_tokens_automation_utils_index.createLayerConfig({
+				label: "line",
+				properties: {
+					borderWidth: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "borderWidth",
+						label: "Thickness",
+						typeOfFixture: ["borderWidths"],
+						values: [__yahoo_uds_fixtures.borderWidths.filter((width) => width !== "none")],
+						defaults: {
+							primary: "thin",
+							secondary: "thin",
+							tertiary: "thin",
+							muted: "thin"
+						}
+					}),
+					borderColor: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "borderColor",
+						label: "Border color",
+						typeOfFixture: [
+							"spectrumColors",
+							"linePaletteColors",
+							"alwaysPaletteAliases"
+						],
+						values: [
+							__yahoo_uds_fixtures.spectrumColors,
+							__yahoo_uds_fixtures.linePaletteColors,
+							__yahoo_uds_fixtures.alwaysPaletteAliases
+						],
+						defaults: {
+							primary: "primary",
+							secondary: "secondary",
+							tertiary: "tertiary",
+							muted: "muted"
+						}
+					})
+				}
+			}),
+			label: require_tokens_automation_utils_index.createLayerConfig({
+				label: "label",
+				properties: {
+					textVariant: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "textVariant",
+						label: "text variant",
+						typeOfFixture: ["textVariants"],
+						values: [__yahoo_uds_fixtures.textVariants],
+						defaults: {
+							primary: "label3",
+							secondary: "label3",
+							tertiary: "label3",
+							muted: "label3"
+						}
+					}),
+					color: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "color",
+						label: "Text color",
+						typeOfFixture: [
+							"spectrumColors",
+							"foregroundPaletteColors",
+							"alwaysPaletteAliases"
+						],
+						values: [
+							__yahoo_uds_fixtures.spectrumColors,
+							__yahoo_uds_fixtures.foregroundPaletteColors,
+							__yahoo_uds_fixtures.alwaysPaletteAliases
+						],
+						defaults: {
+							primary: "primary",
+							secondary: "secondary",
+							tertiary: "tertiary",
+							muted: "muted"
+						}
+					})
+				}
+			})
+		}
+	}) }
+});
+
+//#endregion
+exports.DividerConfig = DividerConfig;

package/dist/tokens/automation/configs/divider.d.cts

@@ -0,0 +1,13 @@
+import { VariantConfigWithProperties } from "../types/ComponentConfig.cjs";
+import "../../index.cjs";
+
+//#region src/tokens/automation/configs/divider.d.ts
+declare const DividerConfig: {
+  label: string;
+  description: string;
+  variants: {
+    variant: VariantConfigWithProperties<string>;
+  };
+};
+//#endregion
+export { DividerConfig };

package/dist/tokens/automation/configs/divider.d.ts

@@ -0,0 +1,13 @@
+import { VariantConfigWithProperties } from "../types/ComponentConfig.js";
+import "../../index.js";
+
+//#region src/tokens/automation/configs/divider.d.ts
+declare const DividerConfig: {
+  label: string;
+  description: string;
+  variants: {
+    variant: VariantConfigWithProperties<string>;
+  };
+};
+//#endregion
+export { DividerConfig };