@tenphi/tasty 0.1.0 → 0.1.3

package/dist/styles/outline.mjs

@@ -1,65 +0,0 @@
-import { filterMods, parseStyle } from "../utils/styles.mjs";
-
-//#region src/styles/outline.ts
-const BORDER_STYLES = [
-	"none",
-	"hidden",
-	"dotted",
-	"dashed",
-	"solid",
-	"double",
-	"groove",
-	"ridge",
-	"inset",
-	"outset"
-];
-/**
-* Generates CSS for outline property with optional offset.
-*
-* Syntax:
-* - `outline="2px solid #red"` - outline only
-* - `outline="2px solid #red / 4px"` - outline with offset (slash separator)
-* - `outline="2px / 4px"` - width with offset (simpler form)
-* - `outline={true}` - default 1ow solid outline
-* - `outlineOffset="4px"` - offset as separate prop (can be combined with outline)
-*
-* Priority: slash syntax in outline takes precedence over outlineOffset prop
-*
-* @return CSS properties for outline and optionally outline-offset
-*/
-function outlineStyle({ outline, outlineOffset }) {
-	const result = {};
-	if (outline != null && outline !== false) {
-		let outlineValue = outline;
-		if (outline === true) outlineValue = "1ow";
-		if (outline === 0) outlineValue = "0";
-		const group = parseStyle(String(outlineValue)).groups[0];
-		if (group) {
-			const { parts } = group;
-			const outlinePart = parts[0] ?? {
-				values: [],
-				mods: [],
-				colors: []
-			};
-			const offsetPart = parts[1];
-			const typeMods = filterMods(outlinePart.mods, BORDER_STYLES);
-			result["outline"] = [
-				outlinePart.values[0] || "var(--outline-width)",
-				typeMods[0] || "solid",
-				outlinePart.colors[0] || "var(--outline-color)"
-			].join(" ");
-			if (offsetPart?.values[0]) result["outline-offset"] = offsetPart.values[0];
-		}
-	}
-	if (outlineOffset != null && !result["outline-offset"]) {
-		const offsetValue = typeof outlineOffset === "number" ? `${outlineOffset}px` : outlineOffset;
-		result["outline-offset"] = parseStyle(offsetValue).groups[0]?.values[0] || offsetValue;
-	}
-	if (Object.keys(result).length === 0) return;
-	return result;
-}
-outlineStyle.__lookupStyles = ["outline", "outlineOffset"];
-
-//#endregion
-export { outlineStyle };
-//# sourceMappingURL=outline.mjs.map

package/dist/styles/outline.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"outline.mjs","names":[],"sources":["../../src/styles/outline.ts"],"sourcesContent":["import { filterMods, parseStyle } from '../utils/styles';\n\nconst BORDER_STYLES = [\n  'none',\n  'hidden',\n  'dotted',\n  'dashed',\n  'solid',\n  'double',\n  'groove',\n  'ridge',\n  'inset',\n  'outset',\n];\n\ninterface OutlineStyleProps {\n  outline?: string | boolean | number;\n  outlineOffset?: string | number;\n}\n\n/**\n * Generates CSS for outline property with optional offset.\n *\n * Syntax:\n * - `outline=\"2px solid #red\"` - outline only\n * - `outline=\"2px solid #red / 4px\"` - outline with offset (slash separator)\n * - `outline=\"2px / 4px\"` - width with offset (simpler form)\n * - `outline={true}` - default 1ow solid outline\n * - `outlineOffset=\"4px\"` - offset as separate prop (can be combined with outline)\n *\n * Priority: slash syntax in outline takes precedence over outlineOffset prop\n *\n * @return CSS properties for outline and optionally outline-offset\n */\nexport function outlineStyle({ outline, outlineOffset }: OutlineStyleProps) {\n  const result: Record<string, string> = {};\n\n  // Handle outline (0 is valid - means no outline)\n  if (outline != null && outline !== false) {\n    let outlineValue: string | boolean | number = outline;\n    if (outline === true) outlineValue = '1ow';\n    if (outline === 0) outlineValue = '0';\n\n    const processed = parseStyle(String(outlineValue));\n    const group = processed.groups[0];\n\n    if (group) {\n      const { parts } = group;\n      const outlinePart = parts[0] ?? { values: [], mods: [], colors: [] };\n      const offsetPart = parts[1];\n\n      const typeMods = filterMods(outlinePart.mods, BORDER_STYLES);\n\n      const value = outlinePart.values[0] || 'var(--outline-width)';\n      const type = typeMods[0] || 'solid';\n      const outlineColor = outlinePart.colors[0] || 'var(--outline-color)';\n\n      result['outline'] = [value, type, outlineColor].join(' ');\n\n      // Check for offset in second part (after /) - takes precedence\n      if (offsetPart?.values[0]) {\n        result['outline-offset'] = offsetPart.values[0];\n      }\n    }\n  }\n\n  // Handle outlineOffset prop (only if not already set by slash syntax)\n  if (outlineOffset != null && !result['outline-offset']) {\n    const offsetValue =\n      typeof outlineOffset === 'number' ? `${outlineOffset}px` : outlineOffset;\n    const processed = parseStyle(offsetValue);\n    result['outline-offset'] = processed.groups[0]?.values[0] || offsetValue;\n  }\n\n  // Return undefined if no styles to apply\n  if (Object.keys(result).length === 0) {\n    return;\n  }\n\n  return result;\n}\n\noutlineStyle.__lookupStyles = ['outline', 'outlineOffset'];\n"],"mappings":";;;AAEA,MAAM,gBAAgB;CACpB;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD;;;;;;;;;;;;;;;AAqBD,SAAgB,aAAa,EAAE,SAAS,iBAAoC;CAC1E,MAAM,SAAiC,EAAE;AAGzC,KAAI,WAAW,QAAQ,YAAY,OAAO;EACxC,IAAI,eAA0C;AAC9C,MAAI,YAAY,KAAM,gBAAe;AACrC,MAAI,YAAY,EAAG,gBAAe;EAGlC,MAAM,QADY,WAAW,OAAO,aAAa,CAAC,CAC1B,OAAO;AAE/B,MAAI,OAAO;GACT,MAAM,EAAE,UAAU;GAClB,MAAM,cAAc,MAAM,MAAM;IAAE,QAAQ,EAAE;IAAE,MAAM,EAAE;IAAE,QAAQ,EAAE;IAAE;GACpE,MAAM,aAAa,MAAM;GAEzB,MAAM,WAAW,WAAW,YAAY,MAAM,cAAc;AAM5D,UAAO,aAAa;IAJN,YAAY,OAAO,MAAM;IAC1B,SAAS,MAAM;IACP,YAAY,OAAO,MAAM;IAEC,CAAC,KAAK,IAAI;AAGzD,OAAI,YAAY,OAAO,GACrB,QAAO,oBAAoB,WAAW,OAAO;;;AAMnD,KAAI,iBAAiB,QAAQ,CAAC,OAAO,mBAAmB;EACtD,MAAM,cACJ,OAAO,kBAAkB,WAAW,GAAG,cAAc,MAAM;AAE7D,SAAO,oBADW,WAAW,YAAY,CACJ,OAAO,IAAI,OAAO,MAAM;;AAI/D,KAAI,OAAO,KAAK,OAAO,CAAC,WAAW,EACjC;AAGF,QAAO;;AAGT,aAAa,iBAAiB,CAAC,WAAW,gBAAgB"}

package/dist/styles/padding.mjs

