@yahoo/uds 3.100.0-beta.1 → 3.100.0-beta.3

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 (39) hide show
  1. package/dist/automated-config/dist/generated/autoVariants.cjs +1 -0
  2. package/dist/automated-config/dist/generated/autoVariants.d.cts +1 -0
  3. package/dist/automated-config/dist/generated/autoVariants.d.ts +1 -0
  4. package/dist/automated-config/dist/generated/autoVariants.js +1 -0
  5. package/dist/automated-config/dist/generated/generatedConfigs.cjs +67 -15
  6. package/dist/automated-config/dist/generated/generatedConfigs.d.cts +27 -0
  7. package/dist/automated-config/dist/generated/generatedConfigs.d.ts +27 -0
  8. package/dist/automated-config/dist/generated/generatedConfigs.js +67 -15
  9. package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +17 -5
  10. package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +17 -5
  11. package/dist/automated-config/dist/properties.cjs +12 -1
  12. package/dist/automated-config/dist/properties.d.cts +7 -1
  13. package/dist/automated-config/dist/properties.d.ts +7 -1
  14. package/dist/automated-config/dist/properties.js +12 -1
  15. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +2 -2
  16. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +2 -2
  17. package/dist/automated-config/dist/utils/index.cjs +4 -4
  18. package/dist/automated-config/dist/utils/index.d.cts +4 -0
  19. package/dist/automated-config/dist/utils/index.d.ts +4 -0
  20. package/dist/automated-config/dist/utils/index.js +4 -4
  21. package/dist/components/client/Tooltip/TooltipContent.cjs +6 -4
  22. package/dist/components/client/Tooltip/TooltipContent.js +6 -4
  23. package/dist/config/dist/index.cjs +17 -5
  24. package/dist/config/dist/index.d.cts +16 -0
  25. package/dist/config/dist/index.d.ts +16 -0
  26. package/dist/config/dist/index.js +17 -5
  27. package/dist/runtime/tooltipConfig.cjs +0 -4
  28. package/dist/runtime/tooltipConfig.d.cts +1 -2
  29. package/dist/runtime/tooltipConfig.d.ts +1 -2
  30. package/dist/runtime/tooltipConfig.js +0 -4
  31. package/dist/styles/styler.d.cts +56 -55
  32. package/dist/styles/styler.d.ts +56 -55
  33. package/dist/styles/variants.d.cts +3 -0
  34. package/dist/styles/variants.d.ts +3 -0
  35. package/dist/tailwind/utils/getShadowStyles.d.cts +4 -4
  36. package/dist/tailwind/utils/getShadowStyles.d.ts +4 -4
  37. package/dist/uds/generated/tailwindPurge.cjs +4 -3
  38. package/dist/uds/generated/tailwindPurge.js +4 -3
  39. package/package.json +1 -1
package/dist/automated-config/dist/generated/autoVariants.cjs CHANGED
@@ -550,6 +550,7 @@ const autoVariants = {
550
550
  tooltipSizeSvg: { default: "uds-tooltip-size-default-svg" },
551
551
  tooltipSizeTitle: { default: "uds-tooltip-size-default-title" },
552
552
  tooltipVariantBlur: { default: "uds-tooltip-variant-default-blur" },
553
+ tooltipVariantIcon: { default: "uds-tooltip-variant-default-icon" },
553
554
  tooltipVariantRoot: { default: "uds-tooltip-variant-default-root" },
554
555
  tooltipVariantSvg: { default: "uds-tooltip-variant-default-svg" }
555
556
  };
package/dist/automated-config/dist/generated/autoVariants.d.cts CHANGED
@@ -127,6 +127,7 @@ interface StylePropsVariantsAuto<T> {
127
127
  tooltipSizeSvg: Record<'default', T>;
128
128
  tooltipSizeTitle: Record<'default', T>;
129
129
  tooltipVariantBlur: Record<'default', T>;
130
+ tooltipVariantIcon: Record<'default', T>;
130
131
  tooltipVariantRoot: Record<'default', T>;
131
132
  tooltipVariantSvg: Record<'default', T>;
132
133
  } //#endregion
