@yahoo/uds 3.66.1 → 3.67.0-beta.2

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

@@ -0,0 +1,309 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { createConfigurableProperty, createLayerConfig, createSubComponentConfig, createVariantConfigWithProperties } from "../utils/index.js";
+import { alwaysPaletteAliases, backgroundPaletteColors, borderRadii, borderWidths, foregroundPaletteColors, iconSizes, linePaletteColors, spacingAliases, spectrumColors, textVariants } from "@yahoo/uds/fixtures";
+
+//#region src/tokens/automation/configs/avatar.ts
+function defineComponentConfig(config) {
+	return config;
+}
+const AvatarConfig = defineComponentConfig({
+	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: createVariantConfigWithProperties({
+		label: "Size",
+		description: "These sizes will apply across all variants",
+		isConfigurable: true,
+		default: "md",
+		options: [
+			"xs",
+			"sm",
+			"md",
+			"lg",
+			"xl"
+		],
+		layers: {
+			root: createLayerConfig({
+				label: "root",
+				properties: {
+					height: createConfigurableProperty({
+						name: "height",
+						label: "Height",
+						typeOfFixture: ["spacingAliases"],
+						values: [spacingAliases],
+						defaults: {
+							xs: "6",
+							sm: "7",
+							md: "10",
+							lg: "12",
+							xl: "16"
+						}
+					}),
+					width: createConfigurableProperty({
+						name: "width",
+						label: "Width",
+						typeOfFixture: ["spacingAliases"],
+						values: [spacingAliases],
+						defaults: {
+							xs: "6",
+							sm: "7",
+							md: "10",
+							lg: "12",
+							xl: "16"
+						}
+					}),
+					borderWidth: createConfigurableProperty({
+						name: "borderWidth",
+						label: "Border width",
+						typeOfFixture: ["borderWidths"],
+						values: [borderWidths],
+						defaults: {
+							xs: "thin",
+							sm: "thin",
+							md: "thin",
+							lg: "thin",
+							xl: "thin"
+						}
+					}),
+					textVariant: createConfigurableProperty({
+						name: "textVariant",
+						label: "Text variant",
+						typeOfFixture: ["textVariants"],
+						values: [textVariants],
+						defaults: {
+							xs: "caption1",
+							sm: "caption2",
+							md: "headline1",
+							lg: "title4",
+							xl: "title3"
+						}
+					})
+				}
+			}),
+			icon: createLayerConfig({
+				label: "icon",
+				properties: { iconSize: createConfigurableProperty({
+					name: "iconSize",
+					label: "Icon size",
+					typeOfFixture: ["iconSizes"],
+					values: [iconSizes],
+					defaults: {
+						xs: "sm",
+						sm: "sm",
+						md: "md",
+						lg: "lg",
+						xl: "lg"
+					}
+				}) }
+			})
+		}
+	}) },
+	subComponents: {
+		text: createSubComponentConfig({
+			label: "Text",
+			description: "",
+			variants: { variant: createVariantConfigWithProperties({
+				label: "Variant",
+				description: "Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",
+				isConfigurable: true,
+				options: ["primary", "secondary"],
+				default: "primary",
+				layers: { root: createLayerConfig({
+					label: "root",
+					properties: {
+						color: createConfigurableProperty({
+							name: "color",
+							label: "text color",
+							typeOfFixture: [
+								"spectrumColors",
+								"foregroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								foregroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "brand",
+								secondary: "secondary"
+							}
+						}),
+						backgroundColor: createConfigurableProperty({
+							name: "backgroundColor",
+							label: "background color",
+							typeOfFixture: [
+								"spectrumColors",
+								"backgroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								backgroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "primary",
+								secondary: "secondary"
+							}
+						}),
+						borderColor: createConfigurableProperty({
+							name: "borderColor",
+							label: "border color",
+							typeOfFixture: [
+								"spectrumColors",
+								"linePaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								linePaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "brand",
+								secondary: "secondary"
+							}
+						}),
+						borderRadius: createConfigurableProperty({
+							name: "borderRadius",
+							label: "Border radius",
+							typeOfFixture: ["borderRadii"],
+							values: [borderRadii],
+							defaults: {
+								primary: "full",
+								secondary: "sm"
+							}
+						})
+					}
+				}) }
+			}) }
+		}),
+		image: createSubComponentConfig({
+			label: "Image",
+			description: "",
+			variants: { variant: createVariantConfigWithProperties({
+				label: "Variant",
+				description: "Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",
+				isConfigurable: true,
+				options: ["primary", "secondary"],
+				default: "primary",
+				layers: { root: createLayerConfig({
+					label: "root",
+					properties: {
+						borderColor: createConfigurableProperty({
+							name: "borderColor",
+							label: "border color",
+							typeOfFixture: [
+								"spectrumColors",
+								"linePaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								linePaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "muted",
+								secondary: "muted"
+							}
+						}),
+						borderRadius: createConfigurableProperty({
+							name: "borderRadius",
+							label: "border radius",
+							typeOfFixture: ["borderRadii"],
+							values: [borderRadii],
+							defaults: {
+								primary: "full",
+								secondary: "sm"
+							}
+						})
+					}
+				}) }
+			}) }
+		}),
+		icon: createSubComponentConfig({
+			label: "Icon",
+			description: "",
+			variants: { variant: createVariantConfigWithProperties({
+				label: "Variant",
+				description: "Shapes and sizes defined here will be applied across the entire family of Avatar (Icon, Image, Text)",
+				isConfigurable: true,
+				options: ["primary", "secondary"],
+				default: "primary",
+				layers: { root: createLayerConfig({
+					label: "root",
+					properties: {
+						color: createConfigurableProperty({
+							name: "color",
+							label: "icon color",
+							typeOfFixture: [
+								"spectrumColors",
+								"foregroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								foregroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "muted",
+								secondary: "muted"
+							}
+						}),
+						backgroundColor: createConfigurableProperty({
+							name: "backgroundColor",
+							label: "background color",
+							typeOfFixture: [
+								"spectrumColors",
+								"backgroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								backgroundPaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "secondary",
+								secondary: "secondary"
+							}
+						}),
+						borderColor: createConfigurableProperty({
+							name: "borderColor",
+							label: "border color",
+							typeOfFixture: [
+								"spectrumColors",
+								"linePaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								spectrumColors,
+								linePaletteColors,
+								alwaysPaletteAliases
+							],
+							defaults: {
+								primary: "primary",
+								secondary: "primary"
+							}
+						}),
+						borderRadius: createConfigurableProperty({
+							name: "borderRadius",
+							label: "border radius",
+							typeOfFixture: ["borderRadii"],
+							values: [borderRadii],
+							defaults: {
+								primary: "full",
+								secondary: "sm"
+							}
+						})
+					}
+				}) }
+			}) }
+		})
+	}
+});
+
+//#endregion
+export { AvatarConfig };

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

