@hypen-space/web 0.2.0

package/dist/src/canvas/utils.js

@@ -0,0 +1,139 @@
+import"../../chunk-2s02mkzs.js";
+
+// src/canvas/utils.ts
+function parseSpacing(value) {
+  if (typeof value === "number") {
+    return { top: value, right: value, bottom: value, left: value };
+  }
+  if (typeof value === "string") {
+    const parts = value.split(/\s+/).map((v) => parseFloat(v) || 0);
+    if (parts.length === 1) {
+      return { top: parts[0], right: parts[0], bottom: parts[0], left: parts[0] };
+    }
+    if (parts.length === 2) {
+      return { top: parts[0], right: parts[1], bottom: parts[0], left: parts[1] };
+    }
+    if (parts.length === 4) {
+      return { top: parts[0], right: parts[1], bottom: parts[2], left: parts[3] };
+    }
+  }
+  if (typeof value === "object" && value !== null) {
+    return {
+      top: parseFloat(value.top) || 0,
+      right: parseFloat(value.right) || 0,
+      bottom: parseFloat(value.bottom) || 0,
+      left: parseFloat(value.left) || 0
+    };
+  }
+  return { top: 0, right: 0, bottom: 0, left: 0 };
+}
+function parseSize(value) {
+  if (typeof value === "number")
+    return value;
+  if (typeof value === "string") {
+    if (value === "auto")
+      return null;
+    const num = parseFloat(value);
+    return isNaN(num) ? null : num;
+  }
+  return null;
+}
+function isPointInRect(point, rect) {
+  return point.x >= rect.x && point.x <= rect.x + rect.width && point.y >= rect.y && point.y <= rect.y + rect.height;
+}
+function isPointInRoundedRect(point, rect, radius) {
+  const { x, y, width, height } = rect;
+  if (!isPointInRect(point, rect))
+    return false;
+  if (radius <= 0)
+    return true;
+  const px = point.x;
+  const py = point.y;
+  if (px < x + radius && py < y + radius) {
+    return Math.pow(px - (x + radius), 2) + Math.pow(py - (y + radius), 2) <= Math.pow(radius, 2);
+  }
+  if (px > x + width - radius && py < y + radius) {
+    return Math.pow(px - (x + width - radius), 2) + Math.pow(py - (y + radius), 2) <= Math.pow(radius, 2);
+  }
+  if (px < x + radius && py > y + height - radius) {
+    return Math.pow(px - (x + radius), 2) + Math.pow(py - (y + height - radius), 2) <= Math.pow(radius, 2);
+  }
+  if (px > x + width - radius && py > y + height - radius) {
+    return Math.pow(px - (x + width - radius), 2) + Math.pow(py - (y + height - radius), 2) <= Math.pow(radius, 2);
+  }
+  return true;
+}
+function mergeRects(rects) {
+  if (rects.length === 0)
+    return null;
+  if (rects.length === 1)
+    return rects[0];
+  let minX = Infinity;
+  let minY = Infinity;
+  let maxX = -Infinity;
+  let maxY = -Infinity;
+  for (const rect of rects) {
+    minX = Math.min(minX, rect.x);
+    minY = Math.min(minY, rect.y);
+    maxX = Math.max(maxX, rect.x + rect.width);
+    maxY = Math.max(maxY, rect.y + rect.height);
+  }
+  return {
+    x: minX,
+    y: minY,
+    width: maxX - minX,
+    height: maxY - minY
+  };
+}
+function createFontString(fontSize, fontWeight, fontFamily) {
+  return `${fontWeight} ${fontSize}px ${fontFamily}`;
+}
+function walkTree(node, callback) {
+  callback(node);
+  for (const child of node.children) {
+    walkTree(child, callback);
+  }
+}
+function findNodeById(root, id) {
+  if (root.id === id)
+    return root;
+  for (const child of root.children) {
+    const found = findNodeById(child, id);
+    if (found)
+      return found;
+  }
+  return null;
+}
+function getAbsoluteBounds(node) {
+  if (!node.layout)
+    return null;
+  let x = node.layout.x;
+  let y = node.layout.y;
+  let current = node.parent;
+  while (current && current.layout) {
+    x += current.layout.contentX;
+    y += current.layout.contentY;
+    current = current.parent;
+  }
+  return {
+    x,
+    y,
+    width: node.layout.width,
+    height: node.layout.height
+  };
+}
+export {
+  walkTree,
+  parseSpacing,
+  parseSize,
+  mergeRects,
+  isPointInRoundedRect,
+  isPointInRect,
+  getAbsoluteBounds,
+  findNodeById,
+  createFontString
+};
+
+export { parseSpacing, parseSize, isPointInRoundedRect, createFontString, getAbsoluteBounds };
+
+//# debugId=2ACA4B13CBD0C32B64756E2164756E21

