@tachui/core 0.7.0-alpha1 → 0.7.1-alpha

package/dist/modifiers/transformations.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"transformations.cjs","sources":["../../src/modifiers/transformations.ts"],"sourcesContent":["/**\n * Transformation Modifiers - CSS Transform System\n *\n * Provides comprehensive 2D and 3D transform capabilities including\n * scale, rotate, translate, skew, perspective, and matrix transforms.\n */\n\nimport type { DOMNode } from '../runtime/types'\nimport { BaseModifier } from './base'\nimport type { ModifierContext, ReactiveModifierProps } from './types'\n\nexport interface TransformConfig {\n  scale?: number | { x?: number; y?: number }\n  rotate?: string\n  translate?: { x?: number | string; y?: number | string }\n  skew?: { x?: string; y?: string }\n  perspective?: number\n}\n\nexport interface Transform3DConfig extends TransformConfig {\n  rotateX?: string\n  rotateY?: string\n  rotateZ?: string\n  translate?: { x?: number | string; y?: number | string; z?: number | string }\n  translateZ?: number | string\n  scaleZ?: number\n}\n\nexport interface ModifierTransformOptions {\n  transform?: TransformConfig | Transform3DConfig\n  transformOrigin?: string\n  backfaceVisibility?: 'visible' | 'hidden'\n  transformStyle?: 'flat' | 'preserve-3d'\n}\n\nexport type ReactiveTransformOptions = ReactiveModifierProps<ModifierTransformOptions>\n\nexport class TransformModifier extends BaseModifier<ModifierTransformOptions> {\n  readonly type = 'transform'\n  readonly priority = 45\n\n  constructor(options: ReactiveTransformOptions) {\n    const resolvedOptions: ModifierTransformOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeTransformStyles(this.properties)\n    this.applyStyles(context.element, styles)\n\n    return undefined\n  }\n\n  private computeTransformStyles(props: ModifierTransformOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transform) {\n      styles.transform = this.generateTransformCSS(props.transform)\n    }\n\n    if (props.transformOrigin) {\n      styles.transformOrigin = props.transformOrigin\n    }\n\n    if (props.backfaceVisibility) {\n      styles.backfaceVisibility = props.backfaceVisibility\n    }\n\n    if (props.transformStyle) {\n      styles.transformStyle = props.transformStyle\n    }\n\n    return styles\n  }\n\n  private generateTransformCSS(config: TransformConfig | Transform3DConfig): string {\n    const transforms: string[] = []\n\n    // Handle perspective first (for 3D transforms)\n    if ('perspective' in config && config.perspective !== undefined) {\n      transforms.push(`perspective(${config.perspective}px)`)\n    }\n\n    // Handle scale\n    if (config.scale !== undefined) {\n      if (typeof config.scale === 'number') {\n        transforms.push(`scale(${config.scale})`)\n      } else {\n        const x = config.scale.x ?? 1\n        const y = config.scale.y ?? 1\n        transforms.push(`scale(${x}, ${y})`)\n      }\n    }\n\n    // Handle rotate (2D)\n    if (config.rotate !== undefined) {\n      transforms.push(`rotate(${config.rotate})`)\n    }\n\n    // Handle 3D rotations\n    if ('rotateX' in config && config.rotateX !== undefined) {\n      transforms.push(`rotateX(${config.rotateX})`)\n    }\n    if ('rotateY' in config && config.rotateY !== undefined) {\n      transforms.push(`rotateY(${config.rotateY})`)\n    }\n    if ('rotateZ' in config && config.rotateZ !== undefined) {\n      transforms.push(`rotateZ(${config.rotateZ})`)\n    }\n\n    // Handle translate\n    if (config.translate !== undefined) {\n      const x = this.formatLength(config.translate.x ?? 0)\n      const y = this.formatLength(config.translate.y ?? 0)\n\n      // Check for Z value in translate object or translateZ property\n      let z = '0'\n      if ('z' in config.translate && config.translate.z !== undefined) {\n        z = this.formatLength(config.translate.z)\n      } else if ('translateZ' in config && config.translateZ !== undefined) {\n        z = this.formatLength(config.translateZ)\n      }\n\n      // Always use translate3d for hardware acceleration\n      transforms.push(`translate3d(${x}, ${y}, ${z})`)\n    }\n\n    // Handle 3D scale\n    if ('scaleZ' in config && config.scaleZ !== undefined) {\n      transforms.push(`scaleZ(${config.scaleZ})`)\n    }\n\n    // Handle skew\n    if (config.skew !== undefined) {\n      if (config.skew.x !== undefined && config.skew.y !== undefined) {\n        transforms.push(`skew(${config.skew.x}, ${config.skew.y})`)\n      } else if (config.skew.x !== undefined) {\n        transforms.push(`skewX(${config.skew.x})`)\n      } else if (config.skew.y !== undefined) {\n        transforms.push(`skewY(${config.skew.y})`)\n      }\n    }\n\n    return transforms.join(' ')\n  }\n\n  private formatLength(value: number | string): string {\n    if (typeof value === 'number') {\n      return `${value}px`\n    }\n    return value\n  }\n}\n\n// ============================================================================\n// Advanced Transform System for Matrix and Extended 3D\n// ============================================================================\n\nexport interface MatrixTransformConfig {\n  matrix?: [number, number, number, number, number, number]\n  matrix3d?: [\n    number, number, number, number,\n    number, number, number, number,\n    number, number, number, number,\n    number, number, number, number\n  ]\n}\n\nexport interface Advanced3DTransformConfig {\n  rotate3d?: { x: number; y: number; z: number; angle: string }\n  scale3d?: { x: number; y: number; z: number }\n  translate3d?: { x?: number | string; y?: number | string; z?: number | string }\n  scaleX?: number\n  scaleY?: number\n  scaleZ?: number\n  translateX?: number | string\n  translateY?: number | string\n  translateZ?: number | string\n}\n\nexport interface ModifierAdvancedTransformOptions {\n  transform?: TransformConfig | Transform3DConfig | MatrixTransformConfig | Advanced3DTransformConfig\n  transformOrigin?: string\n  perspectiveOrigin?: string\n  transformStyle?: 'flat' | 'preserve-3d'\n  backfaceVisibility?: 'visible' | 'hidden'\n}\n\nexport type ReactiveAdvancedTransformOptions = ReactiveModifierProps<ModifierAdvancedTransformOptions>\n\nexport class AdvancedTransformModifier extends BaseModifier<ModifierAdvancedTransformOptions> {\n  readonly type = 'advancedTransform'\n  readonly priority = 45\n\n  constructor(options: ReactiveAdvancedTransformOptions) {\n    const resolvedOptions: ModifierAdvancedTransformOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeAdvancedTransformStyles(this.properties)\n    this.applyStyles(context.element, styles)\n\n    return undefined\n  }\n\n  private computeAdvancedTransformStyles(props: ModifierAdvancedTransformOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transform) {\n      styles.transform = this.generateAdvancedTransformCSS(props.transform)\n    }\n\n    if (props.transformOrigin) {\n      styles.transformOrigin = props.transformOrigin\n    }\n\n    if (props.perspectiveOrigin) {\n      styles.perspectiveOrigin = props.perspectiveOrigin\n    }\n\n    if (props.backfaceVisibility) {\n      styles.backfaceVisibility = props.backfaceVisibility\n    }\n\n    if (props.transformStyle) {\n      styles.transformStyle = props.transformStyle\n    }\n\n    return styles\n  }\n\n  private generateAdvancedTransformCSS(config: any): string {\n    const transforms: string[] = []\n\n    // Handle matrix transforms\n    if ('matrix' in config && config.matrix) {\n      transforms.push(`matrix(${config.matrix.join(', ')})`)\n    }\n    if ('matrix3d' in config && config.matrix3d) {\n      transforms.push(`matrix3d(${config.matrix3d.join(', ')})`)\n    }\n\n    // Handle advanced 3D transforms\n    if ('rotate3d' in config && config.rotate3d) {\n      const { x, y, z, angle } = config.rotate3d\n      transforms.push(`rotate3d(${x}, ${y}, ${z}, ${angle})`)\n    }\n\n    if ('scale3d' in config && config.scale3d) {\n      const { x, y, z } = config.scale3d\n      transforms.push(`scale3d(${x}, ${y}, ${z})`)\n    }\n\n    if ('translate3d' in config && config.translate3d) {\n      const x = this.formatLength(config.translate3d.x ?? 0)\n      const y = this.formatLength(config.translate3d.y ?? 0)\n      const z = this.formatLength(config.translate3d.z ?? 0)\n      transforms.push(`translate3d(${x}, ${y}, ${z})`)\n    }\n\n    // Individual axis transforms\n    if ('scaleX' in config && config.scaleX !== undefined) {\n      transforms.push(`scaleX(${config.scaleX})`)\n    }\n    if ('scaleY' in config && config.scaleY !== undefined) {\n      transforms.push(`scaleY(${config.scaleY})`)\n    }\n    if ('scaleZ' in config && config.scaleZ !== undefined) {\n      transforms.push(`scaleZ(${config.scaleZ})`)\n    }\n    if ('translateX' in config && config.translateX !== undefined) {\n      transforms.push(`translateX(${this.formatLength(config.translateX)})`)\n    }\n    if ('translateY' in config && config.translateY !== undefined) {\n      transforms.push(`translateY(${this.formatLength(config.translateY)})`)\n    }\n    if ('translateZ' in config && config.translateZ !== undefined) {\n      transforms.push(`translateZ(${this.formatLength(config.translateZ)})`)\n    }\n\n    // Fallback to basic transform generation\n    if (transforms.length === 0) {\n      return this.generateTransformCSS(config)\n    }\n\n    return transforms.join(' ')\n  }\n\n  private generateTransformCSS(config: TransformConfig | Transform3DConfig): string {\n    // Reuse the basic transform generation logic\n    const transformModifier = new TransformModifier({ transform: config })\n    return (transformModifier as any).generateTransformCSS(config)\n  }\n\n  private formatLength(value: number | string): string {\n    if (typeof value === 'number') {\n      return `${value}px`\n    }\n    return value\n  }\n}\n\n// ============================================================================\n// Transform Functions\n// ============================================================================\n\n/**\n * General transform modifier with flexible configuration\n *\n * @example\n * ```typescript\n * .transform({\n *   scale: 1.1,\n *   rotate: '45deg',\n *   translate: { x: 10, y: 20 }\n * })\n * ```\n */\nexport function transform(config: TransformConfig | Transform3DConfig): TransformModifier {\n  return new TransformModifier({ transform: config })\n}\n\n/**\n * Scale transformation\n *\n * @example\n * ```typescript\n * .scale(1.2)                    // Uniform scale\n * .scale({ x: 1.5, y: 0.8 })     // Non-uniform scale\n * ```\n */\nexport function scale(value: number | { x?: number; y?: number }): TransformModifier {\n  return new TransformModifier({ transform: { scale: value } })\n}\n\n/**\n * 2D rotation transformation\n *\n * @example\n * ```typescript\n * .rotate('45deg')\n * .rotate('-90deg')\n * .rotate('0.5turn')\n * ```\n */\nexport function rotate(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotate: angle } })\n}\n\n/**\n * Translation transformation\n *\n * @example\n * ```typescript\n * .translate({ x: 10, y: 20 })\n * .translate({ x: '50%', y: '-10px' })\n * ```\n */\nexport function translate(offset: { x?: number | string; y?: number | string }): TransformModifier {\n  return new TransformModifier({ transform: { translate: offset } })\n}\n\n/**\n * Skew transformation\n *\n * @example\n * ```typescript\n * .skew({ x: '15deg', y: '10deg' })\n * .skew({ x: '20deg' })  // Only X axis\n * ```\n */\nexport function skew(angles: { x?: string; y?: string }): TransformModifier {\n  return new TransformModifier({ transform: { skew: angles } })\n}\n\n// ============================================================================\n// 3D Transform Functions\n// ============================================================================\n\n/**\n * X-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateX('45deg')\n * .rotateX('1rad')\n * ```\n */\nexport function rotateX(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateX: angle } })\n}\n\n/**\n * Y-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateY('90deg')\n * .rotateY('-45deg')\n * ```\n */\nexport function rotateY(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateY: angle } })\n}\n\n/**\n * Z-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateZ('180deg')\n * .rotateZ('0.25turn')\n * ```\n */\nexport function rotateZ(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateZ: angle } })\n}\n\n/**\n * 3D perspective\n *\n * @example\n * ```typescript\n * .perspective(1000)  // 1000px perspective\n * .perspective(500)   // Closer perspective\n * ```\n */\nexport function perspective(value: number): TransformModifier {\n  return new TransformModifier({ transform: { perspective: value } })\n}\n\n// ============================================================================\n// Advanced Transform Functions (Matrix, Extended 3D)\n// ============================================================================\n\n/**\n * Advanced transform modifier with matrix and extended 3D support\n *\n * @example\n * ```typescript\n * .advancedTransform({\n *   rotate3d: { x: 1, y: 1, z: 0, angle: '45deg' },\n *   scale3d: { x: 1.2, y: 1.2, z: 1 }\n * })\n * ```\n */\nexport function advancedTransform(config: Advanced3DTransformConfig | MatrixTransformConfig): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: config })\n}\n\n/**\n * 2D matrix transformation\n *\n * @example\n * ```typescript\n * .matrix([1, 0, 0, 1, 50, 100])  // Translate(50, 100)\n * ```\n */\nexport function matrix(values: [number, number, number, number, number, number]): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { matrix: values } })\n}\n\n/**\n * 3D matrix transformation\n *\n * @example\n * ```typescript\n * .matrix3d([1,0,0,0, 0,1,0,0, 0,0,1,0, 50,100,0,1])\n * ```\n */\nexport function matrix3d(values: [\n  number, number, number, number,\n  number, number, number, number,\n  number, number, number, number,\n  number, number, number, number\n]): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { matrix3d: values } })\n}\n\n/**\n * 3D rotation around arbitrary axis\n *\n * @example\n * ```typescript\n * .rotate3d(1, 1, 0, '45deg')  // Rotate around X and Y axis\n * ```\n */\nexport function rotate3d(x: number, y: number, z: number, angle: string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { rotate3d: { x, y, z, angle } } })\n}\n\n/**\n * 3D scale transformation\n *\n * @example\n * ```typescript\n * .scale3d(1.2, 1.2, 0.8)  // Scale XY up, Z down\n * ```\n */\nexport function scale3d(x: number, y: number, z: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scale3d: { x, y, z } } })\n}\n\n/**\n * 3D translation transformation\n *\n * @example\n * ```typescript\n * .translate3d(10, 20, 30)      // Hardware accelerated\n * .translate3d('50%', 0, 0)     // Percentage values\n * ```\n */\nexport function translate3d(x?: number | string, y?: number | string, z?: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translate3d: { x, y, z } } })\n}\n\n// Individual axis scale functions\nexport function scaleX(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleX: value } })\n}\n\nexport function scaleY(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleY: value } })\n}\n\nexport function scaleZ(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleZ: value } })\n}\n\n// Individual axis translate functions\nexport function translateX(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateX: value } })\n}\n\nexport function translateY(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateY: value } })\n}\n\nexport function translateZ(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateZ: value } })\n}\n\n// Transform utility functions\nexport function perspectiveOrigin(value: string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ perspectiveOrigin: value })\n}\n\nexport function transformStyle(value: 'flat' | 'preserve-3d'): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transformStyle: value })\n}\n\nexport function backfaceVisibility(value: 'visible' | 'hidden'): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ backfaceVisibility: value })\n}\n\n// ============================================================================\n// SwiftUI Compatibility Functions\n// ============================================================================\n\ntype AnchorPoint = 'center' | 'top' | 'bottom' | 'leading' | 'trailing' | \n                   'topLeading' | 'topTrailing' | 'bottomLeading' | 'bottomTrailing'\n\n/**\n * SwiftUI-compatible scaleEffect modifier\n * \n * @example\n * ```typescript\n * .scaleEffect(1.5)                    // Uniform scale\n * .scaleEffect(1.5, 2.0)               // Non-uniform scale  \n * .scaleEffect(1.2, undefined, 'topLeading')  // Scale from top-leading corner\n * ```\n */\nexport function scaleEffect(\n  x: number,\n  y?: number,\n  anchor: AnchorPoint = 'center'\n): AdvancedTransformModifier {\n  const scaleX = x\n  const scaleY = y ?? x\n  const transformOrigin = getTransformOrigin(anchor)\n  \n  return new AdvancedTransformModifier({ \n    transform: { scaleX, scaleY },\n    transformOrigin \n  })\n}\n\n/**\n * SwiftUI-compatible offset modifier (relative positioning via transform)\n * \n * Note: SwiftUI's .position() sets absolute coordinates, but in web context\n * we use .offset() for relative positioning which is more common.\n * \n * @example\n * ```typescript\n * .offset(100, 50)   // Offset by x=100, y=50 relative to current position\n * ```\n */\nexport function offset(x: number, y: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({\n    transform: { translateX: x, translateY: y }\n  })\n}\n\n/**\n * Convert SwiftUI anchor point to CSS transform-origin\n */\nfunction getTransformOrigin(anchor: AnchorPoint): string {\n  switch (anchor) {\n    case 'center': return 'center center'\n    case 'top': return 'center top'\n    case 'bottom': return 'center bottom'\n    case 'leading': return 'left center'\n    case 'trailing': return 'right center'\n    case 'topLeading': return 'left top'\n    case 'topTrailing': return 'right top'\n    case 'bottomLeading': return 'left bottom'\n    case 'bottomTrailing': return 'right bottom'\n    default: return 'center center'\n  }\n}\n"],"names":["TransformModifier","BaseModifier","options","resolvedOptions","key","value","__publicField","_node","context","styles","props","config","transforms","x","y","z","AdvancedTransformModifier","angle","transform","scale","rotate","translate","offset","skew","angles","rotateX","rotateY","rotateZ","perspective","advancedTransform","matrix","values","matrix3d","rotate3d","scale3d","translate3d","scaleX","scaleY","scaleZ","translateX","translateY","translateZ","perspectiveOrigin","transformStyle","backfaceVisibility","scaleEffect","anchor","transformOrigin","getTransformOrigin"],"mappings":"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"}

