@yahoo/uds-v5-wip 1.35.0 → 1.36.1

package/dist/core/dist/modifier-mappings.js

@@ -0,0 +1,61 @@
+//#region ../core/dist/modifier-mappings.js
+const modifierMappings = {
+	_after: "after:",
+	_hover: "hover:",
+	_focus: "focus:",
+	_focusWithin: "focus-within:",
+	_focusVisible: "focus-visible:",
+	_active: "active:",
+	_visited: "visited:",
+	_target: "target:",
+	_first: "first:",
+	_last: "last:",
+	_only: "only:",
+	_odd: "odd:",
+	_even: "even:",
+	_firstOfType: "first-of-type:",
+	_lastOfType: "last-of-type:",
+	_onlyOfType: "only-of-type:",
+	_empty: "empty:",
+	_disabled: "disabled:",
+	_enabled: "enabled:",
+	_checked: "checked:",
+	_indeterminate: "indeterminate:",
+	_default: "default:",
+	_required: "required:",
+	_valid: "valid:",
+	_invalid: "invalid:",
+	_inRange: "in-range:",
+	_outOfRange: "out-of-range:",
+	_placeholderShown: "placeholder-shown:",
+	_autofill: "autofill:",
+	_readonly: "read-only:",
+	_file: "file:",
+	_selection: "selection:",
+	_backdrop: "backdrop:",
+	_motionReduce: "motion-reduce:",
+	_motionSafe: "motion-safe:",
+	_contrastMore: "contrast-more:",
+	_contrastLess: "contrast-less:",
+	_forcedColors: "forced-colors:",
+	_placeholder: "placeholder:",
+	_ariaBusy: "aria-busy:",
+	_ariaChecked: "aria-checked:",
+	_ariaHidden: "aria-hidden:",
+	_ariaPressed: "aria-pressed:",
+	_ariaReadonly: "aria-readonly:",
+	_ariaRequired: "aria-required:",
+	_ariaSelected: "aria-selected:",
+	_ariaCurrent: "aria-[current]:",
+	_ariaDisabled: "aria-disabled:",
+	_ariaExpanded: "aria-expanded:",
+	_dataDisabled: "data-[disabled=true]:",
+	_dataStateOpen: "data-[state=open]:",
+	_dataStateClosed: "data-[state=closed]:",
+	_startingStyle: "starting-style:",
+	_scrollbar: "*::-webkit-scrollbar:",
+	_scrollbarThumb: "*::-webkit-scrollbar-thumb:",
+	_scrollbarTrack: "*::-webkit-scrollbar-track:"
+};
+//#endregion
+export { modifierMappings };

package/dist/core/dist/style-prop-data.d.ts

@@ -0,0 +1,33 @@
+import { StyleProp } from "@uds/types";
+
+//#region ../core/dist/style-prop-data.d.ts
+//#region src/style-prop-data.d.ts
+interface PropMapping {
+  /** Class name prefix for runtime class generation. 'no-prefix' means value IS the class. */
+  classPrefix: string;
+  /** CSS property name (for @utility directive generation). Only needed for token-based props. */
+  cssProperty?: string;
+  /** CSS variable namespace for tokens. Only needed for token-based (configurable) props. */
+  defaultVarPrefix?: string;
+  /** Module augmentation interface name. Only needed for configurable props. */
+  augmentType?: string;
+  /** Known literal values for functional @utility generation. Used for props with cssProperty but no defaultVarPrefix. */
+  literalValues?: string[];
+  /** Alternate CSS property for component configs (directValues mode).
+   *  Use when the utility cssProperty differs from the CSS shorthand needed for direct values.
+   *  e.g. transition utility maps to 'transition-property', but direct values need 'transition'. */
+  directCssProperty?: string;
+  /** Template for generating inline style values from arbitrary bracket values.
+   *  When present, arbitrary values like `[3.5px]` produce inline styles instead of Tailwind classes.
+   *  `cssProperty` is the CSS property name (kebab-case), `valueTemplate` uses `%s` as value placeholder.
+   *  e.g. { cssProperty: 'transform', valueTemplate: 'translateX(%s)' } */
+  arbitraryValueTemplate?: {
+    cssProperty: string;
+    valueTemplate: string;
+  };
+}
+/** Exclude className — it's passed through, not mapped to a utility class */
+type MappedStyleProp = Exclude<StyleProp, 'className'>;
+declare const propMappings: Record<MappedStyleProp, PropMapping>; //#endregion
+//#endregion
+export { PropMapping, propMappings };