@@ -0,0 +1,324 @@
+/*! © 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/badge.ts
+function defineComponentConfig(config) {
+	return config;
+}
+const BadgeConfig = defineComponentConfig({
+	label: "Badge",
+	description: "Component for demo purposes and testing the automation",
+	variants: {
+		size: require_tokens_automation_utils_index.createVariantConfigWithProperties({
+			label: "Size",
+			description: "These sizes will apply across all variants",
+			isConfigurable: true,
+			default: "md",
+			options: [
+				"xs",
+				"sm",
+				"md",
+				"lg"
+			],
+			layers: {
+				root: require_tokens_automation_utils_index.createLayerConfig({
+					label: "root",
+					properties: {
+						spacingHorizontal: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "spacingHorizontal",
+							label: "Spacing horizontal",
+							typeOfFixture: ["spacingAliases"],
+							values: [__yahoo_uds_fixtures.spacingAliases],
+							defaults: {
+								xs: "2",
+								sm: "4",
+								md: "6",
+								lg: "8"
+							}
+						}),
+						spacingVertical: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "spacingVertical",
+							label: "Spacing vertical",
+							typeOfFixture: ["spacingAliases"],
+							values: [__yahoo_uds_fixtures.spacingAliases],
+							defaults: {
+								xs: "0.5",
+								sm: "1",
+								md: "1.5",
+								lg: "2"
+							}
+						}),
+						gap: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "gap",
+							label: "Gap",
+							typeOfFixture: ["spacingAliases"],
+							values: [__yahoo_uds_fixtures.spacingAliases],
+							defaults: {
+								xs: "2",
+								sm: "4",
+								md: "6",
+								lg: "8"
+							}
+						}),
+						textVariant: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "textVariant",
+							label: "Text variant",
+							typeOfFixture: ["textVariants"],
+							values: [__yahoo_uds_fixtures.textVariants],
+							defaults: {
+								xs: "label4",
+								sm: "label3",
+								md: "label2",
+								lg: "label1"
+							}
+						})
+					}
+				}),
+				icon: require_tokens_automation_utils_index.createLayerConfig({
+					label: "icon",
+					properties: { size: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "iconSize",
+						label: "Icon size",
+						typeOfFixture: ["iconSizes"],
+						values: [__yahoo_uds_fixtures.iconSizes],
+						defaults: {
+							xs: "sm",
+							sm: "sm",
+							md: "md",
+							lg: "lg"
+						}
+					}) }
+				})
+			}
+		}),
+		variant: require_tokens_automation_utils_index.createVariantConfigWithProperties({
+			label: "Variants",
+			description: "",
+			isConfigurable: true,
+			default: "primary",
+			options: [
+				"primary",
+				"secondary",
+				"brand",
+				"brand-secondary",
+				"alert",
+				"alert-secondary",
+				"warning",
+				"warning-secondary",
+				"positive",
+				"positive-secondary",
+				"info",
+				"info-secondary"
+			],
+			layers: {
+				root: require_tokens_automation_utils_index.createLayerConfig({
+					label: "root",
+					properties: {
+						backgroundColor: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "backgroundColor",
+							label: "Background color",
+							typeOfFixture: [
+								"spectrumColors",
+								"backgroundPaletteColors",
+								"alwaysPaletteAliases"
+							],
+							values: [
+								__yahoo_uds_fixtures.spectrumColors,
+								__yahoo_uds_fixtures.backgroundPaletteColors,
+								__yahoo_uds_fixtures.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: 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",
+								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: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "borderWidth",
+							label: "Border width",
+							typeOfFixture: ["borderWidths"],
+							values: [__yahoo_uds_fixtures.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: 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",
+								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: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "borderRadius",
+							label: "Border radius",
+							typeOfFixture: ["borderRadii"],
+							values: [__yahoo_uds_fixtures.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: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "shadow",
+							label: "Drop shadow",
+							typeOfFixture: ["shadowVariants"],
+							supportsCustom: true,
+							values: [__yahoo_uds_fixtures.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: require_tokens_automation_utils_index.createConfigurableProperty({
+							name: "insetShadow",
+							label: "Inset shadow",
+							typeOfFixture: ["shadowVariantsWithInvert"],
+							supportsCustom: true,
+							values: [__yahoo_uds_fixtures.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: require_tokens_automation_utils_index.createLayerConfig({
+					label: "icon",
+					properties: { color: require_tokens_automation_utils_index.createConfigurableProperty({
+						name: "color",
+						label: "Icon color",
+						typeOfFixture: [
+							"spectrumColors",
+							"foregroundPaletteColors",
+							"alwaysPaletteAliases"
+						],
+						values: [
+							__yahoo_uds_fixtures.spectrumColors,
+							__yahoo_uds_fixtures.foregroundPaletteColors,
+							__yahoo_uds_fixtures.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"
+						}
+					}) }
+				})
+			}
+		})
+	}
+});
+
+//#endregion
+exports.BadgeConfig = BadgeConfig;

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

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

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

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