package/dist/modifiers/transformations.js

@@ -1,216 +0,0 @@
-import { BaseModifier as u } from "./base.js";
-var f = Object.defineProperty, c = (r, t, e) => t in r ? f(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e, l = (r, t, e) => c(r, typeof t != "symbol" ? t + "" : t, e);
-class o extends u {
-  constructor(t) {
-    const e = {};
-    for (const [a, n] of Object.entries(t))
-      typeof n == "function" && "peek" in n ? e[a] = n.peek() : e[a] = n;
-    super(e), l(this, "type", "transform"), l(this, "priority", 45);
-  }
-  apply(t, e) {
-    if (!e.element) return;
-    const a = this.computeTransformStyles(this.properties);
-    this.applyStyles(e.element, a);
-  }
-  computeTransformStyles(t) {
-    const e = {};
-    return t.transform && (e.transform = this.generateTransformCSS(t.transform)), t.transformOrigin && (e.transformOrigin = t.transformOrigin), t.backfaceVisibility && (e.backfaceVisibility = t.backfaceVisibility), t.transformStyle && (e.transformStyle = t.transformStyle), e;
-  }
-  generateTransformCSS(t) {
-    const e = [];
-    if ("perspective" in t && t.perspective !== void 0 && e.push(`perspective(${t.perspective}px)`), t.scale !== void 0)
-      if (typeof t.scale == "number")
-        e.push(`scale(${t.scale})`);
-      else {
-        const a = t.scale.x ?? 1, n = t.scale.y ?? 1;
-        e.push(`scale(${a}, ${n})`);
-      }
-    if (t.rotate !== void 0 && e.push(`rotate(${t.rotate})`), "rotateX" in t && t.rotateX !== void 0 && e.push(`rotateX(${t.rotateX})`), "rotateY" in t && t.rotateY !== void 0 && e.push(`rotateY(${t.rotateY})`), "rotateZ" in t && t.rotateZ !== void 0 && e.push(`rotateZ(${t.rotateZ})`), t.translate !== void 0) {
-      const a = this.formatLength(t.translate.x ?? 0), n = this.formatLength(t.translate.y ?? 0);
-      let i = "0";
-      "z" in t.translate && t.translate.z !== void 0 ? i = this.formatLength(t.translate.z) : "translateZ" in t && t.translateZ !== void 0 && (i = this.formatLength(t.translateZ)), e.push(`translate3d(${a}, ${n}, ${i})`);
-    }
-    return "scaleZ" in t && t.scaleZ !== void 0 && e.push(`scaleZ(${t.scaleZ})`), t.skew !== void 0 && (t.skew.x !== void 0 && t.skew.y !== void 0 ? e.push(`skew(${t.skew.x}, ${t.skew.y})`) : t.skew.x !== void 0 ? e.push(`skewX(${t.skew.x})`) : t.skew.y !== void 0 && e.push(`skewY(${t.skew.y})`)), e.join(" ");
-  }
-  formatLength(t) {
-    return typeof t == "number" ? `${t}px` : t;
-  }
-}
-class s extends u {
-  constructor(t) {
-    const e = {};
-    for (const [a, n] of Object.entries(t))
-      typeof n == "function" && "peek" in n ? e[a] = n.peek() : e[a] = n;
-    super(e), l(this, "type", "advancedTransform"), l(this, "priority", 45);
-  }
-  apply(t, e) {
-    if (!e.element) return;
-    const a = this.computeAdvancedTransformStyles(this.properties);
-    this.applyStyles(e.element, a);
-  }
-  computeAdvancedTransformStyles(t) {
-    const e = {};
-    return t.transform && (e.transform = this.generateAdvancedTransformCSS(t.transform)), t.transformOrigin && (e.transformOrigin = t.transformOrigin), t.perspectiveOrigin && (e.perspectiveOrigin = t.perspectiveOrigin), t.backfaceVisibility && (e.backfaceVisibility = t.backfaceVisibility), t.transformStyle && (e.transformStyle = t.transformStyle), e;
-  }
-  generateAdvancedTransformCSS(t) {
-    const e = [];
-    if ("matrix" in t && t.matrix && e.push(`matrix(${t.matrix.join(", ")})`), "matrix3d" in t && t.matrix3d && e.push(`matrix3d(${t.matrix3d.join(", ")})`), "rotate3d" in t && t.rotate3d) {
-      const { x: a, y: n, z: i, angle: m } = t.rotate3d;
-      e.push(`rotate3d(${a}, ${n}, ${i}, ${m})`);
-    }
-    if ("scale3d" in t && t.scale3d) {
-      const { x: a, y: n, z: i } = t.scale3d;
-      e.push(`scale3d(${a}, ${n}, ${i})`);
-    }
-    if ("translate3d" in t && t.translate3d) {
-      const a = this.formatLength(t.translate3d.x ?? 0), n = this.formatLength(t.translate3d.y ?? 0), i = this.formatLength(t.translate3d.z ?? 0);
-      e.push(`translate3d(${a}, ${n}, ${i})`);
-    }
-    return "scaleX" in t && t.scaleX !== void 0 && e.push(`scaleX(${t.scaleX})`), "scaleY" in t && t.scaleY !== void 0 && e.push(`scaleY(${t.scaleY})`), "scaleZ" in t && t.scaleZ !== void 0 && e.push(`scaleZ(${t.scaleZ})`), "translateX" in t && t.translateX !== void 0 && e.push(`translateX(${this.formatLength(t.translateX)})`), "translateY" in t && t.translateY !== void 0 && e.push(`translateY(${this.formatLength(t.translateY)})`), "translateZ" in t && t.translateZ !== void 0 && e.push(`translateZ(${this.formatLength(t.translateZ)})`), e.length === 0 ? this.generateTransformCSS(t) : e.join(" ");
-  }
-  generateTransformCSS(t) {
-    return new o({ transform: t }).generateTransformCSS(t);
-  }
-  formatLength(t) {
-    return typeof t == "number" ? `${t}px` : t;
-  }
-}
-function p(r) {
-  return new o({ transform: r });
-}
-function y(r) {
-  return new o({ transform: { scale: r } });
-}
-function v(r) {
-  return new o({ transform: { rotate: r } });
-}
-function w(r) {
-  return new o({ transform: { translate: r } });
-}
-function $(r) {
-  return new o({ transform: { skew: r } });
-}
-function b(r) {
-  return new o({ transform: { rotateX: r } });
-}
-function S(r) {
-  return new o({ transform: { rotateY: r } });
-}
-function x(r) {
-  return new o({ transform: { rotateZ: r } });
-}
-function Z(r) {
-  return new o({ transform: { perspective: r } });
-}
-function k(r) {
-  return new s({ transform: r });
-}
-function X(r) {
-  return new s({ transform: { matrix: r } });
-}
-function Y(r) {
-  return new s({ transform: { matrix3d: r } });
-}
-function O(r, t, e, a) {
-  return new s({ transform: { rotate3d: { x: r, y: t, z: e, angle: a } } });
-}
-function T(r, t, e) {
-  return new s({ transform: { scale3d: { x: r, y: t, z: e } } });
-}
-function L(r, t, e) {
-  return new s({ transform: { translate3d: { x: r, y: t, z: e } } });
-}
-function z(r) {
-  return new s({ transform: { scaleX: r } });
-}
-function V(r) {
-  return new s({ transform: { scaleY: r } });
-}
-function _(r) {
-  return new s({ transform: { scaleZ: r } });
-}
-function C(r) {
-  return new s({ transform: { translateX: r } });
-}
-function j(r) {
-  return new s({ transform: { translateY: r } });
-}
-function A(r) {
-  return new s({ transform: { translateZ: r } });
-}
-function M(r) {
-  return new s({ perspectiveOrigin: r });
-}
-function P(r) {
-  return new s({ transformStyle: r });
-}
-function B(r) {
-  return new s({ backfaceVisibility: r });
-}
-function E(r, t, e = "center") {
-  const a = r, n = t ?? r, i = d(e);
-  return new s({
-    transform: { scaleX: a, scaleY: n },
-    transformOrigin: i
-  });
-}
-function F(r, t) {
-  return new s({
-    transform: { translateX: r, translateY: t }
-  });
-}
-function d(r) {
-  switch (r) {
-    case "center":
-      return "center center";
-    case "top":
-      return "center top";
-    case "bottom":
-      return "center bottom";
-    case "leading":
-      return "left center";
-    case "trailing":
-      return "right center";
-    case "topLeading":
-      return "left top";
-    case "topTrailing":
-      return "right top";
-    case "bottomLeading":
-      return "left bottom";
-    case "bottomTrailing":
-      return "right bottom";
-    default:
-      return "center center";
-  }
-}
-export {
-  s as AdvancedTransformModifier,
-  o as TransformModifier,
-  k as advancedTransform,
-  B as backfaceVisibility,
-  X as matrix,
-  Y as matrix3d,
-  F as offset,
-  Z as perspective,
-  M as perspectiveOrigin,
-  v as rotate,
-  O as rotate3d,
-  b as rotateX,
-  S as rotateY,
-  x as rotateZ,
-  y as scale,
-  T as scale3d,
-  E as scaleEffect,
-  z as scaleX,
-  V as scaleY,
-  _ as scaleZ,
-  $ as skew,
-  p as transform,
-  P as transformStyle,
-  w as translate,
-  L as translate3d,
-  C as translateX,
-  j as translateY,
-  A as translateZ
-};
-//# sourceMappingURL=transformations.js.map

package/dist/modifiers/transformations.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"transformations.js","sources":["../../src/modifiers/transformations.ts"],"sourcesContent":["/**\n * Transformation Modifiers - CSS Transform System\n *\n * Provides comprehensive 2D and 3D transform capabilities including\n * scale, rotate, translate, skew, perspective, and matrix transforms.\n */\n\nimport type { DOMNode } from '../runtime/types'\nimport { BaseModifier } from './base'\nimport type { ModifierContext, ReactiveModifierProps } from './types'\n\nexport interface TransformConfig {\n  scale?: number | { x?: number; y?: number }\n  rotate?: string\n  translate?: { x?: number | string; y?: number | string }\n  skew?: { x?: string; y?: string }\n  perspective?: number\n}\n\nexport interface Transform3DConfig extends TransformConfig {\n  rotateX?: string\n  rotateY?: string\n  rotateZ?: string\n  translate?: { x?: number | string; y?: number | string; z?: number | string }\n  translateZ?: number | string\n  scaleZ?: number\n}\n\nexport interface ModifierTransformOptions {\n  transform?: TransformConfig | Transform3DConfig\n  transformOrigin?: string\n  backfaceVisibility?: 'visible' | 'hidden'\n  transformStyle?: 'flat' | 'preserve-3d'\n}\n\nexport type ReactiveTransformOptions = ReactiveModifierProps<ModifierTransformOptions>\n\nexport class TransformModifier extends BaseModifier<ModifierTransformOptions> {\n  readonly type = 'transform'\n  readonly priority = 45\n\n  constructor(options: ReactiveTransformOptions) {\n    const resolvedOptions: ModifierTransformOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeTransformStyles(this.properties)\n    this.applyStyles(context.element, styles)\n\n    return undefined\n  }\n\n  private computeTransformStyles(props: ModifierTransformOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transform) {\n      styles.transform = this.generateTransformCSS(props.transform)\n    }\n\n    if (props.transformOrigin) {\n      styles.transformOrigin = props.transformOrigin\n    }\n\n    if (props.backfaceVisibility) {\n      styles.backfaceVisibility = props.backfaceVisibility\n    }\n\n    if (props.transformStyle) {\n      styles.transformStyle = props.transformStyle\n    }\n\n    return styles\n  }\n\n  private generateTransformCSS(config: TransformConfig | Transform3DConfig): string {\n    const transforms: string[] = []\n\n    // Handle perspective first (for 3D transforms)\n    if ('perspective' in config && config.perspective !== undefined) {\n      transforms.push(`perspective(${config.perspective}px)`)\n    }\n\n    // Handle scale\n    if (config.scale !== undefined) {\n      if (typeof config.scale === 'number') {\n        transforms.push(`scale(${config.scale})`)\n      } else {\n        const x = config.scale.x ?? 1\n        const y = config.scale.y ?? 1\n        transforms.push(`scale(${x}, ${y})`)\n      }\n    }\n\n    // Handle rotate (2D)\n    if (config.rotate !== undefined) {\n      transforms.push(`rotate(${config.rotate})`)\n    }\n\n    // Handle 3D rotations\n    if ('rotateX' in config && config.rotateX !== undefined) {\n      transforms.push(`rotateX(${config.rotateX})`)\n    }\n    if ('rotateY' in config && config.rotateY !== undefined) {\n      transforms.push(`rotateY(${config.rotateY})`)\n    }\n    if ('rotateZ' in config && config.rotateZ !== undefined) {\n      transforms.push(`rotateZ(${config.rotateZ})`)\n    }\n\n    // Handle translate\n    if (config.translate !== undefined) {\n      const x = this.formatLength(config.translate.x ?? 0)\n      const y = this.formatLength(config.translate.y ?? 0)\n\n      // Check for Z value in translate object or translateZ property\n      let z = '0'\n      if ('z' in config.translate && config.translate.z !== undefined) {\n        z = this.formatLength(config.translate.z)\n      } else if ('translateZ' in config && config.translateZ !== undefined) {\n        z = this.formatLength(config.translateZ)\n      }\n\n      // Always use translate3d for hardware acceleration\n      transforms.push(`translate3d(${x}, ${y}, ${z})`)\n    }\n\n    // Handle 3D scale\n    if ('scaleZ' in config && config.scaleZ !== undefined) {\n      transforms.push(`scaleZ(${config.scaleZ})`)\n    }\n\n    // Handle skew\n    if (config.skew !== undefined) {\n      if (config.skew.x !== undefined && config.skew.y !== undefined) {\n        transforms.push(`skew(${config.skew.x}, ${config.skew.y})`)\n      } else if (config.skew.x !== undefined) {\n        transforms.push(`skewX(${config.skew.x})`)\n      } else if (config.skew.y !== undefined) {\n        transforms.push(`skewY(${config.skew.y})`)\n      }\n    }\n\n    return transforms.join(' ')\n  }\n\n  private formatLength(value: number | string): string {\n    if (typeof value === 'number') {\n      return `${value}px`\n    }\n    return value\n  }\n}\n\n// ============================================================================\n// Advanced Transform System for Matrix and Extended 3D\n// ============================================================================\n\nexport interface MatrixTransformConfig {\n  matrix?: [number, number, number, number, number, number]\n  matrix3d?: [\n    number, number, number, number,\n    number, number, number, number,\n    number, number, number, number,\n    number, number, number, number\n  ]\n}\n\nexport interface Advanced3DTransformConfig {\n  rotate3d?: { x: number; y: number; z: number; angle: string }\n  scale3d?: { x: number; y: number; z: number }\n  translate3d?: { x?: number | string; y?: number | string; z?: number | string }\n  scaleX?: number\n  scaleY?: number\n  scaleZ?: number\n  translateX?: number | string\n  translateY?: number | string\n  translateZ?: number | string\n}\n\nexport interface ModifierAdvancedTransformOptions {\n  transform?: TransformConfig | Transform3DConfig | MatrixTransformConfig | Advanced3DTransformConfig\n  transformOrigin?: string\n  perspectiveOrigin?: string\n  transformStyle?: 'flat' | 'preserve-3d'\n  backfaceVisibility?: 'visible' | 'hidden'\n}\n\nexport type ReactiveAdvancedTransformOptions = ReactiveModifierProps<ModifierAdvancedTransformOptions>\n\nexport class AdvancedTransformModifier extends BaseModifier<ModifierAdvancedTransformOptions> {\n  readonly type = 'advancedTransform'\n  readonly priority = 45\n\n  constructor(options: ReactiveAdvancedTransformOptions) {\n    const resolvedOptions: ModifierAdvancedTransformOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeAdvancedTransformStyles(this.properties)\n    this.applyStyles(context.element, styles)\n\n    return undefined\n  }\n\n  private computeAdvancedTransformStyles(props: ModifierAdvancedTransformOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transform) {\n      styles.transform = this.generateAdvancedTransformCSS(props.transform)\n    }\n\n    if (props.transformOrigin) {\n      styles.transformOrigin = props.transformOrigin\n    }\n\n    if (props.perspectiveOrigin) {\n      styles.perspectiveOrigin = props.perspectiveOrigin\n    }\n\n    if (props.backfaceVisibility) {\n      styles.backfaceVisibility = props.backfaceVisibility\n    }\n\n    if (props.transformStyle) {\n      styles.transformStyle = props.transformStyle\n    }\n\n    return styles\n  }\n\n  private generateAdvancedTransformCSS(config: any): string {\n    const transforms: string[] = []\n\n    // Handle matrix transforms\n    if ('matrix' in config && config.matrix) {\n      transforms.push(`matrix(${config.matrix.join(', ')})`)\n    }\n    if ('matrix3d' in config && config.matrix3d) {\n      transforms.push(`matrix3d(${config.matrix3d.join(', ')})`)\n    }\n\n    // Handle advanced 3D transforms\n    if ('rotate3d' in config && config.rotate3d) {\n      const { x, y, z, angle } = config.rotate3d\n      transforms.push(`rotate3d(${x}, ${y}, ${z}, ${angle})`)\n    }\n\n    if ('scale3d' in config && config.scale3d) {\n      const { x, y, z } = config.scale3d\n      transforms.push(`scale3d(${x}, ${y}, ${z})`)\n    }\n\n    if ('translate3d' in config && config.translate3d) {\n      const x = this.formatLength(config.translate3d.x ?? 0)\n      const y = this.formatLength(config.translate3d.y ?? 0)\n      const z = this.formatLength(config.translate3d.z ?? 0)\n      transforms.push(`translate3d(${x}, ${y}, ${z})`)\n    }\n\n    // Individual axis transforms\n    if ('scaleX' in config && config.scaleX !== undefined) {\n      transforms.push(`scaleX(${config.scaleX})`)\n    }\n    if ('scaleY' in config && config.scaleY !== undefined) {\n      transforms.push(`scaleY(${config.scaleY})`)\n    }\n    if ('scaleZ' in config && config.scaleZ !== undefined) {\n      transforms.push(`scaleZ(${config.scaleZ})`)\n    }\n    if ('translateX' in config && config.translateX !== undefined) {\n      transforms.push(`translateX(${this.formatLength(config.translateX)})`)\n    }\n    if ('translateY' in config && config.translateY !== undefined) {\n      transforms.push(`translateY(${this.formatLength(config.translateY)})`)\n    }\n    if ('translateZ' in config && config.translateZ !== undefined) {\n      transforms.push(`translateZ(${this.formatLength(config.translateZ)})`)\n    }\n\n    // Fallback to basic transform generation\n    if (transforms.length === 0) {\n      return this.generateTransformCSS(config)\n    }\n\n    return transforms.join(' ')\n  }\n\n  private generateTransformCSS(config: TransformConfig | Transform3DConfig): string {\n    // Reuse the basic transform generation logic\n    const transformModifier = new TransformModifier({ transform: config })\n    return (transformModifier as any).generateTransformCSS(config)\n  }\n\n  private formatLength(value: number | string): string {\n    if (typeof value === 'number') {\n      return `${value}px`\n    }\n    return value\n  }\n}\n\n// ============================================================================\n// Transform Functions\n// ============================================================================\n\n/**\n * General transform modifier with flexible configuration\n *\n * @example\n * ```typescript\n * .transform({\n *   scale: 1.1,\n *   rotate: '45deg',\n *   translate: { x: 10, y: 20 }\n * })\n * ```\n */\nexport function transform(config: TransformConfig | Transform3DConfig): TransformModifier {\n  return new TransformModifier({ transform: config })\n}\n\n/**\n * Scale transformation\n *\n * @example\n * ```typescript\n * .scale(1.2)                    // Uniform scale\n * .scale({ x: 1.5, y: 0.8 })     // Non-uniform scale\n * ```\n */\nexport function scale(value: number | { x?: number; y?: number }): TransformModifier {\n  return new TransformModifier({ transform: { scale: value } })\n}\n\n/**\n * 2D rotation transformation\n *\n * @example\n * ```typescript\n * .rotate('45deg')\n * .rotate('-90deg')\n * .rotate('0.5turn')\n * ```\n */\nexport function rotate(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotate: angle } })\n}\n\n/**\n * Translation transformation\n *\n * @example\n * ```typescript\n * .translate({ x: 10, y: 20 })\n * .translate({ x: '50%', y: '-10px' })\n * ```\n */\nexport function translate(offset: { x?: number | string; y?: number | string }): TransformModifier {\n  return new TransformModifier({ transform: { translate: offset } })\n}\n\n/**\n * Skew transformation\n *\n * @example\n * ```typescript\n * .skew({ x: '15deg', y: '10deg' })\n * .skew({ x: '20deg' })  // Only X axis\n * ```\n */\nexport function skew(angles: { x?: string; y?: string }): TransformModifier {\n  return new TransformModifier({ transform: { skew: angles } })\n}\n\n// ============================================================================\n// 3D Transform Functions\n// ============================================================================\n\n/**\n * X-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateX('45deg')\n * .rotateX('1rad')\n * ```\n */\nexport function rotateX(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateX: angle } })\n}\n\n/**\n * Y-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateY('90deg')\n * .rotateY('-45deg')\n * ```\n */\nexport function rotateY(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateY: angle } })\n}\n\n/**\n * Z-axis rotation (3D)\n *\n * @example\n * ```typescript\n * .rotateZ('180deg')\n * .rotateZ('0.25turn')\n * ```\n */\nexport function rotateZ(angle: string): TransformModifier {\n  return new TransformModifier({ transform: { rotateZ: angle } })\n}\n\n/**\n * 3D perspective\n *\n * @example\n * ```typescript\n * .perspective(1000)  // 1000px perspective\n * .perspective(500)   // Closer perspective\n * ```\n */\nexport function perspective(value: number): TransformModifier {\n  return new TransformModifier({ transform: { perspective: value } })\n}\n\n// ============================================================================\n// Advanced Transform Functions (Matrix, Extended 3D)\n// ============================================================================\n\n/**\n * Advanced transform modifier with matrix and extended 3D support\n *\n * @example\n * ```typescript\n * .advancedTransform({\n *   rotate3d: { x: 1, y: 1, z: 0, angle: '45deg' },\n *   scale3d: { x: 1.2, y: 1.2, z: 1 }\n * })\n * ```\n */\nexport function advancedTransform(config: Advanced3DTransformConfig | MatrixTransformConfig): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: config })\n}\n\n/**\n * 2D matrix transformation\n *\n * @example\n * ```typescript\n * .matrix([1, 0, 0, 1, 50, 100])  // Translate(50, 100)\n * ```\n */\nexport function matrix(values: [number, number, number, number, number, number]): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { matrix: values } })\n}\n\n/**\n * 3D matrix transformation\n *\n * @example\n * ```typescript\n * .matrix3d([1,0,0,0, 0,1,0,0, 0,0,1,0, 50,100,0,1])\n * ```\n */\nexport function matrix3d(values: [\n  number, number, number, number,\n  number, number, number, number,\n  number, number, number, number,\n  number, number, number, number\n]): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { matrix3d: values } })\n}\n\n/**\n * 3D rotation around arbitrary axis\n *\n * @example\n * ```typescript\n * .rotate3d(1, 1, 0, '45deg')  // Rotate around X and Y axis\n * ```\n */\nexport function rotate3d(x: number, y: number, z: number, angle: string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { rotate3d: { x, y, z, angle } } })\n}\n\n/**\n * 3D scale transformation\n *\n * @example\n * ```typescript\n * .scale3d(1.2, 1.2, 0.8)  // Scale XY up, Z down\n * ```\n */\nexport function scale3d(x: number, y: number, z: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scale3d: { x, y, z } } })\n}\n\n/**\n * 3D translation transformation\n *\n * @example\n * ```typescript\n * .translate3d(10, 20, 30)      // Hardware accelerated\n * .translate3d('50%', 0, 0)     // Percentage values\n * ```\n */\nexport function translate3d(x?: number | string, y?: number | string, z?: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translate3d: { x, y, z } } })\n}\n\n// Individual axis scale functions\nexport function scaleX(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleX: value } })\n}\n\nexport function scaleY(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleY: value } })\n}\n\nexport function scaleZ(value: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { scaleZ: value } })\n}\n\n// Individual axis translate functions\nexport function translateX(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateX: value } })\n}\n\nexport function translateY(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateY: value } })\n}\n\nexport function translateZ(value: number | string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transform: { translateZ: value } })\n}\n\n// Transform utility functions\nexport function perspectiveOrigin(value: string): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ perspectiveOrigin: value })\n}\n\nexport function transformStyle(value: 'flat' | 'preserve-3d'): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ transformStyle: value })\n}\n\nexport function backfaceVisibility(value: 'visible' | 'hidden'): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({ backfaceVisibility: value })\n}\n\n// ============================================================================\n// SwiftUI Compatibility Functions\n// ============================================================================\n\ntype AnchorPoint = 'center' | 'top' | 'bottom' | 'leading' | 'trailing' | \n                   'topLeading' | 'topTrailing' | 'bottomLeading' | 'bottomTrailing'\n\n/**\n * SwiftUI-compatible scaleEffect modifier\n * \n * @example\n * ```typescript\n * .scaleEffect(1.5)                    // Uniform scale\n * .scaleEffect(1.5, 2.0)               // Non-uniform scale  \n * .scaleEffect(1.2, undefined, 'topLeading')  // Scale from top-leading corner\n * ```\n */\nexport function scaleEffect(\n  x: number,\n  y?: number,\n  anchor: AnchorPoint = 'center'\n): AdvancedTransformModifier {\n  const scaleX = x\n  const scaleY = y ?? x\n  const transformOrigin = getTransformOrigin(anchor)\n  \n  return new AdvancedTransformModifier({ \n    transform: { scaleX, scaleY },\n    transformOrigin \n  })\n}\n\n/**\n * SwiftUI-compatible offset modifier (relative positioning via transform)\n * \n * Note: SwiftUI's .position() sets absolute coordinates, but in web context\n * we use .offset() for relative positioning which is more common.\n * \n * @example\n * ```typescript\n * .offset(100, 50)   // Offset by x=100, y=50 relative to current position\n * ```\n */\nexport function offset(x: number, y: number): AdvancedTransformModifier {\n  return new AdvancedTransformModifier({\n    transform: { translateX: x, translateY: y }\n  })\n}\n\n/**\n * Convert SwiftUI anchor point to CSS transform-origin\n */\nfunction getTransformOrigin(anchor: AnchorPoint): string {\n  switch (anchor) {\n    case 'center': return 'center center'\n    case 'top': return 'center top'\n    case 'bottom': return 'center bottom'\n    case 'leading': return 'left center'\n    case 'trailing': return 'right center'\n    case 'topLeading': return 'left top'\n    case 'topTrailing': return 'right top'\n    case 'bottomLeading': return 'left bottom'\n    case 'bottomTrailing': return 'right bottom'\n    default: return 'center center'\n  }\n}\n"],"names":["TransformModifier","BaseModifier","options","resolvedOptions","key","value","__publicField","_node","context","styles","props","config","transforms","x","y","z","AdvancedTransformModifier","angle","transform","scale","rotate","translate","offset","skew","angles","rotateX","rotateY","rotateZ","perspective","advancedTransform","matrix","values","matrix3d","rotate3d","scale3d","translate3d","scaleX","scaleY","scaleZ","translateX","translateY","translateZ","perspectiveOrigin","transformStyle","backfaceVisibility","scaleEffect","anchor","transformOrigin","getTransformOrigin"],"mappings":"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"}