package/dist/automated-config/dist/generated/autoVariants.d.ts CHANGED
@@ -127,6 +127,7 @@ interface StylePropsVariantsAuto<T> {
127
127
  tooltipSizeSvg: Record<'default', T>;
128
128
  tooltipSizeTitle: Record<'default', T>;
129
129
  tooltipVariantBlur: Record<'default', T>;
130
+ tooltipVariantIcon: Record<'default', T>;
130
131
  tooltipVariantRoot: Record<'default', T>;
131
132
  tooltipVariantSvg: Record<'default', T>;
132
133
  } //#endregion
package/dist/automated-config/dist/generated/autoVariants.js CHANGED
@@ -549,6 +549,7 @@ const autoVariants = {
549
549
  tooltipSizeSvg: { default: "uds-tooltip-size-default-svg" },
550
550
  tooltipSizeTitle: { default: "uds-tooltip-size-default-title" },
551
551
  tooltipVariantBlur: { default: "uds-tooltip-variant-default-blur" },
552
+ tooltipVariantIcon: { default: "uds-tooltip-variant-default-icon" },
552
553
  tooltipVariantRoot: { default: "uds-tooltip-variant-default-root" },
553
554
  tooltipVariantSvg: { default: "uds-tooltip-variant-default-svg" }
554
555
  };
package/dist/automated-config/dist/generated/generatedConfigs.cjs CHANGED
@@ -30603,21 +30603,35 @@ const TooltipConfig = {
30603
30603
  },
30604
30604
  svg: {
30605
30605
  label: "svg",
30606
- properties: { borderRadius: {
30607
- defaults: { default: "md" },
30608
- label: "border radius",
30609
- name: "borderRadiusVar",
30610
- typeOfFixture: ["borderRadii"],
30611
- values: [[
30612
- "none",
30613
- "xs",
30614
- "sm",
30615
- "md",
30616
- "lg",
30617
- "xl",
30618
- "full"
30619
- ]]
30620
- } }
30606
+ properties: {
30607
+ borderRadius: {
30608
+ defaults: { default: "md" },
30609
+ label: "border radius",
30610
+ name: "borderRadiusVar",
30611
+ typeOfFixture: ["borderRadii"],
30612
+ values: [[
30613
+ "none",
30614
+ "xs",
30615
+ "sm",
30616
+ "md",
30617
+ "lg",
30618
+ "xl",
30619
+ "full"
30620
+ ]]
30621
+ },
30622
+ strokeWidth: {
30623
+ defaults: { default: "thin" },
30624
+ label: "border width",
30625
+ name: "strokeWidth",
30626
+ typeOfFixture: ["borderWidths"],
30627
+ values: [[
30628
+ "none",
30629
+ "thin",
30630
+ "medium",
30631
+ "thick"
30632
+ ]]
30633
+ }
30634
+ }
30621
30635
  },
