@hypen-space/web 0.3.6 → 0.3.8

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

@@ -27,6 +27,108 @@ var __export = (target, all) => {
 };
 var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
 
+// src/dom/applicators/layout.ts
+var exports_layout = {};
+__export(exports_layout, {
+  mapAlignmentValue: () => mapAlignmentValue,
+  layoutHandlers: () => layoutHandlers
+});
+function mapAlignmentValue(value) {
+  const v = String(value).toLowerCase();
+  switch (v) {
+    case "top":
+    case "start":
+    case "leading":
+    case "left":
+      return "flex-start";
+    case "bottom":
+    case "end":
+    case "trailing":
+    case "right":
+      return "flex-end";
+    case "center":
+      return "center";
+    case "spacebetween":
+    case "space-between":
+      return "space-between";
+    case "spacearound":
+    case "space-around":
+      return "space-around";
+    case "spaceevenly":
+    case "space-evenly":
+      return "space-evenly";
+    default:
+      return v;
+  }
+}
+var layoutHandlers;
+var init_layout = __esm(() => {
+  layoutHandlers = {
+    verticalAlignment: (el, value) => {
+      const val = mapAlignmentValue(String(value));
+      const flexDirection = getComputedStyle(el).flexDirection;
+      if (flexDirection === "column" || flexDirection === "column-reverse") {
+        el.style.justifyContent = val;
+      } else {
+        el.style.alignItems = val;
+      }
+    },
+    horizontalAlignment: (el, value) => {
+      const val = mapAlignmentValue(String(value));
+      const flexDirection = getComputedStyle(el).flexDirection;
+      if (flexDirection === "column" || flexDirection === "column-reverse") {
+        el.style.alignItems = val;
+      } else {
+        el.style.justifyContent = val;
+      }
+    },
+    horizontalAlign: (el, value) => {
+      el.style.justifyContent = mapAlignmentValue(String(value));
+    },
+    verticalAlign: (el, value) => {
+      el.style.alignItems = mapAlignmentValue(String(value));
+    },
+    gap: (el, value) => {
+      el.style.gap = typeof value === "number" ? `${value}px` : String(value);
+    },
+    weight: (el, value) => {
+      el.style.flex = String(value);
+    },
+    flex: (el, value) => {
+      el.style.flex = String(value);
+    },
+    flexGrow: (el, value) => {
+      el.style.flexGrow = String(value);
+    },
+    flexShrink: (el, value) => {
+      el.style.flexShrink = String(value);
+    },
+    cursor: (el, value) => {
+      el.style.cursor = String(value);
+    },
+    overflow: (el, value) => {
+      el.style.overflow = String(value);
+    },
+    scrollable: (el, value) => {
+      if (value === true || value === "true") {
+        el.style.overflow = "auto";
+      } else if (value === false || value === "false") {
+        el.style.overflow = "hidden";
+      } else if (value === "vertical") {
+        el.style.overflowX = "hidden";
+        el.style.overflowY = "auto";
+      } else if (value === "horizontal") {
+        el.style.overflowX = "auto";
+        el.style.overflowY = "hidden";
+      } else if (value === "both") {
+        el.style.overflow = "auto";
+      } else {
+        el.style.overflow = String(value);
+      }
+    }
+  };
+});
+
 // src/dom/applicators/advanced-layout.ts
 var exports_advanced_layout = {};
 __export(exports_advanced_layout, {
@@ -34,6 +136,7 @@ __export(exports_advanced_layout, {
 });
 var advancedLayoutHandlers;
 var init_advanced_layout = __esm(() => {
+  init_layout();
   advancedLayoutHandlers = {
     flexDirection: (el, value) => {
       el.style.flexDirection = String(value);
@@ -45,10 +148,10 @@ var init_advanced_layout = __esm(() => {
       el.style.flexBasis = typeof value === "number" ? `${value}px` : String(value);
     },
     justifyContent: (el, value) => {
-      el.style.justifyContent = String(value);
+      el.style.justifyContent = mapAlignmentValue(String(value));
     },
     alignItems: (el, value) => {
-      el.style.alignItems = String(value);
+      el.style.alignItems = mapAlignmentValue(String(value));
     },
     alignContent: (el, value) => {
       el.style.alignContent = String(value);
@@ -144,4 +247,4 @@ export {
   advancedLayoutHandlers
 };
 
-//# debugId=C1185D52B17FE3EF64756E2164756E21
+//# debugId=7F69A9D7466DB1C064756E2164756E21

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

@@ -1,10 +1,11 @@
 {
   "version": 3,
-  "sources": ["../src/dom/applicators/advanced-layout.ts"],
+  "sources": ["../src/dom/applicators/layout.ts", "../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  // Unified API aliases (simpler names)\n  gridColumns: (el, value) => {\n    // Support number (repeat) or string (CSS value)\n    if (typeof value === \"number\") {\n      el.style.gridTemplateColumns = `repeat(${value}, 1fr)`;\n    } else {\n      el.style.gridTemplateColumns = String(value);\n    }\n  },\n\n  gridRows: (el, value) => {\n    // Support number (repeat) or string (CSS value)\n    if (typeof value === \"number\") {\n      el.style.gridTemplateRows = `repeat(${value}, 1fr)`;\n    } else {\n      el.style.gridTemplateRows = String(value);\n    }\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"
+    "/**\n * Layout Applicators (Flexbox/Grid)\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\n\n/**\n * Maps Hypen alignment values to CSS flexbox values.\n * Ensures consistent cross-platform API (Android/iOS/Web).\n */\nexport function mapAlignmentValue(value: string): string {\n  const v = String(value).toLowerCase();\n  switch (v) {\n    // Positional values -> CSS equivalents\n    case \"top\":\n    case \"start\":\n    case \"leading\":\n    case \"left\":\n      return \"flex-start\";\n    case \"bottom\":\n    case \"end\":\n    case \"trailing\":\n    case \"right\":\n      return \"flex-end\";\n    case \"center\":\n      return \"center\";\n    // Spacing values -> CSS equivalents\n    case \"spacebetween\":\n    case \"space-between\":\n      return \"space-between\";\n    case \"spacearound\":\n    case \"space-around\":\n      return \"space-around\";\n    case \"spaceevenly\":\n    case \"space-evenly\":\n      return \"space-evenly\";\n    // Pass through CSS values as-is\n    default:\n      return v;\n  }\n}\n\nexport const layoutHandlers: Record<string, ApplicatorHandler> = {\n  // Unified alignment API - works for both Column and Row\n  verticalAlignment: (el, value) => {\n    const val = mapAlignmentValue(String(value));\n    // Check flex-direction to determine which CSS property to set\n    const flexDirection = getComputedStyle(el).flexDirection;\n    if (flexDirection === \"column\" || flexDirection === \"column-reverse\") {\n      // For column: vertical is the main axis (justify-content)\n      el.style.justifyContent = val;\n    } else {\n      // For row: vertical is the cross axis (align-items)\n      el.style.alignItems = val;\n    }\n  },\n\n  horizontalAlignment: (el, value) => {\n    const val = mapAlignmentValue(String(value));\n    // Check flex-direction to determine which CSS property to set\n    const flexDirection = getComputedStyle(el).flexDirection;\n    if (flexDirection === \"column\" || flexDirection === \"column-reverse\") {\n      // For column: horizontal is the cross axis (align-items)\n      el.style.alignItems = val;\n    } else {\n      // For row: horizontal is the main axis (justify-content)\n      el.style.justifyContent = val;\n    }\n  },\n\n  // Legacy aliases (kept for backward compatibility)\n  horizontalAlign: (el, value) => {\n    el.style.justifyContent = mapAlignmentValue(String(value));\n  },\n\n  verticalAlign: (el, value) => {\n    el.style.alignItems = mapAlignmentValue(String(value));\n  },\n\n  gap: (el, value) => {\n    el.style.gap = typeof value === \"number\" ? `${value}px` : String(value);\n  },\n\n  // weight: unified cross-platform API (same as flex)\n  // Use .weight(1) to make element take remaining space in Row/Column\n  weight: (el, value) => {\n    el.style.flex = String(value);\n  },\n\n  // flex: CSS flex shorthand (kept for CSS compatibility)\n  flex: (el, value) => {\n    el.style.flex = String(value);\n  },\n\n  flexGrow: (el, value) => {\n    el.style.flexGrow = String(value);\n  },\n\n  flexShrink: (el, value) => {\n    el.style.flexShrink = String(value);\n  },\n\n  cursor: (el, value) => {\n    el.style.cursor = String(value);\n  },\n\n  overflow: (el, value) => {\n    el.style.overflow = String(value);\n  },\n\n  scrollable: (el, value) => {\n    if (value === true || value === \"true\") {\n      el.style.overflow = \"auto\";\n    } else if (value === false || value === \"false\") {\n      el.style.overflow = \"hidden\";\n    } else if (value === \"vertical\") {\n      el.style.overflowX = \"hidden\";\n      el.style.overflowY = \"auto\";\n    } else if (value === \"horizontal\") {\n      el.style.overflowX = \"auto\";\n      el.style.overflowY = \"hidden\";\n    } else if (value === \"both\") {\n      el.style.overflow = \"auto\";\n    } else {\n      el.style.overflow = String(value);\n    }\n  },\n};\n",
+    "/**\n * Advanced Layout Applicators (Flexbox, Grid, Positioning)\n */\n\nimport type { ApplicatorHandler } from \"./index.js\";\nimport { mapAlignmentValue } from \"./layout.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 = mapAlignmentValue(String(value));\n  },\n\n  alignItems: (el, value) => {\n    el.style.alignItems = mapAlignmentValue(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  // Unified API aliases (simpler names)\n  gridColumns: (el, value) => {\n    // Support number (repeat) or string (CSS value)\n    if (typeof value === \"number\") {\n      el.style.gridTemplateColumns = `repeat(${value}, 1fr)`;\n    } else {\n      el.style.gridTemplateColumns = String(value);\n    }\n  },\n\n  gridRows: (el, value) => {\n    // Support number (repeat) or string (CSS value)\n    if (typeof value === \"number\") {\n      el.style.gridTemplateRows = `repeat(${value}, 1fr)`;\n    } else {\n      el.style.gridTemplateRows = String(value);\n    }\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": "C1185D52B17FE3EF64756E2164756E21",
+  "mappings": "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",
+  "debugId": "7F69A9D7466DB1C064756E2164756E21",
   "names": []
 }

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

@@ -413,6 +413,7 @@ var init_font = __esm(() => {
 // src/dom/applicators/layout.ts
 var exports_layout = {};
 __export(exports_layout, {
+  mapAlignmentValue: () => mapAlignmentValue,
   layoutHandlers: () => layoutHandlers
 });
 function mapAlignmentValue(value) {
@@ -1171,6 +1172,7 @@ __export(exports_advanced_layout, {
 });
 var advancedLayoutHandlers;
 var init_advanced_layout = __esm(() => {
+  init_layout();
   advancedLayoutHandlers = {
     flexDirection: (el, value) => {
       el.style.flexDirection = String(value);
@@ -1182,10 +1184,10 @@ var init_advanced_layout = __esm(() => {
       el.style.flexBasis = typeof value === "number" ? `${value}px` : String(value);
     },
     justifyContent: (el, value) => {
-      el.style.justifyContent = String(value);
+      el.style.justifyContent = mapAlignmentValue(String(value));
     },
     alignItems: (el, value) => {
-      el.style.alignItems = String(value);
+      el.style.alignItems = mapAlignmentValue(String(value));
     },
     alignContent: (el, value) => {
       el.style.alignContent = String(value);
@@ -1710,4 +1712,4 @@ export {
   ApplicatorRegistry
 };
 
-//# debugId=FA4B7415966A312264756E2164756E21
+//# debugId=50A2AE96762A922B64756E2164756E21