@@ -1,96 +0,0 @@
-import { DIRECTIONS, filterMods, parseStyle } from "../utils/styles.mjs";
-
-//#region src/styles/padding.ts
-/**
-* Parse a padding value and return the first processed value
-*/
-function parsePaddingValue(value) {
-	if (typeof value === "number") return `${value}px`;
-	if (!value) return null;
-	if (value === true) value = "1x";
-	const { values } = parseStyle(value).groups[0] ?? { values: [] };
-	return values[0] || "var(--gap)";
-}
-/**
-* Parse padding value with optional directions (like "1x top" or "2x left right")
-*/
-function parseDirectionalPadding(value) {
-	if (typeof value === "number") return {
-		values: [`${value}px`],
-		directions: []
-	};
-	if (!value) return {
-		values: [],
-		directions: []
-	};
-	if (value === true) value = "1x";
-	const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};
-	return {
-		values: values.length ? values : ["var(--gap)"],
-		directions: filterMods(mods, DIRECTIONS)
-	};
-}
-function paddingStyle({ padding, paddingBlock, paddingInline, paddingTop, paddingRight, paddingBottom, paddingLeft }) {
-	if (padding == null && paddingBlock == null && paddingInline == null && paddingTop == null && paddingRight == null && paddingBottom == null && paddingLeft == null) return {};
-	let [top, right, bottom, left] = [
-		"0",
-		"0",
-		"0",
-		"0"
-	];
-	if (padding != null) {
-		const { values, directions } = parseDirectionalPadding(padding);
-		if (values.length) if (directions.length === 0) {
-			top = values[0];
-			right = values[1] || values[0];
-			bottom = values[2] || values[0];
-			left = values[3] || values[1] || values[0];
-		} else directions.forEach((dir, i) => {
-			const val = values[i] ?? values[0];
-			if (dir === "top") top = val;
-			else if (dir === "right") right = val;
-			else if (dir === "bottom") bottom = val;
-			else if (dir === "left") left = val;
-		});
-	}
-	if (paddingBlock != null) {
-		const val = parsePaddingValue(paddingBlock);
-		if (val) top = bottom = val;
-	}
-	if (paddingInline != null) {
-		const val = parsePaddingValue(paddingInline);
-		if (val) left = right = val;
-	}
-	if (paddingTop != null) {
-		const val = parsePaddingValue(paddingTop);
-		if (val) top = val;
-	}
-	if (paddingRight != null) {
-		const val = parsePaddingValue(paddingRight);
-		if (val) right = val;
-	}
-	if (paddingBottom != null) {
-		const val = parsePaddingValue(paddingBottom);
-		if (val) bottom = val;
-	}
-	if (paddingLeft != null) {
-		const val = parsePaddingValue(paddingLeft);
-		if (val) left = val;
-	}
-	if (top === right && right === bottom && bottom === left) return { padding: top };
-	if (top === bottom && left === right) return { padding: `${top} ${left}` };
-	return { padding: `${top} ${right} ${bottom} ${left}` };
-}
-paddingStyle.__lookupStyles = [
-	"padding",
-	"paddingTop",
-	"paddingRight",
-	"paddingBottom",
-	"paddingLeft",
-	"paddingBlock",
-	"paddingInline"
-];
-
-//#endregion
-export { paddingStyle };
-//# sourceMappingURL=padding.mjs.map