package/dist/modifiers/transitions.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("./base.cjs");var T=Object.defineProperty,g=(n,t,i)=>t in n?T(n,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):n[t]=i,c=(n,t,i)=>g(n,typeof t!="symbol"?t+"":t,i);class a extends d.BaseModifier{constructor(t){const i={};for(const[o,e]of Object.entries(t))typeof e=="function"&&"peek"in e?i[o]=e.peek():i[o]=e;super(i),c(this,"type","transition"),c(this,"priority",25)}apply(t,i){if(!i.element)return;const o=this.computeTransitionStyles(this.properties);this.applyStyles(i.element,o)}computeTransitionStyles(t){const i={};if(t.transition&&(i.transition=t.transition),t.transitions){const o=this.generateTransitionsCSS(t.transitions);i.transition=o}return i}generateTransitionsCSS(t){return Object.entries(t).map(([i,o])=>{const e=this.toCSSProperty(i),l=o.duration||300,f=o.easing||"ease",u=o.delay||0;return`${e} ${l}ms ${f}${u>0?` ${u}ms`:""}`}).join(", ")}}function r(n="all",t=300,i="ease",o=0){const e=`${n} ${t}ms ${i}${o>0?` ${o}ms`:""}`;return new a({transition:e})}function s(n){return new a({transitions:n})}function m(n=200){return r("opacity",n,"ease-out")}function p(n=300){return r("transform",n,"ease-out")}function b(n=150){return s({color:{duration:n,easing:"ease-out"},backgroundColor:{duration:n,easing:"ease-out"},borderColor:{duration:n,easing:"ease-out"}})}function y(n=250){return s({width:{duration:n,easing:"ease-out"},height:{duration:n,easing:"ease-out"},margin:{duration:n,easing:"ease-out"},padding:{duration:n,easing:"ease-out"}})}function h(){return s({backgroundColor:{duration:150,easing:"ease-out"},transform:{duration:200,easing:"ease-out"},boxShadow:{duration:200,easing:"ease-out"}})}function S(){return s({transform:{duration:200,easing:"ease-out"},boxShadow:{duration:300,easing:"ease-out"},borderColor:{duration:150,easing:"ease-out"}})}function $(){return s({opacity:{duration:200,easing:"ease-out"},transform:{duration:300,easing:"cubic-bezier(0.34, 1.56, 0.64, 1)"}})}function w(n=300){return r("all",n,"ease-out")}function C(n=150){return r("all",n,"ease-out")}function _(n=500){return r("all",n,"ease-out")}exports.TransitionModifier=a;exports.buttonTransition=h;exports.cardTransition=S;exports.colorTransition=b;exports.fadeTransition=m;exports.layoutTransition=y;exports.modalTransition=$;exports.quickTransition=C;exports.slowTransition=_;exports.smoothTransition=w;exports.transformTransition=p;exports.transition=r;exports.transitions=s;
-//# sourceMappingURL=transitions.cjs.map