30622
30636
  title: {
30623
30637
  label: "title",
@@ -30687,11 +30701,49 @@ const TooltipConfig = {
30687
30701
  properties: { backdropBlur: {
30688
30702
  defaults: { default: 0 },
30689
30703
  label: "background blur radius",
30704
+ layerReference: {
30705
+ propertyName: "backgroundColor",
30706
+ variablePath: "variant/default/svg"
30707
+ },
30690
30708
  name: "backdropBlur",
30691
30709
  typeOfFixture: ["positiveIntegers"],
30692
30710
  values: []
30693
30711
  } }
30694
30712
  },
30713
+ icon: {
30714
+ label: "icon",
30715
+ properties: { color: {
30716
+ defaults: { default: "primary" },
30717
+ label: "icon color",
30718
+ name: "color",
30719
+ typeOfFixture: ["foregroundPaletteColors", "alwaysPaletteAliases"],
30720
+ values: [[
30721
+ "primary",
30722
+ "secondary",
30723
+ "accent",
30724
+ "brand",
30725
+ "alert",
30726
+ "positive",
30727
+ "warning",
30728
+ "info",
30729
+ "brand-secondary",
30730
+ "alert-secondary",
30731
+ "positive-secondary",
30732
+ "warning-secondary",
30733
+ "info-secondary",
30734
+ "tertiary",
30735
+ "muted",
30736
+ "on-color"
30737
+ ], [
30738
+ "always/white",
30739
+ "always/black",
30740
+ "always/transparent",
30741
+ "always/current",
30742
+ "always/brand",
30743
+ "always/accent"
30744
+ ]]
30745
+ } }
30746
+ },
30695
30747
  root: {
30696
30748
  label: "root",
30697
30749
  properties: { color: {
package/dist/automated-config/dist/generated/generatedConfigs.d.cts CHANGED
@@ -3343,6 +3343,15 @@ declare const TooltipConfig: {
3343
3343
  readonly typeOfFixture: readonly ["borderRadii"];
3344
3344
  readonly values: readonly [readonly ["none", "xs", "sm", "md", "lg", "xl", "full"]];
3345
3345
  };
3346
+ readonly strokeWidth: {
3347
+ readonly defaults: {
3348
+ readonly default: "thin";
3349
+ };
3350
+ readonly label: "border width";
3351
+ readonly name: "strokeWidth";
3352
+ readonly typeOfFixture: readonly ["borderWidths"];
3353
+ readonly values: readonly [readonly ["none", "thin", "medium", "thick"]];
3354
+ };
3346
3355
  };
3347
3356
  };
3348
3357
  readonly title: {
@@ -3375,12 +3384,30 @@ declare const TooltipConfig: {
3375
3384
  readonly default: 0;
3376
3385
  };
3377
3386
  readonly label: "background blur radius";
3387
+ readonly layerReference: {
3388
+ readonly propertyName: "backgroundColor";
3389
+ readonly variablePath: "variant/default/svg";
3390
+ };
3378
3391
  readonly name: "backdropBlur";
3379
3392
  readonly typeOfFixture: readonly ["positiveIntegers"];
3380
3393
  readonly values: readonly [];
3381
3394
  };
3382
3395
  };
3383
3396
  };
3397
+ readonly icon: {
3398
+ readonly label: "icon";
3399
+ readonly properties: {
3400
+ readonly color: {
3401
+ readonly defaults: {
3402
+ readonly default: "primary";
3403
+ };
3404
+ readonly label: "icon color";
3405
+ readonly name: "color";
3406
+ readonly typeOfFixture: readonly ["foregroundPaletteColors", "alwaysPaletteAliases"];
3407
+ readonly values: readonly [readonly ["primary", "secondary", "accent", "brand", "alert", "positive", "warning", "info", "brand-secondary", "alert-secondary", "positive-secondary", "warning-secondary", "info-secondary", "tertiary", "muted", "on-color"], readonly ["always/white", "always/black", "always/transparent", "always/current", "always/brand", "always/accent"]];
3408
+ };
3409
+ };
3410
+ };
3384
3411
  readonly root: {
3385
3412
  readonly label: "root";
3386
3413
  readonly properties: {
package/dist/automated-config/dist/generated/generatedConfigs.d.ts CHANGED
@@ -3343,6 +3343,15 @@ declare const TooltipConfig: {
3343
3343
  readonly typeOfFixture: readonly ["borderRadii"];
3344
3344
  readonly values: readonly [readonly ["none", "xs", "sm", "md", "lg", "xl", "full"]];
3345
3345
  };
3346
+ readonly strokeWidth: {
3347
+ readonly defaults: {
3348
+ readonly default: "thin";
3349
+ };
3350
+ readonly label: "border width";
3351
+ readonly name: "strokeWidth";
3352
+ readonly typeOfFixture: readonly ["borderWidths"];
3353
+ readonly values: readonly [readonly ["none", "thin", "medium", "thick"]];
3354
+ };
3346
3355
  };
3347
3356
  };