package/dist/styles/padding.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"padding.mjs","names":[],"sources":["../../src/styles/padding.ts"],"sourcesContent":["import { DIRECTIONS, filterMods, parseStyle } from '../utils/styles';\n\n/**\n * Parse a padding value and return the first processed value\n */\nfunction parsePaddingValue(value: string | number | boolean): string | null {\n  if (typeof value === 'number') return `${value}px`;\n  if (!value) return null;\n  if (value === true) value = '1x';\n\n  const { values } = parseStyle(value).groups[0] ?? { values: [] };\n\n  return values[0] || 'var(--gap)';\n}\n\n/**\n * Parse padding value with optional directions (like \"1x top\" or \"2x left right\")\n */\nfunction parseDirectionalPadding(value: string | number | boolean): {\n  values: string[];\n  directions: string[];\n} {\n  if (typeof value === 'number') {\n    return { values: [`${value}px`], directions: [] };\n  }\n  if (!value) return { values: [], directions: [] };\n  if (value === true) value = '1x';\n\n  const { values = [], mods = [] } = parseStyle(value).groups[0] ?? {};\n\n  return {\n    values: values.length ? values : ['var(--gap)'],\n    directions: filterMods(mods, DIRECTIONS),\n  };\n}\n\nexport function paddingStyle({\n  padding,\n  paddingBlock,\n  paddingInline,\n  paddingTop,\n  paddingRight,\n  paddingBottom,\n  paddingLeft,\n}: {\n  padding?: string | number | boolean;\n  paddingBlock?: string | number | boolean;\n  paddingInline?: string | number | boolean;\n  paddingTop?: string | number | boolean;\n  paddingRight?: string | number | boolean;\n  paddingBottom?: string | number | boolean;\n  paddingLeft?: string | number | boolean;\n}) {\n  // If no padding is defined, return empty object\n  if (\n    padding == null &&\n    paddingBlock == null &&\n    paddingInline == null &&\n    paddingTop == null &&\n    paddingRight == null &&\n    paddingBottom == null &&\n    paddingLeft == null\n  ) {\n    return {};\n  }\n\n  // Initialize all directions to 0\n  let [top, right, bottom, left] = ['0', '0', '0', '0'];\n\n  // Priority 1 (lowest): padding\n  if (padding != null) {\n    const { values, directions } = parseDirectionalPadding(padding);\n\n    if (values.length) {\n      if (directions.length === 0) {\n        top = values[0];\n        right = values[1] || values[0];\n        bottom = values[2] || values[0];\n        left = values[3] || values[1] || values[0];\n      } else {\n        // Assign values to directions in the order they appear\n        // e.g., 'right 1x top 2x' → right: 1x, top: 2x\n        directions.forEach((dir, i) => {\n          const val = values[i] ?? values[0];\n          if (dir === 'top') top = val;\n          else if (dir === 'right') right = val;\n          else if (dir === 'bottom') bottom = val;\n          else if (dir === 'left') left = val;\n        });\n      }\n    }\n  }\n\n  // Priority 2 (medium): paddingBlock/paddingInline\n  if (paddingBlock != null) {\n    const val = parsePaddingValue(paddingBlock);\n    if (val) top = bottom = val;\n  }\n  if (paddingInline != null) {\n    const val = parsePaddingValue(paddingInline);\n    if (val) left = right = val;\n  }\n\n  // Priority 3 (highest): individual directions\n  if (paddingTop != null) {\n    const val = parsePaddingValue(paddingTop);\n    if (val) top = val;\n  }\n  if (paddingRight != null) {\n    const val = parsePaddingValue(paddingRight);\n    if (val) right = val;\n  }\n  if (paddingBottom != null) {\n    const val = parsePaddingValue(paddingBottom);\n    if (val) bottom = val;\n  }\n  if (paddingLeft != null) {\n    const val = parsePaddingValue(paddingLeft);\n    if (val) left = val;\n  }\n\n  // Optimize output: 1 value if all same, 2 values if top==bottom && left==right\n  if (top === right && right === bottom && bottom === left) {\n    return { padding: top };\n  }\n  if (top === bottom && left === right) {\n    return { padding: `${top} ${left}` };\n  }\n\n  return { padding: `${top} ${right} ${bottom} ${left}` };\n}\n\npaddingStyle.__lookupStyles = [\n  'padding',\n  'paddingTop',\n  'paddingRight',\n  'paddingBottom',\n  'paddingLeft',\n  'paddingBlock',\n  'paddingInline',\n];\n"],"mappings":";;;;;;AAKA,SAAS,kBAAkB,OAAiD;AAC1E,KAAI,OAAO,UAAU,SAAU,QAAO,GAAG,MAAM;AAC/C,KAAI,CAAC,MAAO,QAAO;AACnB,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,WAAW,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE,QAAQ,EAAE,EAAE;AAEhE,QAAO,OAAO,MAAM;;;;;AAMtB,SAAS,wBAAwB,OAG/B;AACA,KAAI,OAAO,UAAU,SACnB,QAAO;EAAE,QAAQ,CAAC,GAAG,MAAM,IAAI;EAAE,YAAY,EAAE;EAAE;AAEnD,KAAI,CAAC,MAAO,QAAO;EAAE,QAAQ,EAAE;EAAE,YAAY,EAAE;EAAE;AACjD,KAAI,UAAU,KAAM,SAAQ;CAE5B,MAAM,EAAE,SAAS,EAAE,EAAE,OAAO,EAAE,KAAK,WAAW,MAAM,CAAC,OAAO,MAAM,EAAE;AAEpE,QAAO;EACL,QAAQ,OAAO,SAAS,SAAS,CAAC,aAAa;EAC/C,YAAY,WAAW,MAAM,WAAW;EACzC;;AAGH,SAAgB,aAAa,EAC3B,SACA,cACA,eACA,YACA,cACA,eACA,eASC;AAED,KACE,WAAW,QACX,gBAAgB,QAChB,iBAAiB,QACjB,cAAc,QACd,gBAAgB,QAChB,iBAAiB,QACjB,eAAe,KAEf,QAAO,EAAE;CAIX,IAAI,CAAC,KAAK,OAAO,QAAQ,QAAQ;EAAC;EAAK;EAAK;EAAK;EAAI;AAGrD,KAAI,WAAW,MAAM;EACnB,MAAM,EAAE,QAAQ,eAAe,wBAAwB,QAAQ;AAE/D,MAAI,OAAO,OACT,KAAI,WAAW,WAAW,GAAG;AAC3B,SAAM,OAAO;AACb,WAAQ,OAAO,MAAM,OAAO;AAC5B,YAAS,OAAO,MAAM,OAAO;AAC7B,UAAO,OAAO,MAAM,OAAO,MAAM,OAAO;QAIxC,YAAW,SAAS,KAAK,MAAM;GAC7B,MAAM,MAAM,OAAO,MAAM,OAAO;AAChC,OAAI,QAAQ,MAAO,OAAM;YAChB,QAAQ,QAAS,SAAQ;YACzB,QAAQ,SAAU,UAAS;YAC3B,QAAQ,OAAQ,QAAO;IAChC;;AAMR,KAAI,gBAAgB,MAAM;EACxB,MAAM,MAAM,kBAAkB,aAAa;AAC3C,MAAI,IAAK,OAAM,SAAS;;AAE1B,KAAI,iBAAiB,MAAM;EACzB,MAAM,MAAM,kBAAkB,cAAc;AAC5C,MAAI,IAAK,QAAO,QAAQ;;AAI1B,KAAI,cAAc,MAAM;EACtB,MAAM,MAAM,kBAAkB,WAAW;AACzC,MAAI,IAAK,OAAM;;AAEjB,KAAI,gBAAgB,MAAM;EACxB,MAAM,MAAM,kBAAkB,aAAa;AAC3C,MAAI,IAAK,SAAQ;;AAEnB,KAAI,iBAAiB,MAAM;EACzB,MAAM,MAAM,kBAAkB,cAAc;AAC5C,MAAI,IAAK,UAAS;;AAEpB,KAAI,eAAe,MAAM;EACvB,MAAM,MAAM,kBAAkB,YAAY;AAC1C,MAAI,IAAK,QAAO;;AAIlB,KAAI,QAAQ,SAAS,UAAU,UAAU,WAAW,KAClD,QAAO,EAAE,SAAS,KAAK;AAEzB,KAAI,QAAQ,UAAU,SAAS,MAC7B,QAAO,EAAE,SAAS,GAAG,IAAI,GAAG,QAAQ;AAGtC,QAAO,EAAE,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,OAAO,GAAG,QAAQ;;AAGzD,aAAa,iBAAiB;CAC5B;CACA;CACA;CACA;CACA;CACA;CACA;CACD"}

package/dist/styles/predefined.mjs