package/dist/modifiers/transitions.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"transitions.cjs","sources":["../../src/modifiers/transitions.ts"],"sourcesContent":["/**\n * Transition Modifiers - CSS transition system\n *\n * Provides comprehensive CSS transition capabilities with support for\n * individual property transitions and complex multi-property animations.\n */\n\nimport type { DOMNode } from '../runtime/types'\nimport { BaseModifier } from './base'\nimport type { ModifierContext, ReactiveModifierProps } from './types'\n\nexport interface TransitionConfig {\n  property?: string\n  duration?: number\n  easing?: string\n  delay?: number\n}\n\nexport interface TransitionsConfig {\n  [property: string]: TransitionConfig\n}\n\nexport interface ModifierTransitionOptions {\n  transition?: string\n  transitions?: TransitionsConfig\n}\n\nexport type ReactiveTransitionOptions = ReactiveModifierProps<ModifierTransitionOptions>\n\nexport class TransitionModifier extends BaseModifier<ModifierTransitionOptions> {\n  readonly type = 'transition'\n  readonly priority = 25\n\n  constructor(options: ReactiveTransitionOptions) {\n    const resolvedOptions: ModifierTransitionOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeTransitionStyles(this.properties)\n    this.applyStyles(context.element, styles)\n    \n    return undefined\n  }\n\n  private computeTransitionStyles(props: ModifierTransitionOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transition) {\n      styles.transition = props.transition\n    }\n\n    if (props.transitions) {\n      const transitionValue = this.generateTransitionsCSS(props.transitions)\n      styles.transition = transitionValue\n    }\n\n    return styles\n  }\n\n  private generateTransitionsCSS(config: TransitionsConfig): string {\n    return Object.entries(config)\n      .map(([property, settings]) => {\n        const prop = this.toCSSProperty(property)\n        const duration = settings.duration || 300\n        const easing = settings.easing || 'ease'\n        const delay = settings.delay || 0\n        \n        return `${prop} ${duration}ms ${easing}${delay > 0 ? ` ${delay}ms` : ''}`\n      })\n      .join(', ')\n  }\n}\n\n// ============================================================================\n// Transition Functions\n// ============================================================================\n\n/**\n * Simple transition modifier with sensible defaults\n *\n * @example\n * ```typescript\n * .transition()                          // All properties, 300ms, ease\n * .transition('opacity')                 // Just opacity\n * .transition('all', 200)                // All properties, 200ms\n * .transition('transform', 300, 'ease-out')  // Transform with custom easing\n * .transition('opacity', 150, 'ease-in', 50)  // With delay\n * ```\n */\nexport function transition(\n  property: string = 'all', \n  duration: number = 300, \n  easing: string = 'ease', \n  delay: number = 0\n): TransitionModifier {\n  const transitionValue = `${property} ${duration}ms ${easing}${delay > 0 ? ` ${delay}ms` : ''}`\n  return new TransitionModifier({ transition: transitionValue })\n}\n\n/**\n * Complex transitions with multiple properties\n *\n * @example\n * ```typescript\n * .transitions({\n *   opacity: { duration: 200, easing: 'ease-out' },\n *   transform: { duration: 300, easing: 'ease-in-out', delay: 100 },\n *   backgroundColor: { duration: 150 }\n * })\n * ```\n */\nexport function transitions(config: TransitionsConfig): TransitionModifier {\n  return new TransitionModifier({ transitions: config })\n}\n\n// ============================================================================\n// Common Transition Presets\n// ============================================================================\n\n/**\n * Quick fade transition\n */\nexport function fadeTransition(duration: number = 200): TransitionModifier {\n  return transition('opacity', duration, 'ease-out')\n}\n\n/**\n * Smooth transform transition\n */\nexport function transformTransition(duration: number = 300): TransitionModifier {\n  return transition('transform', duration, 'ease-out')\n}\n\n/**\n * Color change transition\n */\nexport function colorTransition(duration: number = 150): TransitionModifier {\n  return transitions({\n    color: { duration, easing: 'ease-out' },\n    backgroundColor: { duration, easing: 'ease-out' },\n    borderColor: { duration, easing: 'ease-out' }\n  })\n}\n\n/**\n * Layout transition for size changes\n */\nexport function layoutTransition(duration: number = 250): TransitionModifier {\n  return transitions({\n    width: { duration, easing: 'ease-out' },\n    height: { duration, easing: 'ease-out' },\n    margin: { duration, easing: 'ease-out' },\n    padding: { duration, easing: 'ease-out' }\n  })\n}\n\n/**\n * Button hover transition\n */\nexport function buttonTransition(): TransitionModifier {\n  return transitions({\n    backgroundColor: { duration: 150, easing: 'ease-out' },\n    transform: { duration: 200, easing: 'ease-out' },\n    boxShadow: { duration: 200, easing: 'ease-out' }\n  })\n}\n\n/**\n * Card hover transition\n */\nexport function cardTransition(): TransitionModifier {\n  return transitions({\n    transform: { duration: 200, easing: 'ease-out' },\n    boxShadow: { duration: 300, easing: 'ease-out' },\n    borderColor: { duration: 150, easing: 'ease-out' }\n  })\n}\n\n/**\n * Modal/dialog transition\n */\nexport function modalTransition(): TransitionModifier {\n  return transitions({\n    opacity: { duration: 200, easing: 'ease-out' },\n    transform: { duration: 300, easing: 'cubic-bezier(0.34, 1.56, 0.64, 1)' }\n  })\n}\n\n/**\n * Smooth all-properties transition\n */\nexport function smoothTransition(duration: number = 300): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}\n\n/**\n * Quick transition for interactive elements\n */\nexport function quickTransition(duration: number = 150): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}\n\n/**\n * Slow transition for dramatic effects\n */\nexport function slowTransition(duration: number = 500): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}"],"names":["TransitionModifier","BaseModifier","options","resolvedOptions","key","value","__publicField","_node","context","styles","props","transitionValue","config","property","settings","prop","duration","easing","delay","transition","transitions","fadeTransition","transformTransition","colorTransition","layoutTransition","buttonTransition","cardTransition","modalTransition","smoothTransition","quickTransition","slowTransition"],"mappings":"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"}

