@yahoo/uds 3.126.0 → 3.127.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/dist/automated-config/dist/generated/autoVariants.cjs +25 -0
  2. package/dist/automated-config/dist/generated/autoVariants.d.cts +7 -0
  3. package/dist/automated-config/dist/generated/autoVariants.d.ts +7 -0
  4. package/dist/automated-config/dist/generated/autoVariants.js +25 -0
  5. package/dist/automated-config/dist/generated/generatedConfigs.cjs +3181 -0
  6. package/dist/automated-config/dist/generated/generatedConfigs.d.cts +305 -1
  7. package/dist/automated-config/dist/generated/generatedConfigs.d.ts +305 -1
  8. package/dist/automated-config/dist/generated/generatedConfigs.js +3180 -1
  9. package/dist/automated-config/dist/generated/universalTokensConfigAuto.cjs +754 -0
  10. package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.cts +3 -1
  11. package/dist/automated-config/dist/generated/universalTokensConfigAuto.d.ts +3 -1
  12. package/dist/automated-config/dist/generated/universalTokensConfigAuto.js +754 -0
  13. package/dist/automated-config/dist/properties.cjs +12 -0
  14. package/dist/automated-config/dist/properties.d.cts +4 -0
  15. package/dist/automated-config/dist/properties.d.ts +4 -0
  16. package/dist/automated-config/dist/properties.js +12 -0
  17. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts +2 -2
  18. package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts +2 -2
  19. package/dist/automated-config/dist/utils/index.cjs +103 -6
  20. package/dist/automated-config/dist/utils/index.js +103 -6
  21. package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts +1 -1
  22. package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts +1 -1
  23. package/dist/components/client/Popover/UDSPopoverConfigProvider.d.cts +1 -1
  24. package/dist/components/client/Popover/UDSPopoverConfigProvider.d.ts +1 -1
  25. package/dist/components/client/Tabs/Tab.cjs +80 -0
  26. package/dist/components/client/Tabs/Tab.d.cts +20 -0
  27. package/dist/components/client/Tabs/Tab.d.ts +21 -0
  28. package/dist/components/client/Tabs/Tab.js +78 -0
  29. package/dist/components/client/Tabs/TabList.cjs +132 -0
  30. package/dist/components/client/Tabs/TabList.d.cts +9 -0
  31. package/dist/components/client/Tabs/TabList.d.ts +10 -0
  32. package/dist/components/client/Tabs/TabList.js +130 -0
  33. package/dist/components/client/Tabs/TabPanel.cjs +22 -0
  34. package/dist/components/client/Tabs/TabPanel.d.cts +9 -0
  35. package/dist/components/client/Tabs/TabPanel.d.ts +10 -0
  36. package/dist/components/client/Tabs/TabPanel.js +20 -0
  37. package/dist/components/client/Tabs/Tabs.cjs +53 -0
  38. package/dist/components/client/Tabs/Tabs.d.cts +45 -0
  39. package/dist/components/client/Tabs/Tabs.d.ts +46 -0
  40. package/dist/components/client/Tabs/Tabs.js +51 -0
  41. package/dist/components/client/Tabs/index.cjs +12 -0
  42. package/dist/components/client/Tabs/index.d.cts +7 -0
  43. package/dist/components/client/Tabs/index.d.ts +8 -0
  44. package/dist/components/client/Tabs/index.js +8 -0
  45. package/dist/components/client/Tabs/tabsContext.cjs +18 -0
  46. package/dist/components/client/Tabs/tabsContext.d.cts +15 -0
  47. package/dist/components/client/Tabs/tabsContext.d.ts +16 -0
  48. package/dist/components/client/Tabs/tabsContext.js +15 -0
  49. package/dist/components/client/Toast/UDSToastConfigProvider.d.cts +5 -5
  50. package/dist/components/client/Toast/UDSToastConfigProvider.d.ts +5 -5
  51. package/dist/components/client/index.cjs +8 -0
  52. package/dist/components/client/index.d.cts +7 -1
  53. package/dist/components/client/index.d.ts +7 -1
  54. package/dist/components/client/index.js +5 -1
  55. package/dist/components/experimental/client/index.cjs +0 -5
  56. package/dist/components/experimental/client/index.d.cts +1 -2
  57. package/dist/components/experimental/client/index.d.ts +1 -2
  58. package/dist/components/experimental/client/index.js +1 -2
  59. package/dist/components/experimental/index.cjs +0 -9
  60. package/dist/components/experimental/index.d.cts +1 -2
  61. package/dist/components/experimental/index.d.ts +1 -2
  62. package/dist/components/experimental/index.js +1 -6
  63. package/dist/components/index.cjs +12 -0
  64. package/dist/components/index.d.cts +6 -1
  65. package/dist/components/index.d.ts +6 -1
  66. package/dist/components/index.js +9 -1
  67. package/dist/config/dist/index.cjs +824 -2
  68. package/dist/config/dist/index.js +824 -2
  69. package/dist/index.cjs +10 -0
  70. package/dist/index.d.cts +8 -3
  71. package/dist/index.d.ts +8 -3
  72. package/dist/index.js +6 -2
  73. package/dist/styles/styler.d.cts +97 -90
  74. package/dist/styles/styler.d.ts +97 -90
  75. package/dist/styles/variants.d.cts +29 -0
  76. package/dist/styles/variants.d.ts +29 -0
  77. package/dist/tailwind/dist/automated-config/dist/generated/autoVariants.cjs +25 -0
  78. package/dist/tailwind/dist/automated-config/dist/generated/autoVariants.js +25 -0
  79. package/dist/tailwind/dist/automated-config/dist/generated/autoVariants.js.map +1 -1
  80. package/dist/tailwind/dist/automated-config/dist/generated/generatedConfigs.cjs +3181 -0
  81. package/dist/tailwind/dist/automated-config/dist/generated/generatedConfigs.js +3180 -1
  82. package/dist/tailwind/dist/automated-config/dist/generated/generatedConfigs.js.map +1 -1
  83. package/dist/tailwind/dist/automated-config/dist/properties.cjs +12 -0
  84. package/dist/tailwind/dist/automated-config/dist/properties.js +12 -0
  85. package/dist/tailwind/dist/automated-config/dist/properties.js.map +1 -1
  86. package/dist/tailwind/dist/automated-config/dist/utils/index.cjs +103 -6
  87. package/dist/tailwind/dist/automated-config/dist/utils/index.js +103 -6
  88. package/dist/tailwind/dist/automated-config/dist/utils/index.js.map +1 -1
  89. package/dist/tailwind/dist/config/dist/index.cjs +824 -2
  90. package/dist/tailwind/dist/config/dist/index.js +824 -2
  91. package/dist/tailwind/dist/config/dist/index.js.map +1 -1
  92. package/dist/tailwind/dist/css/utils.cjs +3 -1
  93. package/dist/tailwind/dist/css/utils.js +3 -1
  94. package/dist/tailwind/dist/css/utils.js.map +1 -1
  95. package/dist/tailwind/dist/purger/optimized/utils/componentAnalyzer.cjs +36 -2
  96. package/dist/tailwind/dist/purger/optimized/utils/componentAnalyzer.js +36 -2
  97. package/dist/tailwind/dist/purger/optimized/utils/componentAnalyzer.js.map +1 -1
  98. package/dist/tailwind/dist/tailwind/plugins/components.cjs +2 -0
  99. package/dist/tailwind/dist/tailwind/plugins/components.js +3 -1
  100. package/dist/tailwind/dist/tailwind/plugins/components.js.map +1 -1
  101. package/dist/tailwind/dist/types/dist/index.d.cts.map +1 -1
  102. package/dist/tailwind/dist/types/dist/index.d.ts.map +1 -1
  103. package/dist/tokens/automation/configs/index.cjs +2 -0
  104. package/dist/tokens/automation/configs/index.d.cts +2 -2
  105. package/dist/tokens/automation/configs/index.d.ts +2 -2
  106. package/dist/tokens/automation/configs/index.js +2 -2
  107. package/dist/tokens/automation/index.cjs +2 -0
  108. package/dist/tokens/automation/index.d.cts +2 -2
  109. package/dist/tokens/automation/index.d.ts +2 -2
  110. package/dist/tokens/automation/index.js +2 -2
  111. package/dist/tokens/index.cjs +2 -0
  112. package/dist/tokens/index.d.cts +3 -3
  113. package/dist/tokens/index.d.ts +3 -3
  114. package/dist/tokens/index.js +2 -2
  115. package/dist/tokens/types.d.cts +2 -2
  116. package/dist/tokens/types.d.ts +2 -2
  117. package/dist/types/dist/index.d.cts +52 -1
  118. package/dist/types/dist/index.d.ts +52 -1
  119. package/dist/uds/generated/componentData.cjs +1457 -1349
  120. package/dist/uds/generated/componentData.js +1448 -1358
  121. package/dist/uds/generated/tailwindPurge.cjs +22 -43
  122. package/dist/uds/generated/tailwindPurge.js +22 -43
  123. package/dist/uds/package.cjs +2 -2
  124. package/dist/uds/package.js +2 -2
  125. package/generated/componentData.json +1808 -1698
  126. package/generated/tailwindPurge.ts +4 -4
  127. package/package.json +3 -3
  128. package/dist/components/experimental/client/Tabs.cjs +0 -76
  129. package/dist/components/experimental/client/Tabs.d.cts +0 -31
  130. package/dist/components/experimental/client/Tabs.d.ts +0 -32
  131. package/dist/components/experimental/client/Tabs.js +0 -71
