@yahoo/uds 3.66.1 → 3.67.0-beta.1

package/dist/tailwind/components/getIconStyles.d.cts

@@ -0,0 +1,10 @@
+import { CssStyleObject } from "./types.cjs";
+
+//#region src/tailwind/components/getIconStyles.d.ts
+
+/**
+ * Generates icon styles for light/dark mode using CSS variables
+ */
+declare function getIconStyles(): CssStyleObject;
+//#endregion
+export { getIconStyles };

package/dist/tailwind/components/getIconStyles.d.ts

@@ -0,0 +1,10 @@
+import { CssStyleObject } from "./types.js";
+
+//#region src/tailwind/components/getIconStyles.d.ts
+
+/**
+ * Generates icon styles for light/dark mode using CSS variables
+ */
+declare function getIconStyles(): CssStyleObject;
+//#endregion
+export { getIconStyles };

package/dist/tailwind/components/getIconStyles.js

@@ -0,0 +1,14 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+//#region src/tailwind/components/getIconStyles.ts
+/**
+* Generates icon styles for light/dark mode using CSS variables
+*/
+function getIconStyles() {
+	return {
+		".uds-light-mode-icon": { display: "var(--uds-light-mode-icon, inline)" },
+		".uds-dark-mode-icon": { display: "var(--uds-dark-mode-icon, none)" }
+	};
+}
+
+//#endregion
+export { getIconStyles };

package/dist/tailwind/components/getInputStyles.cjs

@@ -0,0 +1,16 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+
+//#region src/tailwind/components/getInputStyles.ts
+/**
+* Generates input styles
+*/
+function getInputStyles() {
+	return {
+		[".uds-input[list]::-webkit-calendar-picker-indicator"]: { blockSize: "100% !important" },
+		[".uds-input::-webkit-datetime-edit"]: { color: `rgb(var(--uds-foreground-color-muted))` },
+		[".uds-input::-webkit-calendar-picker-indicator"]: { display: "none" }
+	};
+}
+
+//#endregion
+exports.getInputStyles = getInputStyles;

package/dist/tailwind/components/getInputStyles.d.cts

@@ -0,0 +1,10 @@
+import { CssStyleObject } from "./types.cjs";
+
+//#region src/tailwind/components/getInputStyles.d.ts
+
+/**
+ * Generates input styles
+ */
+declare function getInputStyles(): CssStyleObject;
+//#endregion
+export { getInputStyles };

package/dist/tailwind/components/getInputStyles.d.ts

@@ -0,0 +1,10 @@
+import { CssStyleObject } from "./types.js";
+
+//#region src/tailwind/components/getInputStyles.d.ts
+
+/**
+ * Generates input styles
+ */
+declare function getInputStyles(): CssStyleObject;
+//#endregion
+export { getInputStyles };

package/dist/tailwind/components/getInputStyles.js

@@ -0,0 +1,15 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+//#region src/tailwind/components/getInputStyles.ts
+/**
+* Generates input styles
+*/
+function getInputStyles() {
+	return {
+		[".uds-input[list]::-webkit-calendar-picker-indicator"]: { blockSize: "100% !important" },
+		[".uds-input::-webkit-datetime-edit"]: { color: `rgb(var(--uds-foreground-color-muted))` },
+		[".uds-input::-webkit-calendar-picker-indicator"]: { display: "none" }
+	};
+}
+
+//#endregion
+export { getInputStyles };

package/dist/tailwind/components/getResponsiveTextStyles.cjs