package/dist/{loader/dist/packages/core/dist/propMappings.js → core/dist/style-prop-data.js}

@@ -1,4 +1,4 @@
-//#region ../loader/dist/packages/core/dist/propMappings.js
+//#region ../core/dist/style-prop-data.js
 const propMappings = {
 	animation: {
 		classPrefix: "animation",
@@ -1253,96 +1253,5 @@ const propMappings = {
 		augmentType: "CustomTextShadow"
 	}
 };
-/**
-* Built-in modifier mappings (pseudo-classes, pseudo-elements, etc.).
-* Custom modifiers from defineModes() are handled dynamically in the runtime.
-*/
-const modifierMappings = {
-	_after: "after:",
-	_hover: "hover:",
-	_focus: "focus:",
-	_focusWithin: "focus-within:",
-	_focusVisible: "focus-visible:",
-	_active: "active:",
-	_visited: "visited:",
-	_target: "target:",
-	_first: "first:",
-	_last: "last:",
-	_only: "only:",
-	_odd: "odd:",
-	_even: "even:",
-	_firstOfType: "first-of-type:",
-	_lastOfType: "last-of-type:",
-	_onlyOfType: "only-of-type:",
-	_empty: "empty:",
-	_disabled: "disabled:",
-	_enabled: "enabled:",
-	_checked: "checked:",
-	_indeterminate: "indeterminate:",
-	_default: "default:",
-	_required: "required:",
-	_valid: "valid:",
-	_invalid: "invalid:",
-	_inRange: "in-range:",
-	_outOfRange: "out-of-range:",
-	_placeholderShown: "placeholder-shown:",
-	_autofill: "autofill:",
-	_readonly: "read-only:",
-	_file: "file:",
-	_selection: "selection:",
-	_backdrop: "backdrop:",
-	_motionReduce: "motion-reduce:",
-	_motionSafe: "motion-safe:",
-	_contrastMore: "contrast-more:",
-	_contrastLess: "contrast-less:",
-	_forcedColors: "forced-colors:",
-	_placeholder: "placeholder:",
-	_ariaBusy: "aria-busy:",
-	_ariaChecked: "aria-checked:",
-	_ariaHidden: "aria-hidden:",
-	_ariaPressed: "aria-pressed:",
-	_ariaReadonly: "aria-readonly:",
-	_ariaRequired: "aria-required:",
-	_ariaSelected: "aria-selected:",
-	_ariaCurrent: "aria-[current]:",
-	_ariaDisabled: "aria-disabled:",
-	_ariaExpanded: "aria-expanded:",
-	_dataDisabled: "data-[disabled=true]:",
-	_dataStateOpen: "data-[state=open]:",
-	_dataStateClosed: "data-[state=closed]:",
-	_startingStyle: "starting-style:",
-	_scrollbar: "*::-webkit-scrollbar:",
-	_scrollbarThumb: "*::-webkit-scrollbar-thumb:",
-	_scrollbarTrack: "*::-webkit-scrollbar-track:"
-};
-/**
-* Maps each color prop name to its corresponding opacity prop name.
-* Used by runtime (getStyles) and loader (style-transform) to merge
-* a color value with its opacity before class generation.
-*
-* e.g. `bg="primary"` + `bgOpacity="75"` → class `bg-primary_75`
-*/
-const colorPropToOpacityProp = {
-	bg: "bgOpacity",
-	color: "colorOpacity",
-	textDecorationColor: "textDecorationColorOpacity",
-	borderColor: "borderColorOpacity",
-	borderYColor: "borderYColorOpacity",
-	borderXColor: "borderXColorOpacity",
-	borderStartColor: "borderStartColorOpacity",
-	borderLeftColor: "borderLeftColorOpacity",
-	borderEndColor: "borderEndColorOpacity",
-	borderRightColor: "borderRightColorOpacity",
-	borderTopColor: "borderTopColorOpacity",
-	borderBottomColor: "borderBottomColorOpacity",
-	divideColor: "divideColorOpacity",
-	outlineColor: "outlineColorOpacity",
-	ringColor: "ringColorOpacity",
-	ringOffsetColor: "ringOffsetColorOpacity",
-	fillColor: "fillColorOpacity",
-	strokeColor: "strokeColorOpacity",
-	shadowColor: "shadowColorOpacity",
-	caretColor: "caretColorOpacity"
-};
 //#endregion
-export { colorPropToOpacityProp, modifierMappings, propMappings };
+export { propMappings };

package/dist/core.d.ts

@@ -1,11 +1,14 @@
+import { colorPropToOpacityProp } from "./core/dist/color-opacity-map.js";
 import { expandCompositeStyles, getCompositeStylesConfig, setCompositeStylesConfig } from "./core/dist/compositeStyles.js";
+import { PropMapping, propMappings } from "./core/dist/style-prop-data.js";
+import { ConfigurablePropertyEntry, CssVariablePrefixEntry, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes } from "./core/dist/configurable-prop-helpers.js";
 import { createComponent } from "./core/dist/createComponent.js";
 import { ComponentExample, createComponentExample } from "./core/dist/createComponentExample.js";
 import { createProvider } from "./core/dist/createProvider.js";
 import { stylePropsTwMap } from "./core/dist/generated/stylePropsTwMap.js";
 import { createComponentStyler } from "./core/dist/getComponentStyles.js";
 import { createVariants, cx, getStyles, getVariantClassName, processStyleProps, toCamelCase } from "./core/dist/getStyles.js";
-import { ConfigurablePropertyEntry, CssVariablePrefixEntry, ModifierEntry, PropMapping, colorPropToOpacityProp, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings } from "./core/dist/propMappings.js";
+import { ModifierEntry, modifierMappings } from "./core/dist/modifier-mappings.js";
 import { resolveMotionState } from "./core/dist/resolveMotionState.js";
 import { TransformedMotionProps, transformPreset } from "./core/dist/transformPreset.js";
 import { withDefaultStyleProps } from "./core/dist/withDefaultStyleProps.js";

package/dist/core.js

@@ -1,6 +1,9 @@
+import { colorPropToOpacityProp } from "./core/dist/color-opacity-map.js";
 import { expandCompositeStyles, getCompositeStylesConfig, setCompositeStylesConfig } from "./core/dist/compositeStyles.js";
+import { propMappings } from "./core/dist/style-prop-data.js";
+import { getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes } from "./core/dist/configurable-prop-helpers.js";
 import { stylePropsTwMap } from "./core/dist/generated/stylePropsTwMap.js";
-import { colorPropToOpacityProp, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings } from "./core/dist/propMappings.js";
+import { modifierMappings } from "./core/dist/modifier-mappings.js";
 import { createVariants, cx, getStyles, getVariantClassName, processStyleProps, toCamelCase } from "./core/dist/getStyles.js";
 import { createComponentStyler } from "./core/dist/getComponentStyles.js";
 import { createComponent } from "./core/dist/createComponent.js";

package/dist/fixtures.d.ts

@@ -1,2 +1,4 @@
-import { ConfigurablePropertyEntry, CssVariablePrefixEntry, ModifierEntry, PropMapping, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings } from "./core/dist/propMappings.js";
+import { PropMapping, propMappings } from "./core/dist/style-prop-data.js";
+import { ConfigurablePropertyEntry, CssVariablePrefixEntry, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes } from "./core/dist/configurable-prop-helpers.js";
+import { ModifierEntry, modifierMappings } from "./core/dist/modifier-mappings.js";
 export { type ConfigurablePropertyEntry, type CssVariablePrefixEntry, type ModifierEntry, type PropMapping, getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings };

package/dist/fixtures.js

@@ -1,3 +1,5 @@
-import { getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings } from "./core/dist/propMappings.js";
+import { propMappings } from "./core/dist/style-prop-data.js";
+import { getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes } from "./core/dist/configurable-prop-helpers.js";
+import { modifierMappings } from "./core/dist/modifier-mappings.js";
 import "./core/dist/index.js";
 export { getConfigurablePropMapping, getConfigurableProperties, getCssVariablePrefixes, modifierMappings, propMappings };