@yahoo/uds 3.169.0 → 3.169.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.
@@ -9,11 +9,19 @@ import { CVA, CX } from "./stylerTypes.js";
9
9
  declare function normalizeObject(props: Record<string, unknown>): Record<string, unknown>;
10
10
  declare const cx: CX<string>;
11
11
  declare const cva: CVA<string>;
12
+ /**
13
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
14
+ *
15
+ * Without it, importing anything from this module (e.g. just `cx`) drags the full `variants`
16
+ * map and the auto-generated `autoVariants` (~70 kB minified) into the bundle, because bundlers
17
+ * must assume the module-level `cva(...)` call has side effects. With it, `getStylesInternal`
18
+ * and its `variants` import are dropped when `getStyles` is unused.
19
+ */
12
20
  declare const getStylesInternal: (props?: ({
13
21
  avatarIconVariantRoot?: "primary" | "secondary" | "default" | undefined;
14
22
  avatarImageVariantRoot?: "primary" | "secondary" | "default" | undefined;
15
- avatarSizeIcon?: "xs" | "sm" | "md" | "lg" | "xl" | "default" | "2xl" | "2xs" | "3xl" | undefined;
16
- avatarSizeRoot?: "xs" | "sm" | "md" | "lg" | "xl" | "default" | "2xl" | "2xs" | "3xl" | undefined;
23
+ avatarSizeIcon?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "default" | "2xs" | "3xl" | undefined;
24
+ avatarSizeRoot?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "default" | "2xs" | "3xl" | undefined;
17
25
  avatarTextVariantRoot?: "primary" | "secondary" | "default" | undefined;
18
26
  badgeSizeIcon?: "xs" | "sm" | "md" | "lg" | "default" | undefined;
19
27
  badgeSizeRoot?: "xs" | "sm" | "md" | "lg" | "default" | undefined;
@@ -33,8 +41,8 @@ declare const getStylesInternal: (props?: ({
33
41
  bottomsheetVariantRoot?: "default" | undefined;
34
42
  buttonSizeIcon?: "xs" | "sm" | "md" | "lg" | "default" | undefined;
35
43
  buttonSizeRoot?: "xs" | "sm" | "md" | "lg" | "default" | undefined;
36
- buttonVariantIcon?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "default" | "contrast-high" | "contrast-medium" | "contrast-low" | "brand-tertiary" | "alert-tertiary" | "positive-tertiary" | "warning-tertiary" | "info-tertiary" | undefined;
37
- buttonVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "default" | "contrast-high" | "contrast-medium" | "contrast-low" | "brand-tertiary" | "alert-tertiary" | "positive-tertiary" | "warning-tertiary" | "info-tertiary" | undefined;
44
+ buttonVariantIcon?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "default" | "alert-tertiary" | "brand-tertiary" | "contrast-high" | "contrast-low" | "contrast-medium" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
45
+ buttonVariantRoot?: "primary" | "secondary" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "tertiary" | "default" | "alert-tertiary" | "brand-tertiary" | "contrast-high" | "contrast-low" | "contrast-medium" | "info-tertiary" | "positive-tertiary" | "warning-tertiary" | undefined;
38
46
  checkboxSizeCheckbox?: "sm" | "md" | "default" | undefined;
39
47
  checkboxSizeRoot?: "sm" | "md" | "default" | undefined;
40
48
  checkboxVariantCheckbox?: "primary" | "secondary" | "alert" | "alert-secondary" | "default" | undefined;
@@ -200,10 +208,10 @@ declare const getStylesInternal: (props?: ({
200
208
  toastSizeIcon?: "default" | undefined;
201
209
  toastSizeLabel?: "default" | undefined;
202
210
  toastSizeRoot?: "default" | undefined;
203
- toastVariantActionButton?: "loading" | "warning" | "info" | "default" | "success" | "error" | undefined;
204
- toastVariantCloseIcon?: "loading" | "warning" | "info" | "default" | "success" | "error" | undefined;
205
- toastVariantIcon?: "loading" | "warning" | "info" | "default" | "success" | "error" | undefined;
206
- toastVariantRoot?: "loading" | "warning" | "info" | "default" | "success" | "error" | undefined;
211
+ toastVariantActionButton?: "warning" | "info" | "loading" | "default" | "success" | "error" | undefined;
212
+ toastVariantCloseIcon?: "warning" | "info" | "loading" | "default" | "success" | "error" | undefined;
213
+ toastVariantIcon?: "warning" | "info" | "loading" | "default" | "success" | "error" | undefined;
214
+ toastVariantRoot?: "warning" | "info" | "loading" | "default" | "success" | "error" | undefined;
207
215
  tooltipSizeBody?: "default" | undefined;
208
216
  tooltipSizeEndContent?: "default" | undefined;
209
217
  tooltipSizeIcon?: "default" | undefined;
@@ -218,7 +226,7 @@ declare const getStylesInternal: (props?: ({
218
226
  placeholderColor?: "primary" | "secondary" | "accent" | "brand" | "alert" | "positive" | "warning" | "info" | "brand-secondary" | "alert-secondary" | "positive-secondary" | "warning-secondary" | "info-secondary" | "white" | "black" | "transparent" | "current" | "always/white" | "always/black" | "always/transparent" | "always/current" | "always/brand" | "always/accent" | "tertiary" | "muted" | "on-color" | undefined;
219
227
  fontFamily?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "sans" | "sans-alt" | "serif" | "serif-alt" | "mono" | undefined;
220
228
  fontSize?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
221
- fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "light" | "bold" | "extralight" | "regular" | "semibold" | "extrabold" | undefined;
229
+ fontWeight?: "black" | "thin" | "medium" | "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | "bold" | "extralight" | "light" | "regular" | "semibold" | "extrabold" | undefined;
222
230
  lineHeight?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
223
231
  letterSpacing?: "display1" | "display2" | "display3" | "title1" | "title2" | "title3" | "title4" | "headline1" | "body1" | "label1" | "label2" | "label3" | "label4" | "caption1" | "caption2" | "legal1" | "ui1" | "ui2" | "ui3" | "ui4" | "ui5" | "ui6" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title1/emphasized" | "title2/emphasized" | "title3/emphasized" | "title4/emphasized" | "headline1/emphasized" | "body1/emphasized" | "label1/emphasized" | "label2/emphasized" | "label3/emphasized" | "label4/emphasized" | "caption1/emphasized" | "caption2/emphasized" | "legal1/emphasized" | "ui1/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui4/emphasized" | "ui5/emphasized" | "ui6/emphasized" | undefined;
224
232
  textAlign?: "center" | "justify" | "start" | "end" | undefined;
@@ -250,39 +258,39 @@ declare const getStylesInternal: (props?: ({
250
258
  borderTopEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
251
259
  borderBottomStartRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
252
260
  borderBottomEndRadius?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
253
- borderWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
254
- borderVerticalWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
255
- borderHorizontalWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
256
- borderStartWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
257
- borderEndWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
258
- borderTopWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
259
- borderBottomWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
261
+ borderWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
262
+ borderVerticalWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
263
+ borderHorizontalWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
264
+ borderStartWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
265
+ borderEndWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
266
+ borderTopWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
267
+ borderBottomWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
260
268
  avatarSize?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "2xs" | "3xl" | undefined;
261
269
  iconSize?: "xs" | "sm" | "md" | "lg" | undefined;
262
- alignContent?: "flex-start" | "flex-end" | "center" | "stretch" | "space-between" | "space-around" | undefined;
263
- alignItems?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline" | undefined;
264
- alignSelf?: "flex-start" | "flex-end" | "center" | "stretch" | "baseline" | "auto" | undefined;
265
- flex?: "none" | "1" | "auto" | "initial" | undefined;
270
+ alignContent?: "center" | "flex-start" | "flex-end" | "stretch" | "space-between" | "space-around" | undefined;
271
+ alignItems?: "center" | "flex-start" | "flex-end" | "stretch" | "baseline" | undefined;
272
+ alignSelf?: "center" | "flex-start" | "flex-end" | "stretch" | "baseline" | "auto" | undefined;
273
+ flex?: "1" | "none" | "auto" | "initial" | undefined;
266
274
  flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" | undefined;
267
275
  flexGrow?: "0" | "1" | "2" | "3" | undefined;
268
276
  flexShrink?: "0" | "1" | undefined;
269
277
  flexWrap?: "wrap" | "nowrap" | "wrap-reverse" | undefined;
270
- justifyContent?: "flex-start" | "flex-end" | "center" | "space-between" | "space-around" | "space-evenly" | undefined;
278
+ justifyContent?: "center" | "flex-start" | "flex-end" | "space-between" | "space-around" | "space-evenly" | undefined;
271
279
  flexBasis?: "min-content" | undefined;
272
- display?: "flex" | "none" | "block" | "inline-block" | "inline" | "inline-flex" | "table" | "inline-table" | "table-caption" | "table-cell" | "table-column" | "table-column-group" | "table-footer-group" | "table-header-group" | "table-row-group" | "table-row" | "flow-root" | "grid" | "contents" | undefined;
280
+ display?: "flex" | "table" | "none" | "block" | "inline-block" | "inline" | "inline-flex" | "inline-table" | "table-caption" | "table-cell" | "table-column" | "table-column-group" | "table-footer-group" | "table-header-group" | "table-row-group" | "table-row" | "flow-root" | "grid" | "contents" | undefined;
273
281
  overflow?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
274
282
  overflowX?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
275
283
  overflowY?: "hidden" | "auto" | "clip" | "visible" | "scroll" | undefined;
276
284
  position?: "static" | "fixed" | "absolute" | "relative" | "sticky" | undefined;
277
- contentFit?: "cover" | "contain" | "fill" | "none" | "scale-down" | undefined;
285
+ contentFit?: "none" | "fill" | "cover" | "contain" | "scale-down" | undefined;
278
286
  colorMode?: "light" | "dark" | undefined;
279
- scaleMode?: "medium" | "small" | "xSmall" | "large" | "xLarge" | "xxLarge" | "xxxLarge" | undefined;
287
+ scaleMode?: "small" | "medium" | "xSmall" | "large" | "xLarge" | "xxLarge" | "xxxLarge" | undefined;
280
288
  width?: "full" | "fit" | "screen" | undefined;
281
289
  height?: "full" | "fit" | "screen" | undefined;
282
- dropShadow?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined;
283
- insetShadow?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "xs-invert" | "sm-invert" | "md-invert" | "lg-invert" | "xl-invert" | "2xl-invert" | undefined;
290
+ dropShadow?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined;
291
+ insetShadow?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "xs-invert" | "sm-invert" | "md-invert" | "lg-invert" | "xl-invert" | "2xl-invert" | undefined;
284
292
  nestedBorderRadiusSize?: "none" | "xs" | "sm" | "md" | "lg" | "xl" | "full" | undefined;
285
- nestedBorderRadiusWidth?: "none" | "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "thin" | "medium" | "thick" | undefined;
293
+ nestedBorderRadiusWidth?: "elevation-0" | "elevation-1" | "elevation-2" | "elevation-3" | "elevation-4" | "elevation-5" | "none" | "thin" | "medium" | "thick" | undefined;
286
294
  nestedBorderRadiusSpacing?: "0" | "1" | "2" | "3" | "4" | "5" | "px" | "0.5" | "1.5" | "2.5" | "3.5" | "4.5" | "5.5" | "6" | "7" | "8" | "9" | "10" | "11" | "12" | "14" | "16" | "20" | "24" | "28" | "32" | "36" | "40" | "44" | "48" | "52" | "56" | "60" | "64" | "72" | "80" | "96" | undefined;
287
295
  nestedBorderRadius?: boolean | "first" | "last" | undefined;
288
296
  } & {
@@ -21,7 +21,15 @@ function normalizeObject(props) {
21
21
  }
22
22
  return sorted;
23
23
  }
24
- const twMerge = extendTailwindMerge({
24
+ /**
25
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
26
+ *
27
+ * Without it, bundlers must assume this module-level call has side effects and keep it (plus
28
+ * `tailwind-merge` and the fixtures color lists it references) in any bundle that imports
29
+ * anything from this module. Do not rename/wrap the call without re-checking bundle output
30
+ * (e.g. `esbuild --bundle --minify` an entry that imports a single lightweight export).
31
+ */
32
+ const twMerge = /* @__PURE__ */ extendTailwindMerge({
25
33
  extend: { theme: {
26
34
  borderColor: lineColors,
27
35
  borderWidth: borderWidthsWithElevation,
@@ -83,7 +91,15 @@ const cva = (config) => {
83
91
  return cx(base, variantClassNames, compoundVariantClassNames, className);
84
92
  };
85
93
  };
86
- const getStylesInternal = cva({ variants });
94
+ /**
95
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
96
+ *
97
+ * Without it, importing anything from this module (e.g. just `cx`) drags the full `variants`
98
+ * map and the auto-generated `autoVariants` (~70 kB minified) into the bundle, because bundlers
99
+ * must assume the module-level `cva(...)` call has side effects. With it, `getStylesInternal`
100
+ * and its `variants` import are dropped when `getStyles` is unused.
101
+ */
102
+ const getStylesInternal = /* @__PURE__ */ cva({ variants });
87
103
  const styleCache = /* @__PURE__ */ new Map();
88
104
  const getStylesCacheKeySymbol = Symbol("getStylesCacheKey");
89
105
  const generateCacheKey = (props) => {
@@ -0,0 +1,40 @@
1
+ /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
2
+ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
+ //#region src/styles/textColorVariants.ts
4
+ /**
5
+ * Text color classes for the `color` style prop.
6
+ *
7
+ * Kept in a standalone module so lightweight components (e.g. `Icon`) can map
8
+ * a color to its class without pulling in the full `variants` map, the
9
+ * auto-generated variants, or `tailwind-merge` via the styler.
10
+ */
11
+ const textColorVariants = {
12
+ accent: "text-accent",
13
+ alert: "text-alert",
14
+ "alert-secondary": "text-alert-secondary",
15
+ brand: "text-brand",
16
+ "brand-secondary": "text-brand-secondary",
17
+ positive: "text-positive",
18
+ "positive-secondary": "text-positive-secondary",
19
+ warning: "text-warning",
20
+ "warning-secondary": "text-warning-secondary",
21
+ info: "text-info",
22
+ "info-secondary": "text-info-secondary",
23
+ muted: "text-muted",
24
+ "on-color": "text-on-color",
25
+ primary: "text-primary",
26
+ secondary: "text-secondary",
27
+ tertiary: "text-tertiary",
28
+ white: "text-white",
29
+ black: "text-black",
30
+ transparent: "text-transparent",
31
+ current: "text-current",
32
+ "always/white": "text-always-white",
33
+ "always/black": "text-always-black",
34
+ "always/transparent": "text-always-transparent",
35
+ "always/current": "text-always-current",
36
+ "always/brand": "text-always-brand",
37
+ "always/accent": "text-always-accent"
38
+ };
39
+ //#endregion
40
+ exports.textColorVariants = textColorVariants;
@@ -0,0 +1,39 @@
1
+
2
+ //#region src/styles/textColorVariants.d.ts
3
+ /**
4
+ * Text color classes for the `color` style prop.
5
+ *
6
+ * Kept in a standalone module so lightweight components (e.g. `Icon`) can map
7
+ * a color to its class without pulling in the full `variants` map, the
8
+ * auto-generated variants, or `tailwind-merge` via the styler.
9
+ */
10
+ declare const textColorVariants: {
11
+ accent: string;
12
+ alert: string;
13
+ 'alert-secondary': string;
14
+ brand: string;
15
+ 'brand-secondary': string;
16
+ positive: string;
17
+ 'positive-secondary': string;
18
+ warning: string;
19
+ 'warning-secondary': string;
20
+ info: string;
21
+ 'info-secondary': string;
22
+ muted: string;
23
+ 'on-color': string;
24
+ primary: string;
25
+ secondary: string;
26
+ tertiary: string;
27
+ white: string;
28
+ black: string;
29
+ transparent: string;
30
+ current: string;
31
+ 'always/white': string;
32
+ 'always/black': string;
33
+ 'always/transparent': string;
34
+ 'always/current': string;
35
+ 'always/brand': string;
36
+ 'always/accent': string;
37
+ };
38
+ //#endregion
39
+ export { textColorVariants };
@@ -0,0 +1,39 @@
1
+
2
+ //#region src/styles/textColorVariants.d.ts
3
+ /**
4
+ * Text color classes for the `color` style prop.
5
+ *
6
+ * Kept in a standalone module so lightweight components (e.g. `Icon`) can map
7
+ * a color to its class without pulling in the full `variants` map, the
8
+ * auto-generated variants, or `tailwind-merge` via the styler.
9
+ */
10
+ declare const textColorVariants: {
11
+ accent: string;
12
+ alert: string;
13
+ 'alert-secondary': string;
14
+ brand: string;
15
+ 'brand-secondary': string;
16
+ positive: string;
17
+ 'positive-secondary': string;
18
+ warning: string;
19
+ 'warning-secondary': string;
20
+ info: string;
21
+ 'info-secondary': string;
22
+ muted: string;
23
+ 'on-color': string;
24
+ primary: string;
25
+ secondary: string;
26
+ tertiary: string;
27
+ white: string;
28
+ black: string;
29
+ transparent: string;
30
+ current: string;
31
+ 'always/white': string;
32
+ 'always/black': string;
33
+ 'always/transparent': string;
34
+ 'always/current': string;
35
+ 'always/brand': string;
36
+ 'always/accent': string;
37
+ };
38
+ //#endregion
39
+ export { textColorVariants };
@@ -0,0 +1,39 @@
1
+ /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
2
+ //#region src/styles/textColorVariants.ts
3
+ /**
4
+ * Text color classes for the `color` style prop.
5
+ *
6
+ * Kept in a standalone module so lightweight components (e.g. `Icon`) can map
7
+ * a color to its class without pulling in the full `variants` map, the
8
+ * auto-generated variants, or `tailwind-merge` via the styler.
9
+ */
10
+ const textColorVariants = {
11
+ accent: "text-accent",
12
+ alert: "text-alert",
13
+ "alert-secondary": "text-alert-secondary",
14
+ brand: "text-brand",
15
+ "brand-secondary": "text-brand-secondary",
16
+ positive: "text-positive",
17
+ "positive-secondary": "text-positive-secondary",
18
+ warning: "text-warning",
19
+ "warning-secondary": "text-warning-secondary",
20
+ info: "text-info",
21
+ "info-secondary": "text-info-secondary",
22
+ muted: "text-muted",
23
+ "on-color": "text-on-color",
24
+ primary: "text-primary",
25
+ secondary: "text-secondary",
26
+ tertiary: "text-tertiary",
27
+ white: "text-white",
28
+ black: "text-black",
29
+ transparent: "text-transparent",
30
+ current: "text-current",
31
+ "always/white": "text-always-white",
32
+ "always/black": "text-always-black",
33
+ "always/transparent": "text-always-transparent",
34
+ "always/current": "text-always-current",
35
+ "always/brand": "text-always-brand",
36
+ "always/accent": "text-always-accent"
37
+ };
38
+ //#endregion
39
+ export { textColorVariants };
@@ -4,34 +4,7 @@ const require_autoVariants = require("../automated-config/dist/generated/autoVar
4
4
  const require_index = require("../css-tokens/dist/index.cjs");
5
5
  //#region src/styles/variants.ts
6
6
  const variants = {
7
- color: {
8
- accent: "text-accent",
9
- alert: "text-alert",
10
- "alert-secondary": "text-alert-secondary",
11
- brand: "text-brand",
12
- "brand-secondary": "text-brand-secondary",
13
- positive: "text-positive",
14
- "positive-secondary": "text-positive-secondary",
15
- warning: "text-warning",
16
- "warning-secondary": "text-warning-secondary",
17
- info: "text-info",
18
- "info-secondary": "text-info-secondary",
19
- muted: "text-muted",
20
- "on-color": "text-on-color",
21
- primary: "text-primary",
22
- secondary: "text-secondary",
23
- tertiary: "text-tertiary",
24
- white: "text-white",
25
- black: "text-black",
26
- transparent: "text-transparent",
27
- current: "text-current",
28
- "always/white": "text-always-white",
29
- "always/black": "text-always-black",
30
- "always/transparent": "text-always-transparent",
31
- "always/current": "text-always-current",
32
- "always/brand": "text-always-brand",
33
- "always/accent": "text-always-accent"
34
- },
7
+ color: require("./textColorVariants.cjs").textColorVariants,
35
8
  placeholderColor: {
36
9
  accent: "placeholder:text-accent",
37
10
  alert: "placeholder:text-alert",
@@ -1,36 +1,10 @@
1
1
  /*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
2
2
  import { autoVariants } from "../automated-config/dist/generated/autoVariants.js";
3
3
  import { DARK_COLOR_MODE_CLASSNAME, LARGE_SCALE_MODE_CLASSNAME, LIGHT_COLOR_MODE_CLASSNAME, MEDIUM_SCALE_MODE_CLASSNAME, SMALL_SCALE_MODE_CLASSNAME, XLARGE_SCALE_MODE_CLASSNAME, XSMALL_SCALE_MODE_CLASSNAME, XXLARGE_SCALE_MODE_CLASSNAME, XXXLARGE_SCALE_MODE_CLASSNAME } from "../css-tokens/dist/index.js";
4
+ import { textColorVariants } from "./textColorVariants.js";
4
5
  //#region src/styles/variants.ts
5
6
  const variants = {
6
- color: {
7
- accent: "text-accent",
8
- alert: "text-alert",
9
- "alert-secondary": "text-alert-secondary",
10
- brand: "text-brand",
11
- "brand-secondary": "text-brand-secondary",
12
- positive: "text-positive",
13
- "positive-secondary": "text-positive-secondary",
14
- warning: "text-warning",
15
- "warning-secondary": "text-warning-secondary",
16
- info: "text-info",
17
- "info-secondary": "text-info-secondary",
18
- muted: "text-muted",
19
- "on-color": "text-on-color",
20
- primary: "text-primary",
21
- secondary: "text-secondary",
22
- tertiary: "text-tertiary",
23
- white: "text-white",
24
- black: "text-black",
25
- transparent: "text-transparent",
26
- current: "text-current",
27
- "always/white": "text-always-white",
28
- "always/black": "text-always-black",
29
- "always/transparent": "text-always-transparent",
30
- "always/current": "text-always-current",
31
- "always/brand": "text-always-brand",
32
- "always/accent": "text-always-accent"
33
- },
7
+ color: textColorVariants,
34
8
  placeholderColor: {
35
9
  accent: "placeholder:text-accent",
36
10
  alert: "placeholder:text-alert",
@@ -10,8 +10,8 @@ declare function getShadowStyles({
10
10
  }: {
11
11
  config: UniversalTokensConfig;
12
12
  shadowType: ShadowType;
13
- }): Record<".uds-inset-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-none" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
14
- readonly [x: string]: "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "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)";
13
+ }): Record<".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
14
+ readonly [x: string]: "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "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)";
15
15
  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)";
16
16
  }>; //#endregion
17
17
  //#endregion
@@ -10,8 +10,8 @@ declare function getShadowStyles({
10
10
  }: {
11
11
  config: UniversalTokensConfig;
12
12
  shadowType: ShadowType;
13
- }): Record<".uds-inset-shadow-none" | ".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-none" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
14
- readonly [x: string]: "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "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)";
13
+ }): Record<".uds-inset-shadow-sm" | ".uds-inset-shadow-md" | ".uds-inset-shadow-lg" | ".uds-inset-shadow-xl" | ".uds-inset-shadow-2xl" | ".uds-inset-shadow-none" | ".uds-inset-shadow-xs" | ".uds-inset-shadow-elevation-0" | ".uds-inset-shadow-elevation-1" | ".uds-inset-shadow-elevation-2" | ".uds-inset-shadow-elevation-3" | ".uds-inset-shadow-elevation-4" | ".uds-inset-shadow-elevation-5" | ".uds-drop-shadow-sm" | ".uds-drop-shadow-md" | ".uds-drop-shadow-lg" | ".uds-drop-shadow-xl" | ".uds-drop-shadow-2xl" | ".uds-drop-shadow-none" | ".uds-drop-shadow-xs" | ".uds-drop-shadow-elevation-0" | ".uds-drop-shadow-elevation-1" | ".uds-drop-shadow-elevation-2" | ".uds-drop-shadow-elevation-3" | ".uds-drop-shadow-elevation-4" | ".uds-drop-shadow-elevation-5", {
14
+ readonly [x: string]: "var(--uds-inset-shadow-sm)" | "var(--uds-inset-shadow-md)" | "var(--uds-inset-shadow-lg)" | "var(--uds-inset-shadow-xl)" | "var(--uds-inset-shadow-2xl)" | "var(--uds-inset-shadow-none)" | "var(--uds-inset-shadow-xs)" | "var(--uds-inset-shadow-elevation-0)" | "var(--uds-inset-shadow-elevation-1)" | "var(--uds-inset-shadow-elevation-2)" | "var(--uds-inset-shadow-elevation-3)" | "var(--uds-inset-shadow-elevation-4)" | "var(--uds-inset-shadow-elevation-5)" | "var(--uds-drop-shadow-sm)" | "var(--uds-drop-shadow-md)" | "var(--uds-drop-shadow-lg)" | "var(--uds-drop-shadow-xl)" | "var(--uds-drop-shadow-2xl)" | "var(--uds-drop-shadow-none)" | "var(--uds-drop-shadow-xs)" | "var(--uds-drop-shadow-elevation-0)" | "var(--uds-drop-shadow-elevation-1)" | "var(--uds-drop-shadow-elevation-2)" | "var(--uds-drop-shadow-elevation-3)" | "var(--uds-drop-shadow-elevation-4)" | "var(--uds-drop-shadow-elevation-5)" | "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)";
15
15
  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)";
16
16
  }>; //#endregion
17
17
  //#endregion
@@ -80,7 +80,14 @@ function getFontUrlsByIds(fontIds) {
80
80
  * ReactDOM.preload(fontUrls['centra-no2'][400], { as: 'font', crossOrigin: '', type: 'font/woff2' });
81
81
  * ```
82
82
  */
83
- const fontUrls = getFontUrls();
83
+ /**
84
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
85
+ *
86
+ * This const is re-exported from the `tokens` barrel, so without the annotation some bundlers
87
+ * (rollup, webpack + terser) retain this call — and the font declarations map it walks — in any
88
+ * bundle that imports anything from the barrel, even when `fontUrls` itself is unused.
89
+ */
90
+ const fontUrls = /* @__PURE__ */ getFontUrls();
84
91
  //#endregion
85
92
  exports.fontUrls = fontUrls;
86
93
  exports.getFontUrls = getFontUrls;
@@ -68,6 +68,13 @@ declare function getFontUrlsByIds(fontIds: FontID[]): string[];
68
68
  * ReactDOM.preload(fontUrls['centra-no2'][400], { as: 'font', crossOrigin: '', type: 'font/woff2' });
69
69
  * ```
70
70
  */
71
+ /**
72
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
73
+ *
74
+ * This const is re-exported from the `tokens` barrel, so without the annotation some bundlers
75
+ * (rollup, webpack + terser) retain this call — and the font declarations map it walks — in any
76
+ * bundle that imports anything from the barrel, even when `fontUrls` itself is unused.
77
+ */
71
78
  declare const fontUrls: FontUrlMap;
72
79
  //#endregion
73
80
  export { FontUrlConfig, FontUrlMap, fontUrls, getFontUrls, getFontUrlsByIds };
@@ -68,6 +68,13 @@ declare function getFontUrlsByIds(fontIds: FontID[]): string[];
68
68
  * ReactDOM.preload(fontUrls['centra-no2'][400], { as: 'font', crossOrigin: '', type: 'font/woff2' });
69
69
  * ```
70
70
  */
71
+ /**
72
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
73
+ *
74
+ * This const is re-exported from the `tokens` barrel, so without the annotation some bundlers
75
+ * (rollup, webpack + terser) retain this call — and the font declarations map it walks — in any
76
+ * bundle that imports anything from the barrel, even when `fontUrls` itself is unused.
77
+ */
71
78
  declare const fontUrls: FontUrlMap;
72
79
  //#endregion
73
80
  export { FontUrlConfig, FontUrlMap, fontUrls, getFontUrls, getFontUrlsByIds };
@@ -79,6 +79,13 @@ function getFontUrlsByIds(fontIds) {
79
79
  * ReactDOM.preload(fontUrls['centra-no2'][400], { as: 'font', crossOrigin: '', type: 'font/woff2' });
80
80
  * ```
81
81
  */
82
- const fontUrls = getFontUrls();
82
+ /**
83
+ * !WARNING: The `@__PURE__` annotation below is load-bearing for tree-shaking — do not remove it.
84
+ *
85
+ * This const is re-exported from the `tokens` barrel, so without the annotation some bundlers
86
+ * (rollup, webpack + terser) retain this call — and the font declarations map it walks — in any
87
+ * bundle that imports anything from the barrel, even when `fontUrls` itself is unused.
88
+ */
89
+ const fontUrls = /* @__PURE__ */ getFontUrls();
83
90
  //#endregion
84
91
  export { fontUrls, getFontUrls, getFontUrlsByIds };