package/dist/src/canvas/utils.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/canvas/utils.ts"],
+  "sourcesContent": [
+    "/**\n * Canvas Renderer Utilities\n *\n * Common utility functions\n */\n\nimport type { BoxSpacing, Rectangle, Point, VirtualNode } from \"./types.js\";\n\n/**\n * Parse spacing value (margin, padding)\n * Supports: number, \"10\", \"10 20\", \"10 20 30 40\"\n */\nexport function parseSpacing(value: any): BoxSpacing {\n  if (typeof value === \"number\") {\n    return { top: value, right: value, bottom: value, left: value };\n  }\n\n  if (typeof value === \"string\") {\n    const parts = value.split(/\\s+/).map((v) => parseFloat(v) || 0);\n    if (parts.length === 1) {\n      return { top: parts[0], right: parts[0], bottom: parts[0], left: parts[0] };\n    }\n    if (parts.length === 2) {\n      return { top: parts[0], right: parts[1], bottom: parts[0], left: parts[1] };\n    }\n    if (parts.length === 4) {\n      return { top: parts[0], right: parts[1], bottom: parts[2], left: parts[3] };\n    }\n  }\n\n  if (typeof value === \"object\" && value !== null) {\n    return {\n      top: parseFloat(value.top) || 0,\n      right: parseFloat(value.right) || 0,\n      bottom: parseFloat(value.bottom) || 0,\n      left: parseFloat(value.left) || 0,\n    };\n  }\n\n  return { top: 0, right: 0, bottom: 0, left: 0 };\n}\n\n/**\n * Parse size value (width, height)\n * Returns pixel value or null for \"auto\"\n */\nexport function parseSize(value: any): number | null {\n  if (typeof value === \"number\") return value;\n  if (typeof value === \"string\") {\n    if (value === \"auto\") return null;\n    const num = parseFloat(value);\n    return isNaN(num) ? null : num;\n  }\n  return null;\n}\n\n/**\n * Check if point is inside rectangle\n */\nexport function isPointInRect(point: Point, rect: Rectangle): boolean {\n  return (\n    point.x >= rect.x &&\n    point.x <= rect.x + rect.width &&\n    point.y >= rect.y &&\n    point.y <= rect.y + rect.height\n  );\n}\n\n/**\n * Check if point is inside rounded rectangle\n */\nexport function isPointInRoundedRect(\n  point: Point,\n  rect: Rectangle,\n  radius: number\n): boolean {\n  const { x, y, width, height } = rect;\n\n  // Quick reject if outside bounding box\n  if (!isPointInRect(point, rect)) return false;\n\n  // No radius means simple rectangle\n  if (radius <= 0) return true;\n\n  const px = point.x;\n  const py = point.y;\n\n  // Check corners\n  // Top-left\n  if (px < x + radius && py < y + radius) {\n    return Math.pow(px - (x + radius), 2) + Math.pow(py - (y + radius), 2) <= Math.pow(radius, 2);\n  }\n\n  // Top-right\n  if (px > x + width - radius && py < y + radius) {\n    return (\n      Math.pow(px - (x + width - radius), 2) + Math.pow(py - (y + radius), 2) <=\n      Math.pow(radius, 2)\n    );\n  }\n\n  // Bottom-left\n  if (px < x + radius && py > y + height - radius) {\n    return (\n      Math.pow(px - (x + radius), 2) + Math.pow(py - (y + height - radius), 2) <=\n      Math.pow(radius, 2)\n    );\n  }\n\n  // Bottom-right\n  if (px > x + width - radius && py > y + height - radius) {\n    return (\n      Math.pow(px - (x + width - radius), 2) + Math.pow(py - (y + height - radius), 2) <=\n      Math.pow(radius, 2)\n    );\n  }\n\n  // Inside rectangle\n  return true;\n}\n\n/**\n * Merge rectangles into bounding box\n */\nexport function mergeRects(rects: Rectangle[]): Rectangle | null {\n  if (rects.length === 0) return null;\n  if (rects.length === 1) return rects[0];\n\n  let minX = Infinity;\n  let minY = Infinity;\n  let maxX = -Infinity;\n  let maxY = -Infinity;\n\n  for (const rect of rects) {\n    minX = Math.min(minX, rect.x);\n    minY = Math.min(minY, rect.y);\n    maxX = Math.max(maxX, rect.x + rect.width);\n    maxY = Math.max(maxY, rect.y + rect.height);\n  }\n\n  return {\n    x: minX,\n    y: minY,\n    width: maxX - minX,\n    height: maxY - minY,\n  };\n}\n\n/**\n * Create a canvas font string from font style\n */\nexport function createFontString(\n  fontSize: number,\n  fontWeight: string | number,\n  fontFamily: string\n): string {\n  return `${fontWeight} ${fontSize}px ${fontFamily}`;\n}\n\n/**\n * Walk tree depth-first\n */\nexport function walkTree(node: VirtualNode, callback: (node: VirtualNode) => void): void {\n  callback(node);\n  for (const child of node.children) {\n    walkTree(child, callback);\n  }\n}\n\n/**\n * Find node by ID in tree\n */\nexport function findNodeById(root: VirtualNode, id: string): VirtualNode | null {\n  if (root.id === id) return root;\n\n  for (const child of root.children) {\n    const found = findNodeById(child, id);\n    if (found) return found;\n  }\n\n  return null;\n}\n\n/**\n * Get absolute bounds of node (including transformations)\n */\nexport function getAbsoluteBounds(node: VirtualNode): Rectangle | null {\n  if (!node.layout) return null;\n\n  let x = node.layout.x;\n  let y = node.layout.y;\n\n  // Walk up tree to accumulate offsets\n  let current = node.parent;\n  while (current && current.layout) {\n    x += current.layout.contentX;\n    y += current.layout.contentY;\n    current = current.parent;\n  }\n\n  return {\n    x,\n    y,\n    width: node.layout.width,\n    height: node.layout.height,\n  };\n}\n\n\n\n\n\n\n\n\n\n\n\n"
+  ],
+  "mappings": "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",
+  "debugId": "2ACA4B13CBD0C32B64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/advanced-layout.js

