@yahoo/uds 3.126.0 → 3.127.0

package/dist/automated-config/dist/properties.cjs

@@ -155,6 +155,11 @@ const strokeWidth = {
 	name: "strokeWidth",
 	cssProperties: "stroke-width"
 };
+const underlineWidth = {
+	...borderWidth,
+	name: "underlineWidth",
+	cssProperties: "border-bottom-width"
+};
 const borderColor = {
 	name: "borderColor",
 	cssProperties: "border-color",
@@ -175,6 +180,11 @@ const stroke = {
 	name: "stroke",
 	cssProperties: "stroke"
 };
+const underlineColor = {
+	...borderColor,
+	name: "underlineColor",
+	cssProperties: "border-bottom-color"
+};
 const outlineWidth = {
 	name: "outlineWidth",
 	cssProperties: "outline-width",
@@ -328,10 +338,12 @@ const opacity = {
 const publicProperties = {
 	backgroundColor,
 	borderWidth,
+	underlineWidth,
 	strokeWidth,
 	borderRadius,
 	borderRadiusVar,
 	borderColor,
+	underlineColor,
 	stroke,
 	buttonSize: {
 		name: "buttonSize",

package/dist/automated-config/dist/properties.d.cts

@@ -25,10 +25,12 @@ interface ConfigurableProperty<T extends AllPossibleProperties, CVR = unknown> {
 declare const publicProperties: {
   readonly backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
   readonly borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
+  readonly underlineWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   readonly strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   readonly borderRadius: ConfigurableProperty<"borderRadii", unknown>;
   readonly borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
   readonly borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
+  readonly underlineColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   readonly stroke: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   readonly buttonSize: ConfigurableProperty<"buttonSizes", unknown>;
   readonly buttonVariant: ConfigurableProperty<"buttonVariantsFlat", unknown>;
@@ -71,10 +73,12 @@ declare const configurableProperties: {
   solidOutline: ConfigurableProperty<never, unknown>;
   backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
   borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
+  underlineWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   borderRadius: ConfigurableProperty<"borderRadii", unknown>;
   borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
   borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
+  underlineColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   stroke: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   buttonSize: ConfigurableProperty<"buttonSizes", unknown>;
   buttonVariant: ConfigurableProperty<"buttonVariantsFlat", unknown>;

package/dist/automated-config/dist/properties.d.ts

@@ -25,10 +25,12 @@ interface ConfigurableProperty<T extends AllPossibleProperties, CVR = unknown> {
 declare const publicProperties: {
   readonly backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
   readonly borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
+  readonly underlineWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   readonly strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   readonly borderRadius: ConfigurableProperty<"borderRadii", unknown>;
   readonly borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
   readonly borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
+  readonly underlineColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   readonly stroke: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   readonly buttonSize: ConfigurableProperty<"buttonSizes", unknown>;
   readonly buttonVariant: ConfigurableProperty<"buttonVariantsFlat", unknown>;
@@ -71,10 +73,12 @@ declare const configurableProperties: {
   solidOutline: ConfigurableProperty<never, unknown>;
   backgroundColor: ConfigurableProperty<"backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases" | "elevationAliases", unknown>;
   borderWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
+  underlineWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   strokeWidth: ConfigurableProperty<"elevationAliases" | "borderWidths" | "spacingAliases", unknown>;
   borderRadius: ConfigurableProperty<"borderRadii", unknown>;
   borderRadiusVar: ConfigurableProperty<"borderRadii", unknown>;
   borderColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
+  underlineColor: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   stroke: ConfigurableProperty<"spectrumColors" | "alwaysPaletteAliases" | "elevationAliases" | "linePaletteColors", unknown>;
   buttonSize: ConfigurableProperty<"buttonSizes", unknown>;
   buttonVariant: ConfigurableProperty<"buttonVariantsFlat", unknown>;

package/dist/automated-config/dist/properties.js

@@ -155,6 +155,11 @@ const strokeWidth = {
 	name: "strokeWidth",
 	cssProperties: "stroke-width"
 };
+const underlineWidth = {
+	...borderWidth,
+	name: "underlineWidth",
+	cssProperties: "border-bottom-width"
+};
 const borderColor = {
 	name: "borderColor",
 	cssProperties: "border-color",
@@ -175,6 +180,11 @@ const stroke = {
 	name: "stroke",
 	cssProperties: "stroke"
 };
+const underlineColor = {
+	...borderColor,
+	name: "underlineColor",
+	cssProperties: "border-bottom-color"
+};
 const outlineWidth = {
 	name: "outlineWidth",
 	cssProperties: "outline-width",
@@ -328,10 +338,12 @@ const opacity = {
 const publicProperties = {
 	backgroundColor,
 	borderWidth,
+	underlineWidth,
 	strokeWidth,
 	borderRadius,
 	borderRadiusVar,
 	borderColor,
+	underlineColor,
 	stroke,
 	buttonSize: {
 		name: "buttonSize",

package/dist/automated-config/dist/utils/getConfigVariantProperties.d.cts

@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.cjs";
  * @returns A Record of layer names to their properties, or null if no properties are found
  */
 declare function getConfigVariantProperties(variant?: VariantConfig): {
-  [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" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
-  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" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
 } | null; //#endregion
 //#endregion
 export { getConfigVariantProperties };

package/dist/automated-config/dist/utils/getConfigVariantProperties.d.ts

@@ -11,8 +11,8 @@ import { SelectedConfigurableProperty } from "../properties.js";
  * @returns A Record of layer names to their properties, or null if no properties are found
  */
 declare function getConfigVariantProperties(variant?: VariantConfig): {
-  [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" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
-  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" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  [x: string]: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
+  root: Readonly<Record<string, SelectedConfigurableProperty<"textTransform" | "fontSize" | "fontWeight" | "lineHeight" | "fontFamily" | "letterSpacing" | "backgroundColor" | "borderWidth" | "underlineWidth" | "strokeWidth" | "borderRadius" | "borderRadiusVar" | "borderColor" | "underlineColor" | "stroke" | "buttonSize" | "buttonVariant" | "fontVariationSettings" | "gap" | "color" | "opacity" | "fillOpacity" | "iconSize" | "spacing" | "iconVariant" | "horizontalMargin" | "bottomMargin" | "spacingHorizontal" | "spacingVertical" | "textVariant" | "textDecorationLine" | "shadow" | "shadowVar" | "insetShadow" | "height" | "width" | "scaleEffect" | "backdropBlur" | "blurBackgroundColor" | "blurBackgroundColorFallback" | "scrimBackgroundColor" | "scrimOpacity", 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 ("backgroundPaletteColors" | "spectrumColors" | "alwaysPaletteAliases")[], readonly (readonly unknown[])[]>>>;
 } | null; //#endregion
 //#endregion
 export { getConfigVariantProperties };

package/dist/automated-config/dist/utils/index.cjs

@@ -24,6 +24,16 @@ const CSS_LINE_HEIGHT = "line-height";
 const CSS_BORDER_WIDTH = "border-width";
 const CSS_BORDER_COLOR = "border-color";
 const CSS_BOX_SHADOW = "box-shadow";
+const CSS_BORDER_TOP_WIDTH = "border-top-width";
+const CSS_BORDER_RIGHT_WIDTH = "border-right-width";
+const CSS_BORDER_BOTTOM_WIDTH = "border-bottom-width";
+const CSS_BORDER_LEFT_WIDTH = "border-left-width";
+const CSS_BORDER_TOP_COLOR = "border-top-color";
+const CSS_BORDER_RIGHT_COLOR = "border-right-color";
+const CSS_BORDER_BOTTOM_COLOR = "border-bottom-color";
+const CSS_BORDER_LEFT_COLOR = "border-left-color";
+const CSS_TAB_UNDERLINE_WIDTH = "--uds-tab-underline-width";
+const CSS_TAB_UNDERLINE_COLOR = "--uds-tab-underline-color";
 function deepMerge(target, source) {
 	return (0, lodash_es.mergeWith)({}, target, source);
 }
@@ -39,6 +49,14 @@ const COMPONENTS_WITH_SHADOW_BORDERS = [
 	{
 		componentName: "chip",
 		layer: "root"
+	},
+	{
+		componentName: "tab",
+		layer: "root"
+	},
+	{
+		componentName: "tabs",
+		layer: "root"
 	}
 ];
 /**
@@ -99,19 +117,48 @@ function getButtonLineHeightWithIconMinimum({ lineHeight, schema, iconLayerKey,
 * @example
 * Input:  { border-width: '2px', border-color: 'red', box-shadow: '0 2px 4px rgba(0,0,0,0.1)' }
 * Output: { box-shadow: 'inset 0 0 0 2px red, 0 2px 4px rgba(0,0,0,0.1)' }
+* Renders borders using inset box-shadows instead of CSS border widths.
+* This preserves visual borders without affecting layout dimensions.
 */
 function applyBoxShadowBorder(classStyles) {
-	const borderWidth = classStyles[CSS_BORDER_WIDTH];
-	const borderColor = classStyles[CSS_BORDER_COLOR];
-	if (!borderWidth || !borderColor) return classStyles;
 	const stripImportant = (value) => value.replace(/\s*!important\s*$/, "");
 	const hasImportant = (value) => value?.includes("!important") ?? false;
-	const layers = [`inset 0 0 0 ${stripImportant(borderWidth)} ${stripImportant(borderColor)}`, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
-	const needsImportant = hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
+	const isZeroWidth = (value) => !value || /^(0|0px|0rem|0em|0%)$/i.test(stripImportant(value).trim());
+	const negateLength = (value) => {
+		const normalized = stripImportant(value).trim();
+		if (/^(0|0px|0rem|0em|0%)$/i.test(normalized)) return "0";
+		return `calc(${normalized} * -1)`;
+	};
+	const borderWidth = classStyles[CSS_BORDER_WIDTH];
+	const borderColor = classStyles[CSS_BORDER_COLOR];
+	const topWidth = classStyles[CSS_BORDER_TOP_WIDTH] ?? borderWidth;
+	const rightWidth = classStyles[CSS_BORDER_RIGHT_WIDTH] ?? borderWidth;
+	const bottomWidth = classStyles[CSS_BORDER_BOTTOM_WIDTH] ?? borderWidth;
+	const leftWidth = classStyles[CSS_BORDER_LEFT_WIDTH] ?? borderWidth;
+	const topColor = classStyles[CSS_BORDER_TOP_COLOR] ?? borderColor;
+	const rightColor = classStyles[CSS_BORDER_RIGHT_COLOR] ?? borderColor;
+	const bottomColor = classStyles[CSS_BORDER_BOTTOM_COLOR] ?? borderColor;
+	const leftColor = classStyles[CSS_BORDER_LEFT_COLOR] ?? borderColor;
+	const borderLayers = [];
+	if (!isZeroWidth(topWidth) && topColor) borderLayers.push(`inset 0 ${stripImportant(topWidth)} 0 0 ${stripImportant(topColor)}`);
+	if (!isZeroWidth(rightWidth) && rightColor) borderLayers.push(`inset ${negateLength(rightWidth)} 0 0 0 ${stripImportant(rightColor)}`);
+	if (!isZeroWidth(bottomWidth) && bottomColor) borderLayers.push(`inset 0 ${negateLength(bottomWidth)} 0 0 ${stripImportant(bottomColor)}`);
+	if (!isZeroWidth(leftWidth) && leftColor) borderLayers.push(`inset ${stripImportant(leftWidth)} 0 0 0 ${stripImportant(leftColor)}`);
+	if (borderLayers.length === 0) return classStyles;
+	const layers = [...borderLayers, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
+	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]);
 	const newStyles = { ...classStyles };
 	newStyles[CSS_BOX_SHADOW] = layers.join(", ") + (needsImportant ? " !important" : "");
 	delete newStyles[CSS_BORDER_WIDTH];
 	delete newStyles[CSS_BORDER_COLOR];
+	delete newStyles[CSS_BORDER_TOP_WIDTH];
+	delete newStyles[CSS_BORDER_RIGHT_WIDTH];
+	delete newStyles[CSS_BORDER_BOTTOM_WIDTH];
+	delete newStyles[CSS_BORDER_LEFT_WIDTH];
+	delete newStyles[CSS_BORDER_TOP_COLOR];
+	delete newStyles[CSS_BORDER_RIGHT_COLOR];
+	delete newStyles[CSS_BORDER_BOTTOM_COLOR];
+	delete newStyles[CSS_BORDER_LEFT_COLOR];
 	return newStyles;
 }
 function generateClassName({ componentName, subComponentName, variantKey, variantValue, componentStateKey, componentStateValue, layer, layerOptionalPseudoSelector }) {
@@ -266,6 +313,43 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
 				});
 			}
 		}
+		if ((componentName === "tabs" || componentName === "tab") && layer === "root") {
+			const schemaVariablesForKey = schema?.variables?.[schemaKey];
+			if (propertyKey === "borderWidth" && schemaVariablesForKey?.underlineWidth) {
+				const borderWidth = cssDeclarations[CSS_BORDER_WIDTH];
+				if (borderWidth) {
+					cssDeclarations[CSS_BORDER_TOP_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_RIGHT_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_BOTTOM_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_LEFT_WIDTH] = borderWidth;
+					delete cssDeclarations[CSS_BORDER_WIDTH];
+				}
+			}
+			if (propertyKey === "borderColor" && schemaVariablesForKey?.underlineColor) {
+				const borderColor = cssDeclarations[CSS_BORDER_COLOR];
+				if (borderColor) {
+					cssDeclarations[CSS_BORDER_TOP_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_RIGHT_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_BOTTOM_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_LEFT_COLOR] = borderColor;
+					delete cssDeclarations[CSS_BORDER_COLOR];
+				}
+			}
+			if (propertyKey === "underlineWidth") {
+				const underlineWidth = cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
+				if (underlineWidth) {
+					cssDeclarations[CSS_TAB_UNDERLINE_WIDTH] = underlineWidth;
+					delete cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
+				}
+			}
+			if (propertyKey === "underlineColor") {
+				const underlineColor = cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
+				if (underlineColor) {
+					cssDeclarations[CSS_TAB_UNDERLINE_COLOR] = underlineColor;
+					delete cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
+				}
+			}
+		}
 		if (!styles[fullClassName]) styles[fullClassName] = {
 			...cssDeclarations,
 			...styles[fullClassName]
@@ -407,7 +491,20 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
 	*/
 	const toApply = COMPONENTS_WITH_SHADOW_BORDERS.find((c) => c.componentName === componentName);
 	if (toApply) {
-		for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) styles[className] = applyBoxShadowBorder(styles[className]);
+		for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) {
+			const raw = styles[className];
+			if (toApply.componentName === "tab") {
+				const tabUnderlineWidth = raw[CSS_TAB_UNDERLINE_WIDTH];
+				const tabUnderlineColor = raw[CSS_TAB_UNDERLINE_COLOR];
+				const withoutTabUnderline = { ...raw };
+				delete withoutTabUnderline[CSS_TAB_UNDERLINE_WIDTH];
+				delete withoutTabUnderline[CSS_TAB_UNDERLINE_COLOR];
+				const merged = applyBoxShadowBorder(withoutTabUnderline);
+				if (tabUnderlineWidth !== void 0) merged[CSS_TAB_UNDERLINE_WIDTH] = tabUnderlineWidth;
+				if (tabUnderlineColor !== void 0) merged[CSS_TAB_UNDERLINE_COLOR] = tabUnderlineColor;
+				styles[className] = merged;
+			} else styles[className] = applyBoxShadowBorder(raw);
+		}
 	}
 	return styles;
 }

package/dist/automated-config/dist/utils/index.js

@@ -23,6 +23,16 @@ const CSS_LINE_HEIGHT = "line-height";
 const CSS_BORDER_WIDTH = "border-width";
 const CSS_BORDER_COLOR = "border-color";
 const CSS_BOX_SHADOW = "box-shadow";
+const CSS_BORDER_TOP_WIDTH = "border-top-width";
+const CSS_BORDER_RIGHT_WIDTH = "border-right-width";
+const CSS_BORDER_BOTTOM_WIDTH = "border-bottom-width";
+const CSS_BORDER_LEFT_WIDTH = "border-left-width";
+const CSS_BORDER_TOP_COLOR = "border-top-color";
+const CSS_BORDER_RIGHT_COLOR = "border-right-color";
+const CSS_BORDER_BOTTOM_COLOR = "border-bottom-color";
+const CSS_BORDER_LEFT_COLOR = "border-left-color";
+const CSS_TAB_UNDERLINE_WIDTH = "--uds-tab-underline-width";
+const CSS_TAB_UNDERLINE_COLOR = "--uds-tab-underline-color";
 function deepMerge(target, source) {
 	return mergeWith({}, target, source);
 }
@@ -38,6 +48,14 @@ const COMPONENTS_WITH_SHADOW_BORDERS = [
 	{
 		componentName: "chip",
 		layer: "root"
+	},
+	{
+		componentName: "tab",
+		layer: "root"
+	},
+	{
+		componentName: "tabs",
+		layer: "root"
 	}
 ];
 /**
@@ -98,19 +116,48 @@ function getButtonLineHeightWithIconMinimum({ lineHeight, schema, iconLayerKey,
 * @example
 * Input:  { border-width: '2px', border-color: 'red', box-shadow: '0 2px 4px rgba(0,0,0,0.1)' }
 * Output: { box-shadow: 'inset 0 0 0 2px red, 0 2px 4px rgba(0,0,0,0.1)' }
+* Renders borders using inset box-shadows instead of CSS border widths.
+* This preserves visual borders without affecting layout dimensions.
 */
 function applyBoxShadowBorder(classStyles) {
-	const borderWidth = classStyles[CSS_BORDER_WIDTH];
-	const borderColor = classStyles[CSS_BORDER_COLOR];
-	if (!borderWidth || !borderColor) return classStyles;
 	const stripImportant = (value) => value.replace(/\s*!important\s*$/, "");
 	const hasImportant = (value) => value?.includes("!important") ?? false;
-	const layers = [`inset 0 0 0 ${stripImportant(borderWidth)} ${stripImportant(borderColor)}`, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
-	const needsImportant = hasImportant(borderWidth) || hasImportant(borderColor) || hasImportant(classStyles[CSS_BOX_SHADOW]);
+	const isZeroWidth = (value) => !value || /^(0|0px|0rem|0em|0%)$/i.test(stripImportant(value).trim());
+	const negateLength = (value) => {
+		const normalized = stripImportant(value).trim();
+		if (/^(0|0px|0rem|0em|0%)$/i.test(normalized)) return "0";
+		return `calc(${normalized} * -1)`;
+	};
+	const borderWidth = classStyles[CSS_BORDER_WIDTH];
+	const borderColor = classStyles[CSS_BORDER_COLOR];
+	const topWidth = classStyles[CSS_BORDER_TOP_WIDTH] ?? borderWidth;
+	const rightWidth = classStyles[CSS_BORDER_RIGHT_WIDTH] ?? borderWidth;
+	const bottomWidth = classStyles[CSS_BORDER_BOTTOM_WIDTH] ?? borderWidth;
+	const leftWidth = classStyles[CSS_BORDER_LEFT_WIDTH] ?? borderWidth;
+	const topColor = classStyles[CSS_BORDER_TOP_COLOR] ?? borderColor;
+	const rightColor = classStyles[CSS_BORDER_RIGHT_COLOR] ?? borderColor;
+	const bottomColor = classStyles[CSS_BORDER_BOTTOM_COLOR] ?? borderColor;
+	const leftColor = classStyles[CSS_BORDER_LEFT_COLOR] ?? borderColor;
+	const borderLayers = [];
+	if (!isZeroWidth(topWidth) && topColor) borderLayers.push(`inset 0 ${stripImportant(topWidth)} 0 0 ${stripImportant(topColor)}`);
+	if (!isZeroWidth(rightWidth) && rightColor) borderLayers.push(`inset ${negateLength(rightWidth)} 0 0 0 ${stripImportant(rightColor)}`);
+	if (!isZeroWidth(bottomWidth) && bottomColor) borderLayers.push(`inset 0 ${negateLength(bottomWidth)} 0 0 ${stripImportant(bottomColor)}`);
+	if (!isZeroWidth(leftWidth) && leftColor) borderLayers.push(`inset ${stripImportant(leftWidth)} 0 0 0 ${stripImportant(leftColor)}`);
+	if (borderLayers.length === 0) return classStyles;
+	const layers = [...borderLayers, classStyles[CSS_BOX_SHADOW] && stripImportant(classStyles[CSS_BOX_SHADOW])].filter(Boolean);
+	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]);
 	const newStyles = { ...classStyles };
 	newStyles[CSS_BOX_SHADOW] = layers.join(", ") + (needsImportant ? " !important" : "");
 	delete newStyles[CSS_BORDER_WIDTH];
 	delete newStyles[CSS_BORDER_COLOR];
+	delete newStyles[CSS_BORDER_TOP_WIDTH];
+	delete newStyles[CSS_BORDER_RIGHT_WIDTH];
+	delete newStyles[CSS_BORDER_BOTTOM_WIDTH];
+	delete newStyles[CSS_BORDER_LEFT_WIDTH];
+	delete newStyles[CSS_BORDER_TOP_COLOR];
+	delete newStyles[CSS_BORDER_RIGHT_COLOR];
+	delete newStyles[CSS_BORDER_BOTTOM_COLOR];
+	delete newStyles[CSS_BORDER_LEFT_COLOR];
 	return newStyles;
 }
 function generateClassName({ componentName, subComponentName, variantKey, variantValue, componentStateKey, componentStateValue, layer, layerOptionalPseudoSelector }) {
@@ -265,6 +312,43 @@ function generateDeclaration({ componentName, subComponentName, variantKey, vari
 				});
 			}
 		}
+		if ((componentName === "tabs" || componentName === "tab") && layer === "root") {
+			const schemaVariablesForKey = schema?.variables?.[schemaKey];
+			if (propertyKey === "borderWidth" && schemaVariablesForKey?.underlineWidth) {
+				const borderWidth = cssDeclarations[CSS_BORDER_WIDTH];
+				if (borderWidth) {
+					cssDeclarations[CSS_BORDER_TOP_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_RIGHT_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_BOTTOM_WIDTH] = borderWidth;
+					cssDeclarations[CSS_BORDER_LEFT_WIDTH] = borderWidth;
+					delete cssDeclarations[CSS_BORDER_WIDTH];
+				}
+			}
+			if (propertyKey === "borderColor" && schemaVariablesForKey?.underlineColor) {
+				const borderColor = cssDeclarations[CSS_BORDER_COLOR];
+				if (borderColor) {
+					cssDeclarations[CSS_BORDER_TOP_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_RIGHT_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_BOTTOM_COLOR] = borderColor;
+					cssDeclarations[CSS_BORDER_LEFT_COLOR] = borderColor;
+					delete cssDeclarations[CSS_BORDER_COLOR];
+				}
+			}
+			if (propertyKey === "underlineWidth") {
+				const underlineWidth = cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
+				if (underlineWidth) {
+					cssDeclarations[CSS_TAB_UNDERLINE_WIDTH] = underlineWidth;
+					delete cssDeclarations[CSS_BORDER_BOTTOM_WIDTH];
+				}
+			}
+			if (propertyKey === "underlineColor") {
+				const underlineColor = cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
+				if (underlineColor) {
+					cssDeclarations[CSS_TAB_UNDERLINE_COLOR] = underlineColor;
+					delete cssDeclarations[CSS_BORDER_BOTTOM_COLOR];
+				}
+			}
+		}
 		if (!styles[fullClassName]) styles[fullClassName] = {
 			...cssDeclarations,
 			...styles[fullClassName]
@@ -406,7 +490,20 @@ function generateConfigStyles(config, schema, theme, previewOptions) {
 	*/
 	const toApply = COMPONENTS_WITH_SHADOW_BORDERS.find((c) => c.componentName === componentName);
 	if (toApply) {
-		for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) styles[className] = applyBoxShadowBorder(styles[className]);
+		for (const className in styles) if (className.includes(`-${toApply.layer}`.toLowerCase())) {
+			const raw = styles[className];
+			if (toApply.componentName === "tab") {
+				const tabUnderlineWidth = raw[CSS_TAB_UNDERLINE_WIDTH];
+				const tabUnderlineColor = raw[CSS_TAB_UNDERLINE_COLOR];
+				const withoutTabUnderline = { ...raw };
+				delete withoutTabUnderline[CSS_TAB_UNDERLINE_WIDTH];
+				delete withoutTabUnderline[CSS_TAB_UNDERLINE_COLOR];
+				const merged = applyBoxShadowBorder(withoutTabUnderline);
+				if (tabUnderlineWidth !== void 0) merged[CSS_TAB_UNDERLINE_WIDTH] = tabUnderlineWidth;
+				if (tabUnderlineColor !== void 0) merged[CSS_TAB_UNDERLINE_COLOR] = tabUnderlineColor;
+				styles[className] = merged;
+			} else styles[className] = applyBoxShadowBorder(raw);
+		}
 	}
 	return styles;
 }

package/dist/components/client/Menu/Menu.ItemCheckbox.d.cts

@@ -88,6 +88,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
  *
  * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
  **/
-declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "hideEndIcon" | "rootProps" | "active"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "rootProps" | "hideEndIcon" | "active"> & react.RefAttributes<HTMLDivElement>>;
 //#endregion
 export { MenuItemCheckbox, type MenuItemCheckboxProps };

package/dist/components/client/Menu/Menu.ItemCheckbox.d.ts

@@ -89,6 +89,6 @@ interface MenuItemCheckboxProps extends Omit<PressableProps, 'asChild'>, HtmlBut
  *
  * @related [Menu](https://uds.build/docs/components/menu), [Menu.Item](https://uds.build/docs/components/menu-item)
  **/
-declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "hideEndIcon" | "rootProps" | "active"> & react.RefAttributes<HTMLDivElement>>;
+declare const MenuItemCheckbox: react.ForwardRefExoticComponent<Omit<MenuItemCheckboxProps, "rootProps" | "hideEndIcon" | "active"> & react.RefAttributes<HTMLDivElement>>;
 //#endregion
 export { MenuItemCheckbox, type MenuItemCheckboxProps };

package/dist/components/client/Tabs/Tab.cjs

@@ -0,0 +1,80 @@
+/*! © 2026 Yahoo, Inc. UDS v0.0.0-development */
+"use client";
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_runtime = require('../../../_virtual/_rolldown/runtime.cjs');
+const require_styles_styler = require('../../../styles/styler.cjs');
+const require_components_IconSlot = require('../../IconSlot.cjs');
+const require_components_Text = require('../../Text.cjs');
+const require_components_client_Tabs_tabsContext = require('./tabsContext.cjs');
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _ariakit_react = require("@ariakit/react");
+
+//#region src/components/client/Tabs/Tab.tsx
+/** Matches {@link TabList} sliding-indicator underline (token CSS variables on the tab root). */
+const tabRootUnderlineClassName = require_styles_styler.cx("pointer-events-none absolute bottom-0 left-0 right-0", "h-[var(--uds-tab-underline-width,0px)] bg-[var(--uds-tab-underline-color,transparent)]", "transition-[height,background-color] duration-[240ms] ease-[cubic-bezier(0.2,0,0,1)]");
+function Tab({ value, children, startIcon, endIcon, disabled, asChild = false, className }) {
+	const generatedId = (0, react.useId)();
+	const uid = value ?? `uds-tab-${generatedId}`;
+	const { variant, disableMotion } = require_components_client_Tabs_tabsContext.useTabsContext();
+	const store = (0, _ariakit_react.useTabContext)();
+	if (!store) throw new Error("Tab must be wrapped in a Tabs component");
+	const selectedId = (0, _ariakit_react.useStoreState)(store, "selectedId");
+	const activeState = disabled || selectedId !== uid ? "off" : "on";
+	const rootBaseClass = require_styles_styler.getStyles({
+		tabSizeRoot: "default",
+		tabVariantRoot: variant,
+		tabVariantActiveRoot: "off"
+	});
+	const rootOnClass = require_styles_styler.getStyles({
+		tabSizeRoot: "default",
+		tabVariantRoot: variant,
+		tabVariantActiveRoot: "on"
+	});
+	const configClass = activeState === "on" ? require_styles_styler.cx(rootOnClass, !disableMotion && require_styles_styler.cx("!bg-transparent", "!shadow-none")) : rootBaseClass;
+	const iconConfigClass = require_styles_styler.getStyles({
+		tabSizeIcon: "default",
+		tabVariantIcon: variant,
+		tabVariantActiveIcon: activeState
+	});
+	const tabClass = require_styles_styler.cx(configClass, "inline-flex items-center shrink-0 box-border relative", !disableMotion && "z-[1]", "cursor-pointer select-none whitespace-nowrap", !disabled && "uds-ring", disabled && "opacity-50 cursor-default pointer-events-none", "border-solid border-b-solid", "transition-colors duration-[240ms] ease-[cubic-bezier(0.2,0,0,1)]", className);
+	const resolvedContent = asChild && (0, react.isValidElement)(children) ? children.props.children ?? null : children;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_ariakit_react.Tab, {
+		id: uid,
+		disabled,
+		className: tabClass,
+		render: asChild && (0, react.isValidElement)(children) ? children : void 0,
+		children: [
+			!(activeState === "on" && !disableMotion) ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+				"aria-hidden": true,
+				className: tabRootUnderlineClassName
+			}) : null,
+			startIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
+				icon: startIcon,
+				iconProps: {
+					size: "sm",
+					color: "current"
+				},
+				className: iconConfigClass
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_Text.Text, {
+				variant: "inherit",
+				as: "span",
+				color: "current",
+				children: resolvedContent
+			}),
+			endIcon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_IconSlot.IconSlot, {
+				icon: endIcon,
+				iconProps: {
+					size: "sm",
+					color: "current"
+				},
+				className: iconConfigClass
+			})
+		]
+	});
+}
+Tab.displayName = "Tab";
+
+//#endregion
+exports.Tab = Tab;

package/dist/components/client/Tabs/Tab.d.cts

@@ -0,0 +1,20 @@
+
+import { UniversalTabProps } from "../../../types/dist/index.cjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/client/Tabs/Tab.d.ts
+type TabProps = UniversalTabProps;
+declare function Tab({
+  value,
+  children,
+  startIcon,
+  endIcon,
+  disabled,
+  asChild,
+  className
+}: TabProps): react_jsx_runtime0.JSX.Element;
+declare namespace Tab {
+  var displayName: string;
+}
+//#endregion
+export { Tab, type TabProps };

package/dist/components/client/Tabs/Tab.d.ts

@@ -0,0 +1,21 @@
+
+"use client";
+import { UniversalTabProps } from "../../../types/dist/index.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/client/Tabs/Tab.d.ts
+type TabProps = UniversalTabProps;
+declare function Tab({
+  value,
+  children,
+  startIcon,
+  endIcon,
+  disabled,
+  asChild,
+  className
+}: TabProps): react_jsx_runtime0.JSX.Element;
+declare namespace Tab {
+  var displayName: string;
+}
+//#endregion
+export { Tab, type TabProps };