@@ -1,232 +0,0 @@
-import { isDevEnv } from "../utils/is-dev-env.mjs";
-import { alignStyle } from "./align.mjs";
-import { borderStyle } from "./border.mjs";
-import { createStyle } from "./createStyle.mjs";
-import { colorStyle } from "./color.mjs";
-import { displayStyle } from "./display.mjs";
-import { fadeStyle } from "./fade.mjs";
-import { fillStyle, svgFillStyle } from "./fill.mjs";
-import { flowStyle } from "./flow.mjs";
-import { gapStyle } from "./gap.mjs";
-import { heightStyle } from "./height.mjs";
-import { insetStyle } from "./inset.mjs";
-import { justifyStyle } from "./justify.mjs";
-import { marginStyle } from "./margin.mjs";
-import { outlineStyle } from "./outline.mjs";
-import { paddingStyle } from "./padding.mjs";
-import { presetStyle } from "./preset.mjs";
-import { radiusStyle } from "./radius.mjs";
-import { scrollbarStyle } from "./scrollbar.mjs";
-import { shadowStyle } from "./shadow.mjs";
-import { styledScrollbarStyle } from "./styledScrollbar.mjs";
-import { transitionStyle } from "./transition.mjs";
-import { widthStyle } from "./width.mjs";
-
-//#region src/styles/predefined.ts
-const devMode = isDevEnv();
-const columnsConverter = (val) => {
-	if (typeof val === "number") return "minmax(1px, 1fr) ".repeat(val).trim();
-};
-const rowsConverter = (val) => {
-	if (typeof val === "number") return "auto ".repeat(val).trim();
-};
-const STYLE_HANDLER_MAP = {};
-let initialHandlerMapSnapshot = null;
-/**
-* Capture a snapshot of the current STYLE_HANDLER_MAP.
-* Called after predefine() to preserve built-in handler state.
-*/
-function captureInitialHandlerState() {
-	initialHandlerMapSnapshot = {};
-	for (const key of Object.keys(STYLE_HANDLER_MAP)) initialHandlerMapSnapshot[key] = [...STYLE_HANDLER_MAP[key]];
-}
-function defineCustomStyle(names, handler) {
-	let handlerWithLookup;
-	if (typeof names === "function") {
-		handlerWithLookup = names;
-		names = handlerWithLookup.__lookupStyles;
-	} else if (handler) handlerWithLookup = Object.assign(handler, { __lookupStyles: names });
-	else {
-		console.warn("CubeUIKit: incorrect custom style definition: ", names);
-		return;
-	}
-	if (Array.isArray(names)) names.forEach((name) => {
-		if (!STYLE_HANDLER_MAP[name]) STYLE_HANDLER_MAP[name] = [];
-		STYLE_HANDLER_MAP[name].push(handlerWithLookup);
-	});
-}
-function defineStyleAlias(styleName, cssStyleName, converter) {
-	const styleHandler = createStyle(styleName, cssStyleName, converter);
-	if (!STYLE_HANDLER_MAP[styleName]) STYLE_HANDLER_MAP[styleName] = [];
-	STYLE_HANDLER_MAP[styleName].push(styleHandler);
-}
-function predefine() {
-	defineStyleAlias("gridAreas", "grid-template-areas");
-	defineStyleAlias("gridColumns", "grid-template-columns", columnsConverter);
-	defineStyleAlias("gridRows", "grid-template-rows", rowsConverter);
-	defineStyleAlias("gridTemplate", "grid-template", (val) => {
-		if (typeof val !== "string") return;
-		return val.split("/").map((s, i) => (i ? columnsConverter : rowsConverter)(s)).join("/");
-	});
-	[
-		displayStyle,
-		transitionStyle,
-		fillStyle,
-		svgFillStyle,
-		widthStyle,
-		marginStyle,
-		gapStyle,
-		flowStyle,
-		colorStyle,
-		heightStyle,
-		radiusStyle,
-		borderStyle,
-		shadowStyle,
-		paddingStyle,
-		alignStyle,
-		justifyStyle,
-		presetStyle,
-		outlineStyle,
-		styledScrollbarStyle,
-		scrollbarStyle,
-		fadeStyle,
-		insetStyle
-	].forEach((handler) => defineCustomStyle(handler));
-	captureInitialHandlerState();
-	return {
-		STYLE_HANDLER_MAP,
-		defineCustomStyle,
-		defineStyleAlias
-	};
-}
-/**
-* Normalize a handler definition to a StyleHandler with __lookupStyles.
-* - Function only: lookup styles inferred from key name
-* - [string, fn]: single lookup style
-* - [string[], fn]: multiple lookup styles
-*/
-function normalizeHandlerDefinition(keyName, definition) {
-	let handler;
-	let lookupStyles;
-	if (typeof definition === "function") {
-		handler = definition;
-		lookupStyles = [keyName];
-	} else if (Array.isArray(definition)) {
-		const [first, fn] = definition;
-		if (typeof fn !== "function") throw new Error(`[Tasty] Invalid handler definition for "${keyName}". Tuple must have a function as the second element: [string, function] or [string[], function].`);
-		handler = fn;
-		if (typeof first === "string") lookupStyles = [first];
-		else if (Array.isArray(first)) lookupStyles = first;
-		else throw new Error(`[Tasty] Invalid handler definition for "${keyName}". First element must be a string or string array.`);
-	} else throw new Error(`[Tasty] Invalid handler definition for "${keyName}". Expected function, [string, function], or [string[], function].`);
-	validateHandler(keyName, handler, lookupStyles);
-	const wrappedHandler = ((props) => handler(props));
-	wrappedHandler.__lookupStyles = lookupStyles;
-	return wrappedHandler;
-}
-/**
-* Validate a handler definition in development mode.
-*/
-function validateHandler(name, handler, lookupStyles) {
-	if (!devMode) return;
-	if (typeof handler !== "function") console.warn(`[Tasty] Handler "${name}" is not a function. Handlers must be functions that return CSSMap, CSSMap[], or void.`);
-	if (!lookupStyles || !Array.isArray(lookupStyles) || lookupStyles.length === 0) console.warn(`[Tasty] Handler "${name}" has invalid lookupStyles. Expected non-empty array of style names.`);
-}
-/**
-* Register a custom handler, replacing any existing handlers for the same lookup styles.
-* This is called by configure() to process user-defined handlers.
-*
-* When registering a handler for style X, any existing handler that processes X
-* is removed from ALL its lookup styles to prevent double-processing.
-* For example, if gapStyle handles ['display', 'flow', 'gap'] and a new handler
-* is registered for just ['gap'], gapStyle is removed from display and flow too.
-*/
-function registerHandler(handler) {
-	const lookupStyles = handler.__lookupStyles;
-	if (!lookupStyles || lookupStyles.length === 0) {
-		if (devMode) console.warn("[Tasty] Cannot register handler without __lookupStyles property.");
-		return;
-	}
-	const handlersToRemove = /* @__PURE__ */ new Set();
-	for (const styleName of lookupStyles) {
-		const existing = STYLE_HANDLER_MAP[styleName];
-		if (existing) for (const existingHandler of existing) handlersToRemove.add(existingHandler);
-	}
-	for (const oldHandler of handlersToRemove) {
-		const oldLookupStyles = oldHandler.__lookupStyles;
-		if (oldLookupStyles) for (const oldStyleName of oldLookupStyles) {
-			const handlers = STYLE_HANDLER_MAP[oldStyleName];
-			if (handlers) {
-				const filtered = handlers.filter((h) => h !== oldHandler);
-				if (filtered.length === 0) delete STYLE_HANDLER_MAP[oldStyleName];
-				else STYLE_HANDLER_MAP[oldStyleName] = filtered;
-			}
-		}
-	}
-	for (const styleName of lookupStyles) {
-		const existing = STYLE_HANDLER_MAP[styleName];
-		if (existing) existing.push(handler);
-		else STYLE_HANDLER_MAP[styleName] = [handler];
-	}
-}
-/**
-* Create a wrapped handler that can be safely called by users.
-* The wrapper preserves __lookupStyles for proper registration.
-*/
-function wrapHandler(handler) {
-	const fn = handler;
-	const wrapped = ((props) => fn(props));
-	wrapped.__lookupStyles = handler.__lookupStyles;
-	return wrapped;
-}
-/**
-* Exported object containing wrapped predefined style handlers.
-* Users can import and call these to extend or delegate to built-in behavior.
-*
-* Internal handlers use *Style suffix for searchability.
-* External API uses short names for convenience.
-*
-* @example
-* ```ts
-* import { styleHandlers, configure } from '@tenphi/tasty';
-*
-* configure({
-*   handlers: {
-*     fill: ({ fill }) => {
-*       if (fill?.startsWith('gradient:')) {
-*         return { background: fill.slice(9) };
-*       }
-*       return styleHandlers.fill({ fill });
-*     },
-*   },
-* });
-* ```
-*/
-const styleHandlers = {
-	align: wrapHandler(alignStyle),
-	border: wrapHandler(borderStyle),
-	color: wrapHandler(colorStyle),
-	display: wrapHandler(displayStyle),
-	fade: wrapHandler(fadeStyle),
-	fill: wrapHandler(fillStyle),
-	svgFill: wrapHandler(svgFillStyle),
-	flow: wrapHandler(flowStyle),
-	gap: wrapHandler(gapStyle),
-	height: wrapHandler(heightStyle),
-	inset: wrapHandler(insetStyle),
-	justify: wrapHandler(justifyStyle),
-	margin: wrapHandler(marginStyle),
-	outline: wrapHandler(outlineStyle),
-	padding: wrapHandler(paddingStyle),
-	preset: wrapHandler(presetStyle),
-	radius: wrapHandler(radiusStyle),
-	scrollbar: wrapHandler(scrollbarStyle),
-	shadow: wrapHandler(shadowStyle),
-	styledScrollbar: wrapHandler(styledScrollbarStyle),
-	transition: wrapHandler(transitionStyle),
-	width: wrapHandler(widthStyle)
-};
-
-//#endregion
-export { normalizeHandlerDefinition, predefine, registerHandler };
-//# sourceMappingURL=predefined.mjs.map