@@ -0,0 +1,111 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/advanced-layout.ts
+var exports_advanced_layout = {};
+__export(exports_advanced_layout, {
+  advancedLayoutHandlers: () => advancedLayoutHandlers
+});
+var advancedLayoutHandlers;
+var init_advanced_layout = __esm(() => {
+  advancedLayoutHandlers = {
+    flexDirection: (el, value) => {
+      el.style.flexDirection = String(value);
+    },
+    flexWrap: (el, value) => {
+      el.style.flexWrap = String(value);
+    },
+    flexBasis: (el, value) => {
+      el.style.flexBasis = typeof value === "number" ? `${value}px` : String(value);
+    },
+    justifyContent: (el, value) => {
+      el.style.justifyContent = String(value);
+    },
+    alignItems: (el, value) => {
+      el.style.alignItems = String(value);
+    },
+    alignContent: (el, value) => {
+      el.style.alignContent = String(value);
+    },
+    alignSelf: (el, value) => {
+      el.style.alignSelf = String(value);
+    },
+    order: (el, value) => {
+      el.style.order = String(value);
+    },
+    gridTemplateColumns: (el, value) => {
+      el.style.gridTemplateColumns = String(value);
+    },
+    gridTemplateRows: (el, value) => {
+      el.style.gridTemplateRows = String(value);
+    },
+    gridTemplateAreas: (el, value) => {
+      el.style.gridTemplateAreas = String(value);
+    },
+    gridColumn: (el, value) => {
+      el.style.gridColumn = String(value);
+    },
+    gridRow: (el, value) => {
+      el.style.gridRow = String(value);
+    },
+    gridArea: (el, value) => {
+      el.style.gridArea = String(value);
+    },
+    gridAutoFlow: (el, value) => {
+      el.style.gridAutoFlow = String(value);
+    },
+    gridAutoColumns: (el, value) => {
+      el.style.gridAutoColumns = String(value);
+    },
+    gridAutoRows: (el, value) => {
+      el.style.gridAutoRows = String(value);
+    },
+    rowGap: (el, value) => {
+      el.style.rowGap = typeof value === "number" ? `${value}px` : String(value);
+    },
+    columnGap: (el, value) => {
+      el.style.columnGap = typeof value === "number" ? `${value}px` : String(value);
+    },
+    placeItems: (el, value) => {
+      el.style.placeItems = String(value);
+    },
+    placeContent: (el, value) => {
+      el.style.placeContent = String(value);
+    },
+    placeSelf: (el, value) => {
+      el.style.placeSelf = String(value);
+    },
+    position: (el, value) => {
+      el.style.position = String(value);
+    },
+    top: (el, value) => {
+      el.style.top = typeof value === "number" ? `${value}px` : String(value);
+    },
+    right: (el, value) => {
+      el.style.right = typeof value === "number" ? `${value}px` : String(value);
+    },
+    bottom: (el, value) => {
+      el.style.bottom = typeof value === "number" ? `${value}px` : String(value);
+    },
+    left: (el, value) => {
+      el.style.left = typeof value === "number" ? `${value}px` : String(value);
+    },
+    inset: (el, value) => {
+      el.style.inset = typeof value === "number" ? `${value}px` : String(value);
+    },
+    zIndex: (el, value) => {
+      el.style.zIndex = String(value);
+    }
+  };
+});
+init_advanced_layout();
+
+export {
+  advancedLayoutHandlers
+};
+
+export { exports_advanced_layout, init_advanced_layout };
+
+//# debugId=ADBEE100732B8D4464756E2164756E21

