@tenphi/tasty 0.1.0

package/dist/styles/padding.js

@@ -0,0 +1,96 @@
+import { DIRECTIONS, filterMods, parseStyle } from "../utils/styles.js";
+
+//#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.js.map

package/dist/styles/padding.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"padding.js","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/padding.mjs

@@ -0,0 +1,96 @@
+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

@@ -0,0 +1 @@
+{"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.d.ts

@@ -0,0 +1,74 @@
+import "../utils/styles.js";
+import { alignStyle } from "./align.js";
+import { borderStyle } from "./border.js";
+import { colorStyle } from "./color.js";
+import { displayStyle } from "./display.js";
+import { fadeStyle } from "./fade.js";
+import { fillStyle, svgFillStyle } from "./fill.js";
+import { flowStyle } from "./flow.js";
+import { gapStyle } from "./gap.js";
+import { heightStyle } from "./height.js";
+import { insetStyle } from "./inset.js";
+import { justifyStyle } from "./justify.js";
+import { marginStyle } from "./margin.js";
+import { outlineStyle } from "./outline.js";
+import { paddingStyle } from "./padding.js";
+import { presetStyle } from "./preset.js";
+import { radiusStyle } from "./radius.js";
+import { scrollbarStyle } from "./scrollbar.js";
+import { shadowStyle } from "./shadow.js";
+import { styledScrollbarStyle } from "./styledScrollbar.js";
+import { transitionStyle } from "./transition.js";
+import { widthStyle } from "./width.js";
+
+//#region src/styles/predefined.d.ts
+/**
+ * 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 });
+ *     },
+ *   },
+ * });
+ * ```
+ */
+declare const styleHandlers: {
+  readonly align: typeof alignStyle;
+  readonly border: typeof borderStyle;
+  readonly color: typeof colorStyle;
+  readonly display: typeof displayStyle;
+  readonly fade: typeof fadeStyle;
+  readonly fill: typeof fillStyle;
+  readonly svgFill: typeof svgFillStyle;
+  readonly flow: typeof flowStyle;
+  readonly gap: typeof gapStyle;
+  readonly height: typeof heightStyle;
+  readonly inset: typeof insetStyle;
+  readonly justify: typeof justifyStyle;
+  readonly margin: typeof marginStyle;
+  readonly outline: typeof outlineStyle;
+  readonly padding: typeof paddingStyle;
+  readonly preset: typeof presetStyle;
+  readonly radius: typeof radiusStyle;
+  readonly scrollbar: typeof scrollbarStyle;
+  readonly shadow: typeof shadowStyle;
+  readonly styledScrollbar: typeof styledScrollbarStyle;
+  readonly transition: typeof transitionStyle;
+  readonly width: typeof widthStyle;
+};
+//#endregion
+export { styleHandlers };
+//# sourceMappingURL=predefined.d.ts.map

package/dist/styles/predefined.js

@@ -0,0 +1,241 @@
+import { isDevEnv } from "../utils/is-dev-env.js";
+import { alignStyle } from "./align.js";
+import { borderStyle } from "./border.js";
+import { createStyle } from "./createStyle.js";
+import { colorStyle } from "./color.js";
+import { displayStyle } from "./display.js";
+import { fadeStyle } from "./fade.js";
+import { fillStyle, svgFillStyle } from "./fill.js";
+import { flowStyle } from "./flow.js";
+import { gapStyle } from "./gap.js";
+import { heightStyle } from "./height.js";
+import { insetStyle } from "./inset.js";
+import { justifyStyle } from "./justify.js";
+import { marginStyle } from "./margin.js";
+import { outlineStyle } from "./outline.js";
+import { paddingStyle } from "./padding.js";
+import { presetStyle } from "./preset.js";
+import { radiusStyle } from "./radius.js";
+import { scrollbarStyle } from "./scrollbar.js";
+import { shadowStyle } from "./shadow.js";
+import { styledScrollbarStyle } from "./styledScrollbar.js";
+import { transitionStyle } from "./transition.js";
+import { widthStyle } from "./width.js";
+
+//#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]];
+}
+/**
+* Reset STYLE_HANDLER_MAP to the initial built-in state.
+* Called by resetConfig() to restore handlers after tests.
+*/
+function resetHandlers() {
+	if (!initialHandlerMapSnapshot) return;
+	for (const key of Object.keys(STYLE_HANDLER_MAP)) delete STYLE_HANDLER_MAP[key];
+	for (const key of Object.keys(initialHandlerMapSnapshot)) STYLE_HANDLER_MAP[key] = [...initialHandlerMapSnapshot[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, resetHandlers, styleHandlers };
+//# sourceMappingURL=predefined.js.map

package/dist/styles/predefined.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"predefined.js","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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"}