package/dist/modifiers/transitions.js

@@ -1,102 +0,0 @@
-import { BaseModifier as d } from "./base.js";
-var g = Object.defineProperty, p = (n, t, e) => t in n ? g(n, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : n[t] = e, u = (n, t, e) => p(n, typeof t != "symbol" ? t + "" : t, e);
-class c extends d {
-  constructor(t) {
-    const e = {};
-    for (const [o, i] of Object.entries(t))
-      typeof i == "function" && "peek" in i ? e[o] = i.peek() : e[o] = i;
-    super(e), u(this, "type", "transition"), u(this, "priority", 25);
-  }
-  apply(t, e) {
-    if (!e.element) return;
-    const o = this.computeTransitionStyles(this.properties);
-    this.applyStyles(e.element, o);
-  }
-  computeTransitionStyles(t) {
-    const e = {};
-    if (t.transition && (e.transition = t.transition), t.transitions) {
-      const o = this.generateTransitionsCSS(t.transitions);
-      e.transition = o;
-    }
-    return e;
-  }
-  generateTransitionsCSS(t) {
-    return Object.entries(t).map(([e, o]) => {
-      const i = this.toCSSProperty(e), l = o.duration || 300, f = o.easing || "ease", a = o.delay || 0;
-      return `${i} ${l}ms ${f}${a > 0 ? ` ${a}ms` : ""}`;
-    }).join(", ");
-  }
-}
-function r(n = "all", t = 300, e = "ease", o = 0) {
-  const i = `${n} ${t}ms ${e}${o > 0 ? ` ${o}ms` : ""}`;
-  return new c({ transition: i });
-}
-function s(n) {
-  return new c({ transitions: n });
-}
-function b(n = 200) {
-  return r("opacity", n, "ease-out");
-}
-function y(n = 300) {
-  return r("transform", n, "ease-out");
-}
-function T(n = 150) {
-  return s({
-    color: { duration: n, easing: "ease-out" },
-    backgroundColor: { duration: n, easing: "ease-out" },
-    borderColor: { duration: n, easing: "ease-out" }
-  });
-}
-function h(n = 250) {
-  return s({
-    width: { duration: n, easing: "ease-out" },
-    height: { duration: n, easing: "ease-out" },
-    margin: { duration: n, easing: "ease-out" },
-    padding: { duration: n, easing: "ease-out" }
-  });
-}
-function S() {
-  return s({
-    backgroundColor: { duration: 150, easing: "ease-out" },
-    transform: { duration: 200, easing: "ease-out" },
-    boxShadow: { duration: 200, easing: "ease-out" }
-  });
-}
-function $() {
-  return s({
-    transform: { duration: 200, easing: "ease-out" },
-    boxShadow: { duration: 300, easing: "ease-out" },
-    borderColor: { duration: 150, easing: "ease-out" }
-  });
-}
-function w() {
-  return s({
-    opacity: { duration: 200, easing: "ease-out" },
-    transform: { duration: 300, easing: "cubic-bezier(0.34, 1.56, 0.64, 1)" }
-  });
-}
-function C(n = 300) {
-  return r("all", n, "ease-out");
-}
-function _(n = 150) {
-  return r("all", n, "ease-out");
-}
-function v(n = 500) {
-  return r("all", n, "ease-out");
-}
-export {
-  c as TransitionModifier,
-  S as buttonTransition,
-  $ as cardTransition,
-  T as colorTransition,
-  b as fadeTransition,
-  h as layoutTransition,
-  w as modalTransition,
-  _ as quickTransition,
-  v as slowTransition,
-  C as smoothTransition,
-  y as transformTransition,
-  r as transition,
-  s as transitions
-};
-//# sourceMappingURL=transitions.js.map

package/dist/modifiers/transitions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"transitions.js","sources":["../../src/modifiers/transitions.ts"],"sourcesContent":["/**\n * Transition Modifiers - CSS transition system\n *\n * Provides comprehensive CSS transition capabilities with support for\n * individual property transitions and complex multi-property animations.\n */\n\nimport type { DOMNode } from '../runtime/types'\nimport { BaseModifier } from './base'\nimport type { ModifierContext, ReactiveModifierProps } from './types'\n\nexport interface TransitionConfig {\n  property?: string\n  duration?: number\n  easing?: string\n  delay?: number\n}\n\nexport interface TransitionsConfig {\n  [property: string]: TransitionConfig\n}\n\nexport interface ModifierTransitionOptions {\n  transition?: string\n  transitions?: TransitionsConfig\n}\n\nexport type ReactiveTransitionOptions = ReactiveModifierProps<ModifierTransitionOptions>\n\nexport class TransitionModifier extends BaseModifier<ModifierTransitionOptions> {\n  readonly type = 'transition'\n  readonly priority = 25\n\n  constructor(options: ReactiveTransitionOptions) {\n    const resolvedOptions: ModifierTransitionOptions = {}\n    for (const [key, value] of Object.entries(options)) {\n      if (typeof value === 'function' && 'peek' in value) {\n        ;(resolvedOptions as any)[key] = (value as any).peek()\n      } else {\n        ;(resolvedOptions as any)[key] = value\n      }\n    }\n    super(resolvedOptions)\n  }\n\n  apply(_node: DOMNode, context: ModifierContext): DOMNode | undefined {\n    if (!context.element) return\n\n    const styles = this.computeTransitionStyles(this.properties)\n    this.applyStyles(context.element, styles)\n    \n    return undefined\n  }\n\n  private computeTransitionStyles(props: ModifierTransitionOptions) {\n    const styles: Record<string, string> = {}\n\n    if (props.transition) {\n      styles.transition = props.transition\n    }\n\n    if (props.transitions) {\n      const transitionValue = this.generateTransitionsCSS(props.transitions)\n      styles.transition = transitionValue\n    }\n\n    return styles\n  }\n\n  private generateTransitionsCSS(config: TransitionsConfig): string {\n    return Object.entries(config)\n      .map(([property, settings]) => {\n        const prop = this.toCSSProperty(property)\n        const duration = settings.duration || 300\n        const easing = settings.easing || 'ease'\n        const delay = settings.delay || 0\n        \n        return `${prop} ${duration}ms ${easing}${delay > 0 ? ` ${delay}ms` : ''}`\n      })\n      .join(', ')\n  }\n}\n\n// ============================================================================\n// Transition Functions\n// ============================================================================\n\n/**\n * Simple transition modifier with sensible defaults\n *\n * @example\n * ```typescript\n * .transition()                          // All properties, 300ms, ease\n * .transition('opacity')                 // Just opacity\n * .transition('all', 200)                // All properties, 200ms\n * .transition('transform', 300, 'ease-out')  // Transform with custom easing\n * .transition('opacity', 150, 'ease-in', 50)  // With delay\n * ```\n */\nexport function transition(\n  property: string = 'all', \n  duration: number = 300, \n  easing: string = 'ease', \n  delay: number = 0\n): TransitionModifier {\n  const transitionValue = `${property} ${duration}ms ${easing}${delay > 0 ? ` ${delay}ms` : ''}`\n  return new TransitionModifier({ transition: transitionValue })\n}\n\n/**\n * Complex transitions with multiple properties\n *\n * @example\n * ```typescript\n * .transitions({\n *   opacity: { duration: 200, easing: 'ease-out' },\n *   transform: { duration: 300, easing: 'ease-in-out', delay: 100 },\n *   backgroundColor: { duration: 150 }\n * })\n * ```\n */\nexport function transitions(config: TransitionsConfig): TransitionModifier {\n  return new TransitionModifier({ transitions: config })\n}\n\n// ============================================================================\n// Common Transition Presets\n// ============================================================================\n\n/**\n * Quick fade transition\n */\nexport function fadeTransition(duration: number = 200): TransitionModifier {\n  return transition('opacity', duration, 'ease-out')\n}\n\n/**\n * Smooth transform transition\n */\nexport function transformTransition(duration: number = 300): TransitionModifier {\n  return transition('transform', duration, 'ease-out')\n}\n\n/**\n * Color change transition\n */\nexport function colorTransition(duration: number = 150): TransitionModifier {\n  return transitions({\n    color: { duration, easing: 'ease-out' },\n    backgroundColor: { duration, easing: 'ease-out' },\n    borderColor: { duration, easing: 'ease-out' }\n  })\n}\n\n/**\n * Layout transition for size changes\n */\nexport function layoutTransition(duration: number = 250): TransitionModifier {\n  return transitions({\n    width: { duration, easing: 'ease-out' },\n    height: { duration, easing: 'ease-out' },\n    margin: { duration, easing: 'ease-out' },\n    padding: { duration, easing: 'ease-out' }\n  })\n}\n\n/**\n * Button hover transition\n */\nexport function buttonTransition(): TransitionModifier {\n  return transitions({\n    backgroundColor: { duration: 150, easing: 'ease-out' },\n    transform: { duration: 200, easing: 'ease-out' },\n    boxShadow: { duration: 200, easing: 'ease-out' }\n  })\n}\n\n/**\n * Card hover transition\n */\nexport function cardTransition(): TransitionModifier {\n  return transitions({\n    transform: { duration: 200, easing: 'ease-out' },\n    boxShadow: { duration: 300, easing: 'ease-out' },\n    borderColor: { duration: 150, easing: 'ease-out' }\n  })\n}\n\n/**\n * Modal/dialog transition\n */\nexport function modalTransition(): TransitionModifier {\n  return transitions({\n    opacity: { duration: 200, easing: 'ease-out' },\n    transform: { duration: 300, easing: 'cubic-bezier(0.34, 1.56, 0.64, 1)' }\n  })\n}\n\n/**\n * Smooth all-properties transition\n */\nexport function smoothTransition(duration: number = 300): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}\n\n/**\n * Quick transition for interactive elements\n */\nexport function quickTransition(duration: number = 150): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}\n\n/**\n * Slow transition for dramatic effects\n */\nexport function slowTransition(duration: number = 500): TransitionModifier {\n  return transition('all', duration, 'ease-out')\n}"],"names":["TransitionModifier","BaseModifier","options","resolvedOptions","key","value","__publicField","_node","context","styles","props","transitionValue","config","property","settings","prop","duration","easing","delay","transition","transitions","fadeTransition","transformTransition","colorTransition","layoutTransition","buttonTransition","cardTransition","modalTransition","smoothTransition","quickTransition","slowTransition"],"mappings":"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"}