package/dist/src/dom/applicators/advanced-layout.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/advanced-layout.ts"],
+  "sourcesContent": [
+    "/**\n * Advanced Layout Applicators (Flexbox, Grid, Positioning)\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const advancedLayoutHandlers: Record<string, ApplicatorHandler> = {\n  // Flexbox properties\n  flexDirection: (el, value) => {\n    el.style.flexDirection = String(value);\n  },\n\n  flexWrap: (el, value) => {\n    el.style.flexWrap = String(value);\n  },\n\n  flexBasis: (el, value) => {\n    el.style.flexBasis = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  justifyContent: (el, value) => {\n    el.style.justifyContent = String(value);\n  },\n\n  alignItems: (el, value) => {\n    el.style.alignItems = String(value);\n  },\n\n  alignContent: (el, value) => {\n    el.style.alignContent = String(value);\n  },\n\n  alignSelf: (el, value) => {\n    el.style.alignSelf = String(value);\n  },\n\n  order: (el, value) => {\n    el.style.order = String(value);\n  },\n\n  // Grid properties\n  gridTemplateColumns: (el, value) => {\n    el.style.gridTemplateColumns = String(value);\n  },\n\n  gridTemplateRows: (el, value) => {\n    el.style.gridTemplateRows = String(value);\n  },\n\n  gridTemplateAreas: (el, value) => {\n    el.style.gridTemplateAreas = String(value);\n  },\n\n  gridColumn: (el, value) => {\n    el.style.gridColumn = String(value);\n  },\n\n  gridRow: (el, value) => {\n    el.style.gridRow = String(value);\n  },\n\n  gridArea: (el, value) => {\n    el.style.gridArea = String(value);\n  },\n\n  gridAutoFlow: (el, value) => {\n    el.style.gridAutoFlow = String(value);\n  },\n\n  gridAutoColumns: (el, value) => {\n    el.style.gridAutoColumns = String(value);\n  },\n\n  gridAutoRows: (el, value) => {\n    el.style.gridAutoRows = String(value);\n  },\n\n  rowGap: (el, value) => {\n    el.style.rowGap = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  columnGap: (el, value) => {\n    el.style.columnGap = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  placeItems: (el, value) => {\n    el.style.placeItems = String(value);\n  },\n\n  placeContent: (el, value) => {\n    el.style.placeContent = String(value);\n  },\n\n  placeSelf: (el, value) => {\n    el.style.placeSelf = String(value);\n  },\n\n  // Positioning\n  position: (el, value) => {\n    el.style.position = String(value);\n  },\n\n  top: (el, value) => {\n    el.style.top = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  right: (el, value) => {\n    el.style.right = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  bottom: (el, value) => {\n    el.style.bottom = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  left: (el, value) => {\n    el.style.left = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  inset: (el, value) => {\n    el.style.inset = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  zIndex: (el, value) => {\n    el.style.zIndex = String(value);\n  },\n};\n\n\n"
+  ],
+  "mappings": "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",
+  "debugId": "ADBEE100732B8D4464756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/background.js

@@ -0,0 +1,54 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/background.ts
+var exports_background = {};
+__export(exports_background, {
+  backgroundHandlers: () => backgroundHandlers
+});
+var backgroundHandlers;
+var init_background = __esm(() => {
+  backgroundHandlers = {
+    backgroundImage: (el, value) => {
+      el.style.backgroundImage = String(value);
+    },
+    backgroundSize: (el, value) => {
+      el.style.backgroundSize = String(value);
+    },
+    backgroundPosition: (el, value) => {
+      el.style.backgroundPosition = String(value);
+    },
+    backgroundRepeat: (el, value) => {
+      el.style.backgroundRepeat = String(value);
+    },
+    backgroundAttachment: (el, value) => {
+      el.style.backgroundAttachment = String(value);
+    },
+    backgroundClip: (el, value) => {
+      el.style.backgroundClip = String(value);
+    },
+    backgroundOrigin: (el, value) => {
+      el.style.backgroundOrigin = String(value);
+    },
+    linearGradient: (el, value) => {
+      el.style.backgroundImage = `linear-gradient(${value})`;
+    },
+    radialGradient: (el, value) => {
+      el.style.backgroundImage = `radial-gradient(${value})`;
+    },
+    conicGradient: (el, value) => {
+      el.style.backgroundImage = `conic-gradient(${value})`;
+    }
+  };
+});
+init_background();
+
+export {
+  backgroundHandlers
+};
+
+export { exports_background, init_background };
+
+//# debugId=5E76F9BB54DEF5E264756E2164756E21