@@ -155,6 +155,11 @@ const strokeWidth = {
155
155
  name: "strokeWidth",
156
156
  cssProperties: "stroke-width"
157
157
  };
158
+ const underlineWidth = {
159
+ ...borderWidth,
160
+ name: "underlineWidth",
161
+ cssProperties: "border-bottom-width"
162
+ };
158
163
  const borderColor = {
159
164
  name: "borderColor",
160
165
  cssProperties: "border-color",
@@ -175,6 +180,11 @@ const stroke = {
175
180
  name: "stroke",
176
181
  cssProperties: "stroke"
177
182
  };
183
+ const underlineColor = {
184
+ ...borderColor,
185
+ name: "underlineColor",
186
+ cssProperties: "border-bottom-color"
187
+ };
178
188
  const outlineWidth = {
179
189
  name: "outlineWidth",
180
190
  cssProperties: "outline-width",
@@ -328,10 +338,12 @@ const opacity = {
328
338
  const publicProperties = {
329
339
  backgroundColor,
330
340
  borderWidth,
341
+ underlineWidth,
331
342
  strokeWidth,
332
343
  borderRadius,
333
344
  borderRadiusVar,
334
345
  borderColor,
346
+ underlineColor,
335
347
  stroke,
336
348
  buttonSize: {
337
349
  name: "buttonSize",
@@ -155,6 +155,11 @@ const strokeWidth = {
155
155
  name: "strokeWidth",
156
156
  cssProperties: "stroke-width"
157
157
  };
158
+ const underlineWidth = {
159
+ ...borderWidth,
160
+ name: "underlineWidth",
161
+ cssProperties: "border-bottom-width"
162
+ };
158
163
  const borderColor = {
159
164
  name: "borderColor",
160
165
  cssProperties: "border-color",
@@ -175,6 +180,11 @@ const stroke = {
175
180
  name: "stroke",
176
181
  cssProperties: "stroke"
177
182
  };
183
+ const underlineColor = {
184
+ ...borderColor,
185
+ name: "underlineColor",
186
+ cssProperties: "border-bottom-color"
187
+ };
178
188
  const outlineWidth = {
179
189
  name: "outlineWidth",
180
190
  cssProperties: "outline-width",
@@ -328,10 +338,12 @@ const opacity = {
328
338
  const publicProperties = {
329
339
  backgroundColor,
330
340
  borderWidth,
341
+ underlineWidth,
331
342
  strokeWidth,
332
343
  borderRadius,
333
344
  borderRadiusVar,
334
345
  borderColor,
346
+ underlineColor,
335
347
  stroke,
336
348
  buttonSize: {
337
349
  name: "buttonSize",
@@ -1 +1 @@
1
- {"version":3,"file":"properties.js","names":[],"sources":["../../../../automated-config/dist/properties.js"],"sourcesContent":["/*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */\nimport { assertUnreachable } from \"./utils/assertUnreachable.js\";\nimport { mapTextVariantFixtureToValue } from \"./mapTextVariantFixtureToValue.js\";\nimport { mapColorFixtureToValue } from \"./utils/mapColorFixtureToValue.js\";\nimport { BACKGROUND_BLUR_COLOR_PREFIX, BACKGROUND_BLUR_FALLBACK_COLOR_PREFIX, BORDER_RADIUS_PREFIX, BUTTON_SCALE_EFFECT, DROP_SHADOW_PREFIX, getShadowLayerValue, textVariantsSafe } from \"@yahoo/uds-css-tokens\";\nimport { SCALE_EFFECTS } from \"@yahoo/uds-motion-tokens\";\n\n//#region src/properties.ts\nconst isInputWrapperCtx = (context) => {\n\treturn context.componentName === \"input\" && context.layer === \"inputWrapper\";\n};\nconst hexToRgb = (hex) => {\n\thex = hex.replace(\"#\", \"\");\n\tif (hex.length === 3) hex = hex.split(\"\").map((char) => char + char).join(\"\");\n\treturn `${parseInt(hex.substring(0, 2), 16)} ${parseInt(hex.substring(2, 4), 16)} ${parseInt(hex.substring(4, 6), 16)}`;\n};\nconst backgroundColor = {\n\tname: \"backgroundColor\",\n\tcssProperties: \"background-color\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\n\t\t\"backgroundPaletteColors\",\n\t\t\"spectrumColors\",\n\t\t\"alwaysPaletteAliases\",\n\t\t\"elevationAliases\"\n\t],\n\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\tif (type === \"elevationAliases\") return `var(--uds-background-color-${value})`;\n\t\treturn theme(mapColorFixtureToValue(type, value));\n\t}\n};\nconst color = {\n\tname: \"color\",\n\tcssProperties: \"color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"foregroundPaletteColors\"\n\t]\n};\nconst fontSize = {\n\tname: \"fontSize\",\n\tcssProperties: \"font-size\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontSize\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst fontVariationSettings = {\n\tname: \"fontVariationSettings\",\n\tcssProperties: \"font-variation-settings\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\"textVariants\"],\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst { value: rawValue } = schemaValue;\n\t\tconst value = textVariantsSafe(rawValue);\n\t\treturn `\"wght\" var(--uds-font-weight-${value}), \"slnt\" var(--uds-font-slant-${value}), \"ital\" var(--uds-font-slant-${value}), \"wdth\" var(--uds-font-width-${value})`;\n\t}\n};\nconst fontWeight = {\n\tname: \"fontWeight\",\n\tcssProperties: \"font-weight\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontWeight\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst fontFamily = {\n\tname: \"fontFamily\",\n\tcssProperties: \"font-family\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontFamily\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst textTransform = {\n\tname: \"textTransform\",\n\tcssProperties: \"text-transform\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"textTransform\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst lineHeight = {\n\tname: \"lineHeight\",\n\tcssProperties: \"line-height\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"lineHeight\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst letterSpacing = {\n\tname: \"letterSpacing\",\n\tcssProperties: \"letter-spacing\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"letterSpacing\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst textVariant = {\n\tname: \"textVariant\",\n\tcssProperties: [],\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\"textVariants\"],\n\textendedProperties: [\n\t\t\"fontSize\",\n\t\t\"fontWeight\",\n\t\t\"fontFamily\",\n\t\t\"lineHeight\",\n\t\t\"textTransform\",\n\t\t\"fontVariationSettings\",\n\t\t\"letterSpacing\"\n\t]\n};\nconst textDecorationLine = {\n\tname: \"textDecorationLine\",\n\tcssProperties: \"text-decoration-line\",\n\tpossibleFixtures: [\"textDecorationLines\"],\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tcustomValueRenderer: (schemaValue) => {\n\t\treturn String(schemaValue.value);\n\t}\n};\nconst gap = {\n\tname: \"gap\",\n\tcssProperties: \"gap\",\n\ttwThemePath: (fixtureType, value) => fixtureType === \"spacingAliases\" ? `spacing[${value}]` : \"\",\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst borderWidth = {\n\tname: \"borderWidth\",\n\tcssProperties: \"border-width\",\n\ttwThemePath: (fixtureType, value) => {\n\t\tswitch (fixtureType) {\n\t\t\tcase \"borderWidths\":\n\t\t\tcase \"elevationAliases\": return `udsBorderWidth[${value}]`;\n\t\t\tcase \"spacingAliases\": return `spacing[${value}]`;\n\t\t}\n\t\treturn assertUnreachable(fixtureType);\n\t},\n\tpossibleFixtures: [\n\t\t\"borderWidths\",\n\t\t\"spacingAliases\",\n\t\t\"elevationAliases\"\n\t],\n\textendedProperties: (context) => {\n\t\tif (isInputWrapperCtx(context)) return [\n\t\t\t\"outlineWidth\",\n\t\t\t\"insetOutlineOffset\",\n\t\t\t\"solidOutline\"\n\t\t];\n\t\treturn false;\n\t}\n};\nconst strokeWidth = {\n\t...borderWidth,\n\tname: \"strokeWidth\",\n\tcssProperties: \"stroke-width\"\n};\nconst borderColor = {\n\tname: \"borderColor\",\n\tcssProperties: \"border-color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"linePaletteColors\",\n\t\t\"elevationAliases\"\n\t],\n\textendedProperties: (context) => {\n\t\tif (isInputWrapperCtx(context)) return [\"outlineColor\"];\n\t\treturn false;\n\t}\n};\nconst stroke = {\n\t...borderColor,\n\tname: \"stroke\",\n\tcssProperties: \"stroke\"\n};\nconst outlineWidth = {\n\tname: \"outlineWidth\",\n\tcssProperties: \"outline-width\",\n\ttwThemePath: (type, value) => type === \"borderWidths\" ? `udsBorderWidth[${value}]` : `spacing[${value}]`,\n\tpossibleFixtures: [\"borderWidths\", \"spacingAliases\"]\n};\nconst solidOutline = {\n\tname: \"solidOutline\",\n\tcssProperties: \"outline-style\",\n\ttwThemePath: () => \"\",\n\tcustomValueRenderer: () => \"solid\",\n\tpossibleFixtures: []\n};\nconst insetOutlineOffset = {\n\tname: \"insetOutlineOffset\",\n\tcssProperties: \"outline-offset\",\n\ttwThemePath: () => \"\",\n\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\treturn `calc(-1 * ${type === \"borderWidths\" ? theme(`udsBorderWidth[${value}]`) : theme(`spacing[${value}]`)})`;\n\t},\n\tpossibleFixtures: [\"borderWidths\", \"spacingAliases\"]\n};\nconst outlineColor = {\n\tname: \"outlineColor\",\n\tcssProperties: \"outline-color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"linePaletteColors\"\n\t]\n};\nconst borderRadius = {\n\tname: \"borderRadius\",\n\tcssProperties: \"border-radius\",\n\ttwThemePath: (_, value) => `udsBorderRadius.${value}`,\n\tpossibleFixtures: [\"borderRadii\"]\n};\nconst borderRadiusVar = {\n\t...borderRadius,\n\tname: \"borderRadiusVar\",\n\tcssProperties: `--${BORDER_RADIUS_PREFIX}`\n};\nconst spacing = {\n\tname: \"spacing\",\n\tcssProperties: \"padding\",\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst spacingHorizontal = {\n\tname: \"spacingHorizontal\",\n\tcssProperties: [\"padding-right\", \"padding-left\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst spacingVertical = {\n\tname: \"spacingVertical\",\n\tcssProperties: [\"padding-top\", \"padding-bottom\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst horizontalMargin = {\n\tname: \"horizontalMargin\",\n\tcssProperties: [\"margin-left\", \"margin-right\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst bottomMargin = {\n\tname: \"bottomMargin\",\n\tcssProperties: \"margin-bottom\",\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst height = {\n\tname: \"height\",\n\tcssProperties: \"height\",\n\ttwThemePath: (_, value) => {\n\t\treturn `height[${value}]`;\n\t},\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst width = {\n\tname: \"width\",\n\tcssProperties: \"width\",\n\ttwThemePath: (_, value) => {\n\t\treturn `width[${value}]`;\n\t},\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst shadow = {\n\tname: \"drop shadow\",\n\tcssProperties: \"box-shadow\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tconcatenate: true,\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst shadowType = \"drop\";\n\t\tconst noneValue = \"0 0 0 transparent\";\n\t\tif (schemaValue.valueType === \"alias\") {\n\t\t\tconst noneValue = \"0 0 0 transparent\";\n\t\t\tif (schemaValue.value === \"none\") return noneValue;\n\t\t\tif (schemaValue.value !== \"custom\") return `var(--uds-${shadowType}-shadow-${schemaValue.value})`;\n\t\t} else if (schemaValue.valueType === \"custom\") return schemaValue.value.map((preset, index) => getShadowLayerValue({\n\t\t\tpreset,\n\t\t\tshadowType,\n\t\t\tprefix: index > 0 ? `${index + 1}` : void 0\n\t\t}))?.join(\", \") || noneValue;\n\t\tthrow new Error(\"Invalid valueType\");\n\t},\n\tpossibleFixtures: [\n\t\t\"shadowVariants\",\n\t\t\"shadowVariantConfig\",\n\t\t\"elevationAliases\"\n\t]\n};\nconst insetShadow = {\n\tname: \"inset shadow\",\n\tcssProperties: \"box-shadow\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tconcatenate: true,\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst shadowType = \"inset\";\n\t\tconst noneValue = \"0 0 0 transparent\";\n\t\tif (schemaValue.valueType === \"alias\") {\n\t\t\tconst noneValue = \"0 0 0 transparent\";\n\t\t\tif (schemaValue.value === \"none\") return noneValue;\n\t\t\tif (schemaValue.value !== \"custom\") return `var(--uds-${shadowType}-shadow-${schemaValue.value})`;\n\t\t} else if (schemaValue.valueType === \"custom\") return schemaValue.value.map((preset, index) => getShadowLayerValue({\n\t\t\tpreset,\n\t\t\tshadowType,\n\t\t\tprefix: index > 0 ? `${index + 1}` : void 0\n\t\t}))?.join(\", \") || noneValue;\n\t\tthrow new Error(\"Invalid valueType\");\n\t},\n\tpossibleFixtures: [\"shadowVariantsWithInvert\"]\n};\nconst shadowVar = {\n\t...shadow,\n\tname: \"shadowVar\",\n\tcssProperties: `--${DROP_SHADOW_PREFIX}`\n};\nconst opacity = {\n\tname: \"opacity\",\n\tcssProperties: \"opacity\",\n\ttwThemePath: (_, value) => `opacity[${value}]`,\n\tpossibleFixtures: [\"opacitySteps\"]\n};\nconst publicProperties = {\n\tbackgroundColor,\n\tborderWidth,\n\tstrokeWidth,\n\tborderRadius,\n\tborderRadiusVar,\n\tborderColor,\n\tstroke,\n\tbuttonSize: {\n\t\tname: \"buttonSize\",\n\t\tcssProperties: \"--uds-button-size\",\n\t\tpossibleFixtures: [\"buttonSizes\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\tbuttonVariant: {\n\t\tname: \"buttonVariant\",\n\t\tcssProperties: \"--uds-button-variant\",\n\t\tpossibleFixtures: [\"buttonVariantsFlat\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\tfontFamily,\n\tfontSize,\n\tfontVariationSettings,\n\tlineHeight,\n\ttextTransform,\n\tletterSpacing,\n\tgap,\n\tcolor,\n\topacity,\n\tfillOpacity: {\n\t\tname: \"fillOpacity\",\n\t\tcssProperties: \"fill-opacity\",\n\t\ttwThemePath: (_, value) => `opacity[${value}]`,\n\t\tpossibleFixtures: [\"opacitySteps\"]\n\t},\n\tfontWeight,\n\ticonSize: {\n\t\tname: \"iconSize\",\n\t\tcssProperties: [\"width\", \"height\"],\n\t\ttwThemePath: (_, value) => `sizing.icon.${value}`,\n\t\tpossibleFixtures: [\"iconSizes\"]\n\t},\n\tspacing,\n\ticonVariant: {\n\t\tname: \"iconVariant\",\n\t\tcssProperties: \"--uds-icon-variant\",\n\t\tpossibleFixtures: [\"iconVariants\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\thorizontalMargin,\n\tbottomMargin,\n\tspacingHorizontal,\n\tspacingVertical,\n\ttextVariant,\n\ttextDecorationLine,\n\tshadow,\n\tshadowVar,\n\tinsetShadow,\n\theight,\n\twidth,\n\tscaleEffect: {\n\t\tname: \"scaleEffect\",\n\t\tcssProperties: BUTTON_SCALE_EFFECT,\n\t\tpossibleFixtures: [\"scaleEffects\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\tconst value = schemaValue.value;\n\t\t\tconst stringValue = String(value);\n\t\t\treturn String(SCALE_EFFECTS[stringValue] ?? SCALE_EFFECTS.none);\n\t\t}\n\t},\n\tbackdropBlur: {\n\t\tname: \"backdropBlur\",\n\t\tpossibleFixtures: [\"positiveIntegers\"],\n\t\tcssProperties: \"--uds-backdrop-blur\",\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue, schema, _theme, originalPropertyDefinition) => {\n\t\t\tif (originalPropertyDefinition && originalPropertyDefinition.layerReference) {\n\t\t\t\tconst { variablePath, propertyName } = originalPropertyDefinition.layerReference;\n\t\t\t\tconst property = schema.variables[variablePath][propertyName].rest;\n\t\t\t\tif (property.type === \"elevationAliases\") return `var(--uds-background-blur-radius-${property.value})`;\n\t\t\t}\n\t\t\treturn `blur(${schemaValue.value}px)`;\n\t\t}\n\t},\n\tblurBackgroundColor: {\n\t\t...backgroundColor,\n\t\tname: \"blurBackgroundColor\",\n\t\tcssProperties: `--${BACKGROUND_BLUR_COLOR_PREFIX}`\n\t},\n\tblurBackgroundColorFallback: {\n\t\t...backgroundColor,\n\t\tname: \"blurBackgroundColorFallback\",\n\t\tcssProperties: `--${BACKGROUND_BLUR_FALLBACK_COLOR_PREFIX}`\n\t},\n\tscrimBackgroundColor: {\n\t\tname: \"scrimBackgroundColor\",\n\t\tcssProperties: \"--uds-scrim-background-color\",\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tpossibleFixtures: [\n\t\t\t\"backgroundPaletteColors\",\n\t\t\t\"spectrumColors\",\n\t\t\t\"alwaysPaletteAliases\"\n\t\t],\n\t\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\t\tconst resolved = theme(mapColorFixtureToValue(type, value));\n\t\t\tif (resolved.startsWith(\"#\")) return hexToRgb(resolved) ?? resolved;\n\t\t\tif (resolved.startsWith(\"rgb(\") && resolved.endsWith(\")\")) return resolved.slice(4, -1);\n\t\t\treturn resolved;\n\t\t}\n\t},\n\tscrimOpacity: {\n\t\t...opacity,\n\t\tname: \"scrimOpacity\",\n\t\tcssProperties: \"--uds-scrim-opacity\",\n\t\ttwThemePath: () => \"\",\n\t\tcustomValueRenderer: ({ value }) => `${String(value)}%`\n\t}\n};\nconst internalProperties = {\n\toutlineWidth,\n\toutlineColor,\n\tinsetOutlineOffset,\n\tsolidOutline\n};\nconst configurableProperties = {\n\t...publicProperties,\n\t...internalProperties\n};\n\n//#endregion\nexport { configurableProperties };\n//# sourceMappingURL=properties.js.map"],"mappings":"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"}
1
+ {"version":3,"file":"properties.js","names":[],"sources":["../../../../automated-config/dist/properties.js"],"sourcesContent":["/*! © 2026 Yahoo, Inc. UDS Default Config v0.0.0-development */\nimport { assertUnreachable } from \"./utils/assertUnreachable.js\";\nimport { mapTextVariantFixtureToValue } from \"./mapTextVariantFixtureToValue.js\";\nimport { mapColorFixtureToValue } from \"./utils/mapColorFixtureToValue.js\";\nimport { BACKGROUND_BLUR_COLOR_PREFIX, BACKGROUND_BLUR_FALLBACK_COLOR_PREFIX, BORDER_RADIUS_PREFIX, BUTTON_SCALE_EFFECT, DROP_SHADOW_PREFIX, getShadowLayerValue, textVariantsSafe } from \"@yahoo/uds-css-tokens\";\nimport { SCALE_EFFECTS } from \"@yahoo/uds-motion-tokens\";\n\n//#region src/properties.ts\nconst isInputWrapperCtx = (context) => {\n\treturn context.componentName === \"input\" && context.layer === \"inputWrapper\";\n};\nconst hexToRgb = (hex) => {\n\thex = hex.replace(\"#\", \"\");\n\tif (hex.length === 3) hex = hex.split(\"\").map((char) => char + char).join(\"\");\n\treturn `${parseInt(hex.substring(0, 2), 16)} ${parseInt(hex.substring(2, 4), 16)} ${parseInt(hex.substring(4, 6), 16)}`;\n};\nconst backgroundColor = {\n\tname: \"backgroundColor\",\n\tcssProperties: \"background-color\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\n\t\t\"backgroundPaletteColors\",\n\t\t\"spectrumColors\",\n\t\t\"alwaysPaletteAliases\",\n\t\t\"elevationAliases\"\n\t],\n\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\tif (type === \"elevationAliases\") return `var(--uds-background-color-${value})`;\n\t\treturn theme(mapColorFixtureToValue(type, value));\n\t}\n};\nconst color = {\n\tname: \"color\",\n\tcssProperties: \"color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"foregroundPaletteColors\"\n\t]\n};\nconst fontSize = {\n\tname: \"fontSize\",\n\tcssProperties: \"font-size\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontSize\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst fontVariationSettings = {\n\tname: \"fontVariationSettings\",\n\tcssProperties: \"font-variation-settings\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\"textVariants\"],\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst { value: rawValue } = schemaValue;\n\t\tconst value = textVariantsSafe(rawValue);\n\t\treturn `\"wght\" var(--uds-font-weight-${value}), \"slnt\" var(--uds-font-slant-${value}), \"ital\" var(--uds-font-slant-${value}), \"wdth\" var(--uds-font-width-${value})`;\n\t}\n};\nconst fontWeight = {\n\tname: \"fontWeight\",\n\tcssProperties: \"font-weight\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontWeight\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst fontFamily = {\n\tname: \"fontFamily\",\n\tcssProperties: \"font-family\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"fontFamily\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst textTransform = {\n\tname: \"textTransform\",\n\tcssProperties: \"text-transform\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"textTransform\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst lineHeight = {\n\tname: \"lineHeight\",\n\tcssProperties: \"line-height\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"lineHeight\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst letterSpacing = {\n\tname: \"letterSpacing\",\n\tcssProperties: \"letter-spacing\",\n\ttwThemePath: mapTextVariantFixtureToValue(\"letterSpacing\"),\n\tpossibleFixtures: [\"textVariants\"]\n};\nconst textVariant = {\n\tname: \"textVariant\",\n\tcssProperties: [],\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tpossibleFixtures: [\"textVariants\"],\n\textendedProperties: [\n\t\t\"fontSize\",\n\t\t\"fontWeight\",\n\t\t\"fontFamily\",\n\t\t\"lineHeight\",\n\t\t\"textTransform\",\n\t\t\"fontVariationSettings\",\n\t\t\"letterSpacing\"\n\t]\n};\nconst textDecorationLine = {\n\tname: \"textDecorationLine\",\n\tcssProperties: \"text-decoration-line\",\n\tpossibleFixtures: [\"textDecorationLines\"],\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tcustomValueRenderer: (schemaValue) => {\n\t\treturn String(schemaValue.value);\n\t}\n};\nconst gap = {\n\tname: \"gap\",\n\tcssProperties: \"gap\",\n\ttwThemePath: (fixtureType, value) => fixtureType === \"spacingAliases\" ? `spacing[${value}]` : \"\",\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst borderWidth = {\n\tname: \"borderWidth\",\n\tcssProperties: \"border-width\",\n\ttwThemePath: (fixtureType, value) => {\n\t\tswitch (fixtureType) {\n\t\t\tcase \"borderWidths\":\n\t\t\tcase \"elevationAliases\": return `udsBorderWidth[${value}]`;\n\t\t\tcase \"spacingAliases\": return `spacing[${value}]`;\n\t\t}\n\t\treturn assertUnreachable(fixtureType);\n\t},\n\tpossibleFixtures: [\n\t\t\"borderWidths\",\n\t\t\"spacingAliases\",\n\t\t\"elevationAliases\"\n\t],\n\textendedProperties: (context) => {\n\t\tif (isInputWrapperCtx(context)) return [\n\t\t\t\"outlineWidth\",\n\t\t\t\"insetOutlineOffset\",\n\t\t\t\"solidOutline\"\n\t\t];\n\t\treturn false;\n\t}\n};\nconst strokeWidth = {\n\t...borderWidth,\n\tname: \"strokeWidth\",\n\tcssProperties: \"stroke-width\"\n};\nconst underlineWidth = {\n\t...borderWidth,\n\tname: \"underlineWidth\",\n\tcssProperties: \"border-bottom-width\"\n};\nconst borderColor = {\n\tname: \"borderColor\",\n\tcssProperties: \"border-color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"linePaletteColors\",\n\t\t\"elevationAliases\"\n\t],\n\textendedProperties: (context) => {\n\t\tif (isInputWrapperCtx(context)) return [\"outlineColor\"];\n\t\treturn false;\n\t}\n};\nconst stroke = {\n\t...borderColor,\n\tname: \"stroke\",\n\tcssProperties: \"stroke\"\n};\nconst underlineColor = {\n\t...borderColor,\n\tname: \"underlineColor\",\n\tcssProperties: \"border-bottom-color\"\n};\nconst outlineWidth = {\n\tname: \"outlineWidth\",\n\tcssProperties: \"outline-width\",\n\ttwThemePath: (type, value) => type === \"borderWidths\" ? `udsBorderWidth[${value}]` : `spacing[${value}]`,\n\tpossibleFixtures: [\"borderWidths\", \"spacingAliases\"]\n};\nconst solidOutline = {\n\tname: \"solidOutline\",\n\tcssProperties: \"outline-style\",\n\ttwThemePath: () => \"\",\n\tcustomValueRenderer: () => \"solid\",\n\tpossibleFixtures: []\n};\nconst insetOutlineOffset = {\n\tname: \"insetOutlineOffset\",\n\tcssProperties: \"outline-offset\",\n\ttwThemePath: () => \"\",\n\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\treturn `calc(-1 * ${type === \"borderWidths\" ? theme(`udsBorderWidth[${value}]`) : theme(`spacing[${value}]`)})`;\n\t},\n\tpossibleFixtures: [\"borderWidths\", \"spacingAliases\"]\n};\nconst outlineColor = {\n\tname: \"outlineColor\",\n\tcssProperties: \"outline-color\",\n\ttwThemePath: mapColorFixtureToValue,\n\tpossibleFixtures: [\n\t\t\"alwaysPaletteAliases\",\n\t\t\"spectrumColors\",\n\t\t\"linePaletteColors\"\n\t]\n};\nconst borderRadius = {\n\tname: \"borderRadius\",\n\tcssProperties: \"border-radius\",\n\ttwThemePath: (_, value) => `udsBorderRadius.${value}`,\n\tpossibleFixtures: [\"borderRadii\"]\n};\nconst borderRadiusVar = {\n\t...borderRadius,\n\tname: \"borderRadiusVar\",\n\tcssProperties: `--${BORDER_RADIUS_PREFIX}`\n};\nconst spacing = {\n\tname: \"spacing\",\n\tcssProperties: \"padding\",\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst spacingHorizontal = {\n\tname: \"spacingHorizontal\",\n\tcssProperties: [\"padding-right\", \"padding-left\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst spacingVertical = {\n\tname: \"spacingVertical\",\n\tcssProperties: [\"padding-top\", \"padding-bottom\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst horizontalMargin = {\n\tname: \"horizontalMargin\",\n\tcssProperties: [\"margin-left\", \"margin-right\"],\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst bottomMargin = {\n\tname: \"bottomMargin\",\n\tcssProperties: \"margin-bottom\",\n\ttwThemePath: (_, value) => `spacing[${value}]`,\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst height = {\n\tname: \"height\",\n\tcssProperties: \"height\",\n\ttwThemePath: (_, value) => {\n\t\treturn `height[${value}]`;\n\t},\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst width = {\n\tname: \"width\",\n\tcssProperties: \"width\",\n\ttwThemePath: (_, value) => {\n\t\treturn `width[${value}]`;\n\t},\n\tpossibleFixtures: [\"spacingAliases\"]\n};\nconst shadow = {\n\tname: \"drop shadow\",\n\tcssProperties: \"box-shadow\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tconcatenate: true,\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst shadowType = \"drop\";\n\t\tconst noneValue = \"0 0 0 transparent\";\n\t\tif (schemaValue.valueType === \"alias\") {\n\t\t\tconst noneValue = \"0 0 0 transparent\";\n\t\t\tif (schemaValue.value === \"none\") return noneValue;\n\t\t\tif (schemaValue.value !== \"custom\") return `var(--uds-${shadowType}-shadow-${schemaValue.value})`;\n\t\t} else if (schemaValue.valueType === \"custom\") return schemaValue.value.map((preset, index) => getShadowLayerValue({\n\t\t\tpreset,\n\t\t\tshadowType,\n\t\t\tprefix: index > 0 ? `${index + 1}` : void 0\n\t\t}))?.join(\", \") || noneValue;\n\t\tthrow new Error(\"Invalid valueType\");\n\t},\n\tpossibleFixtures: [\n\t\t\"shadowVariants\",\n\t\t\"shadowVariantConfig\",\n\t\t\"elevationAliases\"\n\t]\n};\nconst insetShadow = {\n\tname: \"inset shadow\",\n\tcssProperties: \"box-shadow\",\n\ttwThemePath: () => {\n\t\treturn ``;\n\t},\n\tconcatenate: true,\n\tcustomValueRenderer: (schemaValue) => {\n\t\tconst shadowType = \"inset\";\n\t\tconst noneValue = \"0 0 0 transparent\";\n\t\tif (schemaValue.valueType === \"alias\") {\n\t\t\tconst noneValue = \"0 0 0 transparent\";\n\t\t\tif (schemaValue.value === \"none\") return noneValue;\n\t\t\tif (schemaValue.value !== \"custom\") return `var(--uds-${shadowType}-shadow-${schemaValue.value})`;\n\t\t} else if (schemaValue.valueType === \"custom\") return schemaValue.value.map((preset, index) => getShadowLayerValue({\n\t\t\tpreset,\n\t\t\tshadowType,\n\t\t\tprefix: index > 0 ? `${index + 1}` : void 0\n\t\t}))?.join(\", \") || noneValue;\n\t\tthrow new Error(\"Invalid valueType\");\n\t},\n\tpossibleFixtures: [\"shadowVariantsWithInvert\"]\n};\nconst shadowVar = {\n\t...shadow,\n\tname: \"shadowVar\",\n\tcssProperties: `--${DROP_SHADOW_PREFIX}`\n};\nconst opacity = {\n\tname: \"opacity\",\n\tcssProperties: \"opacity\",\n\ttwThemePath: (_, value) => `opacity[${value}]`,\n\tpossibleFixtures: [\"opacitySteps\"]\n};\nconst publicProperties = {\n\tbackgroundColor,\n\tborderWidth,\n\tunderlineWidth,\n\tstrokeWidth,\n\tborderRadius,\n\tborderRadiusVar,\n\tborderColor,\n\tunderlineColor,\n\tstroke,\n\tbuttonSize: {\n\t\tname: \"buttonSize\",\n\t\tcssProperties: \"--uds-button-size\",\n\t\tpossibleFixtures: [\"buttonSizes\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\tbuttonVariant: {\n\t\tname: \"buttonVariant\",\n\t\tcssProperties: \"--uds-button-variant\",\n\t\tpossibleFixtures: [\"buttonVariantsFlat\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\tfontFamily,\n\tfontSize,\n\tfontVariationSettings,\n\tlineHeight,\n\ttextTransform,\n\tletterSpacing,\n\tgap,\n\tcolor,\n\topacity,\n\tfillOpacity: {\n\t\tname: \"fillOpacity\",\n\t\tcssProperties: \"fill-opacity\",\n\t\ttwThemePath: (_, value) => `opacity[${value}]`,\n\t\tpossibleFixtures: [\"opacitySteps\"]\n\t},\n\tfontWeight,\n\ticonSize: {\n\t\tname: \"iconSize\",\n\t\tcssProperties: [\"width\", \"height\"],\n\t\ttwThemePath: (_, value) => `sizing.icon.${value}`,\n\t\tpossibleFixtures: [\"iconSizes\"]\n\t},\n\tspacing,\n\ticonVariant: {\n\t\tname: \"iconVariant\",\n\t\tcssProperties: \"--uds-icon-variant\",\n\t\tpossibleFixtures: [\"iconVariants\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\treturn String(schemaValue.value);\n\t\t}\n\t},\n\thorizontalMargin,\n\tbottomMargin,\n\tspacingHorizontal,\n\tspacingVertical,\n\ttextVariant,\n\ttextDecorationLine,\n\tshadow,\n\tshadowVar,\n\tinsetShadow,\n\theight,\n\twidth,\n\tscaleEffect: {\n\t\tname: \"scaleEffect\",\n\t\tcssProperties: BUTTON_SCALE_EFFECT,\n\t\tpossibleFixtures: [\"scaleEffects\"],\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue) => {\n\t\t\tconst value = schemaValue.value;\n\t\t\tconst stringValue = String(value);\n\t\t\treturn String(SCALE_EFFECTS[stringValue] ?? SCALE_EFFECTS.none);\n\t\t}\n\t},\n\tbackdropBlur: {\n\t\tname: \"backdropBlur\",\n\t\tpossibleFixtures: [\"positiveIntegers\"],\n\t\tcssProperties: \"--uds-backdrop-blur\",\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tcustomValueRenderer: (schemaValue, schema, _theme, originalPropertyDefinition) => {\n\t\t\tif (originalPropertyDefinition && originalPropertyDefinition.layerReference) {\n\t\t\t\tconst { variablePath, propertyName } = originalPropertyDefinition.layerReference;\n\t\t\t\tconst property = schema.variables[variablePath][propertyName].rest;\n\t\t\t\tif (property.type === \"elevationAliases\") return `var(--uds-background-blur-radius-${property.value})`;\n\t\t\t}\n\t\t\treturn `blur(${schemaValue.value}px)`;\n\t\t}\n\t},\n\tblurBackgroundColor: {\n\t\t...backgroundColor,\n\t\tname: \"blurBackgroundColor\",\n\t\tcssProperties: `--${BACKGROUND_BLUR_COLOR_PREFIX}`\n\t},\n\tblurBackgroundColorFallback: {\n\t\t...backgroundColor,\n\t\tname: \"blurBackgroundColorFallback\",\n\t\tcssProperties: `--${BACKGROUND_BLUR_FALLBACK_COLOR_PREFIX}`\n\t},\n\tscrimBackgroundColor: {\n\t\tname: \"scrimBackgroundColor\",\n\t\tcssProperties: \"--uds-scrim-background-color\",\n\t\ttwThemePath: () => {\n\t\t\treturn ``;\n\t\t},\n\t\tpossibleFixtures: [\n\t\t\t\"backgroundPaletteColors\",\n\t\t\t\"spectrumColors\",\n\t\t\t\"alwaysPaletteAliases\"\n\t\t],\n\t\tcustomValueRenderer: ({ value, type }, schema, theme) => {\n\t\t\tconst resolved = theme(mapColorFixtureToValue(type, value));\n\t\t\tif (resolved.startsWith(\"#\")) return hexToRgb(resolved) ?? resolved;\n\t\t\tif (resolved.startsWith(\"rgb(\") && resolved.endsWith(\")\")) return resolved.slice(4, -1);\n\t\t\treturn resolved;\n\t\t}\n\t},\n\tscrimOpacity: {\n\t\t...opacity,\n\t\tname: \"scrimOpacity\",\n\t\tcssProperties: \"--uds-scrim-opacity\",\n\t\ttwThemePath: () => \"\",\n\t\tcustomValueRenderer: ({ value }) => `${String(value)}%`\n\t}\n};\nconst internalProperties = {\n\toutlineWidth,\n\toutlineColor,\n\tinsetOutlineOffset,\n\tsolidOutline\n};\nconst configurableProperties = {\n\t...publicProperties,\n\t...internalProperties\n};\n\n//#endregion\nexport { configurableProperties };\n//# sourceMappingURL=properties.js.map"],"mappings":"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"}
@@ -14,6 +14,16 @@ const CSS_LINE_HEIGHT = "line-height";
14
14
  const CSS_BORDER_WIDTH = "border-width";
15
15
  const CSS_BORDER_COLOR = "border-color";
16
16
  const CSS_BOX_SHADOW = "box-shadow";
17
+ const CSS_BORDER_TOP_WIDTH = "border-top-width";
18
+ const CSS_BORDER_RIGHT_WIDTH = "border-right-width";
19
+ const CSS_BORDER_BOTTOM_WIDTH = "border-bottom-width";
20
+ const CSS_BORDER_LEFT_WIDTH = "border-left-width";
21
+ const CSS_BORDER_TOP_COLOR = "border-top-color";
22
+ const CSS_BORDER_RIGHT_COLOR = "border-right-color";
23
+ const CSS_BORDER_BOTTOM_COLOR = "border-bottom-color";
24
+ const CSS_BORDER_LEFT_COLOR = "border-left-color";
25
+ const CSS_TAB_UNDERLINE_WIDTH = "--uds-tab-underline-width";
26
+ const CSS_TAB_UNDERLINE_COLOR = "--uds-tab-underline-color";
17
27
  function deepMerge(target, source) {
18
28
  return (0, lodash_es.mergeWith)({}, target, source);
19
29
  }
@@ -29,6 +39,14 @@ const COMPONENTS_WITH_SHADOW_BORDERS = [
29
39
  {
30
40
  componentName: "chip",
31
41
  layer: "root"
42
+ },
43
+ {
44
+ componentName: "tab",
45
+ layer: "root"
46
+ },
47
+ {
48
+ componentName: "tabs",
49
+ layer: "root"
32
50
  }
33
51
  ];
34
52
  /**
@@ -89,19 +107,48 @@ function getButtonLineHeightWithIconMinimum({ lineHeight, schema, iconLayerKey,
89
107
  * @example
90
108
  * Input: { border-width: '2px', border-color: 'red', box-shadow: '0 2px 4px rgba(0,0,0,0.1)' }
91
109
  * Output: { box-shadow: 'inset 0 0 0 2px red, 0 2px 4px rgba(0,0,0,0.1)' }
110
+ * Renders borders using inset box-shadows instead of CSS border widths.
111
+ * This preserves visual borders without affecting layout dimensions.
92
112
  */
93
113
  function applyBoxShadowBorder(classStyles) {
94
- const borderWidth = classStyles[CSS_BORDER_WIDTH];
95
- const borderColor = classStyles[CSS_BORDER_COLOR];
96
- if (!borderWidth || !borderColor) return classStyles;
97
114
  const stripImportant = (value) => value.replace(/\s*!important\s*$/, "");
98
115
  const hasImportant = (value) => value?.includes("!important") ?? false;
99
- const layers = [`inset 0 0 0 ${stripImportant(borderWidth)} ${stripImportant(borderColor)}`, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
100
- const needsImportant = hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
116
+ const isZeroWidth = (value) => !value || /^(0|0px|0rem|0em|0%)$/i.test(stripImportant(value).trim());
117
+ const negateLength = (value) => {
118
+ const normalized = stripImportant(value).trim();
119
+ if (/^(0|0px|0rem|0em|0%)$/i.test(normalized)) return "0";
120
+ return `calc(${normalized} * -1)`;
121
+ };
122
+ const borderWidth = classStyles[CSS_BORDER_WIDTH];
123
+ const borderColor = classStyles[CSS_BORDER_COLOR];
124
+ const topWidth = classStyles[CSS_BORDER_TOP_WIDTH] ?? borderWidth;
125
+ const rightWidth = classStyles[CSS_BORDER_RIGHT_WIDTH] ?? borderWidth;
126
+ const bottomWidth = classStyles[CSS_BORDER_BOTTOM_WIDTH] ?? borderWidth;
127
+ const leftWidth = classStyles[CSS_BORDER_LEFT_WIDTH] ?? borderWidth;
128
+ const topColor = classStyles[CSS_BORDER_TOP_COLOR] ?? borderColor;
129
+ const rightColor = classStyles[CSS_BORDER_RIGHT_COLOR] ?? borderColor;
130
+ const bottomColor = classStyles[CSS_BORDER_BOTTOM_COLOR] ?? borderColor;
131
+ const leftColor = classStyles[CSS_BORDER_LEFT_COLOR] ?? borderColor;
132
+ const borderLayers = [];
133
+ if (!isZeroWidth(topWidth) && topColor) borderLayers.push(`inset 0 ${stripImportant(topWidth)} 0 0 ${stripImportant(topColor)}`);
134
+ if (!isZeroWidth(rightWidth) && rightColor) borderLayers.push(`inset ${negateLength(rightWidth)} 0 0 0 ${stripImportant(rightColor)}`);
135
+ if (!isZeroWidth(bottomWidth) && bottomColor) borderLayers.push(`inset 0 ${negateLength(bottomWidth)} 0 0 ${stripImportant(bottomColor)}`);
136
+ if (!isZeroWidth(leftWidth) && leftColor) borderLayers.push(`inset ${stripImportant(leftWidth)} 0 0 0 ${stripImportant(leftColor)}`);
137
+ if (borderLayers.length === 0) return classStyles;
138
+ const layers = [...borderLayers, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
139
+ const needsImportant = hasImportant(topWidth) || hasImportant(rightWidth) || hasImportant(bottomWidth) || hasImportant(leftWidth) || hasImportant(topColor) || hasImportant(rightColor) || hasImportant(bottomColor) || hasImportant(leftColor) || hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
101
140
  const newStyles = { ...classStyles };
102
141
  newStyles[CSS_BOX_SHADOW] = layers.join(", ") + (needsImportant ? " !important" : "");
103
142
  delete newStyles[CSS_BORDER_WIDTH];
104
143
  delete newStyles[CSS_BORDER_COLOR];
144
+ delete newStyles[CSS_BORDER_TOP_WIDTH];
145
+ delete newStyles[CSS_BORDER_RIGHT_WIDTH];
146
+ delete newStyles[CSS_BORDER_BOTTOM_WIDTH];
147
+ delete newStyles[CSS_BORDER_LEFT_WIDTH];
148
+ delete newStyles[CSS_BORDER_TOP_COLOR];
149
+ delete newStyles[CSS_BORDER_RIGHT_COLOR];
150
+ delete newStyles[CSS_BORDER_BOTTOM_COLOR];
151
+ delete newStyles[CSS_BORDER_LEFT_COLOR];
105
152
  return newStyles;
106
153
  }
107
154
  function generateClassName({ componentName, subComponentName, variantKey, variantValue, componentStateKey, componentStateValue, layer, layerOptionalPseudoSelector }) {
@@ -256,6 +303,43 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
256
303
  });
257
304
  }
258
305
  }
306
+ if ((componentName === "tabs" || componentName === "tab") && layer === "root") {
307
+ const schemaVariablesForKey = schema?.variables?.[schemaKey];
308
+ if (propertyKey === "borderWidth" && schemaVariablesForKey?.underlineWidth) {
309
+ const borderWidth = cssDeclarations[CSS_BORDER_WIDTH];
310
+ if (borderWidth) {
311
+ cssDeclarations[CSS_BORDER_TOP_WIDTH] = borderWidth;
312
+ cssDeclarations[CSS_BORDER_RIGHT_WIDTH] = borderWidth;
313
+ cssDeclarations[CSS_BORDER_BOTTOM_WIDTH] = borderWidth;
314
+ cssDeclarations[CSS_BORDER_LEFT_WIDTH] = borderWidth;
315
+ delete cssDeclarations[CSS_BORDER_WIDTH];
316
+ }
317
+ }
318
+ if (propertyKey === "borderColor" && schemaVariablesForKey?.underlineColor) {
319
+ const borderColor = cssDeclarations[CSS_BORDER_COLOR];
320
+ if (borderColor) {
321
+ cssDeclarations[CSS_BORDER_TOP_COLOR] = borderColor;
322
+ cssDeclarations[CSS_BORDER_RIGHT_COLOR] = borderColor;
323
+ cssDeclarations[CSS_BORDER_BOTTOM_COLOR] = borderColor;
324
+ cssDeclarations[CSS_BORDER_LEFT_COLOR] = borderColor;
325
+ delete cssDeclarations[CSS_BORDER_COLOR];
326
+ }
327
+ }
328
+ if (propertyKey === "underlineWidth") {
329
+ const underlineWidth = cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
330
+ if (underlineWidth) {
331
+ cssDeclarations[CSS_TAB_UNDERLINE_WIDTH] = underlineWidth;
332
+ delete cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
333
+ }
334
+ }
335
+ if (propertyKey === "underlineColor") {
336
+ const underlineColor = cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
337
+ if (underlineColor) {
338
+ cssDeclarations[CSS_TAB_UNDERLINE_COLOR] = underlineColor;
339
+ delete cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
340
+ }
341
+ }
342
+ }
259
343
  if (!styles[fullClassName]) styles[fullClassName] = {
260
344
  ...cssDeclarations,
261
345
  ...styles[fullClassName]
@@ -397,7 +481,20 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
397
481
  */
398
482
  const toApply = COMPONENTS_WITH_SHADOW_BORDERS.find((c) => c.componentName === componentName);
399
483
  if (toApply) {
400
- for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) styles[className] = applyBoxShadowBorder(styles[className]);
484
+ for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) {
485
+ const raw = styles[className];
486
+ if (toApply.componentName === "tab") {
487
+ const tabUnderlineWidth = raw[CSS_TAB_UNDERLINE_WIDTH];
488
+ const tabUnderlineColor = raw[CSS_TAB_UNDERLINE_COLOR];
489
+ const withoutTabUnderline = { ...raw };
490
+ delete withoutTabUnderline[CSS_TAB_UNDERLINE_WIDTH];
491
+ delete withoutTabUnderline[CSS_TAB_UNDERLINE_COLOR];
492
+ const merged = applyBoxShadowBorder(withoutTabUnderline);
493
+ if (tabUnderlineWidth !== void 0) merged[CSS_TAB_UNDERLINE_WIDTH] = tabUnderlineWidth;
494
+ if (tabUnderlineColor !== void 0) merged[CSS_TAB_UNDERLINE_COLOR] = tabUnderlineColor;
495
+ styles[className] = merged;
496
+ } else styles[className] = applyBoxShadowBorder(raw);
497
+ }
401
498
  }
402
499
  return styles;
403
500
  }
@@ -13,6 +13,16 @@ const CSS_LINE_HEIGHT = "line-height";
13
13
  const CSS_BORDER_WIDTH = "border-width";
14
14
  const CSS_BORDER_COLOR = "border-color";
15
15
  const CSS_BOX_SHADOW = "box-shadow";
16
+ const CSS_BORDER_TOP_WIDTH = "border-top-width";
17
+ const CSS_BORDER_RIGHT_WIDTH = "border-right-width";
18
+ const CSS_BORDER_BOTTOM_WIDTH = "border-bottom-width";
19
+ const CSS_BORDER_LEFT_WIDTH = "border-left-width";
20
+ const CSS_BORDER_TOP_COLOR = "border-top-color";
21
+ const CSS_BORDER_RIGHT_COLOR = "border-right-color";
22
+ const CSS_BORDER_BOTTOM_COLOR = "border-bottom-color";
23
+ const CSS_BORDER_LEFT_COLOR = "border-left-color";
24
+ const CSS_TAB_UNDERLINE_WIDTH = "--uds-tab-underline-width";
25
+ const CSS_TAB_UNDERLINE_COLOR = "--uds-tab-underline-color";
16
26
  function deepMerge(target, source) {
17
27
  return mergeWith({}, target, source);
18
28
  }
@@ -28,6 +38,14 @@ const COMPONENTS_WITH_SHADOW_BORDERS = [
28
38
  {
29
39
  componentName: "chip",
30
40
  layer: "root"
41
+ },
42
+ {
43
+ componentName: "tab",
44
+ layer: "root"
45
+ },
46
+ {
47
+ componentName: "tabs",
48
+ layer: "root"
31
49
  }
32
50
  ];
33
51
  /**
@@ -88,19 +106,48 @@ function getButtonLineHeightWithIconMinimum({ lineHeight, schema, iconLayerKey,
88
106
  * @example
89
107
  * Input: { border-width: '2px', border-color: 'red', box-shadow: '0 2px 4px rgba(0,0,0,0.1)' }
90
108
  * Output: { box-shadow: 'inset 0 0 0 2px red, 0 2px 4px rgba(0,0,0,0.1)' }
109
+ * Renders borders using inset box-shadows instead of CSS border widths.
110
+ * This preserves visual borders without affecting layout dimensions.
91
111
  */
92
112
  function applyBoxShadowBorder(classStyles) {
93
- const borderWidth = classStyles[CSS_BORDER_WIDTH];
94
- const borderColor = classStyles[CSS_BORDER_COLOR];
95
- if (!borderWidth || !borderColor) return classStyles;
96
113
  const stripImportant = (value) => value.replace(/\s*!important\s*$/, "");
97
114
  const hasImportant = (value) => value?.includes("!important") ?? false;
98
- const layers = [`inset 0 0 0 ${stripImportant(borderWidth)} ${stripImportant(borderColor)}`, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
99
- const needsImportant = hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
115
+ const isZeroWidth = (value) => !value || /^(0|0px|0rem|0em|0%)$/i.test(stripImportant(value).trim());
116
+ const negateLength = (value) => {
117
+ const normalized = stripImportant(value).trim();
118
+ if (/^(0|0px|0rem|0em|0%)$/i.test(normalized)) return "0";
119
+ return `calc(${normalized} * -1)`;
120
+ };
121
+ const borderWidth = classStyles[CSS_BORDER_WIDTH];
122
+ const borderColor = classStyles[CSS_BORDER_COLOR];
123
+ const topWidth = classStyles[CSS_BORDER_TOP_WIDTH] ?? borderWidth;
124
+ const rightWidth = classStyles[CSS_BORDER_RIGHT_WIDTH] ?? borderWidth;
125
+ const bottomWidth = classStyles[CSS_BORDER_BOTTOM_WIDTH] ?? borderWidth;
126
+ const leftWidth = classStyles[CSS_BORDER_LEFT_WIDTH] ?? borderWidth;
127
+ const topColor = classStyles[CSS_BORDER_TOP_COLOR] ?? borderColor;
128
+ const rightColor = classStyles[CSS_BORDER_RIGHT_COLOR] ?? borderColor;
129
+ const bottomColor = classStyles[CSS_BORDER_BOTTOM_COLOR] ?? borderColor;
130
+ const leftColor = classStyles[CSS_BORDER_LEFT_COLOR] ?? borderColor;
131
+ const borderLayers = [];
132
+ if (!isZeroWidth(topWidth) && topColor) borderLayers.push(`inset 0 ${stripImportant(topWidth)} 0 0 ${stripImportant(topColor)}`);
133
+ if (!isZeroWidth(rightWidth) && rightColor) borderLayers.push(`inset ${negateLength(rightWidth)} 0 0 0 ${stripImportant(rightColor)}`);
134
+ if (!isZeroWidth(bottomWidth) && bottomColor) borderLayers.push(`inset 0 ${negateLength(bottomWidth)} 0 0 ${stripImportant(bottomColor)}`);
135
+ if (!isZeroWidth(leftWidth) && leftColor) borderLayers.push(`inset ${stripImportant(leftWidth)} 0 0 0 ${stripImportant(leftColor)}`);
136
+ if (borderLayers.length === 0) return classStyles;
137
+ const layers = [...borderLayers, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
138
+ const needsImportant = hasImportant(topWidth) || hasImportant(rightWidth) || hasImportant(bottomWidth) || hasImportant(leftWidth) || hasImportant(topColor) || hasImportant(rightColor) || hasImportant(bottomColor) || hasImportant(leftColor) || hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
100
139
  const newStyles = { ...classStyles };
101
140
  newStyles[CSS_BOX_SHADOW] = layers.join(", ") + (needsImportant ? " !important" : "");
102
141
  delete newStyles[CSS_BORDER_WIDTH];
103
142
  delete newStyles[CSS_BORDER_COLOR];
143
+ delete newStyles[CSS_BORDER_TOP_WIDTH];
144
+ delete newStyles[CSS_BORDER_RIGHT_WIDTH];
145
+ delete newStyles[CSS_BORDER_BOTTOM_WIDTH];
146
+ delete newStyles[CSS_BORDER_LEFT_WIDTH];
147
+ delete newStyles[CSS_BORDER_TOP_COLOR];
148
+ delete newStyles[CSS_BORDER_RIGHT_COLOR];
149
+ delete newStyles[CSS_BORDER_BOTTOM_COLOR];
150
+ delete newStyles[CSS_BORDER_LEFT_COLOR];
104
151
  return newStyles;
105
152
  }
106
153
  function generateClassName({ componentName, subComponentName, variantKey, variantValue, componentStateKey, componentStateValue, layer, layerOptionalPseudoSelector }) {
@@ -255,6 +302,43 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
255
302
  });
256
303
  }
257
304
  }
305
+ if ((componentName === "tabs" || componentName === "tab") && layer === "root") {
306
+ const schemaVariablesForKey = schema?.variables?.[schemaKey];
307
+ if (propertyKey === "borderWidth" && schemaVariablesForKey?.underlineWidth) {
308
+ const borderWidth = cssDeclarations[CSS_BORDER_WIDTH];
309
+ if (borderWidth) {
310
+ cssDeclarations[CSS_BORDER_TOP_WIDTH] = borderWidth;
311
+ cssDeclarations[CSS_BORDER_RIGHT_WIDTH] = borderWidth;
312
+ cssDeclarations[CSS_BORDER_BOTTOM_WIDTH] = borderWidth;
313
+ cssDeclarations[CSS_BORDER_LEFT_WIDTH] = borderWidth;
314
+ delete cssDeclarations[CSS_BORDER_WIDTH];
315
+ }
316
+ }
317
+ if (propertyKey === "borderColor" && schemaVariablesForKey?.underlineColor) {
318
+ const borderColor = cssDeclarations[CSS_BORDER_COLOR];
319
+ if (borderColor) {
320
+ cssDeclarations[CSS_BORDER_TOP_COLOR] = borderColor;
321
+ cssDeclarations[CSS_BORDER_RIGHT_COLOR] = borderColor;
322
+ cssDeclarations[CSS_BORDER_BOTTOM_COLOR] = borderColor;
323
+ cssDeclarations[CSS_BORDER_LEFT_COLOR] = borderColor;
324
+ delete cssDeclarations[CSS_BORDER_COLOR];
325
+ }
326
+ }
327
+ if (propertyKey === "underlineWidth") {
328
+ const underlineWidth = cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
329
+ if (underlineWidth) {
330
+ cssDeclarations[CSS_TAB_UNDERLINE_WIDTH] = underlineWidth;
331
+ delete cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
332
+ }
333
+ }
334
+ if (propertyKey === "underlineColor") {
335
+ const underlineColor = cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
336
+ if (underlineColor) {
337
+ cssDeclarations[CSS_TAB_UNDERLINE_COLOR] = underlineColor;
338
+ delete cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
339
+ }
340
+ }
341
+ }
258
342
  if (!styles[fullClassName]) styles[fullClassName] = {
259
343
  ...cssDeclarations,
260
344
  ...styles[fullClassName]
@@ -396,7 +480,20 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
396
480
  */
397
481
  const toApply = COMPONENTS_WITH_SHADOW_BORDERS.find((c) => c.componentName === componentName);
398
482
  if (toApply) {
399
- for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) styles[className] = applyBoxShadowBorder(styles[className]);
483
+ for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) {
484
+ const raw = styles[className];
485
+ if (toApply.componentName === "tab") {
486
+ const tabUnderlineWidth = raw[CSS_TAB_UNDERLINE_WIDTH];
487
+ const tabUnderlineColor = raw[CSS_TAB_UNDERLINE_COLOR];
488
+ const withoutTabUnderline = { ...raw };
489
+ delete withoutTabUnderline[CSS_TAB_UNDERLINE_WIDTH];
490
+ delete withoutTabUnderline[CSS_TAB_UNDERLINE_COLOR];
491
+ const merged = applyBoxShadowBorder(withoutTabUnderline);
492
+ if (tabUnderlineWidth !== void 0) merged[CSS_TAB_UNDERLINE_WIDTH] = tabUnderlineWidth;
493
+ if (tabUnderlineColor !== void 0) merged[CSS_TAB_UNDERLINE_COLOR] = tabUnderlineColor;
494
+ styles[className] = merged;
495
+ } else styles[className] = applyBoxShadowBorder(raw);
496
+ }
400
497
  }
401
498
  return styles;
402
499
  }