package/dist/styles/predefined.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"predefined.mjs","names":[],"sources":["../../src/styles/predefined.ts"],"sourcesContent":["import { isDevEnv } from '../utils/is-dev-env';\nimport type {\n  RawStyleHandler,\n  StyleHandler,\n  StyleHandlerDefinition,\n} from '../utils/styles';\n\nimport { alignStyle } from './align';\nimport { borderStyle } from './border';\nimport { colorStyle } from './color';\nimport { createStyle } from './createStyle';\nimport { displayStyle } from './display';\nimport { fadeStyle } from './fade';\nimport { fillStyle, svgFillStyle } from './fill';\nimport { flowStyle } from './flow';\n// Note: fontStyle (font.ts) and fontStyleStyle (fontStyle.ts) removed\n// Both font and fontStyle props are now handled by presetStyle\nimport { gapStyle } from './gap';\nimport { heightStyle } from './height';\nimport { insetStyle } from './inset';\nimport { justifyStyle } from './justify';\nimport { marginStyle } from './margin';\nimport { outlineStyle } from './outline';\nimport { paddingStyle } from './padding';\nimport { presetStyle } from './preset';\nimport { radiusStyle } from './radius';\nimport { scrollbarStyle } from './scrollbar';\nimport { shadowStyle } from './shadow';\nimport { styledScrollbarStyle } from './styledScrollbar';\nimport { transitionStyle } from './transition';\nimport { widthStyle } from './width';\n\nconst devMode = isDevEnv();\n\n \nconst _numberConverter = (val) => {\n  if (typeof val === 'number') {\n    return `${val}px`;\n  }\n\n  return val;\n};\nconst columnsConverter = (val) => {\n  if (typeof val === 'number') {\n    return 'minmax(1px, 1fr) '.repeat(val).trim();\n  }\n\n  return;\n};\nconst rowsConverter = (val) => {\n  if (typeof val === 'number') {\n    return 'auto '.repeat(val).trim();\n  }\n\n  return;\n};\n\ntype StyleHandlerMap = Record<string, StyleHandler[]>;\n\nexport const STYLE_HANDLER_MAP: StyleHandlerMap = {};\n\n// Store initial handler state for reset functionality\nlet initialHandlerMapSnapshot: StyleHandlerMap | null = null;\n\n/**\n * Capture a snapshot of the current STYLE_HANDLER_MAP.\n * Called after predefine() to preserve built-in handler state.\n */\nfunction captureInitialHandlerState(): void {\n  initialHandlerMapSnapshot = {};\n  for (const key of Object.keys(STYLE_HANDLER_MAP)) {\n    // Shallow copy the array - handlers themselves are immutable\n    initialHandlerMapSnapshot[key] = [...STYLE_HANDLER_MAP[key]];\n  }\n}\n\n/**\n * Reset STYLE_HANDLER_MAP to the initial built-in state.\n * Called by resetConfig() to restore handlers after tests.\n */\nexport function resetHandlers(): void {\n  if (!initialHandlerMapSnapshot) {\n    // predefine() hasn't been called yet, nothing to reset\n    return;\n  }\n\n  // Clear current map\n  for (const key of Object.keys(STYLE_HANDLER_MAP)) {\n    delete STYLE_HANDLER_MAP[key];\n  }\n\n  // Restore initial state\n  for (const key of Object.keys(initialHandlerMapSnapshot)) {\n    STYLE_HANDLER_MAP[key] = [...initialHandlerMapSnapshot[key]];\n  }\n}\n\nexport function defineCustomStyle(\n  names: string[] | StyleHandler,\n  handler?: RawStyleHandler,\n) {\n  let handlerWithLookup: StyleHandler;\n\n  if (typeof names === 'function') {\n    handlerWithLookup = names;\n    names = handlerWithLookup.__lookupStyles;\n  } else if (handler) {\n    handlerWithLookup = Object.assign(handler, { __lookupStyles: names });\n  } else {\n    console.warn('CubeUIKit: incorrect custom style definition: ', names);\n    return;\n  }\n\n  if (Array.isArray(names)) {\n    // just to pass type checking\n    names.forEach((name) => {\n      if (!STYLE_HANDLER_MAP[name]) {\n        STYLE_HANDLER_MAP[name] = [];\n      }\n\n      STYLE_HANDLER_MAP[name].push(handlerWithLookup);\n    });\n  }\n}\n\ntype ConverterHandler = (\n  s: string | boolean | number | undefined,\n) => string | undefined;\n\nexport function defineStyleAlias(\n  styleName: string,\n  cssStyleName?: string,\n  converter?: ConverterHandler,\n) {\n  const styleHandler = createStyle(styleName, cssStyleName, converter);\n\n  if (!STYLE_HANDLER_MAP[styleName]) {\n    STYLE_HANDLER_MAP[styleName] = [];\n  }\n\n  STYLE_HANDLER_MAP[styleName].push(styleHandler);\n}\n\nexport function predefine() {\n  // Style aliases\n  defineStyleAlias('gridAreas', 'grid-template-areas');\n  defineStyleAlias('gridColumns', 'grid-template-columns', columnsConverter);\n  defineStyleAlias('gridRows', 'grid-template-rows', rowsConverter);\n  defineStyleAlias('gridTemplate', 'grid-template', (val) => {\n    if (typeof val !== 'string') return;\n\n    return val\n      .split('/')\n      .map((s, i) => (i ? columnsConverter : rowsConverter)(s))\n      .join('/');\n  });\n  // Note: outlineOffset is now handled by outlineStyle\n\n  [\n    displayStyle,\n    transitionStyle,\n    fillStyle,\n    svgFillStyle,\n    widthStyle,\n    marginStyle,\n    gapStyle,\n    flowStyle,\n    colorStyle,\n    heightStyle,\n    radiusStyle,\n    borderStyle,\n    shadowStyle,\n    paddingStyle,\n    alignStyle,\n    justifyStyle,\n    presetStyle,\n    outlineStyle,\n    // DEPRECATED: `styledScrollbar` is deprecated, use `scrollbar` instead\n    styledScrollbarStyle,\n    scrollbarStyle,\n    fadeStyle,\n    insetStyle,\n  ]\n    // @ts-expect-error handler type varies across built-in style handlers\n    .forEach((handler) => defineCustomStyle(handler));\n\n  // Capture initial state after all built-in handlers are registered\n  captureInitialHandlerState();\n\n  return { STYLE_HANDLER_MAP, defineCustomStyle, defineStyleAlias };\n}\n\n// ============================================================================\n// Handler Registration API (for configure())\n// ============================================================================\n\n/**\n * Normalize a handler definition to a StyleHandler with __lookupStyles.\n * - Function only: lookup styles inferred from key name\n * - [string, fn]: single lookup style\n * - [string[], fn]: multiple lookup styles\n */\nexport function normalizeHandlerDefinition(\n  keyName: string,\n  definition: StyleHandlerDefinition,\n): StyleHandler {\n  let handler: RawStyleHandler;\n  let lookupStyles: string[];\n\n  if (typeof definition === 'function') {\n    // Function only - lookup styles inferred from key name\n    handler = definition;\n    lookupStyles = [keyName];\n  } else if (Array.isArray(definition)) {\n    const [first, fn] = definition;\n\n    if (typeof fn !== 'function') {\n      throw new Error(\n        `[Tasty] Invalid handler definition for \"${keyName}\". ` +\n          'Tuple must have a function as the second element: [string, function] or [string[], function].',\n      );\n    }\n\n    handler = fn;\n\n    if (typeof first === 'string') {\n      // [string, fn] - single lookup style\n      lookupStyles = [first];\n    } else if (Array.isArray(first)) {\n      // [string[], fn] - multiple lookup styles\n      lookupStyles = first;\n    } else {\n      throw new Error(\n        `[Tasty] Invalid handler definition for \"${keyName}\". ` +\n          'First element must be a string or string array.',\n      );\n    }\n  } else {\n    throw new Error(\n      `[Tasty] Invalid handler definition for \"${keyName}\". ` +\n        'Expected function, [string, function], or [string[], function].',\n    );\n  }\n\n  // Validate handler in dev mode\n  validateHandler(keyName, handler, lookupStyles);\n\n  // Wrap the handler to avoid mutation issues when the same function\n  // is reused for multiple handler definitions. Each registration\n  // gets its own function identity with its own __lookupStyles.\n  const wrappedHandler = ((props) => handler(props)) as StyleHandler;\n  wrappedHandler.__lookupStyles = lookupStyles;\n\n  return wrappedHandler;\n}\n\n/**\n * Validate a handler definition in development mode.\n */\nfunction validateHandler(\n  name: string,\n  handler: RawStyleHandler,\n  lookupStyles: string[],\n): void {\n  if (!devMode) return;\n\n  if (typeof handler !== 'function') {\n    console.warn(\n      `[Tasty] Handler \"${name}\" is not a function. ` +\n        'Handlers must be functions that return CSSMap, CSSMap[], or void.',\n    );\n  }\n\n  if (\n    !lookupStyles ||\n    !Array.isArray(lookupStyles) ||\n    lookupStyles.length === 0\n  ) {\n    console.warn(\n      `[Tasty] Handler \"${name}\" has invalid lookupStyles. ` +\n        'Expected non-empty array of style names.',\n    );\n  }\n}\n\n/**\n * Validate a handler result in development mode.\n * Call this after invoking a handler to check the return value.\n */\nexport function validateHandlerResult(name: string, result: unknown): void {\n  if (!devMode) return;\n  if (result === undefined || result === null) return; // void is valid\n\n  // Check for empty string (migration from old pattern)\n  if (result === '') {\n    console.warn(\n      `[Tasty] Handler \"${name}\" returned empty string. ` +\n        'Return void/undefined instead for no output.',\n    );\n    return;\n  }\n\n  // Check result is object (CSSMap or CSSMap[])\n  if (typeof result !== 'object') {\n    console.warn(\n      `[Tasty] Handler \"${name}\" returned invalid type: ${typeof result}. ` +\n        'Expected CSSMap, CSSMap[], or void.',\n    );\n  }\n}\n\n/**\n * Register a custom handler, replacing any existing handlers for the same lookup styles.\n * This is called by configure() to process user-defined handlers.\n *\n * When registering a handler for style X, any existing handler that processes X\n * is removed from ALL its lookup styles to prevent double-processing.\n * For example, if gapStyle handles ['display', 'flow', 'gap'] and a new handler\n * is registered for just ['gap'], gapStyle is removed from display and flow too.\n */\nexport function registerHandler(handler: StyleHandler): void {\n  const lookupStyles = handler.__lookupStyles;\n\n  if (!lookupStyles || lookupStyles.length === 0) {\n    if (devMode) {\n      console.warn(\n        '[Tasty] Cannot register handler without __lookupStyles property.',\n      );\n    }\n    return;\n  }\n\n  // Find and remove existing handlers that would conflict\n  // A handler conflicts if it handles any of the same styles as the new handler\n  const handlersToRemove = new Set<StyleHandler>();\n\n  for (const styleName of lookupStyles) {\n    const existing = STYLE_HANDLER_MAP[styleName];\n    if (existing) {\n      for (const existingHandler of existing) {\n        handlersToRemove.add(existingHandler);\n      }\n    }\n  }\n\n  // Remove conflicting handlers from ALL their lookup styles\n  for (const oldHandler of handlersToRemove) {\n    const oldLookupStyles = oldHandler.__lookupStyles;\n    if (oldLookupStyles) {\n      for (const oldStyleName of oldLookupStyles) {\n        const handlers = STYLE_HANDLER_MAP[oldStyleName];\n        if (handlers) {\n          const filtered = handlers.filter((h) => h !== oldHandler);\n          if (filtered.length === 0) {\n            delete STYLE_HANDLER_MAP[oldStyleName];\n          } else {\n            STYLE_HANDLER_MAP[oldStyleName] = filtered;\n          }\n        }\n      }\n    }\n  }\n\n  // Register the new handler under its lookup styles\n  for (const styleName of lookupStyles) {\n    const existing = STYLE_HANDLER_MAP[styleName];\n    if (existing) {\n      existing.push(handler);\n    } else {\n      STYLE_HANDLER_MAP[styleName] = [handler];\n    }\n  }\n}\n\n// ============================================================================\n// Wrapped Style Handlers Export\n// ============================================================================\n\n/**\n * Create a wrapped handler that can be safely called by users.\n * The wrapper preserves __lookupStyles for proper registration.\n */\nfunction wrapHandler<T extends { __lookupStyles: string[] }>(handler: T): T {\n  const fn = handler as unknown as (props: unknown) => unknown;\n  const wrapped = ((props: unknown) => fn(props)) as unknown as T;\n  wrapped.__lookupStyles = handler.__lookupStyles;\n  return wrapped;\n}\n\n/**\n * Exported object containing wrapped predefined style handlers.\n * Users can import and call these to extend or delegate to built-in behavior.\n *\n * Internal handlers use *Style suffix for searchability.\n * External API uses short names for convenience.\n *\n * @example\n * ```ts\n * import { styleHandlers, configure } from '@tenphi/tasty';\n *\n * configure({\n *   handlers: {\n *     fill: ({ fill }) => {\n *       if (fill?.startsWith('gradient:')) {\n *         return { background: fill.slice(9) };\n *       }\n *       return styleHandlers.fill({ fill });\n *     },\n *   },\n * });\n * ```\n */\nexport const styleHandlers = {\n  align: wrapHandler(alignStyle),\n  border: wrapHandler(borderStyle),\n  color: wrapHandler(colorStyle),\n  display: wrapHandler(displayStyle),\n  fade: wrapHandler(fadeStyle),\n  fill: wrapHandler(fillStyle),\n  svgFill: wrapHandler(svgFillStyle),\n  flow: wrapHandler(flowStyle),\n  gap: wrapHandler(gapStyle),\n  height: wrapHandler(heightStyle),\n  inset: wrapHandler(insetStyle),\n  justify: wrapHandler(justifyStyle),\n  margin: wrapHandler(marginStyle),\n  outline: wrapHandler(outlineStyle),\n  padding: wrapHandler(paddingStyle),\n  preset: wrapHandler(presetStyle),\n  radius: wrapHandler(radiusStyle),\n  scrollbar: wrapHandler(scrollbarStyle),\n  shadow: wrapHandler(shadowStyle),\n  styledScrollbar: wrapHandler(styledScrollbarStyle),\n  transition: wrapHandler(transitionStyle),\n  width: wrapHandler(widthStyle),\n} as const;\n"],"mappings":"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"}