@@ -0,0 +1,73 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_tokens_consts_cssTokens = require('../../tokens/consts/cssTokens.cjs');
+const require_utils_assertUnreachable = require('../../utils/assertUnreachable.cjs');
+const require_utils_entries = require('../../utils/entries.cjs');
+let __yahoo_uds_fixtures = require("@yahoo/uds/fixtures");
+let lodash_isString_js = require("lodash/isString.js");
+lodash_isString_js = require_rolldown_runtime.__toESM(lodash_isString_js);
+
+//#region src/tailwind/components/getResponsiveTextStyles.ts
+const textVariantsSafe = (variant) => variant.replace("/", "-");
+const BASE_SIZE = 16;
+const toRem = (size) => `${size / BASE_SIZE}rem`;
+const mapClassNames = (name) => "." + require_tokens_consts_cssTokens.TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES[name];
+const getValue = (config, variant, key, breakpoint) => {
+	const data = config.typography[variant]?.[key];
+	if (!data) throw new Error(`Missing typography data for variant "${variant}" and key "${key}"`);
+	const value = breakpoint === "base" ? data.base : data.breakpoints?.[breakpoint];
+	if (!value) throw new Error(`Missing value for variant "${variant}", key "${key}", and breakpoint "${breakpoint}"`);
+	if ((0, lodash_isString_js.default)(value)) return value;
+	switch (value.type) {
+		case "px": return toRem(value.value);
+		case "unitless": return String(value.value);
+	}
+	return require_utils_assertUnreachable.assertUnreachable(value);
+};
+const convertFontAlias = (config, value) => {
+	if (value in config.font) return `var(--${require_tokens_consts_cssTokens.FONT_FAMILY_PREFIX}-${value})`;
+	return value;
+};
+const cssVariablesForBreakpoint = (config, breakpoint) => Object.fromEntries(__yahoo_uds_fixtures.textVariants.flatMap((variant) => {
+	const safeVariant = textVariantsSafe(variant);
+	return [
+		[`--${require_tokens_consts_cssTokens.FONT_FAMILY_PREFIX}-${safeVariant}`, convertFontAlias(config, getValue(config, variant, "fontFamily", breakpoint))],
+		[`--${require_tokens_consts_cssTokens.FONT_SIZE_PREFIX}-${safeVariant}`, getValue(config, variant, "fontSize", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.FONT_WEIGHT_PREFIX}-${safeVariant}`, getValue(config, variant, "fontWeight", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.FONT_SLANT_PREFIX}-${safeVariant}`, getValue(config, variant, "fontSlant", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.FONT_WIDTH_PREFIX}-${safeVariant}`, getValue(config, variant, "fontWidth", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.LINE_HEIGHT_PREFIX}-${safeVariant}`, getValue(config, variant, "lineHeight", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.TEXT_TRANSFORM_PREFIX}-${safeVariant}`, getValue(config, variant, "textTransform", breakpoint)],
+		[`--${require_tokens_consts_cssTokens.LETTER_SPACING_PREFIX}-${safeVariant}`, getValue(config, variant, "letterSpacing", breakpoint)]
+	];
+}));
+const tailwindConfigPerVariant = (prefix) => Object.fromEntries(__yahoo_uds_fixtures.textVariants.map(textVariantsSafe).map((variant) => [variant, `var(--${prefix}-${variant})`]));
+const RESPONSIVE_TAILWIND_CONFIG_MAP = {
+	fontFamily: tailwindConfigPerVariant(require_tokens_consts_cssTokens.FONT_FAMILY_PREFIX),
+	fontWeight: tailwindConfigPerVariant(require_tokens_consts_cssTokens.FONT_WEIGHT_PREFIX),
+	fontSlant: tailwindConfigPerVariant(require_tokens_consts_cssTokens.FONT_SLANT_PREFIX),
+	fontWidth: tailwindConfigPerVariant(require_tokens_consts_cssTokens.FONT_WIDTH_PREFIX),
+	fontSize: tailwindConfigPerVariant(require_tokens_consts_cssTokens.FONT_SIZE_PREFIX),
+	lineHeight: tailwindConfigPerVariant(require_tokens_consts_cssTokens.LINE_HEIGHT_PREFIX),
+	textTransform: tailwindConfigPerVariant(require_tokens_consts_cssTokens.TEXT_TRANSFORM_PREFIX),
+	letterSpacing: tailwindConfigPerVariant(require_tokens_consts_cssTokens.LETTER_SPACING_PREFIX)
+};
+const getBaseTextVars = (config) => {
+	return cssVariablesForBreakpoint(config, "base");
+};
+const getResponsiveTextStyles = (config) => {
+	const breakpoints = require_utils_entries.entries(config.breakpoints).sort(([, { value: minWidthA }], [, { value: minWidthB }]) => minWidthA - minWidthB);
+	return {
+		[`.${require_tokens_consts_cssTokens.TEXT_RESPONSIVE_CLASSNAME}`]: Object.fromEntries(breakpoints.map(([name, { value: minWidth }]) => [`@media (min-width: ${minWidth}px)`, cssVariablesForBreakpoint(config, name)])),
+		[mapClassNames("base")]: cssVariablesForBreakpoint(config, "base"),
+		[mapClassNames("defaultBreakpoint")]: cssVariablesForBreakpoint(config, config.globalDefaults.breakpoint),
+		...Object.fromEntries(breakpoints.map(([name]) => [mapClassNames(name), cssVariablesForBreakpoint(config, name)]))
+	};
+};
+
+//#endregion
+exports.RESPONSIVE_TAILWIND_CONFIG_MAP = RESPONSIVE_TAILWIND_CONFIG_MAP;
+exports.cssVariablesForBreakpoint = cssVariablesForBreakpoint;
+exports.getBaseTextVars = getBaseTextVars;
+exports.getResponsiveTextStyles = getResponsiveTextStyles;
+exports.textVariantsSafe = textVariantsSafe;

package/dist/tailwind/components/getResponsiveTextStyles.d.cts

@@ -0,0 +1,37 @@
+import { BreakpointWithBase, UniversalTokensConfig } from "../../tokens/types.cjs";
+import "../../tokens/index.cjs";
+import { CssStyleObject } from "./types.cjs";
+
+//#region src/tailwind/components/getResponsiveTextStyles.d.ts
+declare const textVariantsSafe: (variant: string) => string;
+declare const cssVariablesForBreakpoint: (config: UniversalTokensConfig, breakpoint: BreakpointWithBase) => CssStyleObject;
+declare const RESPONSIVE_TAILWIND_CONFIG_MAP: {
+  fontFamily: {
+    [k: string]: string;
+  };
+  fontWeight: {
+    [k: string]: string;
+  };
+  fontSlant: {
+    [k: string]: string;
+  };
+  fontWidth: {
+    [k: string]: string;
+  };
+  fontSize: {
+    [k: string]: string;
+  };
+  lineHeight: {
+    [k: string]: string;
+  };
+  textTransform: {
+    [k: string]: string;
+  };
+  letterSpacing: {
+    [k: string]: string;
+  };
+};
+declare const getBaseTextVars: (config: UniversalTokensConfig) => CssStyleObject;
+declare const getResponsiveTextStyles: (config: UniversalTokensConfig) => CssStyleObject;
+//#endregion
+export { RESPONSIVE_TAILWIND_CONFIG_MAP, cssVariablesForBreakpoint, getBaseTextVars, getResponsiveTextStyles, textVariantsSafe };

package/dist/tailwind/components/getResponsiveTextStyles.d.ts

@@ -0,0 +1,37 @@
+import { BreakpointWithBase, UniversalTokensConfig } from "../../tokens/types.js";
+import "../../tokens/index.js";
+import { CssStyleObject } from "./types.js";
+
+//#region src/tailwind/components/getResponsiveTextStyles.d.ts
+declare const textVariantsSafe: (variant: string) => string;
+declare const cssVariablesForBreakpoint: (config: UniversalTokensConfig, breakpoint: BreakpointWithBase) => CssStyleObject;
+declare const RESPONSIVE_TAILWIND_CONFIG_MAP: {
+  fontFamily: {
+    [k: string]: string;
+  };
+  fontWeight: {
+    [k: string]: string;
+  };
+  fontSlant: {
+    [k: string]: string;
+  };
+  fontWidth: {
+    [k: string]: string;
+  };
+  fontSize: {
+    [k: string]: string;
+  };
+  lineHeight: {
+    [k: string]: string;
+  };
+  textTransform: {
+    [k: string]: string;
+  };
+  letterSpacing: {
+    [k: string]: string;
+  };
+};
+declare const getBaseTextVars: (config: UniversalTokensConfig) => CssStyleObject;
+declare const getResponsiveTextStyles: (config: UniversalTokensConfig) => CssStyleObject;
+//#endregion
+export { RESPONSIVE_TAILWIND_CONFIG_MAP, cssVariablesForBreakpoint, getBaseTextVars, getResponsiveTextStyles, textVariantsSafe };

package/dist/tailwind/components/getResponsiveTextStyles.js

@@ -0,0 +1,67 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { FONT_FAMILY_PREFIX, FONT_SIZE_PREFIX, FONT_SLANT_PREFIX, FONT_WEIGHT_PREFIX, FONT_WIDTH_PREFIX, LETTER_SPACING_PREFIX, LINE_HEIGHT_PREFIX, TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES, TEXT_RESPONSIVE_CLASSNAME, TEXT_TRANSFORM_PREFIX } from "../../tokens/consts/cssTokens.js";
+import { assertUnreachable } from "../../utils/assertUnreachable.js";
+import { entries as entries$1 } from "../../utils/entries.js";
+import { textVariants } from "@yahoo/uds/fixtures";
+import { isString } from "lodash-es";
+
+//#region src/tailwind/components/getResponsiveTextStyles.ts
+const textVariantsSafe = (variant) => variant.replace("/", "-");
+const BASE_SIZE = 16;
+const toRem = (size) => `${size / BASE_SIZE}rem`;
+const mapClassNames = (name) => "." + TEXT_RESPONSIVE_BREAKPOINT_CLASSNAMES[name];
+const getValue = (config, variant, key, breakpoint) => {
+	const data = config.typography[variant]?.[key];
+	if (!data) throw new Error(`Missing typography data for variant "${variant}" and key "${key}"`);
+	const value = breakpoint === "base" ? data.base : data.breakpoints?.[breakpoint];
+	if (!value) throw new Error(`Missing value for variant "${variant}", key "${key}", and breakpoint "${breakpoint}"`);
+	if (isString(value)) return value;
+	switch (value.type) {
+		case "px": return toRem(value.value);
+		case "unitless": return String(value.value);
+	}
+	return assertUnreachable(value);
+};
+const convertFontAlias = (config, value) => {
+	if (value in config.font) return `var(--${FONT_FAMILY_PREFIX}-${value})`;
+	return value;
+};
+const cssVariablesForBreakpoint = (config, breakpoint) => Object.fromEntries(textVariants.flatMap((variant) => {
+	const safeVariant = textVariantsSafe(variant);
+	return [
+		[`--${FONT_FAMILY_PREFIX}-${safeVariant}`, convertFontAlias(config, getValue(config, variant, "fontFamily", breakpoint))],
+		[`--${FONT_SIZE_PREFIX}-${safeVariant}`, getValue(config, variant, "fontSize", breakpoint)],
+		[`--${FONT_WEIGHT_PREFIX}-${safeVariant}`, getValue(config, variant, "fontWeight", breakpoint)],
+		[`--${FONT_SLANT_PREFIX}-${safeVariant}`, getValue(config, variant, "fontSlant", breakpoint)],
+		[`--${FONT_WIDTH_PREFIX}-${safeVariant}`, getValue(config, variant, "fontWidth", breakpoint)],
+		[`--${LINE_HEIGHT_PREFIX}-${safeVariant}`, getValue(config, variant, "lineHeight", breakpoint)],
+		[`--${TEXT_TRANSFORM_PREFIX}-${safeVariant}`, getValue(config, variant, "textTransform", breakpoint)],
+		[`--${LETTER_SPACING_PREFIX}-${safeVariant}`, getValue(config, variant, "letterSpacing", breakpoint)]
+	];
+}));
+const tailwindConfigPerVariant = (prefix) => Object.fromEntries(textVariants.map(textVariantsSafe).map((variant) => [variant, `var(--${prefix}-${variant})`]));
+const RESPONSIVE_TAILWIND_CONFIG_MAP = {
+	fontFamily: tailwindConfigPerVariant(FONT_FAMILY_PREFIX),
+	fontWeight: tailwindConfigPerVariant(FONT_WEIGHT_PREFIX),
+	fontSlant: tailwindConfigPerVariant(FONT_SLANT_PREFIX),
+	fontWidth: tailwindConfigPerVariant(FONT_WIDTH_PREFIX),
+	fontSize: tailwindConfigPerVariant(FONT_SIZE_PREFIX),
+	lineHeight: tailwindConfigPerVariant(LINE_HEIGHT_PREFIX),
+	textTransform: tailwindConfigPerVariant(TEXT_TRANSFORM_PREFIX),
+	letterSpacing: tailwindConfigPerVariant(LETTER_SPACING_PREFIX)
+};
+const getBaseTextVars = (config) => {
+	return cssVariablesForBreakpoint(config, "base");
+};
+const getResponsiveTextStyles = (config) => {
+	const breakpoints = entries$1(config.breakpoints).sort(([, { value: minWidthA }], [, { value: minWidthB }]) => minWidthA - minWidthB);
+	return {
+		[`.${TEXT_RESPONSIVE_CLASSNAME}`]: Object.fromEntries(breakpoints.map(([name, { value: minWidth }]) => [`@media (min-width: ${minWidth}px)`, cssVariablesForBreakpoint(config, name)])),
+		[mapClassNames("base")]: cssVariablesForBreakpoint(config, "base"),
+		[mapClassNames("defaultBreakpoint")]: cssVariablesForBreakpoint(config, config.globalDefaults.breakpoint),
+		...Object.fromEntries(breakpoints.map(([name]) => [mapClassNames(name), cssVariablesForBreakpoint(config, name)]))
+	};
+};
+
+//#endregion
+export { RESPONSIVE_TAILWIND_CONFIG_MAP, cssVariablesForBreakpoint, getBaseTextVars, getResponsiveTextStyles, textVariantsSafe };

package/dist/tailwind/components/types.cjs

@@ -0,0 +1 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */

package/dist/tailwind/components/types.d.cts

@@ -0,0 +1,9 @@
+import { CSSRuleObject } from "tailwindcss/types/config";
+
+//#region src/tailwind/components/types.d.ts
+/** TODO: create typed theme function to ensure valid paths are being used */
+type ThemeFn = (path: string) => string;
+type SimpleStyleObject = Record<string, string> | CSSRuleObject;
+type CssStyleObject = Record<`.${string}`, SimpleStyleObject | Record<string, SimpleStyleObject>>;
+//#endregion
+export { CssStyleObject, SimpleStyleObject, ThemeFn };

package/dist/tailwind/components/types.d.ts

@@ -0,0 +1,9 @@
+import { CSSRuleObject } from "tailwindcss/types/config";
+
+//#region src/tailwind/components/types.d.ts
+/** TODO: create typed theme function to ensure valid paths are being used */
+type ThemeFn = (path: string) => string;
+type SimpleStyleObject = Record<string, string> | CSSRuleObject;
+type CssStyleObject = Record<`.${string}`, SimpleStyleObject | Record<string, SimpleStyleObject>>;
+//#endregion
+export { CssStyleObject, SimpleStyleObject, ThemeFn };

package/dist/tailwind/components/types.js

@@ -0,0 +1 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */

package/dist/tailwind/defaultTailwindThemeAsUdsConfig.cjs

@@ -0,0 +1,68 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+
+//#region src/tailwind/defaultTailwindThemeAsUdsConfig.ts
+const fontSizeMap = {
+	display1: "6xl",
+	display2: "5xl",
+	display3: "4xl",
+	title1: "3xl",
+	title2: "2xl",
+	title3: "xl",
+	title4: "lg",
+	headline1: "base",
+	body1: "base",
+	label1: "sm",
+	label2: "sm",
+	label3: "sm",
+	label4: "sm",
+	caption1: "xs",
+	caption2: "xs",
+	"display1/emphasized": "6xl",
+	"display2/emphasized": "5xl",
+	"display3/emphasized": "4xl",
+	"title1/emphasized": "3xl",
+	"title2/emphasized": "2xl",
+	"title3/emphasized": "xl",
+	"title4/emphasized": "lg",
+	"headline1/emphasized": "base",
+	"body1/emphasized": "base",
+	"label1/emphasized": "sm",
+	"label2/emphasized": "sm",
+	"label3/emphasized": "sm",
+	"label4/emphasized": "sm",
+	"caption1/emphasized": "xs",
+	"caption2/emphasized": "xs",
+	ui1: "xs",
+	ui2: "xs",
+	ui3: "xs",
+	ui4: "xs",
+	ui5: "xs",
+	ui6: "xs",
+	"ui1/emphasized": "xs",
+	"ui2/emphasized": "xs",
+	"ui3/emphasized": "xs",
+	"ui4/emphasized": "xs",
+	"ui5/emphasized": "xs",
+	"ui6/emphasized": "xs"
+};
+const borderRadiusMap = {
+	xs: "sm",
+	sm: "DEFAULT",
+	md: "md",
+	lg: "lg",
+	xl: "xl"
+};
+const borderWidthMap = {
+	thin: "DEFAULT",
+	medium: "2",
+	thick: "4"
+};
+const udsToTailwindMap = {
+	fontSize: fontSizeMap,
+	lineHeight: fontSizeMap,
+	borderRadius: borderRadiusMap,
+	borderWidth: borderWidthMap
+};
+
+//#endregion
+exports.udsToTailwindMap = udsToTailwindMap;

package/dist/tailwind/defaultTailwindThemeAsUdsConfig.d.cts

@@ -0,0 +1,19 @@
+import { TextVariantUi } from "../tokens/types.cjs";
+import "../tokens/index.cjs";
+import defaultTailwindTheme from "tailwindcss/defaultTheme";
+
+//#region src/tailwind/defaultTailwindThemeAsUdsConfig.d.ts
+type TwFontSizeToExclude = '7xl' | '8xl' | '9xl';
+type TwdFontSize = Exclude<keyof typeof defaultTailwindTheme.fontSize, TwFontSizeToExclude>;
+type TwBorderRadiusToExclude = 'none' | '2xl' | '3xl' | 'full';
+type TwBorderRadius = Exclude<keyof typeof defaultTailwindTheme.borderRadius, TwBorderRadiusToExclude>;
+type TwBorderWidthToExclude = '0' | '8';
+type TwBorderWidth = Exclude<keyof typeof defaultTailwindTheme.borderWidth, TwBorderWidthToExclude>;
+declare const udsToTailwindMap: {
+  fontSize: Record<"title1" | "caption1" | "headline1" | "title4" | "caption2" | "title3" | "label2" | "label3" | "label1" | "label4" | "display1" | "display2" | "display3" | "title2" | "body1" | TextVariantUi | "title1/emphasized" | "caption1/emphasized" | "headline1/emphasized" | "title4/emphasized" | "caption2/emphasized" | "title3/emphasized" | "label2/emphasized" | "label3/emphasized" | "label1/emphasized" | "label4/emphasized" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title2/emphasized" | "body1/emphasized" | "ui1/emphasized" | "ui4/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui5/emphasized" | "ui6/emphasized", TwdFontSize>;
+  lineHeight: Record<"title1" | "caption1" | "headline1" | "title4" | "caption2" | "title3" | "label2" | "label3" | "label1" | "label4" | "display1" | "display2" | "display3" | "title2" | "body1" | TextVariantUi | "title1/emphasized" | "caption1/emphasized" | "headline1/emphasized" | "title4/emphasized" | "caption2/emphasized" | "title3/emphasized" | "label2/emphasized" | "label3/emphasized" | "label1/emphasized" | "label4/emphasized" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title2/emphasized" | "body1/emphasized" | "ui1/emphasized" | "ui4/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui5/emphasized" | "ui6/emphasized", TwdFontSize>;
+  borderRadius: Record<"sm" | "md" | "lg" | "xl" | "xs", TwBorderRadius>;
+  borderWidth: Record<"thin" | "medium" | "thick", TwBorderWidth>;
+};
+//#endregion
+export { udsToTailwindMap };

package/dist/tailwind/defaultTailwindThemeAsUdsConfig.d.ts

@@ -0,0 +1,19 @@
+import { TextVariantUi } from "../tokens/types.js";
+import "../tokens/index.js";
+import defaultTailwindTheme from "tailwindcss/defaultTheme";
+
+//#region src/tailwind/defaultTailwindThemeAsUdsConfig.d.ts
+type TwFontSizeToExclude = '7xl' | '8xl' | '9xl';
+type TwdFontSize = Exclude<keyof typeof defaultTailwindTheme.fontSize, TwFontSizeToExclude>;
+type TwBorderRadiusToExclude = 'none' | '2xl' | '3xl' | 'full';
+type TwBorderRadius = Exclude<keyof typeof defaultTailwindTheme.borderRadius, TwBorderRadiusToExclude>;
+type TwBorderWidthToExclude = '0' | '8';
+type TwBorderWidth = Exclude<keyof typeof defaultTailwindTheme.borderWidth, TwBorderWidthToExclude>;
+declare const udsToTailwindMap: {
+  fontSize: Record<"title1" | "caption1" | "headline1" | "title4" | "caption2" | "title3" | "label2" | "label3" | "label1" | "label4" | "display1" | "display2" | "display3" | "title2" | "body1" | TextVariantUi | "title1/emphasized" | "caption1/emphasized" | "headline1/emphasized" | "title4/emphasized" | "caption2/emphasized" | "title3/emphasized" | "label2/emphasized" | "label3/emphasized" | "label1/emphasized" | "label4/emphasized" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title2/emphasized" | "body1/emphasized" | "ui1/emphasized" | "ui4/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui5/emphasized" | "ui6/emphasized", TwdFontSize>;
+  lineHeight: Record<"title1" | "caption1" | "headline1" | "title4" | "caption2" | "title3" | "label2" | "label3" | "label1" | "label4" | "display1" | "display2" | "display3" | "title2" | "body1" | TextVariantUi | "title1/emphasized" | "caption1/emphasized" | "headline1/emphasized" | "title4/emphasized" | "caption2/emphasized" | "title3/emphasized" | "label2/emphasized" | "label3/emphasized" | "label1/emphasized" | "label4/emphasized" | "display1/emphasized" | "display2/emphasized" | "display3/emphasized" | "title2/emphasized" | "body1/emphasized" | "ui1/emphasized" | "ui4/emphasized" | "ui2/emphasized" | "ui3/emphasized" | "ui5/emphasized" | "ui6/emphasized", TwdFontSize>;
+  borderRadius: Record<"sm" | "md" | "lg" | "xl" | "xs", TwBorderRadius>;
+  borderWidth: Record<"thin" | "medium" | "thick", TwBorderWidth>;
+};
+//#endregion
+export { udsToTailwindMap };

package/dist/tailwind/defaultTailwindThemeAsUdsConfig.js

@@ -0,0 +1,67 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+//#region src/tailwind/defaultTailwindThemeAsUdsConfig.ts
+const fontSizeMap = {
+	display1: "6xl",
+	display2: "5xl",
+	display3: "4xl",
+	title1: "3xl",
+	title2: "2xl",
+	title3: "xl",
+	title4: "lg",
+	headline1: "base",
+	body1: "base",
+	label1: "sm",
+	label2: "sm",
+	label3: "sm",
+	label4: "sm",
+	caption1: "xs",
+	caption2: "xs",
+	"display1/emphasized": "6xl",
+	"display2/emphasized": "5xl",
+	"display3/emphasized": "4xl",
+	"title1/emphasized": "3xl",
+	"title2/emphasized": "2xl",
+	"title3/emphasized": "xl",
+	"title4/emphasized": "lg",
+	"headline1/emphasized": "base",
+	"body1/emphasized": "base",
+	"label1/emphasized": "sm",
+	"label2/emphasized": "sm",
+	"label3/emphasized": "sm",
+	"label4/emphasized": "sm",
+	"caption1/emphasized": "xs",
+	"caption2/emphasized": "xs",
+	ui1: "xs",
+	ui2: "xs",
+	ui3: "xs",
+	ui4: "xs",
+	ui5: "xs",
+	ui6: "xs",
+	"ui1/emphasized": "xs",
+	"ui2/emphasized": "xs",
+	"ui3/emphasized": "xs",
+	"ui4/emphasized": "xs",
+	"ui5/emphasized": "xs",
+	"ui6/emphasized": "xs"
+};
+const borderRadiusMap = {
+	xs: "sm",
+	sm: "DEFAULT",
+	md: "md",
+	lg: "lg",
+	xl: "xl"
+};
+const borderWidthMap = {
+	thin: "DEFAULT",
+	medium: "2",
+	thick: "4"
+};
+const udsToTailwindMap = {
+	fontSize: fontSizeMap,
+	lineHeight: fontSizeMap,
+	borderRadius: borderRadiusMap,
+	borderWidth: borderWidthMap
+};
+
+//#endregion
+export { udsToTailwindMap };

package/dist/tailwind/plugins/a11y.cjs

@@ -0,0 +1,34 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_tailwind_components_getFocusRingStyles = require('../components/getFocusRingStyles.cjs');
+const require_tailwind_components_getHitTargetStyles = require('../components/getHitTargetStyles.cjs');
+let tailwindcss_plugin_js = require("tailwindcss/plugin.js");
+tailwindcss_plugin_js = require_rolldown_runtime.__toESM(tailwindcss_plugin_js);
+
+//#region src/tailwind/plugins/a11y.ts
+const a11yPlugin = tailwindcss_plugin_js.default.withOptions(() => ({ addComponents, theme }) => {
+	addComponents(require_tailwind_components_getHitTargetStyles.getHitTargetStyles());
+	addComponents(require_tailwind_components_getFocusRingStyles.getFocusRingStyles({ theme }));
+}, () => ({
+	safelist: ["uds-hit-target", "uds-ring"],
+	theme: { extend: {
+		aria: {
+			checked: "checked=\"true\"",
+			disabled: "disabled=\"true\"",
+			expanded: "expanded=\"true\"",
+			invalid: "aria-invalid=\"true\""
+		},
+		data: {
+			active: "active=\"true\"",
+			"active-item": "active-item=\"true\"",
+			autofill: "autofill=\"true\"",
+			backdrop: "backdrop=\"true\"",
+			enter: "enter=\"true\"",
+			leave: "leave=\"true\"",
+			"focus-visible": "focus-visible=\"true\""
+		}
+	} }
+}));
+
+//#endregion
+exports.a11yPlugin = a11yPlugin;

package/dist/tailwind/plugins/a11y.d.cts

@@ -0,0 +1,13 @@
+import { TailwindPluginOptions } from "../utils/composeTailwindPlugins.cjs";
+import * as tailwindcss_types_config3 from "tailwindcss/types/config";
+
+//#region src/tailwind/plugins/a11y.d.ts
+declare const a11yPlugin: {
+  (options: TailwindPluginOptions): {
+    handler: tailwindcss_types_config3.PluginCreator;
+    config?: Partial<tailwindcss_types_config3.Config>;
+  };
+  __isOptionsFunction: true;
+};
+//#endregion
+export { a11yPlugin };

package/dist/tailwind/plugins/a11y.d.ts

@@ -0,0 +1,13 @@
+import { TailwindPluginOptions } from "../utils/composeTailwindPlugins.js";
+import * as tailwindcss_types_config23 from "tailwindcss/types/config";
+
+//#region src/tailwind/plugins/a11y.d.ts
+declare const a11yPlugin: {
+  (options: TailwindPluginOptions): {
+    handler: tailwindcss_types_config23.PluginCreator;
+    config?: Partial<tailwindcss_types_config23.Config>;
+  };
+  __isOptionsFunction: true;
+};
+//#endregion
+export { a11yPlugin };

package/dist/tailwind/plugins/a11y.js

@@ -0,0 +1,32 @@
+/*! © 2025 Yahoo, Inc. UDS v0.0.0-development */
+import { getFocusRingStyles } from "../components/getFocusRingStyles.js";
+import { getHitTargetStyles } from "../components/getHitTargetStyles.js";
+import plugin from "tailwindcss/plugin.js";
+
+//#region src/tailwind/plugins/a11y.ts
+const a11yPlugin = plugin.withOptions(() => ({ addComponents, theme }) => {
+	addComponents(getHitTargetStyles());
+	addComponents(getFocusRingStyles({ theme }));
+}, () => ({
+	safelist: ["uds-hit-target", "uds-ring"],
+	theme: { extend: {
+		aria: {
+			checked: "checked=\"true\"",
+			disabled: "disabled=\"true\"",
+			expanded: "expanded=\"true\"",
+			invalid: "aria-invalid=\"true\""
+		},
+		data: {
+			active: "active=\"true\"",
+			"active-item": "active-item=\"true\"",
+			autofill: "autofill=\"true\"",
+			backdrop: "backdrop=\"true\"",
+			enter: "enter=\"true\"",
+			leave: "leave=\"true\"",
+			"focus-visible": "focus-visible=\"true\""
+		}
+	} }
+}));
+
+//#endregion
+export { a11yPlugin };