package/dist/src/dom/applicators/background.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/background.ts"],
+  "sourcesContent": [
+    "/**\n * Background Applicators\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const backgroundHandlers: Record<string, ApplicatorHandler> = {\n  backgroundImage: (el, value) => {\n    el.style.backgroundImage = String(value);\n  },\n\n  backgroundSize: (el, value) => {\n    el.style.backgroundSize = String(value);\n  },\n\n  backgroundPosition: (el, value) => {\n    el.style.backgroundPosition = String(value);\n  },\n\n  backgroundRepeat: (el, value) => {\n    el.style.backgroundRepeat = String(value);\n  },\n\n  backgroundAttachment: (el, value) => {\n    el.style.backgroundAttachment = String(value);\n  },\n\n  backgroundClip: (el, value) => {\n    el.style.backgroundClip = String(value);\n  },\n\n  backgroundOrigin: (el, value) => {\n    el.style.backgroundOrigin = String(value);\n  },\n\n  // Gradient helpers\n  linearGradient: (el, value) => {\n    el.style.backgroundImage = `linear-gradient(${value})`;\n  },\n\n  radialGradient: (el, value) => {\n    el.style.backgroundImage = `radial-gradient(${value})`;\n  },\n\n  conicGradient: (el, value) => {\n    el.style.backgroundImage = `conic-gradient(${value})`;\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,uBAAwD;AAAA,IACnE,iBAAiB,CAAC,IAAI,UAAU;AAAA,MAC9B,GAAG,MAAM,kBAAkB,OAAO,KAAK;AAAA;AAAA,IAGzC,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,iBAAiB,OAAO,KAAK;AAAA;AAAA,IAGxC,oBAAoB,CAAC,IAAI,UAAU;AAAA,MACjC,GAAG,MAAM,qBAAqB,OAAO,KAAK;AAAA;AAAA,IAG5C,kBAAkB,CAAC,IAAI,UAAU;AAAA,MAC/B,GAAG,MAAM,mBAAmB,OAAO,KAAK;AAAA;AAAA,IAG1C,sBAAsB,CAAC,IAAI,UAAU;AAAA,MACnC,GAAG,MAAM,uBAAuB,OAAO,KAAK;AAAA;AAAA,IAG9C,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,iBAAiB,OAAO,KAAK;AAAA;AAAA,IAGxC,kBAAkB,CAAC,IAAI,UAAU;AAAA,MAC/B,GAAG,MAAM,mBAAmB,OAAO,KAAK;AAAA;AAAA,IAI1C,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,kBAAkB,mBAAmB;AAAA;AAAA,IAGhD,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,kBAAkB,mBAAmB;AAAA;AAAA,IAGhD,eAAe,CAAC,IAAI,UAAU;AAAA,MAC5B,GAAG,MAAM,kBAAkB,kBAAkB;AAAA;AAAA,EAEjD;AAAA;",
+  "debugId": "5E76F9BB54DEF5E264756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/border.js

@@ -0,0 +1,33 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/border.ts
+var exports_border = {};
+__export(exports_border, {
+  borderHandlers: () => borderHandlers
+});
+var borderHandlers;
+var init_border = __esm(() => {
+  borderHandlers = {
+    borderWidth: (el, value) => {
+      el.style.borderWidth = typeof value === "number" ? `${value}px` : String(value);
+    },
+    borderStyle: (el, value) => {
+      el.style.borderStyle = String(value);
+    },
+    borderRadius: (el, value) => {
+      el.style.borderRadius = typeof value === "number" ? `${value}px` : String(value);
+    }
+  };
+});
+init_border();
+
+export {
+  borderHandlers
+};
+
+export { exports_border, init_border };
+
+//# debugId=4DD8111342D6DA7B64756E2164756E21

package/dist/src/dom/applicators/border.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/border.ts"],
+  "sourcesContent": [
+    "/**\n * Border Applicators\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const borderHandlers: Record<string, ApplicatorHandler> = {\n  borderWidth: (el, value) => {\n    el.style.borderWidth = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  borderStyle: (el, value) => {\n    el.style.borderStyle = String(value);\n  },\n\n  borderRadius: (el, value) => {\n    el.style.borderRadius = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,mBAAoD;AAAA,IAC/D,aAAa,CAAC,IAAI,UAAU;AAAA,MAC1B,GAAG,MAAM,cAAc,OAAO,UAAU,WAAW,GAAG,YAAY,OAAO,KAAK;AAAA;AAAA,IAGhF,aAAa,CAAC,IAAI,UAAU;AAAA,MAC1B,GAAG,MAAM,cAAc,OAAO,KAAK;AAAA;AAAA,IAGrC,cAAc,CAAC,IAAI,UAAU;AAAA,MAC3B,GAAG,MAAM,eAAe,OAAO,UAAU,WAAW,GAAG,YAAY,OAAO,KAAK;AAAA;AAAA,EAEnF;AAAA;",
+  "debugId": "4DD8111342D6DA7B64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/color.js

@@ -0,0 +1,36 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/color.ts
+var exports_color = {};
+__export(exports_color, {
+  colorHandlers: () => colorHandlers
+});
+var colorHandlers;
+var init_color = __esm(() => {
+  colorHandlers = {
+    color: (el, value) => {
+      el.style.color = String(value);
+    },
+    backgroundColor: (el, value) => {
+      el.style.backgroundColor = String(value);
+    },
+    borderColor: (el, value) => {
+      el.style.borderColor = String(value);
+    },
+    opacity: (el, value) => {
+      el.style.opacity = String(value);
+    }
+  };
+});
+init_color();
+
+export {
+  colorHandlers
+};
+
+export { exports_color, init_color };
+
+//# debugId=A4A9421169CA693964756E2164756E21

package/dist/src/dom/applicators/color.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/color.ts"],
+  "sourcesContent": [
+    "/**\n * Color Applicators\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const colorHandlers: Record<string, ApplicatorHandler> = {\n  color: (el, value) => {\n    el.style.color = String(value);\n  },\n\n  backgroundColor: (el, value) => {\n    el.style.backgroundColor = String(value);\n  },\n\n  borderColor: (el, value) => {\n    el.style.borderColor = String(value);\n  },\n\n  opacity: (el, value) => {\n    el.style.opacity = String(value);\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,kBAAmD;AAAA,IAC9D,OAAO,CAAC,IAAI,UAAU;AAAA,MACpB,GAAG,MAAM,QAAQ,OAAO,KAAK;AAAA;AAAA,IAG/B,iBAAiB,CAAC,IAAI,UAAU;AAAA,MAC9B,GAAG,MAAM,kBAAkB,OAAO,KAAK;AAAA;AAAA,IAGzC,aAAa,CAAC,IAAI,UAAU;AAAA,MAC1B,GAAG,MAAM,cAAc,OAAO,KAAK;AAAA;AAAA,IAGrC,SAAS,CAAC,IAAI,UAAU;AAAA,MACtB,GAAG,MAAM,UAAU,OAAO,KAAK;AAAA;AAAA,EAEnC;AAAA;",
+  "debugId": "A4A9421169CA693964756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/display.js

@@ -0,0 +1,57 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/display.ts
+var exports_display = {};
+__export(exports_display, {
+  displayHandlers: () => displayHandlers
+});
+var displayHandlers;
+var init_display = __esm(() => {
+  displayHandlers = {
+    display: (el, value) => {
+      el.style.display = String(value);
+    },
+    visibility: (el, value) => {
+      el.style.visibility = String(value);
+    },
+    overflowX: (el, value) => {
+      el.style.overflowX = String(value);
+    },
+    overflowY: (el, value) => {
+      el.style.overflowY = String(value);
+    },
+    pointerEvents: (el, value) => {
+      el.style.pointerEvents = String(value);
+    },
+    userSelect: (el, value) => {
+      el.style.userSelect = String(value);
+    },
+    resize: (el, value) => {
+      el.style.resize = String(value);
+    },
+    boxSizing: (el, value) => {
+      el.style.boxSizing = String(value);
+    },
+    aspectRatio: (el, value) => {
+      el.style.aspectRatio = String(value);
+    },
+    objectFit: (el, value) => {
+      el.style.objectFit = String(value);
+    },
+    objectPosition: (el, value) => {
+      el.style.objectPosition = String(value);
+    }
+  };
+});
+init_display();
+
+export {
+  displayHandlers
+};
+
+export { exports_display, init_display };
+
+//# debugId=07E4BDF30355D41264756E2164756E21

package/dist/src/dom/applicators/display.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/display.ts"],
+  "sourcesContent": [
+    "/**\n * Display and Visibility Applicators\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const displayHandlers: Record<string, ApplicatorHandler> = {\n  display: (el, value) => {\n    el.style.display = String(value);\n  },\n\n  visibility: (el, value) => {\n    el.style.visibility = String(value);\n  },\n\n  overflowX: (el, value) => {\n    el.style.overflowX = String(value);\n  },\n\n  overflowY: (el, value) => {\n    el.style.overflowY = String(value);\n  },\n\n  pointerEvents: (el, value) => {\n    el.style.pointerEvents = String(value);\n  },\n\n  userSelect: (el, value) => {\n    el.style.userSelect = String(value);\n  },\n\n  resize: (el, value) => {\n    el.style.resize = String(value);\n  },\n\n  boxSizing: (el, value) => {\n    el.style.boxSizing = String(value);\n  },\n\n  // Sizing helpers\n  aspectRatio: (el, value) => {\n    el.style.aspectRatio = String(value);\n  },\n\n  objectFit: (el, value) => {\n    el.style.objectFit = String(value);\n  },\n\n  objectPosition: (el, value) => {\n    el.style.objectPosition = String(value);\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,oBAAqD;AAAA,IAChE,SAAS,CAAC,IAAI,UAAU;AAAA,MACtB,GAAG,MAAM,UAAU,OAAO,KAAK;AAAA;AAAA,IAGjC,YAAY,CAAC,IAAI,UAAU;AAAA,MACzB,GAAG,MAAM,aAAa,OAAO,KAAK;AAAA;AAAA,IAGpC,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,IAGnC,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,IAGnC,eAAe,CAAC,IAAI,UAAU;AAAA,MAC5B,GAAG,MAAM,gBAAgB,OAAO,KAAK;AAAA;AAAA,IAGvC,YAAY,CAAC,IAAI,UAAU;AAAA,MACzB,GAAG,MAAM,aAAa,OAAO,KAAK;AAAA;AAAA,IAGpC,QAAQ,CAAC,IAAI,UAAU;AAAA,MACrB,GAAG,MAAM,SAAS,OAAO,KAAK;AAAA;AAAA,IAGhC,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,IAInC,aAAa,CAAC,IAAI,UAAU;AAAA,MAC1B,GAAG,MAAM,cAAc,OAAO,KAAK;AAAA;AAAA,IAGrC,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,IAGnC,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,iBAAiB,OAAO,KAAK;AAAA;AAAA,EAE1C;AAAA;",
+  "debugId": "07E4BDF30355D41264756E2164756E21",
+  "names": []
+}

package/dist/src/dom/applicators/effects.js

@@ -0,0 +1,89 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/applicators/effects.ts
+var exports_effects = {};
+__export(exports_effects, {
+  effectsHandlers: () => effectsHandlers
+});
+var effectsHandlers;
+var init_effects = __esm(() => {
+  effectsHandlers = {
+    boxShadow: (el, value) => {
+      el.style.boxShadow = String(value);
+    },
+    textShadow: (el, value) => {
+      el.style.textShadow = String(value);
+    },
+    filter: (el, value) => {
+      el.style.filter = String(value);
+    },
+    backdropFilter: (el, value) => {
+      el.style.backdropFilter = String(value);
+    },
+    blur: (el, value) => {
+      const val = typeof value === "number" ? `${value}px` : String(value);
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} blur(${val})` : `blur(${val})`;
+    },
+    brightness: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} brightness(${value})` : `brightness(${value})`;
+    },
+    contrast: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} contrast(${value})` : `contrast(${value})`;
+    },
+    grayscale: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} grayscale(${value})` : `grayscale(${value})`;
+    },
+    hueRotate: (el, value) => {
+      const val = String(value);
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} hue-rotate(${val})` : `hue-rotate(${val})`;
+    },
+    invert: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} invert(${value})` : `invert(${value})`;
+    },
+    saturate: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} saturate(${value})` : `saturate(${value})`;
+    },
+    sepia: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} sepia(${value})` : `sepia(${value})`;
+    },
+    dropShadow: (el, value) => {
+      const current = el.style.filter || "";
+      el.style.filter = current ? `${current} drop-shadow(${value})` : `drop-shadow(${value})`;
+    },
+    mixBlendMode: (el, value) => {
+      el.style.mixBlendMode = String(value);
+    },
+    backgroundBlendMode: (el, value) => {
+      el.style.backgroundBlendMode = String(value);
+    },
+    clipPath: (el, value) => {
+      el.style.clipPath = String(value);
+    },
+    mask: (el, value) => {
+      el.style.mask = String(value);
+    },
+    maskImage: (el, value) => {
+      el.style.maskImage = String(value);
+    }
+  };
+});
+init_effects();
+
+export {
+  effectsHandlers
+};
+
+export { exports_effects, init_effects };
+
+//# debugId=100BE0B731B0070664756E2164756E21