package/dist/modifiers/types.cjs

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var T=(A=>(A[A.LAYOUT=100]="LAYOUT",A[A.APPEARANCE=200]="APPEARANCE",A[A.INTERACTION=300]="INTERACTION",A[A.ANIMATION=400]="ANIMATION",A[A.CUSTOM=500]="CUSTOM",A))(T||{});exports.ModifierPriority=T;
-//# sourceMappingURL=types.cjs.map

package/dist/modifiers/types.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.cjs","sources":["../../src/modifiers/types.ts"],"sourcesContent":["/**\n * SwiftUI Modifier System Types\n *\n * Core type definitions for the SwiftUI-inspired modifier system.\n * Enables chaining modifiers on components similar to SwiftUI.\n */\n\nimport type { Signal } from '../reactive/types'\nimport type { ComponentInstance, ComponentProps, DOMNode } from '../runtime/types'\nimport type { FontWeight } from './typography'\nimport type { Dimension } from '../constants/layout'\nimport type { StatefulBackgroundValue } from '../gradients/types'\nimport type { ResponsiveModifierBuilder, ResponsiveBreakpointBuilder } from './responsive/responsive-builder'\nimport type { Asset } from '../assets/Asset'\nimport type { ColorAssetProxy, ImageAssetProxy, FontAssetProxy } from '../assets/types'\n\n/**\n * Valid color value types for modifiers\n */\nexport type ColorValue = string | Asset | ColorAssetProxy | Signal<string>\n\n/**\n * Valid asset types for modifiers\n */\nexport type AssetValue = Asset | ColorAssetProxy | ImageAssetProxy | FontAssetProxy\n\n/**\n * Text component interface for type safety with asHTML modifier\n */\nexport interface TextComponent extends ComponentInstance {\n  readonly __tachui_component_type: 'Text'\n  content: string\n}\n\n/**\n * Base modifier interface that all modifiers must implement\n */\nexport interface Modifier<TProps = {}> {\n  readonly type: string\n  readonly priority: number\n  readonly properties: TProps\n  apply(node: DOMNode, context: ModifierContext): DOMNode | undefined\n}\n\n/**\n * Context passed to modifiers during application\n */\nexport interface ModifierContext {\n  componentId: string\n  componentInstance?: ComponentInstance\n  element?: Element\n  parentElement?: Element\n  phase: 'creation' | 'update' | 'cleanup'\n  previousModifiers?: Modifier[]\n}\n\n/**\n * Modifier application result\n */\nexport interface ModifierResult {\n  node: DOMNode\n  effects?: (() => void)[]\n  cleanup?: (() => void)[]\n}\n\n/**\n * Reactive modifier properties that can contain signals\n */\nexport type ReactiveModifierProps<T> = {\n  [K in keyof T]: T[K] | Signal<T[K]>\n}\n\n/**\n * Strict TextShadow configuration interface\n * Prevents common mistakes like using 'radius' instead of 'blur'\n */\nexport interface TextShadowConfig {\n  readonly x: number\n  readonly y: number  \n  readonly blur: number\n  readonly color: string\n}\n\n/**\n * Layout modifier properties\n */\nexport interface LayoutModifierProps {\n  frame?: {\n    width?: Dimension\n    height?: Dimension\n    minWidth?: Dimension\n    maxWidth?: Dimension\n    minHeight?: Dimension\n    maxHeight?: Dimension\n  }\n  padding?:\n    | {\n        top?: number\n        right?: number\n        bottom?: number\n        left?: number\n      }\n    | number\n  margin?:\n    | {\n        top?: number | string\n        right?: number | string\n        bottom?: number | string\n        left?: number | string\n      }\n    | number | string\n  alignment?: 'leading' | 'center' | 'trailing' | 'top' | 'bottom'\n  layoutPriority?: number\n  offset?: {\n    x?: number\n    y?: number\n  }\n  aspectRatio?: {\n    ratio?: number\n    contentMode?: 'fit' | 'fill'\n  }\n  fixedSize?: {\n    horizontal?: boolean\n    vertical?: boolean\n  }\n  // Transform Properties (Phase 3 - Epic: Butternut)\n  scaleEffect?: {\n    x?: number\n    y?: number\n    anchor?:\n      | 'center'\n      | 'top'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottom'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n      | 'leading'\n      | 'trailing'\n  }\n  position?: {\n    x?: number\n    y?: number\n  }\n  zIndex?: number\n}\n\n/**\n * Appearance modifier properties\n */\nexport interface AppearanceModifierProps {\n  foregroundColor?: ColorValue\n  backgroundColor?: ColorValue\n  background?: StatefulBackgroundValue\n  opacity?: number\n  font?: {\n    family?: string\n    size?: number | string | Signal<number> | Signal<string>\n    weight?:\n      | 'normal'\n      | 'bold'\n      | '100'\n      | '200'\n      | '300'\n      | '400'\n      | '500'\n      | '600'\n      | '700'\n      | '800'\n      | '900'\n    style?: 'normal' | 'italic' | 'oblique'\n  }\n  cornerRadius?: number\n  border?: {\n    width?: number | Signal<number>\n    color?: ColorValue\n    style?: 'solid' | 'dashed' | 'dotted'\n  }\n  shadow?: {\n    color?: string\n    radius?: number\n    x?: number\n    y?: number\n  }\n  clipped?: boolean\n  clipShape?: {\n    shape: 'circle' | 'ellipse' | 'rect' | 'polygon'\n    parameters?: Record<string, any>\n  }\n  // Visual Effects (Phase 2 - Epic: Butternut)\n  blur?: number // CSS filter: blur(Npx)\n  brightness?: number // CSS filter: brightness(N) - 1.0 is normal\n  contrast?: number // CSS filter: contrast(N) - 1.0 is normal  \n  saturation?: number // CSS filter: saturate(N) - 1.0 is normal\n  hueRotation?: number // CSS filter: hue-rotate(Ndeg)\n  grayscale?: number // CSS filter: grayscale(N) - 0.0 to 1.0\n  colorInvert?: number // CSS filter: invert(N) - 0.0 to 1.0\n}\n\n/**\n * Interaction modifier properties\n */\nexport interface InteractionModifierProps {\n  // Existing mouse events\n  onTap?: (event: MouseEvent) => void\n  onHover?: (isHovered: boolean) => void\n  onMouseEnter?: (event: MouseEvent) => void\n  onMouseLeave?: (event: MouseEvent) => void\n  onMouseDown?: (event: MouseEvent) => void\n  onMouseUp?: (event: MouseEvent) => void\n  onDoubleClick?: (event: MouseEvent) => void\n  onContextMenu?: (event: MouseEvent) => void\n  \n  // Existing drag events\n  onDragStart?: (event: DragEvent) => void\n  onDragOver?: (event: DragEvent) => void\n  onDragLeave?: (event: DragEvent) => void\n  onDrop?: (event: DragEvent) => void\n  \n  // Focus events (onFocus exists, adding onBlur)\n  onFocus?: (isFocused: boolean) => void\n  onBlur?: (isFocused: boolean) => void\n  \n  // Keyboard events\n  onKeyPress?: (event: KeyboardEvent) => void\n  onKeyDown?: (event: KeyboardEvent) => void\n  onKeyUp?: (event: KeyboardEvent) => void\n  \n  // Scroll and wheel events\n  onScroll?: (event: Event) => void\n  onWheel?: (event: WheelEvent) => void\n  \n  // Input events\n  onInput?: (event: InputEvent) => void\n  onChange?: (value: any, event?: Event) => void\n  \n  // Clipboard events\n  onCopy?: (event: ClipboardEvent) => void\n  onCut?: (event: ClipboardEvent) => void\n  onPaste?: (event: ClipboardEvent) => void\n  \n  // Other events\n  onSelect?: (event: Event) => void\n  \n  // Advanced Gesture Modifiers (Phase 4 - Epic: Butternut)\n  onLongPressGesture?: {\n    minimumDuration?: number // ms, default 500\n    maximumDistance?: number // px, default 10\n    perform: () => void\n    onPressingChanged?: (isPressing: boolean) => void\n  }\n  \n  // Keyboard Shortcuts (Phase 4 - Epic: Butternut)\n  keyboardShortcut?: {\n    key: string\n    modifiers?: ('cmd' | 'ctrl' | 'shift' | 'alt' | 'meta')[]\n    action: () => void\n  }\n  \n  // Focus Management (Phase 4 - Epic: Butternut) \n  focused?: boolean | Signal<boolean>\n  focusable?: {\n    isFocusable?: boolean\n    interactions?: ('activate' | 'edit')[]\n  }\n  \n  // Enhanced Hover Tracking (Phase 4 - Epic: Butternut)\n  onContinuousHover?: {\n    coordinateSpace?: 'local' | 'global'\n    perform: (location: { x: number; y: number } | null) => void\n  }\n  \n  // Gesture Priority System (Phase 4 - Epic: Butternut)\n  highPriorityGesture?: {\n    gesture: any // Will define gesture types later\n    including?: ('all' | 'subviews' | 'none')[]\n  }\n  simultaneousGesture?: {\n    gesture: any\n    including?: ('all' | 'subviews' | 'none')[]\n  }\n  \n  // Hit Testing Control (Phase 4 - Epic: Butternut)\n  allowsHitTesting?: boolean\n  \n  // Existing state properties\n  disabled?: boolean\n  draggable?: boolean\n  accessibilityLabel?: string\n  accessibilityHint?: string\n}\n\n/**\n * Animation modifier properties\n */\nexport interface AnimationModifierProps {\n  transition?: {\n    property?: string\n    duration?: number\n    easing?: string\n    delay?: number\n  }\n  animation?: {\n    keyframes?: Record<string, Record<string, string>>\n    duration?: number\n    easing?: string\n    iterations?: number | 'infinite'\n    direction?: 'normal' | 'reverse' | 'alternate' | 'alternate-reverse'\n  }\n  transform?: string | Signal<string>\n  rotationEffect?: {\n    angle: number\n    anchor?:\n      | 'center'\n      | 'top'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottom'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n      | 'leading'\n      | 'trailing'\n  }\n  overlay?: {\n    content: any // ComponentInstance or function that returns ComponentInstance\n    alignment?:\n      | 'center'\n      | 'top'\n      | 'bottom'\n      | 'leading'\n      | 'trailing'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n  }\n}\n\n/**\n * Lifecycle modifier properties\n */\nexport interface LifecycleModifierProps {\n  onAppear?: () => void\n  onDisappear?: () => void\n  task?: {\n    operation: () => Promise<void> | void\n    id?: string\n    priority?: 'background' | 'userInitiated' | 'utility' | 'default'\n  }\n  refreshable?: {\n    onRefresh: () => Promise<void>\n    isRefreshing?: boolean | Signal<boolean>\n  }\n}\n\n/**\n * Modifier factory function type\n */\nexport type ModifierFactory<TProps = {}> = (\n  props: ReactiveModifierProps<TProps>\n) => Modifier<TProps>\n\n/**\n * Modifier builder interface for creating chainable modifiers\n */\nexport interface ModifierBuilder<T extends ComponentInstance = ComponentInstance> {\n  // Layout modifiers\n  frame(width?: Dimension, height?: Dimension): ModifierBuilder<T>\n  frame(options: LayoutModifierProps['frame']): ModifierBuilder<T>\n  padding(value: number): ModifierBuilder<T>\n  padding(options: LayoutModifierProps['padding']): ModifierBuilder<T>\n  margin(value: number | string): ModifierBuilder<T>\n  margin(options: LayoutModifierProps['margin']): ModifierBuilder<T>\n\n  // New multi-property modifiers\n  size(options: {\n    width?: Dimension\n    height?: Dimension\n    minWidth?: Dimension\n    maxWidth?: Dimension\n    minHeight?: Dimension\n    maxHeight?: Dimension\n  }): ModifierBuilder<T>\n  width(value: Dimension): ModifierBuilder<T>\n  height(value: Dimension): ModifierBuilder<T>\n  maxWidth(value: Dimension): ModifierBuilder<T>\n  minWidth(value: Dimension): ModifierBuilder<T>\n  maxHeight(value: Dimension): ModifierBuilder<T>\n  minHeight(value: Dimension): ModifierBuilder<T>\n  marginTop(value: number | string): ModifierBuilder<T>\n  marginBottom(value: number | string): ModifierBuilder<T>\n  marginHorizontal(value: number | string): ModifierBuilder<T>\n  marginVertical(value: number | string): ModifierBuilder<T>\n\n  // Typography modifiers\n  typography(options: {\n    size?: number | string\n    weight?: FontWeight | number\n    family?: string\n    lineHeight?: number | string\n    letterSpacing?: number | string\n    align?: string\n    transform?: string\n    decoration?: string\n    variant?: string\n    style?: string\n    color?: string\n  }): ModifierBuilder<T>\n  textAlign(value: 'left' | 'center' | 'right' | 'justify' | 'start' | 'end'): ModifierBuilder<T>\n  textTransform(value: 'none' | 'uppercase' | 'lowercase' | 'capitalize'): ModifierBuilder<T>\n  letterSpacing(value: number | string): ModifierBuilder<T>\n  lineHeight(value: number | string): ModifierBuilder<T>\n  gradientText(gradient: string): ModifierBuilder<T>\n\n  // Border modifiers\n  borderTop(\n    width: number | Signal<number>,\n    color: ColorValue,\n    style?: 'solid' | 'dashed' | 'dotted' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'\n  ): ModifierBuilder<T>\n  borderRight(\n    width: number | Signal<number>,\n    color: ColorValue,\n    style?: 'solid' | 'dashed' | 'dotted' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'\n  ): ModifierBuilder<T>\n  borderBottom(\n    width: number | Signal<number>,\n    color: ColorValue,\n    style?: 'solid' | 'dashed' | 'dotted' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'\n  ): ModifierBuilder<T>\n  borderLeft(\n    width: number | Signal<number>,\n    color: ColorValue,\n    style?: 'solid' | 'dashed' | 'dotted' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'\n  ): ModifierBuilder<T>\n\n  // Flexbox modifiers\n  flexGrow(value: number): ModifierBuilder<T>\n  flexShrink(value: number): ModifierBuilder<T>\n  justifyContent(\n    value: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly'\n  ): ModifierBuilder<T>\n  alignItems(\n    value: 'flex-start' | 'flex-end' | 'center' | 'stretch' | 'baseline'\n  ): ModifierBuilder<T>\n  gap(value: number | string): ModifierBuilder<T>\n  flexDirection(value: 'row' | 'row-reverse' | 'column' | 'column-reverse'): ModifierBuilder<T>\n  flexWrap(value: 'nowrap' | 'wrap' | 'wrap-reverse'): ModifierBuilder<T>\n\n  // Utility modifiers\n  cursor(\n    value:\n      | 'auto'\n      | 'default'\n      | 'pointer'\n      | 'text'\n      | 'wait'\n      | 'help'\n      | 'not-allowed'\n      | 'grab'\n      | 'grabbing'\n  ): ModifierBuilder<T>\n  overflowY(value: 'visible' | 'hidden' | 'scroll' | 'auto'): ModifierBuilder<T>\n  overflowX(value: 'visible' | 'hidden' | 'scroll' | 'auto'): ModifierBuilder<T>\n  position(value: 'static' | 'relative' | 'absolute' | 'fixed' | 'sticky'): ModifierBuilder<T>\n  zIndex(value: number): ModifierBuilder<T>\n  display(\n    value: 'block' | 'inline' | 'inline-block' | 'flex' | 'inline-flex' | 'grid' | 'none'\n  ): ModifierBuilder<T>\n  transform(value: string | Signal<string>): ModifierBuilder<T>\n\n  // Raw CSS modifiers\n  css(properties: { [property: string]: string | number | undefined }): ModifierBuilder<T>\n  cssProperty(property: string, value: string | number): ModifierBuilder<T>\n  cssVariable(name: string, value: string | number): ModifierBuilder<T>\n\n  // Phase 1 SwiftUI modifiers\n  offset(x: number | Signal<number>, y?: number | Signal<number>): ModifierBuilder<T>\n  clipped(): ModifierBuilder<T>\n  rotationEffect(\n    angle: number | Signal<number>,\n    anchor?:\n      | 'center'\n      | 'top'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottom'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n      | 'leading'\n      | 'trailing'\n  ): ModifierBuilder<T>\n\n  // Phase 2 SwiftUI modifiers\n  aspectRatio(ratio?: number | Signal<number>, contentMode?: 'fit' | 'fill'): ModifierBuilder<T>\n  fixedSize(horizontal?: boolean, vertical?: boolean): ModifierBuilder<T>\n  clipShape(\n    shape: 'circle' | 'ellipse' | 'rect' | 'polygon',\n    parameters?: Record<string, any>\n  ): ModifierBuilder<T>\n  overlay(\n    content: any,\n    alignment?:\n      | 'center'\n      | 'top'\n      | 'bottom'\n      | 'leading'\n      | 'trailing'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n  ): ModifierBuilder<T>\n\n  // Phase 3 SwiftUI modifiers - Critical Transform Modifiers\n  scaleEffect(\n    x: number | Signal<number>,\n    y?: number | Signal<number>,\n    anchor?:\n      | 'center'\n      | 'top'\n      | 'topLeading'\n      | 'topTrailing'\n      | 'bottom'\n      | 'bottomLeading'\n      | 'bottomTrailing'\n      | 'leading'\n      | 'trailing'\n  ): ModifierBuilder<T>\n  \n  // Note: SwiftUI-style position for absolute positioning (different from CSS position)\n  absolutePosition(x: number | Signal<number>, y: number | Signal<number>): ModifierBuilder<T>\n\n  // Appearance modifiers\n  foregroundColor(color: ColorValue): ModifierBuilder<T>\n  backgroundColor(color: ColorValue): ModifierBuilder<T>\n  background(value: StatefulBackgroundValue | Signal<string>): ModifierBuilder<T>\n  font(options: AppearanceModifierProps['font']): ModifierBuilder<T>\n  font(size: number | string): ModifierBuilder<T>\n  fontWeight(weight: NonNullable<AppearanceModifierProps['font']>['weight']): ModifierBuilder<T>\n  fontSize(size: number | string | Signal<number> | Signal<string>): ModifierBuilder<T>\n  opacity(value: number | Signal<number>): ModifierBuilder<T>\n  cornerRadius(radius: number | Signal<number>): ModifierBuilder<T>\n  border(width: number | Signal<number>, color?: ColorValue): ModifierBuilder<T>\n  border(options: AppearanceModifierProps['border']): ModifierBuilder<T>\n  borderWidth(width: number | Signal<number>): ModifierBuilder<T>\n  shadow(options: AppearanceModifierProps['shadow']): ModifierBuilder<T>\n  shadow(config: { x: number; y: number; blur: number; color: string; spread?: number; inset?: boolean }): ModifierBuilder<T>\n  shadows(configs: Array<{ x: number; y: number; blur: number; color: string; spread?: number; inset?: boolean }>): ModifierBuilder<T>\n  textShadow(config: TextShadowConfig): ModifierBuilder<T>\n  shadowPreset(presetName: string): ModifierBuilder<T>\n\n  // Visual Effects Modifiers (Phase 2 - Epic: Butternut)\n  blur(radius: number | Signal<number>): ModifierBuilder<T>\n  brightness(amount: number | Signal<number>): ModifierBuilder<T>\n  contrast(amount: number | Signal<number>): ModifierBuilder<T>\n  saturation(amount: number | Signal<number>): ModifierBuilder<T>\n  hueRotation(angle: number | Signal<number>): ModifierBuilder<T>\n  grayscale(amount: number | Signal<number>): ModifierBuilder<T>\n  colorInvert(amount?: number | Signal<number>): ModifierBuilder<T>\n  dropShadow(shadow: string): ModifierBuilder<T>\n  \n  // Additional filter methods\n  filter(config: { blur?: number; brightness?: number; contrast?: number; saturate?: number; [key: string]: any } | string): ModifierBuilder<T>\n  saturate(value: number): ModifierBuilder<T>\n  sepia(value: number): ModifierBuilder<T>\n  hueRotate(angle: string): ModifierBuilder<T>\n  invert(value: number): ModifierBuilder<T>\n  \n  // Filter presets\n  vintagePhoto(sepiaAmount?: number, contrastAmount?: number): ModifierBuilder<T>\n  blackAndWhite(contrastAmount?: number): ModifierBuilder<T>\n  vibrant(saturationAmount?: number, contrastAmount?: number): ModifierBuilder<T>\n  warmTone(hueShift?: string): ModifierBuilder<T>\n  coolTone(hueShift?: string): ModifierBuilder<T>\n  faded(contrastAmount?: number, saturationAmount?: number): ModifierBuilder<T>\n  highKey(brightnessAmount?: number, contrastAmount?: number): ModifierBuilder<T>\n  lowKey(brightnessAmount?: number, contrastAmount?: number): ModifierBuilder<T>\n  softFocus(blurAmount?: number): ModifierBuilder<T>\n  highContrastMode(): ModifierBuilder<T>\n  subtleBlur(): ModifierBuilder<T>\n  darkModeInvert(): ModifierBuilder<T>\n\n  // Transform modifiers (SwiftUI-style)\n  scale(value: number | { x?: number; y?: number }): ModifierBuilder<T>\n  rotate(angle: string): ModifierBuilder<T>\n  translate(offset: { x?: number | string; y?: number | string }): ModifierBuilder<T>\n  perspective(value: number): ModifierBuilder<T>\n\n  // Hover and cursor effect modifiers\n  hover(styles: any, transition?: string | number): ModifierBuilder<T>\n  hoverEffect(effect: 'automatic' | 'highlight' | 'lift' | 'scale', isEnabled?: boolean): ModifierBuilder<T>\n  hoverWithTransition(styles: any, duration?: number): ModifierBuilder<T>\n  conditionalHover(effect: 'automatic' | 'highlight' | 'lift' | 'scale', isEnabled: boolean): ModifierBuilder<T>\n\n  // Cursor preset methods\n  interactiveCursor(): ModifierBuilder<T>\n  draggableCursor(): ModifierBuilder<T>\n  textCursor(): ModifierBuilder<T>\n  disabledCursor(): ModifierBuilder<T>\n  loadingCursor(): ModifierBuilder<T>\n  helpCursor(): ModifierBuilder<T>\n  zoomCursor(mode?: 'in' | 'out'): ModifierBuilder<T>\n\n  // Hover effect presets\n  buttonHover(): ModifierBuilder<T>\n  cardHover(): ModifierBuilder<T>\n  linkHover(): ModifierBuilder<T>\n  imageHover(): ModifierBuilder<T>\n\n  // Interaction modifiers\n  onTap(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onHover(handler: (isHovered: boolean) => void): ModifierBuilder<T>\n  onMouseEnter(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onMouseLeave(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onMouseDown(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onMouseUp(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onDoubleClick(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onContextMenu(handler: (event: MouseEvent) => void): ModifierBuilder<T>\n  onDragStart(handler: (event: DragEvent) => void): ModifierBuilder<T>\n  onDragOver(handler: (event: DragEvent) => void): ModifierBuilder<T>\n  onDragLeave(handler: (event: DragEvent) => void): ModifierBuilder<T>\n  onDrop(handler: (event: DragEvent) => void): ModifierBuilder<T>\n  \n  // Focus events\n  onFocus(handler: (isFocused: boolean) => void): ModifierBuilder<T>\n  onBlur(handler: (isFocused: boolean) => void): ModifierBuilder<T>\n  \n  // Keyboard events\n  onKeyPress(handler: (event: KeyboardEvent) => void): ModifierBuilder<T>\n  onKeyDown(handler: (event: KeyboardEvent) => void): ModifierBuilder<T>\n  onKeyUp(handler: (event: KeyboardEvent) => void): ModifierBuilder<T>\n  \n  // Scroll and wheel events\n  onScroll(handler: (event: Event) => void): ModifierBuilder<T>\n  onWheel(handler: (event: WheelEvent) => void): ModifierBuilder<T>\n  \n  // Input events\n  onInput(handler: (event: InputEvent) => void): ModifierBuilder<T>\n  onChange(handler: (value: any, event?: Event) => void): ModifierBuilder<T>\n  \n  // Clipboard events\n  onCopy(handler: (event: ClipboardEvent) => void): ModifierBuilder<T>\n  onCut(handler: (event: ClipboardEvent) => void): ModifierBuilder<T>\n  onPaste(handler: (event: ClipboardEvent) => void): ModifierBuilder<T>\n  \n  // Other events\n  onSelect(handler: (event: Event) => void): ModifierBuilder<T>\n  \n  // Advanced Gesture Modifiers (Phase 4 - Epic: Butternut)\n  onLongPressGesture(\n    options: {\n      minimumDuration?: number\n      maximumDistance?: number\n      perform: () => void\n      onPressingChanged?: (isPressing: boolean) => void\n    }\n  ): ModifierBuilder<T>\n  \n  // Keyboard Shortcuts (Phase 4 - Epic: Butternut)\n  keyboardShortcut(\n    key: string,\n    modifiers: ('cmd' | 'ctrl' | 'shift' | 'alt' | 'meta')[],\n    action: () => void\n  ): ModifierBuilder<T>\n  \n  // Focus Management (Phase 4 - Epic: Butternut)\n  focused(binding: boolean | Signal<boolean>): ModifierBuilder<T>\n  focusable(\n    isFocusable?: boolean,\n    interactions?: ('activate' | 'edit')[]\n  ): ModifierBuilder<T>\n  \n  // Enhanced Hover Tracking (Phase 4 - Epic: Butternut)\n  onContinuousHover(\n    coordinateSpace: 'local' | 'global',\n    perform: (location: { x: number; y: number } | null) => void\n  ): ModifierBuilder<T>\n  \n  // Gesture Priority System (Phase 4 - Epic: Butternut)\n  highPriorityGesture(\n    gesture: any,\n    including?: ('all' | 'subviews' | 'none')[]\n  ): ModifierBuilder<T>\n  simultaneousGesture(\n    gesture: any,\n    including?: ('all' | 'subviews' | 'none')[]\n  ): ModifierBuilder<T>\n  \n  // Hit Testing Control (Phase 4 - Epic: Butternut)\n  allowsHitTesting(enabled: boolean): ModifierBuilder<T>\n  \n  // HTML and ARIA Attributes\n  id(value: string): ModifierBuilder<T>\n  data(attributes: { [key: string]: string | number | boolean }): ModifierBuilder<T>\n  aria(attributes: { [key: string]: string | number | boolean | undefined }): ModifierBuilder<T>\n  tabIndex(value: number): ModifierBuilder<T>\n\n  // Text Modifiers\n  lineClamp(lines: number): ModifierBuilder<T>\n  wordBreak(value: 'normal' | 'break-all' | 'keep-all' | 'break-word'): ModifierBuilder<T>\n  overflowWrap(value: 'normal' | 'break-word' | 'anywhere'): ModifierBuilder<T>\n  hyphens(value: 'none' | 'manual' | 'auto'): ModifierBuilder<T>\n\n  // Backdrop Filter Modifiers (Unified Implementation)\n  backdropFilter(config: { blur?: number; brightness?: number; contrast?: number; saturate?: number; [key: string]: any }, fallbackColor?: ColorValue): ModifierBuilder<T>\n  backdropFilter(cssValue: string, fallbackColor?: ColorValue): ModifierBuilder<T>\n  glassmorphism(intensity?: 'subtle' | 'light' | 'medium' | 'heavy', customFallback?: ColorValue): ModifierBuilder<T>\n\n  // Pseudo-element modifiers\n  before(styles: { content: string; color?: string; [key: string]: any }): ModifierBuilder<T>\n  after(styles: { content: string; color?: string; [key: string]: any }): ModifierBuilder<T>\n\n  // State modifiers\n  disabled(isDisabled?: boolean | Signal<boolean>): ModifierBuilder<T>\n  draggable(isDraggable?: boolean): ModifierBuilder<T>\n  setAttribute(name: string, value: string): ModifierBuilder<T>\n  accessibilityLabel(label: string): ModifierBuilder<T>\n\n  // Animation modifiers\n  transition(property?: string, duration?: number, easing?: string, delay?: number): ModifierBuilder<T>\n  transitions(config: any): ModifierBuilder<T>\n  animation(options: AnimationModifierProps['animation']): ModifierBuilder<T>\n\n  // Transition presets\n  fadeTransition(duration?: number): ModifierBuilder<T>\n  transformTransition(duration?: number): ModifierBuilder<T>\n  colorTransition(duration?: number): ModifierBuilder<T>\n  layoutTransition(duration?: number): ModifierBuilder<T>\n  buttonTransition(): ModifierBuilder<T>\n  cardTransition(): ModifierBuilder<T>\n  modalTransition(): ModifierBuilder<T>\n  smoothTransition(duration?: number): ModifierBuilder<T>\n  quickTransition(duration?: number): ModifierBuilder<T>\n  slowTransition(duration?: number): ModifierBuilder<T>\n\n  // Scroll modifiers\n  scroll(config: any): ModifierBuilder<T>\n  scrollBehavior(value: 'auto' | 'smooth'): ModifierBuilder<T>\n  overscrollBehavior(value: 'auto' | 'contain' | 'none'): ModifierBuilder<T>\n  overscrollBehaviorX(value: 'auto' | 'contain' | 'none'): ModifierBuilder<T>\n  overscrollBehaviorY(value: 'auto' | 'contain' | 'none'): ModifierBuilder<T>\n  scrollMargin(margin: number | string | { top?: number | string, right?: number | string, bottom?: number | string, left?: number | string }): ModifierBuilder<T>\n  scrollPadding(padding: number | string | { top?: number | string, right?: number | string, bottom?: number | string, left?: number | string }): ModifierBuilder<T>\n  scrollSnap(\n    type: 'none' | 'x mandatory' | 'y mandatory' | 'x proximity' | 'y proximity' | 'both mandatory' | 'both proximity',\n    align?: 'start' | 'end' | 'center',\n    stop?: 'normal' | 'always'\n  ): ModifierBuilder<T>\n\n  // Lifecycle modifiers\n  onAppear(handler: () => void): ModifierBuilder<T>\n  onDisappear(handler: () => void): ModifierBuilder<T>\n  task(\n    operation: () => Promise<void> | void,\n    options?: { id?: string; priority?: 'background' | 'userInitiated' | 'utility' | 'default' }\n  ): ModifierBuilder<T>\n  refreshable(\n    onRefresh: () => Promise<void>,\n    isRefreshing?: boolean | Signal<boolean>\n  ): ModifierBuilder<T>\n\n  // Custom modifier application\n  modifier(modifier: Modifier): ModifierBuilder<T>\n\n  // Resizable modifier for images\n  resizable(): ModifierBuilder<T>\n\n  // Text case alias for textTransform\n  textCase(value: 'none' | 'uppercase' | 'lowercase' | 'capitalize'): ModifierBuilder<T>\n\n  // HTML Content Rendering (Text components only)\n  /**\n   * Render component content as HTML instead of plain text\n   * \n   * ⚠️ **RESTRICTION**: Only available on Text components for security\n   * ⚠️ **SECURITY NOTICE**: This modifier treats content as HTML.\n   * - Default: Basic sanitization removes common XSS vectors\n   * - Use skipSanitizer: true only with fully trusted content\n   * - Consider DOMPurify for comprehensive sanitization\n   * - Non-reactive for performance (content is processed once)\n   * \n   * @param options - Configuration options\n   * \n   * @example\n   * ```typescript\n   * // ✅ Allowed: Text components only\n   * Text('<p>Hello <strong>world</strong></p>').modifier.asHTML().build()\n   * \n   * // ❌ Compile Error: Not a Text component\n   * VStack({}).modifier.asHTML() // TypeScript error\n   * \n   * // ✅ Dangerous: Skip sanitization\n   * Text(serverTemplate).modifier.asHTML({ skipSanitizer: true }).build()\n   * ```\n   */\n  asHTML(options?: import('./as-html').AsHTMLOptions): ModifierBuilder<T>\n\n  // Responsive Design Methods\n  responsive(): ResponsiveModifierBuilder<T>\n  \n  // Responsive Breakpoint Shorthand Properties\n  readonly base: ResponsiveBreakpointBuilder<T>\n  readonly sm: ResponsiveBreakpointBuilder<T>\n  readonly md: ResponsiveBreakpointBuilder<T>\n  readonly lg: ResponsiveBreakpointBuilder<T>\n  readonly xl: ResponsiveBreakpointBuilder<T>\n  readonly '2xl': ResponsiveBreakpointBuilder<T>\n  \n  addModifier(modifier: Modifier): void\n\n  // Build the final component with all modifiers applied\n  build(): T\n}\n\n/**\n * Modifiable component - components that can have modifiers applied\n */\nexport interface ModifiableComponent<P extends ComponentProps = ComponentProps>\n  extends ComponentInstance<P> {\n  modifiers: Modifier[]\n  modifierBuilder?: ModifierBuilder<ModifiableComponent<P>>\n}\n\n/**\n * CSS style properties that can be generated by modifiers\n */\nexport interface CSSStyleProperties {\n  [property: string]: string | number | Signal<string> | Signal<number> | undefined\n}\n\n/**\n * CSS class names that can be applied by modifiers\n */\nexport interface CSSClassNames {\n  base?: string[]\n  state?: Record<string, string[]>\n  responsive?: Record<string, string[]>\n}\n\n/**\n * Modifier registry for registering custom modifiers\n */\nexport interface ModifierRegistry {\n  register<TProps>(name: string, factory: ModifierFactory<TProps>): void\n  get<TProps>(name: string): ModifierFactory<TProps> | undefined\n  has(name: string): boolean\n  list(): string[]\n}\n\n/**\n * Modifier application options\n */\nexport interface ModifierApplicationOptions {\n  immediate?: boolean\n  batch?: boolean\n  suppressEffects?: boolean\n  enableAnimations?: boolean\n}\n\n/**\n * Modifier priority levels for ordering\n */\nexport enum ModifierPriority {\n  LAYOUT = 100,\n  APPEARANCE = 200,\n  INTERACTION = 300,\n  ANIMATION = 400,\n  CUSTOM = 500,\n}\n\n/**\n * Modifier application strategy\n */\nexport type ModifierApplicationStrategy =\n  | 'sequential' // Apply modifiers one by one in order\n  | 'batch' // Batch all style changes and apply at once\n  | 'immediate' // Apply each modifier immediately\n\n/**\n * Style computation context for reactive styles\n */\nexport interface StyleComputationContext {\n  componentId: string\n  element: Element\n  modifiers: Modifier[]\n  signals: Set<Signal<any>>\n  cleanup: (() => void)[]\n}\n"],"names":["ModifierPriority"],"mappings":"gFA+1BO,IAAKA,GAAAA,IACVA,EAAAA,EAAA,OAAS,GAAA,EAAT,SACAA,EAAAA,EAAA,WAAa,GAAA,EAAb,aACAA,EAAAA,EAAA,YAAc,GAAA,EAAd,cACAA,EAAAA,EAAA,UAAY,GAAA,EAAZ,YACAA,EAAAA,EAAA,OAAS,GAAA,EAAT,SALUA,IAAAA,GAAA,CAAA,CAAA"}

package/dist/modifiers/types.js

@@ -1,5 +0,0 @@
-var N = /* @__PURE__ */ ((A) => (A[A.LAYOUT = 100] = "LAYOUT", A[A.APPEARANCE = 200] = "APPEARANCE", A[A.INTERACTION = 300] = "INTERACTION", A[A.ANIMATION = 400] = "ANIMATION", A[A.CUSTOM = 500] = "CUSTOM", A))(N || {});
-export {
-  N as ModifierPriority
-};
-//# sourceMappingURL=types.js.map