@hypen-space/web 0.2.0

package/dist/src/dom/components/center.js

@@ -0,0 +1,32 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/center.ts
+var exports_center = {};
+__export(exports_center, {
+  centerHandler: () => centerHandler
+});
+var centerHandler;
+var init_center = __esm(() => {
+  centerHandler = {
+    create() {
+      const el = document.createElement("div");
+      el.style.display = "flex";
+      el.style.alignItems = "center";
+      el.style.justifyContent = "center";
+      el.dataset.hypenType = "center";
+      return el;
+    }
+  };
+});
+init_center();
+
+export {
+  centerHandler
+};
+
+export { exports_center, init_center };
+
+//# debugId=7FC1DBC55B39CF4564756E2164756E21

package/dist/src/dom/components/center.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/center.ts"],
+  "sourcesContent": [
+    "/**\n * Center Component - Centers content\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const centerHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"div\");\n    el.style.display = \"flex\";\n    el.style.alignItems = \"center\";\n    el.style.justifyContent = \"center\";\n    el.dataset.hypenType = \"center\";\n    return el;\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,kBAAkC;AAAA,IAC7C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,KAAK;AAAA,MACvC,GAAG,MAAM,UAAU;AAAA,MACnB,GAAG,MAAM,aAAa;AAAA,MACtB,GAAG,MAAM,iBAAiB;AAAA,MAC1B,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,EAEX;AAAA;",
+  "debugId": "7FC1DBC55B39CF4564756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/checkbox.js

@@ -0,0 +1,54 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/checkbox.ts
+var exports_checkbox = {};
+__export(exports_checkbox, {
+  checkboxHandler: () => checkboxHandler
+});
+var checkboxHandler;
+var init_checkbox = __esm(() => {
+  checkboxHandler = {
+    create() {
+      const wrapper = document.createElement("label");
+      wrapper.dataset.hypenType = "checkbox";
+      wrapper.style.display = "inline-flex";
+      wrapper.style.alignItems = "center";
+      wrapper.style.gap = "8px";
+      wrapper.style.cursor = "pointer";
+      const input = document.createElement("input");
+      input.type = "checkbox";
+      input.dataset.hypenCheckbox = "true";
+      wrapper.appendChild(input);
+      return wrapper;
+    },
+    applyProps(el, props) {
+      const input = el.querySelector('input[type="checkbox"]');
+      if (!input)
+        return;
+      if (props.checked !== undefined) {
+        input.checked = Boolean(props.checked);
+      }
+      if (props.disabled !== undefined) {
+        input.disabled = Boolean(props.disabled);
+      }
+      const label = props["0"] || props.label;
+      if (label !== undefined) {
+        const textNodes = Array.from(el.childNodes).filter((node) => node.nodeType === Node.TEXT_NODE);
+        textNodes.forEach((node) => node.remove());
+        el.appendChild(document.createTextNode(String(label)));
+      }
+    }
+  };
+});
+init_checkbox();
+
+export {
+  checkboxHandler
+};
+
+export { exports_checkbox, init_checkbox };
+
+//# debugId=1AC390FE9F560E8F64756E2164756E21

package/dist/src/dom/components/checkbox.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/checkbox.ts"],
+  "sourcesContent": [
+    "/**\n * Checkbox Component\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const checkboxHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const wrapper = document.createElement(\"label\");\n    wrapper.dataset.hypenType = \"checkbox\";\n    wrapper.style.display = \"inline-flex\";\n    wrapper.style.alignItems = \"center\";\n    wrapper.style.gap = \"8px\";\n    wrapper.style.cursor = \"pointer\";\n\n    const input = document.createElement(\"input\");\n    input.type = \"checkbox\";\n    input.dataset.hypenCheckbox = \"true\";\n    \n    wrapper.appendChild(input);\n    \n    return wrapper;\n  },\n\n  applyProps(el: HTMLElement, props: Record<string, any>): void {\n    const input = el.querySelector('input[type=\"checkbox\"]') as HTMLInputElement;\n    if (!input) return;\n\n    // Checked state\n    if (props.checked !== undefined) {\n      input.checked = Boolean(props.checked);\n    }\n\n    // Disabled\n    if (props.disabled !== undefined) {\n      input.disabled = Boolean(props.disabled);\n    }\n\n    // Label text\n    const label = props[\"0\"] || props.label;\n    if (label !== undefined) {\n      // Remove existing text node if any\n      const textNodes = Array.from(el.childNodes).filter(\n        node => node.nodeType === Node.TEXT_NODE\n      );\n      textNodes.forEach(node => node.remove());\n      \n      // Add new label text\n      el.appendChild(document.createTextNode(String(label)));\n    }\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,oBAAoC;AAAA,IAC/C,MAAM,GAAgB;AAAA,MACpB,MAAM,UAAU,SAAS,cAAc,OAAO;AAAA,MAC9C,QAAQ,QAAQ,YAAY;AAAA,MAC5B,QAAQ,MAAM,UAAU;AAAA,MACxB,QAAQ,MAAM,aAAa;AAAA,MAC3B,QAAQ,MAAM,MAAM;AAAA,MACpB,QAAQ,MAAM,SAAS;AAAA,MAEvB,MAAM,QAAQ,SAAS,cAAc,OAAO;AAAA,MAC5C,MAAM,OAAO;AAAA,MACb,MAAM,QAAQ,gBAAgB;AAAA,MAE9B,QAAQ,YAAY,KAAK;AAAA,MAEzB,OAAO;AAAA;AAAA,IAGT,UAAU,CAAC,IAAiB,OAAkC;AAAA,MAC5D,MAAM,QAAQ,GAAG,cAAc,wBAAwB;AAAA,MACvD,IAAI,CAAC;AAAA,QAAO;AAAA,MAGZ,IAAI,MAAM,YAAY,WAAW;AAAA,QAC/B,MAAM,UAAU,QAAQ,MAAM,OAAO;AAAA,MACvC;AAAA,MAGA,IAAI,MAAM,aAAa,WAAW;AAAA,QAChC,MAAM,WAAW,QAAQ,MAAM,QAAQ;AAAA,MACzC;AAAA,MAGA,MAAM,QAAQ,MAAM,QAAQ,MAAM;AAAA,MAClC,IAAI,UAAU,WAAW;AAAA,QAEvB,MAAM,YAAY,MAAM,KAAK,GAAG,UAAU,EAAE,OAC1C,UAAQ,KAAK,aAAa,KAAK,SACjC;AAAA,QACA,UAAU,QAAQ,UAAQ,KAAK,OAAO,CAAC;AAAA,QAGvC,GAAG,YAAY,SAAS,eAAe,OAAO,KAAK,CAAC,CAAC;AAAA,MACvD;AAAA;AAAA,EAEJ;AAAA;",
+  "debugId": "1AC390FE9F560E8F64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/column.js

@@ -0,0 +1,31 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/column.ts
+var exports_column = {};
+__export(exports_column, {
+  columnHandler: () => columnHandler
+});
+var columnHandler;
+var init_column = __esm(() => {
+  columnHandler = {
+    create() {
+      const el = document.createElement("div");
+      el.style.display = "flex";
+      el.style.flexDirection = "column";
+      el.dataset.hypenType = "column";
+      return el;
+    }
+  };
+});
+init_column();
+
+export {
+  columnHandler
+};
+
+export { exports_column, init_column };
+
+//# debugId=9DD121C0F8A1BFDD64756E2164756E21

package/dist/src/dom/components/column.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/column.ts"],
+  "sourcesContent": [
+    "/**\n * Column Component - Vertical Stack\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const columnHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"div\");\n    el.style.display = \"flex\";\n    el.style.flexDirection = \"column\";\n    el.dataset.hypenType = \"column\";\n    return el;\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,kBAAkC;AAAA,IAC7C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,KAAK;AAAA,MACvC,GAAG,MAAM,UAAU;AAAA,MACnB,GAAG,MAAM,gBAAgB;AAAA,MACzB,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,EAEX;AAAA;",
+  "debugId": "9DD121C0F8A1BFDD64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/container.js

@@ -0,0 +1,29 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/container.ts
+var exports_container = {};
+__export(exports_container, {
+  containerHandler: () => containerHandler
+});
+var containerHandler;
+var init_container = __esm(() => {
+  containerHandler = {
+    create() {
+      const el = document.createElement("div");
+      el.dataset.hypenType = "container";
+      return el;
+    }
+  };
+});
+init_container();
+
+export {
+  containerHandler
+};
+
+export { exports_container, init_container };
+
+//# debugId=79B298802801EA8F64756E2164756E21

package/dist/src/dom/components/container.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/container.ts"],
+  "sourcesContent": [
+    "/**\n * Container/Box Component\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const containerHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"div\");\n    el.dataset.hypenType = \"container\";\n    return el;\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,qBAAqC;AAAA,IAChD,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,KAAK;AAAA,MACvC,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,EAEX;AAAA;",
+  "debugId": "79B298802801EA8F64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/divider.js

@@ -0,0 +1,45 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/divider.ts
+var exports_divider = {};
+__export(exports_divider, {
+  dividerHandler: () => dividerHandler
+});
+var dividerHandler;
+var init_divider = __esm(() => {
+  dividerHandler = {
+    create() {
+      const el = document.createElement("hr");
+      el.dataset.hypenType = "divider";
+      el.style.border = "none";
+      el.style.borderTop = "1px solid #e0e0e0";
+      el.style.margin = "0";
+      return el;
+    },
+    applyProps(el, props) {
+      if (props.thickness !== undefined) {
+        const thickness = typeof props.thickness === "number" ? `${props.thickness}px` : String(props.thickness);
+        el.style.borderTopWidth = thickness;
+      }
+      if (props.orientation === "vertical") {
+        el.style.borderTop = "none";
+        el.style.borderLeft = "1px solid #e0e0e0";
+        el.style.height = "100%";
+        el.style.width = "0";
+        el.style.display = "inline-block";
+      }
+    }
+  };
+});
+init_divider();
+
+export {
+  dividerHandler
+};
+
+export { exports_divider, init_divider };
+
+//# debugId=2257FF52F429686364756E2164756E21

package/dist/src/dom/components/divider.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/divider.ts"],
+  "sourcesContent": [
+    "/**\n * Divider Component - Visual separator\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const dividerHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"hr\");\n    el.dataset.hypenType = \"divider\";\n    el.style.border = \"none\";\n    el.style.borderTop = \"1px solid #e0e0e0\";\n    el.style.margin = \"0\";\n    return el;\n  },\n\n  applyProps(el: HTMLElement, props: Record<string, any>): void {\n    // Thickness\n    if (props.thickness !== undefined) {\n      const thickness = typeof props.thickness === \"number\" \n        ? `${props.thickness}px` \n        : String(props.thickness);\n      el.style.borderTopWidth = thickness;\n    }\n\n    // Orientation\n    if (props.orientation === \"vertical\") {\n      el.style.borderTop = \"none\";\n      el.style.borderLeft = \"1px solid #e0e0e0\";\n      el.style.height = \"100%\";\n      el.style.width = \"0\";\n      el.style.display = \"inline-block\";\n    }\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,mBAAmC;AAAA,IAC9C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,IAAI;AAAA,MACtC,GAAG,QAAQ,YAAY;AAAA,MACvB,GAAG,MAAM,SAAS;AAAA,MAClB,GAAG,MAAM,YAAY;AAAA,MACrB,GAAG,MAAM,SAAS;AAAA,MAClB,OAAO;AAAA;AAAA,IAGT,UAAU,CAAC,IAAiB,OAAkC;AAAA,MAE5D,IAAI,MAAM,cAAc,WAAW;AAAA,QACjC,MAAM,YAAY,OAAO,MAAM,cAAc,WACzC,GAAG,MAAM,gBACT,OAAO,MAAM,SAAS;AAAA,QAC1B,GAAG,MAAM,iBAAiB;AAAA,MAC5B;AAAA,MAGA,IAAI,MAAM,gBAAgB,YAAY;AAAA,QACpC,GAAG,MAAM,YAAY;AAAA,QACrB,GAAG,MAAM,aAAa;AAAA,QACtB,GAAG,MAAM,SAAS;AAAA,QAClB,GAAG,MAAM,QAAQ;AAAA,QACjB,GAAG,MAAM,UAAU;AAAA,MACrB;AAAA;AAAA,EAEJ;AAAA;",
+  "debugId": "2257FF52F429686364756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/grid.js

@@ -0,0 +1,44 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/grid.ts
+var exports_grid = {};
+__export(exports_grid, {
+  gridHandler: () => gridHandler
+});
+var gridHandler;
+var init_grid = __esm(() => {
+  gridHandler = {
+    create() {
+      const el = document.createElement("div");
+      el.style.display = "grid";
+      el.dataset.hypenType = "grid";
+      return el;
+    },
+    applyProps(el, props) {
+      if (props.columns !== undefined) {
+        const columns = typeof props.columns === "number" ? `repeat(${props.columns}, 1fr)` : String(props.columns);
+        el.style.gridTemplateColumns = columns;
+      }
+      if (props.rows !== undefined) {
+        const rows = typeof props.rows === "number" ? `repeat(${props.rows}, 1fr)` : String(props.rows);
+        el.style.gridTemplateRows = rows;
+      }
+      if (props.gap !== undefined) {
+        const gap = typeof props.gap === "number" ? `${props.gap}px` : String(props.gap);
+        el.style.gap = gap;
+      }
+    }
+  };
+});
+init_grid();
+
+export {
+  gridHandler
+};
+
+export { exports_grid, init_grid };
+
+//# debugId=B3844D598AB703BF64756E2164756E21

package/dist/src/dom/components/grid.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/grid.ts"],
+  "sourcesContent": [
+    "/**\n * Grid Component - CSS Grid Layout\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const gridHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"div\");\n    el.style.display = \"grid\";\n    el.dataset.hypenType = \"grid\";\n    return el;\n  },\n\n  applyProps(el: HTMLElement, props: Record<string, any>): void {\n    // Columns\n    if (props.columns !== undefined) {\n      const columns = typeof props.columns === \"number\"\n        ? `repeat(${props.columns}, 1fr)`\n        : String(props.columns);\n      el.style.gridTemplateColumns = columns;\n    }\n\n    // Rows\n    if (props.rows !== undefined) {\n      const rows = typeof props.rows === \"number\"\n        ? `repeat(${props.rows}, 1fr)`\n        : String(props.rows);\n      el.style.gridTemplateRows = rows;\n    }\n\n    // Gap\n    if (props.gap !== undefined) {\n      const gap = typeof props.gap === \"number\" ? `${props.gap}px` : String(props.gap);\n      el.style.gap = gap;\n    }\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,gBAAgC;AAAA,IAC3C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,KAAK;AAAA,MACvC,GAAG,MAAM,UAAU;AAAA,MACnB,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,IAGT,UAAU,CAAC,IAAiB,OAAkC;AAAA,MAE5D,IAAI,MAAM,YAAY,WAAW;AAAA,QAC/B,MAAM,UAAU,OAAO,MAAM,YAAY,WACrC,UAAU,MAAM,kBAChB,OAAO,MAAM,OAAO;AAAA,QACxB,GAAG,MAAM,sBAAsB;AAAA,MACjC;AAAA,MAGA,IAAI,MAAM,SAAS,WAAW;AAAA,QAC5B,MAAM,OAAO,OAAO,MAAM,SAAS,WAC/B,UAAU,MAAM,eAChB,OAAO,MAAM,IAAI;AAAA,QACrB,GAAG,MAAM,mBAAmB;AAAA,MAC9B;AAAA,MAGA,IAAI,MAAM,QAAQ,WAAW;AAAA,QAC3B,MAAM,MAAM,OAAO,MAAM,QAAQ,WAAW,GAAG,MAAM,UAAU,OAAO,MAAM,GAAG;AAAA,QAC/E,GAAG,MAAM,MAAM;AAAA,MACjB;AAAA;AAAA,EAEJ;AAAA;",
+  "debugId": "B3844D598AB703BF64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/heading.js

@@ -0,0 +1,47 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/heading.ts
+var exports_heading = {};
+__export(exports_heading, {
+  headingHandler: () => headingHandler
+});
+var headingHandler;
+var init_heading = __esm(() => {
+  headingHandler = {
+    create() {
+      const el = document.createElement("h2");
+      el.dataset.hypenType = "heading";
+      return el;
+    },
+    applyProps(el, props) {
+      if (props.level !== undefined) {
+        const level = Math.max(1, Math.min(6, Number(props.level)));
+        const newEl = document.createElement(`h${level}`);
+        newEl.dataset.hypenType = "heading";
+        newEl.innerHTML = el.innerHTML;
+        Array.from(el.attributes).forEach((attr) => {
+          newEl.setAttribute(attr.name, attr.value);
+        });
+        if (el.parentNode) {
+          el.parentNode.replaceChild(newEl, el);
+        }
+      }
+      const text = props["0"] || props.text;
+      if (text !== undefined) {
+        el.textContent = String(text);
+      }
+    }
+  };
+});
+init_heading();
+
+export {
+  headingHandler
+};
+
+export { exports_heading, init_heading };
+
+//# debugId=57A7AFC5B8A3B8B864756E2164756E21

package/dist/src/dom/components/heading.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/heading.ts"],
+  "sourcesContent": [
+    "/**\n * Heading Component - Semantic headings (h1-h6)\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const headingHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"h2\");\n    el.dataset.hypenType = \"heading\";\n    return el;\n  },\n\n  applyProps(el: HTMLElement, props: Record<string, any>): void {\n    // Level property (1-6)\n    if (props.level !== undefined) {\n      const level = Math.max(1, Math.min(6, Number(props.level)));\n      const newEl = document.createElement(`h${level}`);\n      newEl.dataset.hypenType = \"heading\";\n      \n      // Copy content and attributes\n      newEl.innerHTML = el.innerHTML;\n      Array.from(el.attributes).forEach(attr => {\n        newEl.setAttribute(attr.name, attr.value);\n      });\n      \n      // Replace the element\n      if (el.parentNode) {\n        el.parentNode.replaceChild(newEl, el);\n      }\n    }\n\n    // Text content\n    const text = props[\"0\"] || props.text;\n    if (text !== undefined) {\n      el.textContent = String(text);\n    }\n  },\n};\n\n\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,mBAAmC;AAAA,IAC9C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,IAAI;AAAA,MACtC,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,IAGT,UAAU,CAAC,IAAiB,OAAkC;AAAA,MAE5D,IAAI,MAAM,UAAU,WAAW;AAAA,QAC7B,MAAM,QAAQ,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,OAAO,MAAM,KAAK,CAAC,CAAC;AAAA,QAC1D,MAAM,QAAQ,SAAS,cAAc,IAAI,OAAO;AAAA,QAChD,MAAM,QAAQ,YAAY;AAAA,QAG1B,MAAM,YAAY,GAAG;AAAA,QACrB,MAAM,KAAK,GAAG,UAAU,EAAE,QAAQ,UAAQ;AAAA,UACxC,MAAM,aAAa,KAAK,MAAM,KAAK,KAAK;AAAA,SACzC;AAAA,QAGD,IAAI,GAAG,YAAY;AAAA,UACjB,GAAG,WAAW,aAAa,OAAO,EAAE;AAAA,QACtC;AAAA,MACF;AAAA,MAGA,MAAM,OAAO,MAAM,QAAQ,MAAM;AAAA,MACjC,IAAI,SAAS,WAAW;AAAA,QACtB,GAAG,cAAc,OAAO,IAAI;AAAA,MAC9B;AAAA;AAAA,EAEJ;AAAA;",
+  "debugId": "57A7AFC5B8A3B8B864756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/image.js

@@ -0,0 +1,39 @@
+import {
+  __esm,
+  __export
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/image.ts
+var exports_image = {};
+__export(exports_image, {
+  imageHandler: () => imageHandler
+});
+var imageHandler;
+var init_image = __esm(() => {
+  imageHandler = {
+    create() {
+      const el = document.createElement("img");
+      el.dataset.hypenType = "image";
+      return el;
+    },
+    applyProps(el, props) {
+      const img = el;
+      const src = props["0"] || props.url || props.src;
+      if (src !== undefined) {
+        img.src = String(src);
+      }
+      if (props.alt !== undefined) {
+        img.alt = String(props.alt);
+      }
+    }
+  };
+});
+init_image();
+
+export {
+  imageHandler
+};
+
+export { exports_image, init_image };
+
+//# debugId=20E9875428BBBCEF64756E2164756E21

package/dist/src/dom/components/image.js.map

@@ -0,0 +1,10 @@
+{
+  "version": 3,
+  "sources": ["../src/dom/components/image.ts"],
+  "sourcesContent": [
+    "/**\n * Image Component\n */\n\nimport type { ComponentHandler } from \"./index.js\";\n\nexport const imageHandler: ComponentHandler = {\n  create(): HTMLElement {\n    const el = document.createElement(\"img\");\n    el.dataset.hypenType = \"image\";\n    return el as any as HTMLElement;\n  },\n\n  applyProps(el: HTMLElement, props: Record<string, any>): void {\n    const img = el as HTMLImageElement;\n\n    // Support url, src, or first positional argument\n    const src = props[\"0\"] || props.url || props.src;\n    if (src !== undefined) {\n      img.src = String(src);\n    }\n\n    if (props.alt !== undefined) {\n      img.alt = String(props.alt);\n    }\n  },\n};\n"
+  ],
+  "mappings": ";;;;;;;;;;IAMa;AAAA;AAAA,iBAAiC;AAAA,IAC5C,MAAM,GAAgB;AAAA,MACpB,MAAM,KAAK,SAAS,cAAc,KAAK;AAAA,MACvC,GAAG,QAAQ,YAAY;AAAA,MACvB,OAAO;AAAA;AAAA,IAGT,UAAU,CAAC,IAAiB,OAAkC;AAAA,MAC5D,MAAM,MAAM;AAAA,MAGZ,MAAM,MAAM,MAAM,QAAQ,MAAM,OAAO,MAAM;AAAA,MAC7C,IAAI,QAAQ,WAAW;AAAA,QACrB,IAAI,MAAM,OAAO,GAAG;AAAA,MACtB;AAAA,MAEA,IAAI,MAAM,QAAQ,WAAW;AAAA,QAC3B,IAAI,MAAM,OAAO,MAAM,GAAG;AAAA,MAC5B;AAAA;AAAA,EAEJ;AAAA;",
+  "debugId": "20E9875428BBBCEF64756E2164756E21",
+  "names": []
+}

package/dist/src/dom/components/index.js

@@ -0,0 +1,217 @@
+import {
+  exports_list,
+  init_list
+} from "./list.js";
+import {
+  exports_textarea,
+  init_textarea
+} from "./textarea.js";
+import {
+  exports_grid,
+  init_grid
+} from "./grid.js";
+import {
+  exports_link,
+  init_link
+} from "./link.js";
+import {
+  exports_avatar,
+  init_avatar
+} from "./avatar.js";
+import {
+  exports_switch,
+  init_switch
+} from "./switch.js";
+import {
+  exports_badge,
+  init_badge
+} from "./badge.js";
+import {
+  exports_route,
+  init_route
+} from "./route.js";
+import {
+  exports_center,
+  init_center
+} from "./center.js";
+import {
+  exports_divider,
+  init_divider
+} from "./divider.js";
+import {
+  exports_spacer,
+  init_spacer
+} from "./spacer.js";
+import {
+  exports_input,
+  init_input
+} from "./input.js";
+import {
+  exports_stack,
+  init_stack
+} from "./stack.js";
+import {
+  exports_progressbar,
+  init_progressbar
+} from "./progressbar.js";
+import {
+  exports_button,
+  init_button
+} from "./button.js";
+import {
+  exports_heading,
+  init_heading
+} from "./heading.js";
+import {
+  exports_slider,
+  init_slider
+} from "./slider.js";
+import {
+  exports_card,
+  init_card
+} from "./card.js";
+import {
+  exports_container,
+  init_container
+} from "./container.js";
+import {
+  exports_video,
+  init_video
+} from "./video.js";
+import {
+  exports_spinner,
+  init_spinner
+} from "./spinner.js";
+import {
+  exports_row,
+  init_row
+} from "./row.js";
+import {
+  exports_select,
+  init_select
+} from "./select.js";
+import {
+  exports_router,
+  init_router
+} from "./router.js";
+import {
+  exports_audio,
+  init_audio
+} from "./audio.js";
+import {
+  exports_paragraph,
+  init_paragraph
+} from "./paragraph.js";
+import {
+  exports_text,
+  init_text
+} from "./text.js";
+import {
+  exports_checkbox,
+  init_checkbox
+} from "./checkbox.js";
+import {
+  exports_column,
+  init_column
+} from "./column.js";
+import {
+  exports_image,
+  init_image
+} from "./image.js";
+import {
+  __toCommonJS
+} from "../../../chunk-2s02mkzs.js";
+
+// src/dom/components/index.ts
+class ComponentRegistry {
+  handlers = new Map;
+  constructor() {
+    this.registerDefaults();
+  }
+  register(type, handler) {
+    this.handlers.set(type.toLowerCase(), handler);
+  }
+  get(type) {
+    return this.handlers.get(type.toLowerCase());
+  }
+  createElement(type, props = {}) {
+    const handler = this.get(type);
+    if (!handler)
+      return null;
+    const element = handler.create();
+    if (handler.applyProps) {
+      handler.applyProps(element, props);
+    }
+    return element;
+  }
+  registerDefaults() {
+    const { columnHandler } = (init_column(), __toCommonJS(exports_column));
+    const { rowHandler } = (init_row(), __toCommonJS(exports_row));
+    const { textHandler } = (init_text(), __toCommonJS(exports_text));
+    const { imageHandler } = (init_image(), __toCommonJS(exports_image));
+    const { buttonHandler } = (init_button(), __toCommonJS(exports_button));
+    const { containerHandler } = (init_container(), __toCommonJS(exports_container));
+    const { centerHandler } = (init_center(), __toCommonJS(exports_center));
+    const { listHandler } = (init_list(), __toCommonJS(exports_list));
+    const { inputHandler } = (init_input(), __toCommonJS(exports_input));
+    const { linkHandler } = (init_link(), __toCommonJS(exports_link));
+    const { textareaHandler } = (init_textarea(), __toCommonJS(exports_textarea));
+    const { checkboxHandler } = (init_checkbox(), __toCommonJS(exports_checkbox));
+    const { selectHandler } = (init_select(), __toCommonJS(exports_select));
+    const { spacerHandler } = (init_spacer(), __toCommonJS(exports_spacer));
+    const { stackHandler } = (init_stack(), __toCommonJS(exports_stack));
+    const { dividerHandler } = (init_divider(), __toCommonJS(exports_divider));
+    const { gridHandler } = (init_grid(), __toCommonJS(exports_grid));
+    const { cardHandler } = (init_card(), __toCommonJS(exports_card));
+    const { headingHandler } = (init_heading(), __toCommonJS(exports_heading));
+    const { switchHandler } = (init_switch(), __toCommonJS(exports_switch));
+    const { sliderHandler } = (init_slider(), __toCommonJS(exports_slider));
+    const { spinnerHandler } = (init_spinner(), __toCommonJS(exports_spinner));
+    const { badgeHandler } = (init_badge(), __toCommonJS(exports_badge));
+    const { avatarHandler } = (init_avatar(), __toCommonJS(exports_avatar));
+    const { progressBarHandler } = (init_progressbar(), __toCommonJS(exports_progressbar));
+    const { videoHandler } = (init_video(), __toCommonJS(exports_video));
+    const { audioHandler } = (init_audio(), __toCommonJS(exports_audio));
+    const { paragraphHandler } = (init_paragraph(), __toCommonJS(exports_paragraph));
+    const { routerHandler } = (init_router(), __toCommonJS(exports_router));
+    const { routeHandler } = (init_route(), __toCommonJS(exports_route));
+    this.register("column", columnHandler);
+    this.register("row", rowHandler);
+    this.register("text", textHandler);
+    this.register("image", imageHandler);
+    this.register("button", buttonHandler);
+    this.register("container", containerHandler);
+    this.register("box", containerHandler);
+    this.register("center", centerHandler);
+    this.register("list", listHandler);
+    this.register("input", inputHandler);
+    this.register("link", linkHandler);
+    this.register("textarea", textareaHandler);
+    this.register("checkbox", checkboxHandler);
+    this.register("select", selectHandler);
+    this.register("spacer", spacerHandler);
+    this.register("stack", stackHandler);
+    this.register("divider", dividerHandler);
+    this.register("grid", gridHandler);
+    this.register("card", cardHandler);
+    this.register("heading", headingHandler);
+    this.register("switch", switchHandler);
+    this.register("slider", sliderHandler);
+    this.register("spinner", spinnerHandler);
+    this.register("badge", badgeHandler);
+    this.register("avatar", avatarHandler);
+    this.register("progressbar", progressBarHandler);
+    this.register("video", videoHandler);
+    this.register("audio", audioHandler);
+    this.register("paragraph", paragraphHandler);
+    this.register("router", routerHandler);
+    this.register("route", routeHandler);
+  }
+}
+export {
+  ComponentRegistry
+};
+
+export { ComponentRegistry };
+
+//# debugId=65DAAC739196799D64756E2164756E21