package/dist/src/dom/applicators/effects.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/applicators/effects.ts"],
+  "sourcesContent": [
+    "/**\n * Visual Effects Applicators (Shadows, Filters, Blend Modes)\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\nexport const effectsHandlers: Record<string, ApplicatorHandler> = {\n  // Shadow effects\n  boxShadow: (el, value) => {\n    el.style.boxShadow = String(value);\n  },\n\n  textShadow: (el, value) => {\n    el.style.textShadow = String(value);\n  },\n\n  // Filter effects\n  filter: (el, value) => {\n    el.style.filter = String(value);\n  },\n\n  backdropFilter: (el, value) => {\n    el.style.backdropFilter = String(value);\n  },\n\n  // Individual filter functions\n  blur: (el, value) => {\n    const val = typeof value === \"number\" ? `${value}px` : String(value);\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} blur(${val})` : `blur(${val})`;\n  },\n\n  brightness: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} brightness(${value})` : `brightness(${value})`;\n  },\n\n  contrast: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} contrast(${value})` : `contrast(${value})`;\n  },\n\n  grayscale: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} grayscale(${value})` : `grayscale(${value})`;\n  },\n\n  hueRotate: (el, value) => {\n    const val = String(value);\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} hue-rotate(${val})` : `hue-rotate(${val})`;\n  },\n\n  invert: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} invert(${value})` : `invert(${value})`;\n  },\n\n  saturate: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} saturate(${value})` : `saturate(${value})`;\n  },\n\n  sepia: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} sepia(${value})` : `sepia(${value})`;\n  },\n\n  dropShadow: (el, value) => {\n    const current = el.style.filter || \"\";\n    el.style.filter = current ? `${current} drop-shadow(${value})` : `drop-shadow(${value})`;\n  },\n\n  // Blend modes\n  mixBlendMode: (el, value) => {\n    el.style.mixBlendMode = String(value);\n  },\n\n  backgroundBlendMode: (el, value) => {\n    el.style.backgroundBlendMode = String(value);\n  },\n\n  // Clip and mask\n  clipPath: (el, value) => {\n    el.style.clipPath = String(value);\n  },\n\n  mask: (el, value) => {\n    el.style.mask = String(value);\n  },\n\n  maskImage: (el, value) => {\n    el.style.maskImage = String(value);\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,oBAAqD;AAAA,IAEhE,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,IAGnC,YAAY,CAAC,IAAI,UAAU;AAAA,MACzB,GAAG,MAAM,aAAa,OAAO,KAAK;AAAA;AAAA,IAIpC,QAAQ,CAAC,IAAI,UAAU;AAAA,MACrB,GAAG,MAAM,SAAS,OAAO,KAAK;AAAA;AAAA,IAGhC,gBAAgB,CAAC,IAAI,UAAU;AAAA,MAC7B,GAAG,MAAM,iBAAiB,OAAO,KAAK;AAAA;AAAA,IAIxC,MAAM,CAAC,IAAI,UAAU;AAAA,MACnB,MAAM,MAAM,OAAO,UAAU,WAAW,GAAG,YAAY,OAAO,KAAK;AAAA,MACnE,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,gBAAgB,SAAS,QAAQ;AAAA;AAAA,IAGlE,YAAY,CAAC,IAAI,UAAU;AAAA,MACzB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,sBAAsB,WAAW,cAAc;AAAA;AAAA,IAGhF,UAAU,CAAC,IAAI,UAAU;AAAA,MACvB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,oBAAoB,WAAW,YAAY;AAAA;AAAA,IAG5E,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,qBAAqB,WAAW,aAAa;AAAA;AAAA,IAG9E,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,MAAM,MAAM,OAAO,KAAK;AAAA,MACxB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,sBAAsB,SAAS,cAAc;AAAA;AAAA,IAG9E,QAAQ,CAAC,IAAI,UAAU;AAAA,MACrB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,kBAAkB,WAAW,UAAU;AAAA;AAAA,IAGxE,UAAU,CAAC,IAAI,UAAU;AAAA,MACvB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,oBAAoB,WAAW,YAAY;AAAA;AAAA,IAG5E,OAAO,CAAC,IAAI,UAAU;AAAA,MACpB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,iBAAiB,WAAW,SAAS;AAAA;AAAA,IAGtE,YAAY,CAAC,IAAI,UAAU;AAAA,MACzB,MAAM,UAAU,GAAG,MAAM,UAAU;AAAA,MACnC,GAAG,MAAM,SAAS,UAAU,GAAG,uBAAuB,WAAW,eAAe;AAAA;AAAA,IAIlF,cAAc,CAAC,IAAI,UAAU;AAAA,MAC3B,GAAG,MAAM,eAAe,OAAO,KAAK;AAAA;AAAA,IAGtC,qBAAqB,CAAC,IAAI,UAAU;AAAA,MAClC,GAAG,MAAM,sBAAsB,OAAO,KAAK;AAAA;AAAA,IAI7C,UAAU,CAAC,IAAI,UAAU;AAAA,MACvB,GAAG,MAAM,WAAW,OAAO,KAAK;AAAA;AAAA,IAGlC,MAAM,CAAC,IAAI,UAAU;AAAA,MACnB,GAAG,MAAM,OAAO,OAAO,KAAK;AAAA;AAAA,IAG9B,WAAW,CAAC,IAAI,UAAU;AAAA,MACxB,GAAG,MAAM,YAAY,OAAO,KAAK;AAAA;AAAA,EAErC;AAAA;",
+  "debugId": "100BE0B731B0070664756E2164756E21",
+  "names": []
+}