package/dist/styles/preset.mjs

@@ -1,126 +0,0 @@
-import { makeEmptyDetails } from "../parser/types.mjs";
-import { parseStyle } from "../utils/styles.mjs";
-
-//#region src/styles/preset.ts
-/**
-* Convert a value to CSS, handling numbers as pixels for numeric properties
-*/
-function toCSS(value, isNumeric) {
-	if (value == null) return null;
-	if (typeof value === "number") return isNumeric ? `${value}px` : String(value);
-	return parseStyle(String(value)).groups[0]?.values[0] || String(value);
-}
-function setCSSValue(styles, styleName, presetName, isPropOnly = false) {
-	styles[`--${styleName}`] = (() => {
-		if (presetName === "inherit") return "inherit";
-		const defaultValue = `var(--default-${styleName}, ${styleName === "font-family" ? "var(--font, NonexistentFontName)" : "inherit"})`;
-		const fontSuffix = styleName === "font-family" ? ", var(--font, sans-serif)" : "";
-		if (presetName === "default") return `${defaultValue}${fontSuffix}`;
-		else return `var(--${presetName}-${styleName}, ${defaultValue})${fontSuffix}`;
-	})();
-	if (!isPropOnly) styles[styleName] = styles[`--${styleName}`];
-}
-/**
-* Resolve font/fontFamily value to CSS font-family string.
-*
-* - `font="monospace"` → var(--monospace-font)
-* - `font={true}` → var(--font)
-* - `font="CustomFont"` → CustomFont, var(--font)
-* - `fontFamily="Arial"` → Arial (direct, no fallback)
-*/
-function resolveFontFamily(font, fontFamily) {
-	if (fontFamily) return {
-		value: fontFamily,
-		setVar: false
-	};
-	if (font == null || font === false) return null;
-	if (font === "monospace") return {
-		value: "var(--monospace-font)",
-		setVar: true
-	};
-	if (font === true) return {
-		value: "var(--font)",
-		setVar: true
-	};
-	return {
-		value: `${font}, var(--font)`,
-		setVar: true
-	};
-}
-/**
-* Handles typography preset and individual font properties.
-*
-* When `preset` is defined, it sets up CSS custom properties for typography.
-* Individual font props can be used with or without `preset`:
-* - With `preset`: overrides the preset value for that property
-* - Without `preset`: outputs the CSS directly
-*
-* Number values are converted to pixels for fontSize, lineHeight, letterSpacing.
-* fontWeight accepts numbers directly (e.g., 400, 700).
-*
-* font vs fontFamily:
-* - `font` is the recommended prop with special handling (monospace, boolean, fallback)
-* - `fontFamily` is a direct value without special handling
-*/
-function presetStyle({ preset, fontSize, lineHeight, textTransform, letterSpacing, fontWeight, fontStyle, fontFamily, font }) {
-	const styles = {};
-	if (preset != null && preset !== false) {
-		let { mods } = parseStyle(preset === true ? "" : String(preset)).groups[0] ?? makeEmptyDetails();
-		const isStrong = mods.includes("strong");
-		const isItalic = mods.includes("italic");
-		const isIcon = mods.includes("icon");
-		const isTight = mods.includes("tight");
-		mods = mods.filter((mod) => mod !== "strong" && mod !== "bold" && mod !== "italic" && mod !== "icon" && mod !== "tight");
-		const name = mods[0] || "inherit";
-		if (fontSize == null) setCSSValue(styles, "font-size", name);
-		if (lineHeight == null) setCSSValue(styles, "line-height", name);
-		if (letterSpacing == null) setCSSValue(styles, "letter-spacing", name);
-		if (fontWeight == null) setCSSValue(styles, "font-weight", name);
-		if (fontStyle == null) setCSSValue(styles, "font-style", name);
-		if (textTransform == null) setCSSValue(styles, "text-transform", name);
-		if (fontFamily == null && font == null) setCSSValue(styles, "font-family", name);
-		setCSSValue(styles, "bold-font-weight", name, true);
-		setCSSValue(styles, "icon-size", name, true);
-		if (isStrong) styles["font-weight"] = "var(--bold-font-weight)";
-		if (isItalic) styles["font-style"] = "italic";
-		if (isIcon) {
-			styles["font-size"] = "var(--icon-size)";
-			styles["line-height"] = "var(--icon-size)";
-		}
-		if (isTight) styles["line-height"] = "var(--font-size)";
-	}
-	const fontSizeVal = toCSS(fontSize, true);
-	if (fontSizeVal) styles["font-size"] = fontSizeVal;
-	const lineHeightVal = toCSS(lineHeight, true);
-	if (lineHeightVal) styles["line-height"] = lineHeightVal;
-	const letterSpacingVal = toCSS(letterSpacing, true);
-	if (letterSpacingVal) styles["letter-spacing"] = letterSpacingVal;
-	const fontWeightVal = toCSS(fontWeight, false);
-	if (fontWeightVal) styles["font-weight"] = fontWeightVal;
-	if (fontStyle != null) if (fontStyle === true) styles["font-style"] = "italic";
-	else if (fontStyle !== "inherit") styles["font-style"] = fontStyle ? "italic" : "normal";
-	else styles["font-style"] = "inherit";
-	if (textTransform) styles["text-transform"] = textTransform;
-	const fontResult = resolveFontFamily(font, fontFamily);
-	if (fontResult) {
-		styles["font-family"] = fontResult.value;
-		if (fontResult.setVar) styles["--font-family"] = fontResult.value;
-	}
-	if (Object.keys(styles).length === 0) return;
-	return styles;
-}
-presetStyle.__lookupStyles = [
-	"preset",
-	"fontSize",
-	"lineHeight",
-	"letterSpacing",
-	"textTransform",
-	"fontWeight",
-	"fontStyle",
-	"fontFamily",
-	"font"
-];
-
-//#endregion
-export { presetStyle };
-//# sourceMappingURL=preset.mjs.map