3348
3357
  readonly title: {
@@ -3375,12 +3384,30 @@ declare const TooltipConfig: {
3375
3384
  readonly default: 0;
3376
3385
  };
3377
3386
  readonly label: "background blur radius";
3387
+ readonly layerReference: {
3388
+ readonly propertyName: "backgroundColor";
3389
+ readonly variablePath: "variant/default/svg";
3390
+ };
3378
3391
  readonly name: "backdropBlur";
3379
3392
  readonly typeOfFixture: readonly ["positiveIntegers"];
3380
3393
  readonly values: readonly [];
3381
3394
  };
3382
3395
  };
3383
3396
  };
3397
+ readonly icon: {
3398
+ readonly label: "icon";
3399
+ readonly properties: {
3400
+ readonly color: {
3401
+ readonly defaults: {
3402
+ readonly default: "primary";
3403
+ };
3404
+ readonly label: "icon color";
3405
+ readonly name: "color";
3406
+ readonly typeOfFixture: readonly ["foregroundPaletteColors", "alwaysPaletteAliases"];
3407
+ readonly values: readonly [readonly ["primary", "secondary", "accent", "brand", "alert", "positive", "warning", "info", "brand-secondary", "alert-secondary", "positive-secondary", "warning-secondary", "info-secondary", "tertiary", "muted", "on-color"], readonly ["always/white", "always/black", "always/transparent", "always/current", "always/brand", "always/accent"]];
3408
+ };
3409
+ };
3410
+ };
3384
3411
  readonly root: {
3385
3412
  readonly label: "root";
3386
3413
  readonly properties: {
package/dist/automated-config/dist/generated/generatedConfigs.js CHANGED
@@ -30602,21 +30602,35 @@ const TooltipConfig = {
30602
30602
  },
30603
30603
  svg: {
30604
30604
  label: "svg",
30605
- properties: { borderRadius: {
30606
- defaults: { default: "md" },
30607
- label: "border radius",
30608
- name: "borderRadiusVar",
30609
- typeOfFixture: ["borderRadii"],
30610
- values: [[
30611
- "none",
30612
- "xs",
30613
- "sm",
30614
- "md",
30615
- "lg",
30616
- "xl",
30617
- "full"
30618
- ]]
30619
- } }
30605
+ properties: {
30606
+ borderRadius: {
30607
+ defaults: { default: "md" },
30608
+ label: "border radius",
30609
+ name: "borderRadiusVar",
30610
+ typeOfFixture: ["borderRadii"],
30611
+ values: [[
30612
+ "none",
30613
+ "xs",
30614
+ "sm",
30615
+ "md",
30616
+ "lg",
30617
+ "xl",
30618
+ "full"
30619
+ ]]
30620
+ },
30621
+ strokeWidth: {
30622
+ defaults: { default: "thin" },
30623
+ label: "border width",
30624
+ name: "strokeWidth",
30625
+ typeOfFixture: ["borderWidths"],
30626
+ values: [[
30627
+ "none",
30628
+ "thin",
30629
+ "medium",
30630
+ "thick"
30631
+ ]]
30632
+ }
30633
+ }
30620
30634
  },
30621
30635
  title: {
30622
30636
  label: "title",
@@ -30686,11 +30700,49 @@ const TooltipConfig = {
30686
30700
  properties: { backdropBlur: {
30687
30701
  defaults: { default: 0 },
30688
30702
  label: "background blur radius",
30703
+ layerReference: {
30704
+ propertyName: "backgroundColor",
30705
+ variablePath: "variant/default/svg"
30706
+ },
30689
30707
  name: "backdropBlur",
30690
30708
  typeOfFixture: ["positiveIntegers"],
30691
30709
  values: []
30692
30710
  } }
30693
30711
  },
30712
+ icon: {
30713
+ label: "icon",
30714
+ properties: { color: {
30715
+ defaults: { default: "primary" },
30716
+ label: "icon color",
30717
+ name: "color",
30718
+ typeOfFixture: ["foregroundPaletteColors", "alwaysPaletteAliases"],
30719
+ values: [[
30720
+ "primary",
30721
+ "secondary",
30722
+ "accent",
30723
+ "brand",
30724
+ "alert",
30725
+ "positive",
30726
+ "warning",
30727
+ "info",
30728
+ "brand-secondary",
30729
+ "alert-secondary",
30730
+ "positive-secondary",
30731
+ "warning-secondary",
30732
+ "info-secondary",
30733
+ "tertiary",
30734
+ "muted",
30735
+ "on-color"
30736
+ ], [
30737
+ "always/white",
30738
+ "always/black",
30739
+ "always/transparent",
30740
+ "always/current",
30741
+ "always/brand",
30742
+ "always/accent"
30743
+ ]]
30744
+ } }
30745
+ },
30694
30746
  root: {
30695
30747
  label: "root",
30696
30748
  properties: { color: {
package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs CHANGED
@@ -11960,11 +11960,18 @@ const defaultUniversalTokensConfigAuto = {
11960
11960
  valueType: "alias"
11961
11961
  } }
11962
11962
  },
11963
- "size/default/svg": { borderRadius: { rest: {
11964
- type: "borderRadii",
11965
- value: "md",
11966
- valueType: "alias"
11967
- } } },
11963
+ "size/default/svg": {
11964
+ borderRadius: { rest: {
11965
+ type: "borderRadii",
11966
+ value: "md",
11967
+ valueType: "alias"
11968
+ } },
11969
+ strokeWidth: { rest: {
11970
+ type: "borderWidths",
11971
+ value: "thin",
11972
+ valueType: "alias"
11973
+ } }
11974
+ },
11968
11975
  "size/default/title": { textVariant: { rest: {
11969
11976
  type: "textVariants",
11970
11977
  value: "ui1/emphasized",
@@ -11975,6 +11982,11 @@ const defaultUniversalTokensConfigAuto = {
11975
11982
  value: 0,
11976
11983
  valueType: "alias"
11977
11984
  } } },
11985
+ "variant/default/icon": { color: { rest: {
11986
+ type: "foregroundPaletteColors",
11987
+ value: "primary",
11988
+ valueType: "alias"
11989
+ } } },
11978
11990
  "variant/default/root": { color: { rest: {
11979
11991
  type: "foregroundPaletteColors",
11980
11992
  value: "primary",
package/dist/automated-config/dist/generated/universalTokensConfigAuto.js CHANGED
@@ -11959,11 +11959,18 @@ const defaultUniversalTokensConfigAuto = {
11959
11959
  valueType: "alias"
11960
11960
  } }
11961
11961
  },
11962
- "size/default/svg": { borderRadius: { rest: {
11963
- type: "borderRadii",
11964
- value: "md",
11965
- valueType: "alias"
11966
- } } },
11962
+ "size/default/svg": {
11963
+ borderRadius: { rest: {
11964
+ type: "borderRadii",
11965
+ value: "md",
11966
+ valueType: "alias"
11967
+ } },
11968
+ strokeWidth: { rest: {
11969
+ type: "borderWidths",
11970
+ value: "thin",
11971
+ valueType: "alias"
11972
+ } }
11973
+ },
11967
11974
  "size/default/title": { textVariant: { rest: {
11968
11975
  type: "textVariants",
11969
11976
  value: "ui1/emphasized",
@@ -11974,6 +11981,11 @@ const defaultUniversalTokensConfigAuto = {
11974
11981
  value: 0,
11975
11982
  valueType: "alias"
11976
11983
  } } },
11984
+ "variant/default/icon": { color: { rest: {
11985
+ type: "foregroundPaletteColors",
11986
+ value: "primary",
11987
+ valueType: "alias"
11988
+ } } },
11977
11989
  "variant/default/root": { color: { rest: {
11978
11990
  type: "foregroundPaletteColors",
11979
11991
  value: "primary",
package/dist/automated-config/dist/properties.cjs CHANGED
@@ -148,6 +148,11 @@ const borderWidth = {
148
148
  return false;
149
149
  }
150
150
  };
151
+ const strokeWidth = {
152
+ ...borderWidth,
153
+ name: "strokeWidth",
154
+ cssProperties: "stroke-width"
155
+ };
151
156
  const borderColor = {
152
157
  name: "borderColor",
153
158
  cssProperties: "border-color",
@@ -298,6 +303,7 @@ const insetShadow = {
298
303
  const publicProperties = {
299
304
  backgroundColor,
300
305
  borderWidth,
306
+ strokeWidth,
301
307
  borderRadius,
302
308
  borderRadiusVar,
303
309
  borderColor,
@@ -396,7 +402,12 @@ const publicProperties = {
396
402
  twThemePath: () => {
397
403
  return ``;
398
404
  },
399
- customValueRenderer: (schemaValue) => {
405
+ customValueRenderer: (schemaValue, schema, _theme, originalPropertyDefinition) => {
406
+ if (originalPropertyDefinition && originalPropertyDefinition.layerReference) {
407
+ const { variablePath, propertyName } = originalPropertyDefinition.layerReference;
408
+ const property = schema.variables[variablePath][propertyName].rest;
409
+ if (property.type === "elevationAliases") return `var(--uds-background-blur-radius-${property.value})`;
410
+ }
400
411
  return `blur(${schemaValue.value}px)`;
401
412
  }
402
413
  },
package/dist/automated-config/dist/properties.d.cts CHANGED
@@ -18,13 +18,14 @@ interface ConfigurableProperty<T extends AllPossibleProperties, CVR = unknown> {
18
18
  twThemePath: (fixtureType: T, value: string) => string;
19
19
  possibleFixtures: readonly T[];
20
20
  extendedProperties?: ExtendablePropertiesName[] | ((context: ComponentConfigContext) => ExtendablePropertiesName[] | undefined | false);
21
- customValueRenderer?: (schemaStateValue: SchemaStateValue<CVR>, schema: unknown, themeGetter: (path: string) => string) => string;
21
+ customValueRenderer?: (schemaStateValue: SchemaStateValue<CVR>, schema: unknown, themeGetter: (path: string) => string, originalPropertyDefinition?: SelectedConfigurableProperty<ConfigurablePropertiesName, any>) => string;
22
22
  concatenate?: boolean;
23
23
  concatenationDelimiter?: string;
24
24
  }
25
25
  declare const publicProperties: {
26
26
  readonly backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
27
27
  readonly borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
28
+ readonly strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
28
29
  readonly borderRadius: ConfigurableProperty<"borderRadii", unknown>;
29
30
  readonly borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
30
31
  readonly borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
@@ -66,6 +67,7 @@ declare const configurableProperties: {
66
67
  solidOutline: ConfigurableProperty<never, unknown>;
67
68
  backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
68
69
  borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
70
+ strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
69
71
  borderRadius: ConfigurableProperty<"borderRadii", unknown>;
70
72
  borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
71
73
  borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
@@ -110,6 +112,10 @@ interface SelectedConfigurableProperty<C extends ConfigurablePropertiesName, O e
110
112
  skipRestState?: boolean;
111
113
  pseudoStates?: PossibleStates[];
112
114
  supportsCustom?: boolean;
115
+ layerReference?: {
116
+ variablePath: string;
117
+ propertyName: string;
118
+ };
113
119
  defaults: { [K in O]: V[number][number] | (Extract<T[number], ArbitraryFixtures> extends never ? never : InferArbitraryType<Extract<T[number], ArbitraryFixtures>>) };
114
120
  } //#endregion
115
121
  //#endregion
package/dist/automated-config/dist/properties.d.ts CHANGED
@@ -18,13 +18,14 @@ interface ConfigurableProperty<T extends AllPossibleProperties, CVR = unknown> {
18
18
  twThemePath: (fixtureType: T, value: string) => string;
19
19
  possibleFixtures: readonly T[];
20
20
  extendedProperties?: ExtendablePropertiesName[] | ((context: ComponentConfigContext) => ExtendablePropertiesName[] | undefined | false);
21
- customValueRenderer?: (schemaStateValue: SchemaStateValue<CVR>, schema: unknown, themeGetter: (path: string) => string) => string;
21
+ customValueRenderer?: (schemaStateValue: SchemaStateValue<CVR>, schema: unknown, themeGetter: (path: string) => string, originalPropertyDefinition?: SelectedConfigurableProperty<ConfigurablePropertiesName, any>) => string;
22
22
  concatenate?: boolean;
23
23
  concatenationDelimiter?: string;
24
24
  }
25
25
  declare const publicProperties: {
26
26
  readonly backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
27
27
  readonly borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
28
+ readonly strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
28
29
  readonly borderRadius: ConfigurableProperty<"borderRadii", unknown>;
29
30
  readonly borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
30
31
  readonly borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
@@ -66,6 +67,7 @@ declare const configurableProperties: {
66
67
  solidOutline: ConfigurableProperty<never, unknown>;
67
68
  backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
68
69
  borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
70
+ strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
69
71
  borderRadius: ConfigurableProperty<"borderRadii", unknown>;
70
72
  borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
71
73
  borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
@@ -110,6 +112,10 @@ interface SelectedConfigurableProperty<C extends ConfigurablePropertiesName, O e
110
112
  skipRestState?: boolean;
111
113
  pseudoStates?: PossibleStates[];
112
114
  supportsCustom?: boolean;
115
+ layerReference?: {
116
+ variablePath: string;
117
+ propertyName: string;
118
+ };
113
119
  defaults: { [K in O]: V[number][number] | (Extract<T[number], ArbitraryFixtures> extends never ? never : InferArbitraryType<Extract<T[number], ArbitraryFixtures>>) };
114
120
  } //#endregion
115
121
  //#endregion
package/dist/automated-config/dist/properties.js CHANGED
@@ -148,6 +148,11 @@ const borderWidth = {
148
148
  return false;
149
149
  }
150
150
  };
151
+ const strokeWidth = {
152
+ ...borderWidth,
153
+ name: "strokeWidth",
154
+ cssProperties: "stroke-width"
155
+ };
151
156
  const borderColor = {
152
157
  name: "borderColor",
153
158
  cssProperties: "border-color",
@@ -298,6 +303,7 @@ const insetShadow = {
298
303
  const publicProperties = {
299
304
  backgroundColor,
300
305
  borderWidth,
306
+ strokeWidth,
301
307
  borderRadius,
302
308
  borderRadiusVar,
303
309
  borderColor,
@@ -396,7 +402,12 @@ const publicProperties = {
396
402
  twThemePath: () => {
397
403
  return ``;
398
404
  },
399
- customValueRenderer: (schemaValue) => {
405
+ customValueRenderer: (schemaValue, schema, _theme, originalPropertyDefinition) => {
406
+ if (originalPropertyDefinition && originalPropertyDefinition.layerReference) {
407
+ const { variablePath, propertyName } = originalPropertyDefinition.layerReference;
408
+ const property = schema.variables[variablePath][propertyName].rest;
409
+ if (property.type === "elevationAliases") return `var(--uds-background-blur-radius-${property.value})`;
410
+ }
400
411
  return `blur(${schemaValue.value}px)`;
401
412
  }
402
413
  },
package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts CHANGED
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.cjs";
11
11
  * @returns A Record of layer names to their properties, or null if no properties are found
12
12
  */
13
13
  declare function getConfigVariantProperties(variant?: VariantConfig): {
14
- [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
- root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
14
+ [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
+ root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
16
16
  } | null; //#endregion
17
17
  //#endregion
18
18
  export { getConfigVariantProperties };
package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts CHANGED
@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.js";
11
11
  * @returns A Record of layer names to their properties, or null if no properties are found
12
12
  */
13
13
  declare function getConfigVariantProperties(variant?: VariantConfig): {
14
- [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
- root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
14
+ [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
15
+ root: Readonly<Record<string, SelectedConfigurableProperty<"backgroundColor" | "borderWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontFamily" | "fontSize" | "fontVariationSettings" | "lineHeight" | "textTransform" | "letterSpacing" | "gap" | "color" | "opacity" | "fillOpacity" | "fontWeight" | "iconSize" | "spacing" | "iconVariant" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback", string, readonly ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases")[] | readonly ("elevationAliases" | "borderWidths" | "spacingAliases")[] | readonly "borderRadii"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors")[] | readonly "buttonSizes"[] | readonly "buttonVariantsFlat"[] | readonly "textVariants"[] | readonly "spacingAliases"[] | readonly ("spectrumColors" | "alwaysPaletteAliases" | "foregroundPaletteColors")[] | readonly "opacitySteps"[] | readonly "iconSizes"[] | readonly "iconVariants"[] | readonly "textDecorationLines"[] | readonly ("elevationAliases" | "shadowVariants" | "shadowVariantConfig")[] | readonly ("shadowVariantConfig" | "shadowVariantsWithInvert")[] | readonly "scaleEffects"[] | readonly "positiveIntegers"[], readonly (readonly unknown[])[]>>>;
16
16
  } | null; //#endregion
17
17
  //#endregion
18
18
  export { getConfigVariantProperties };
package/dist/automated-config/dist/utils/index.cjs CHANGED
@@ -115,11 +115,11 @@ function generateClassName({ componentName, subComponentName, variantKey, varian
115
115
  if (layerOptionalPseudoSelector) className = `${className}${layerOptionalPseudoSelector}`;
116
116
  return className.replaceAll(/\s+/g, "-");
117
117
  }
118
- const getTheCssPropertyValue = (schema, theme, propertyName, schemaStateValue, existingValue) => {
118
+ const getTheCssPropertyValue = (schema, theme, propertyName, schemaStateValue, existingValue, originalPropertyDefinition) => {
119
119
  const { value, type } = schemaStateValue;
120
120
  const propertyConfig = require_properties.configurableProperties[propertyName];
121
121
  let newValue;
122
- if (propertyConfig.customValueRenderer) newValue = propertyConfig.customValueRenderer(schemaStateValue, schema, theme);
122
+ if (propertyConfig.customValueRenderer) newValue = propertyConfig.customValueRenderer(schemaStateValue, schema, theme, originalPropertyDefinition);
123
123
  else {
124
124
  const safeTwThemePath = propertyConfig.twThemePath;
125
125
  newValue = theme(safeTwThemePath(type, String(value)));
@@ -222,10 +222,10 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
222
222
  }
223
223
  } else if (typeof cssProperties === "string") {
224
224
  const existingValue = currentStyles?.[fullClassName]?.[cssProperties];
225
- cssDeclarations[cssProperties] = getTheCssPropertyValue(schema, theme, originalPropertyDefinition.name, schemaValueForState, existingValue);
225
+ cssDeclarations[cssProperties] = getTheCssPropertyValue(schema, theme, originalPropertyDefinition.name, schemaValueForState, existingValue, originalPropertyDefinition);
226
226
  } else if (Array.isArray(cssProperties)) for (const cssProp of cssProperties) {
227
227
  const existingValue = currentStyles?.[fullClassName]?.[cssProp];
228
- cssDeclarations[cssProp] = getTheCssPropertyValue(schema, theme, originalPropertyDefinition.name, schemaValueForState, existingValue);
228
+ cssDeclarations[cssProp] = getTheCssPropertyValue(schema, theme, originalPropertyDefinition.name, schemaValueForState, existingValue, originalPropertyDefinition);
229
229
  }
230
230
  /**
231
231
  * Button root layer workarounds & enhancements.
package/dist/automated-config/dist/utils/index.d.cts CHANGED
@@ -93,6 +93,10 @@ declare function createConfigurableProperty<C extends ConfigurablePropertiesName
93
93
  skipRestState?: boolean;
94
94
  pseudoStates?: PossibleStates[];
95
95
  supportsCustom?: boolean;
96
+ layerReference?: {
97
+ variablePath: string;
98
+ propertyName: string;
99
+ };
96
100
  }): SelectedConfigurableProperty<C, O, T, V>;
97
101
  declare function createVariantConfig(config: {
98
102
  label: string;