package/dist/styles/preset.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"preset.mjs","names":[],"sources":["../../src/styles/preset.ts"],"sourcesContent":["import { makeEmptyDetails } from '../parser/types';\nimport { parseStyle } from '../utils/styles';\n\nimport type { Styles } from './types';\n\n/**\n * Convert a value to CSS, handling numbers as pixels for numeric properties\n */\nfunction toCSS(\n  value: string | number | undefined,\n  isNumeric: boolean,\n): string | null {\n  if (value == null) return null;\n  if (typeof value === 'number') {\n    return isNumeric ? `${value}px` : String(value);\n  }\n  // Parse through style parser to handle custom units like 1x, 2r, etc.\n  const processed = parseStyle(String(value));\n  return processed.groups[0]?.values[0] || String(value);\n}\n\nfunction setCSSValue(\n  styles: Styles,\n  styleName: string,\n  presetName: string,\n  isPropOnly = false,\n) {\n  styles[`--${styleName}`] = (() => {\n    if (presetName === 'inherit') {\n      return 'inherit';\n    }\n\n    const defaultValue = `var(--default-${styleName}, ${\n      styleName === 'font-family'\n        ? 'var(--font, NonexistentFontName)'\n        : 'inherit'\n    })`;\n    const fontSuffix =\n      styleName === 'font-family' ? ', var(--font, sans-serif)' : '';\n\n    if (presetName === 'default') {\n      return `${defaultValue}${fontSuffix}`;\n    } else {\n      return `var(--${presetName}-${styleName}, ${defaultValue})${fontSuffix}`;\n    }\n  })();\n\n  if (!isPropOnly) {\n    styles[styleName] = styles[`--${styleName}`];\n  }\n}\n\ninterface PresetStyleProps {\n  preset?: string | boolean;\n  fontSize?: string | number;\n  lineHeight?: string | number;\n  textTransform?: string;\n  letterSpacing?: string | number;\n  fontWeight?: string | number;\n  fontStyle?: string | boolean;\n  fontFamily?: string;\n  /** Alias for fontFamily with special handling for 'monospace' and boolean */\n  font?: string | boolean;\n}\n\n/**\n * Resolve font/fontFamily value to CSS font-family string.\n *\n * - `font=\"monospace\"` → var(--monospace-font)\n * - `font={true}` → var(--font)\n * - `font=\"CustomFont\"` → CustomFont, var(--font)\n * - `fontFamily=\"Arial\"` → Arial (direct, no fallback)\n */\nfunction resolveFontFamily(\n  font: string | boolean | undefined,\n  fontFamily: string | undefined,\n): { value: string; setVar: boolean } | null {\n  // fontFamily takes precedence as a direct value\n  if (fontFamily) {\n    return { value: fontFamily, setVar: false };\n  }\n\n  if (font == null || font === false) {\n    return null;\n  }\n\n  if (font === 'monospace') {\n    return { value: 'var(--monospace-font)', setVar: true };\n  }\n\n  if (font === true) {\n    return { value: 'var(--font)', setVar: true };\n  }\n\n  return { value: `${font}, var(--font)`, setVar: true };\n}\n\n/**\n * Handles typography preset and individual font properties.\n *\n * When `preset` is defined, it sets up CSS custom properties for typography.\n * Individual font props can be used with or without `preset`:\n * - With `preset`: overrides the preset value for that property\n * - Without `preset`: outputs the CSS directly\n *\n * Number values are converted to pixels for fontSize, lineHeight, letterSpacing.\n * fontWeight accepts numbers directly (e.g., 400, 700).\n *\n * font vs fontFamily:\n * - `font` is the recommended prop with special handling (monospace, boolean, fallback)\n * - `fontFamily` is a direct value without special handling\n */\nexport function presetStyle({\n  preset,\n  fontSize,\n  lineHeight,\n  textTransform,\n  letterSpacing,\n  fontWeight,\n  fontStyle,\n  fontFamily,\n  font,\n}: PresetStyleProps) {\n  const styles: Styles = {};\n  const hasPreset = preset != null && preset !== false;\n\n  // Handle preset if defined\n  if (hasPreset) {\n    const presetValue = preset === true ? '' : String(preset);\n\n    const processed = parseStyle(presetValue);\n    let { mods } = processed.groups[0] ?? makeEmptyDetails();\n\n    const isStrong = mods.includes('strong');\n    const isItalic = mods.includes('italic');\n    const isIcon = mods.includes('icon');\n    const isTight = mods.includes('tight');\n\n    mods = mods.filter(\n      (mod) =>\n        mod !== 'strong' &&\n        mod !== 'bold' &&\n        mod !== 'italic' &&\n        mod !== 'icon' &&\n        mod !== 'tight',\n    );\n\n    const name = mods[0] || 'inherit';\n\n    // Set preset values for properties not explicitly overridden\n    if (fontSize == null) {\n      setCSSValue(styles, 'font-size', name);\n    }\n    if (lineHeight == null) {\n      setCSSValue(styles, 'line-height', name);\n    }\n    if (letterSpacing == null) {\n      setCSSValue(styles, 'letter-spacing', name);\n    }\n    if (fontWeight == null) {\n      setCSSValue(styles, 'font-weight', name);\n    }\n    if (fontStyle == null) {\n      setCSSValue(styles, 'font-style', name);\n    }\n    if (textTransform == null) {\n      setCSSValue(styles, 'text-transform', name);\n    }\n    if (fontFamily == null && font == null) {\n      setCSSValue(styles, 'font-family', name);\n    }\n\n    setCSSValue(styles, 'bold-font-weight', name, true);\n    setCSSValue(styles, 'icon-size', name, true);\n\n    if (isStrong) {\n      styles['font-weight'] = 'var(--bold-font-weight)';\n    }\n    if (isItalic) {\n      styles['font-style'] = 'italic';\n    }\n    if (isIcon) {\n      styles['font-size'] = 'var(--icon-size)';\n      styles['line-height'] = 'var(--icon-size)';\n    }\n    if (isTight) {\n      styles['line-height'] = 'var(--font-size)';\n    }\n  }\n\n  // Handle individual font properties (work with or without preset)\n  const fontSizeVal = toCSS(fontSize, true);\n  if (fontSizeVal) {\n    styles['font-size'] = fontSizeVal;\n  }\n\n  const lineHeightVal = toCSS(lineHeight, true);\n  if (lineHeightVal) {\n    styles['line-height'] = lineHeightVal;\n  }\n\n  const letterSpacingVal = toCSS(letterSpacing, true);\n  if (letterSpacingVal) {\n    styles['letter-spacing'] = letterSpacingVal;\n  }\n\n  // fontWeight: numbers should NOT get 'px' suffix\n  const fontWeightVal = toCSS(fontWeight, false);\n  if (fontWeightVal) {\n    styles['font-weight'] = fontWeightVal;\n  }\n\n  // fontStyle: handle boolean (true → italic) and string values\n  if (fontStyle != null) {\n    if (fontStyle === true) {\n      styles['font-style'] = 'italic';\n    } else if (fontStyle !== 'inherit') {\n      styles['font-style'] = fontStyle ? 'italic' : 'normal';\n    } else {\n      styles['font-style'] = 'inherit';\n    }\n  }\n\n  if (textTransform) {\n    styles['text-transform'] = textTransform;\n  }\n\n  // Handle font/fontFamily (font has special handling, fontFamily is direct)\n  const fontResult = resolveFontFamily(font, fontFamily);\n  if (fontResult) {\n    styles['font-family'] = fontResult.value;\n    if (fontResult.setVar) {\n      styles['--font-family'] = fontResult.value;\n    }\n  }\n\n  // Return undefined if no styles to apply\n  if (Object.keys(styles).length === 0) {\n    return;\n  }\n\n  return styles;\n}\n\npresetStyle.__lookupStyles = [\n  'preset',\n  'fontSize',\n  'lineHeight',\n  'letterSpacing',\n  'textTransform',\n  'fontWeight',\n  'fontStyle',\n  'fontFamily',\n  'font',\n];\n"],"mappings":"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"}

package/dist/styles/radius.mjs

@@ -1,51 +0,0 @@
-import { makeEmptyDetails } from "../parser/types.mjs";
-import { DIRECTIONS, parseStyle } from "../utils/styles.mjs";
-
-//#region src/styles/radius.ts
-const PROP = "var(--radius)";
-const SHARP = "var(--sharp-radius)";
-function radiusStyle({ radius }) {
-	if (typeof radius === "number") radius = `${radius}px`;
-	if (!radius) return;
-	if (radius === true) radius = "1r";
-	const processed = parseStyle(radius);
-	const { mods } = processed.groups[0] ?? makeEmptyDetails();
-	let { values } = processed.groups[0] ?? makeEmptyDetails();
-	if (mods.includes("round")) values = ["9999rem"];
-	else if (mods.includes("ellipse")) values = ["50%"];
-	else if (!values.length) values = [PROP];
-	if (mods.includes("leaf")) values = [
-		values[1] || SHARP,
-		values[0] || PROP,
-		values[1] || SHARP,
-		values[0] || PROP
-	];
-	else if (mods.includes("backleaf")) values = [
-		values[0] || PROP,
-		values[1] || SHARP,
-		values[0] || PROP,
-		values[1] || SHARP
-	];
-	else if (mods.length) {
-		const arr = [
-			"0",
-			"0",
-			"0",
-			"0"
-		];
-		let flag = false;
-		DIRECTIONS.forEach((dir, i) => {
-			if (!mods.includes(dir)) return;
-			flag = true;
-			arr[i] = values[0] || PROP;
-			arr[(i + 1) % 4] = values[0] || PROP;
-		});
-		if (flag) values = arr;
-	}
-	return { "border-radius": values.join(" ") };
-}
-radiusStyle.__lookupStyles = ["radius"];
-
-//#endregion
-export { radiusStyle };
-//# sourceMappingURL=radius.mjs.map