@endge/native-dom 0.1.3 → 0.1.8

package/dist/native-dom.js

@@ -1,20 +1,21 @@
-import { ENDGE_SFC_RENDER_ADAPTER_PROTOCOL_VERSION as g, ENDGE_SFC_RENDER_ADAPTER_PROTOCOL as m } from "@endge/core";
-function s(e, r, t) {
+import { ENDGE_SFC_RENDER_ADAPTER_PROTOCOL_VERSION as y, ENDGE_SFC_RENDER_ADAPTER_PROTOCOL as b } from "@endge/core";
+function n(e, r, t) {
   const o = e.document.createElement(r);
-  return u(o, e.attrs), o.classList.add(t), y(o, e.props), d(o, e.children), o;
+  return S(o, e.attrs), o.classList.add(t), h(o, e.props), m(o, e.children), o;
 }
-function d(e, r) {
+function m(e, r) {
   for (const t of r) {
-    if (t == null || t === !1) continue;
+    if (t == null || t === !1)
+      continue;
     const o = typeof t == "object" && "nodeType" in t;
     e.append(o ? t : String(t));
   }
 }
-function u(e, r) {
+function S(e, r) {
   for (const [t, o] of Object.entries(r))
     if (!(o == null || o === !1 || t === "key")) {
       if (t === "class") {
-        f(o).forEach((l) => e.classList.add(l));
+        u(o).forEach((s) => e.classList.add(s));
         continue;
       }
       if (t === "style" && o && typeof o == "object") {
@@ -24,105 +25,127 @@ function u(e, r) {
       t.startsWith("on") || e.setAttribute(t, o === !0 ? "" : String(o));
     }
 }
-function y(e, r) {
-  const t = c(r.colStart, r.colSpan), o = c(r.rowStart, r.rowSpan);
+function h(e, r) {
+  const t = d(r.colStart, r.colSpan), o = d(r.rowStart, r.rowSpan);
   t && (e.style.gridColumn = t), o && (e.style.gridRow = o);
 }
-function n(e, r = 1) {
-  if (e == null || e === !1) return "";
-  if (typeof e == "number") return `${e * r}px`;
+function i(e, r = 1) {
+  if (e == null || e === !1)
+    return "";
+  if (typeof e == "number")
+    return `${e * r}px`;
   const t = String(e).trim();
   return /^-?\d+(\.\d+)?$/.test(t) ? `${Number(t) * r}px` : t;
 }
-function i(e, r) {
+function p(e, r) {
   if (e == null || e === !1 || String(e).trim() === "")
     return r ? `repeat(${r}, minmax(0, 1fr))` : "";
   const t = String(e).trim();
   return /^\d+$/.test(t) && Number(t) > 0 ? `repeat(${Number(t)}, minmax(0, 1fr))` : t;
 }
-function c(e, r) {
-  const t = p(e), o = p(r);
+function d(e, r) {
+  const t = f(e), o = f(r);
   return t != null && o != null ? `${t} / span ${o}` : t != null ? String(t) : o != null ? `span ${o}` : "";
 }
-function p(e) {
-  if (e == null || e === !1 || e === "") return null;
+function f(e) {
+  if (e == null || e === !1 || e === "")
+    return null;
   const r = Number(e);
   return Number.isInteger(r) && r > 0 ? r : null;
 }
-function f(e) {
-  return Array.isArray(e) ? e.flatMap(f) : e && typeof e == "object" ? Object.entries(e).filter(([, r]) => !!r).map(([r]) => r) : String(e ?? "").trim().split(/\s+/).filter(Boolean);
+function u(e) {
+  return Array.isArray(e) ? e.flatMap(u) : e && typeof e == "object" ? Object.entries(e).filter(([, r]) => !!r).map(([r]) => r) : String(e ?? "").trim().split(/\s+/).filter(Boolean);
 }
-const b = {
-  Text: (e) => s(e, "span", "endge-sfc-text"),
+const x = {
+  Text: (e) => n(e, "span", "endge-sfc-text"),
   DateTime: (e) => {
-    const r = s(e, "time", "endge-sfc-datetime");
-    return e.props.value != null && e.children.length === 0 && (r.textContent = String(e.props.value)), r;
+    const r = n(e, "time", "endge-sfc-datetime");
+    return e.props.value != null && e.children.length === 0 && (r.dateTime = String(e.props.value), r.textContent = w(
+      e.props.value,
+      e.props.format,
+      e.props.timezone
+    )), r;
   },
   Number: (e) => {
-    const r = s(e, "span", "endge-sfc-number");
+    const r = n(e, "span", "endge-sfc-number");
     return e.props.value != null && e.children.length === 0 && (r.textContent = String(e.props.value)), r;
   },
   Icon: (e) => {
-    const r = s(e, "span", "endge-sfc-icon");
+    const r = n(e, "span", "endge-sfc-icon");
     return r.setAttribute("aria-hidden", e.props.label == null ? "true" : "false"), e.props.label != null && r.setAttribute("aria-label", String(e.props.label)), e.props.name != null && e.children.length === 0 && (r.textContent = String(e.props.name)), r;
   },
-  Badge: (e) => s(e, "span", "endge-sfc-badge"),
+  Badge: (e) => n(e, "span", "endge-sfc-badge"),
   Dot: (e) => {
-    const r = s(e, "span", "endge-sfc-dot"), t = n(e.props.size, 1) || "8px";
+    const r = n(e, "span", "endge-sfc-dot"), t = i(e.props.size, 1) || "8px";
     return r.style.display = "inline-block", r.style.width = t, r.style.height = t, r.style.borderRadius = "9999px", r;
   },
-  Box: (e) => s(e, "div", "endge-sfc-box"),
+  Box: (e) => n(e, "div", "endge-sfc-box"),
   Flex: (e) => {
-    const r = s(e, "div", "endge-sfc-flex"), t = e.props.col === !0 || e.props.direction === "column";
-    return r.style.display = "flex", r.style.flexDirection = t ? "column" : "row", r.style.gap = n(e.props.gap, 4), e.props.align != null && (r.style.alignItems = String(e.props.align)), e.props.justify != null && (r.style.justifyContent = String(e.props.justify)), (e.props.wrap === !0 || e.props.wrap === "wrap") && (r.style.flexWrap = "wrap"), r;
+    const r = n(e, "div", "endge-sfc-flex"), t = e.props.col === !0 || e.props.direction === "column";
+    return r.style.display = "flex", r.style.flexDirection = t ? "column" : "row", r.style.gap = i(e.props.gap, 4), e.props.align != null && (r.style.alignItems = String(e.props.align)), e.props.justify != null && (r.style.justifyContent = String(e.props.justify)), (e.props.wrap === !0 || e.props.wrap === "wrap") && (r.style.flexWrap = "wrap"), r;
   },
   Grid: (e) => {
-    const r = s(e, "div", "endge-sfc-grid");
-    return r.style.display = "grid", r.style.gridTemplateColumns = i(e.props.columns, 12), r.style.gridTemplateRows = i(e.props.rows), r.style.gridAutoRows = n(e.props.autoRows), e.props.autoFlow != null && (r.style.gridAutoFlow = String(e.props.autoFlow)), r.style.gap = n(e.props.gap, 4), r.style.columnGap = n(e.props.columnGap, 4), r.style.rowGap = n(e.props.rowGap, 4), e.props.align != null && (r.style.alignItems = String(e.props.align)), e.props.justify != null && (r.style.justifyItems = String(e.props.justify)), r;
+    const r = n(e, "div", "endge-sfc-grid");
+    return r.style.display = "grid", r.style.gridTemplateColumns = p(e.props.columns, 12), r.style.gridTemplateRows = p(e.props.rows), r.style.gridAutoRows = i(e.props.autoRows), e.props.autoFlow != null && (r.style.gridAutoFlow = String(e.props.autoFlow)), r.style.gap = i(e.props.gap, 4), r.style.columnGap = i(e.props.columnGap, 4), r.style.rowGap = i(e.props.rowGap, 4), e.props.align != null && (r.style.alignItems = String(e.props.align)), e.props.justify != null && (r.style.justifyItems = String(e.props.justify)), r;
   },
-  Divider: (e) => s(e, "hr", "endge-sfc-divider"),
+  Divider: (e) => n(e, "hr", "endge-sfc-divider"),
   Input: (e) => {
-    const r = s({ ...e, children: [] }, "input", "endge-sfc-input");
+    const r = n({ ...e, children: [] }, "input", "endge-sfc-input");
     return e.props.type != null && (r.type = String(e.props.type).toLowerCase()), e.props.value != null && (r.value = String(e.props.value)), e.props.placeholder != null && (r.placeholder = String(e.props.placeholder)), e.props.disabled === !0 && (r.disabled = !0), r;
   },
   Textarea: (e) => {
-    const r = s({ ...e, children: [] }, "textarea", "endge-sfc-textarea");
+    const r = n({ ...e, children: [] }, "textarea", "endge-sfc-textarea");
     return e.props.value != null && (r.value = String(e.props.value)), e.props.placeholder != null && (r.placeholder = String(e.props.placeholder)), e.props.rows != null && (r.rows = Math.max(1, Number(e.props.rows) || 1)), e.props.disabled === !0 && (r.disabled = !0), r;
   },
   Checkbox: (e) => {
-    const r = s({ ...e, children: [] }, "label", "endge-sfc-checkbox"), t = e.document.createElement("input");
-    return t.type = "checkbox", t.checked = e.props.checked === !0, t.disabled = e.props.disabled === !0, r.append(t), e.props.label != null && r.append(String(e.props.label)), d(r, e.children), r;
+    const r = n({ ...e, children: [] }, "label", "endge-sfc-checkbox"), t = e.document.createElement("input");
+    return t.type = "checkbox", t.checked = e.props.checked === !0, t.disabled = e.props.disabled === !0, r.append(t), e.props.label != null && r.append(String(e.props.label)), m(r, e.children), r;
   },
   Select: (e) => {
-    const r = s({ ...e, children: [] }, "select", "endge-sfc-select");
+    const r = n({ ...e, children: [] }, "select", "endge-sfc-select");
     r.multiple = e.props.multiple === !0, r.disabled = e.props.disabled === !0;
     const t = Array.isArray(e.props.options) ? e.props.options : [];
     for (const o of t) {
-      const l = e.document.createElement("option");
+      const s = e.document.createElement("option");
       if (o && typeof o == "object") {
-        const a = o;
-        l.value = String(a.value ?? ""), l.textContent = String(a.label ?? a.value ?? "");
+        const l = o;
+        s.value = String(l.value ?? ""), s.textContent = String(l.label ?? l.value ?? "");
       } else
-        l.value = String(o ?? ""), l.textContent = String(o ?? "");
-      r.append(l);
+        s.value = String(o ?? ""), s.textContent = String(o ?? "");
+      r.append(s);
     }
     return r;
   }
-}, S = "native-dom", x = {
-  id: S,
-  protocol: m,
-  protocolVersion: g,
+};
+function w(e, r, t) {
+  const o = String(e ?? "").trim(), s = r === "HH:mm" ? o.match(/^(\d{2}):(\d{2})(?::\d{2})?$/) : null;
+  if (s)
+    return `${s[1]}:${s[2]}`;
+  const l = new Date(o);
+  if (Number.isNaN(l.getTime()))
+    return o;
+  const a = String(t ?? "").trim(), g = !a || a === "local" ? void 0 : a, c = r === "HH:mm" ? { hour: "2-digit", minute: "2-digit", hour12: !1 } : r === "date" ? {} : { dateStyle: "medium", timeStyle: "short" };
+  try {
+    return new Intl.DateTimeFormat(void 0, { ...c, timeZone: g }).format(l);
+  } catch {
+    return new Intl.DateTimeFormat(void 0, c).format(l);
+  }
+}
+const D = "native-dom", v = {
+  id: D,
+  protocol: b,
+  protocolVersion: y,
   renderer: "native-dom",
-  renderers: b
+  renderers: x
 };
 export {
-  S as NATIVE_DOM_SFC_ADAPTER_ID,
-  x as NativeDOMSFCAdapter,
-  b as NativeDOMVisualRenderers,
-  d as appendNativeDOMChildren,
-  u as applyNativeDOMAttrs,
-  y as applyNativeDOMGridPlacement,
-  s as createNativeDOMElement,
-  n as normalizeNativeDOMLength,
-  i as normalizeNativeDOMTracks
+  D as NATIVE_DOM_SFC_ADAPTER_ID,
+  v as NativeDOMSFCAdapter,
+  x as NativeDOMVisualRenderers,
+  m as appendNativeDOMChildren,
+  S as applyNativeDOMAttrs,
+  h as applyNativeDOMGridPlacement,
+  n as createNativeDOMElement,
+  i as normalizeNativeDOMLength,
+  p as normalizeNativeDOMTracks
 };

package/package.json

@@ -1,37 +1,41 @@
 {
   "name": "@endge/native-dom",
-  "version": "0.1.3",
+  "type": "module",
+  "version": "0.1.8",
   "private": false,
   "license": "Apache-2.0",
-  "type": "module",
-  "main": "./dist/native-dom.js",
-  "module": "./dist/native-dom.js",
-  "types": "./dist/main.d.ts",
   "exports": {
     ".": {
       "types": "./dist/main.d.ts",
       "import": "./dist/native-dom.js"
     }
   },
+  "main": "./dist/native-dom.js",
+  "module": "./dist/native-dom.js",
+  "types": "./dist/main.d.ts",
   "files": [
     "dist"
   ],
+  "scripts": {
+    "clean": "rimraf dist tsconfig.tsbuildinfo",
+    "build": "vite build",
+    "test": "vitest",
+    "typecheck": "tsc --noEmit",
+    "lint-check": "eslint . --cache",
+    "lint-fix": "eslint . --fix --cache"
+  },
   "peerDependencies": {
-    "@endge/core": "^1.2.9"
+    "@endge/core": "^1.2.9 || ^2.0.2 || ^3.0.0 || ^4.0.0"
   },
   "devDependencies": {
-    "@endge/core": "link:../@endge-core",
+    "@antfu/eslint-config": "9.3.0",
+    "@endge/core": "^4.0.0",
+    "eslint": "10.9.1",
     "jsdom": "^26.1.0",
     "rimraf": "^6.0.1",
-    "typescript": "^5.5.4",
+    "typescript": "~6.0.3",
+    "unplugin-dts": "^1.0.3",
     "vite": "^6.1.0",
-    "vite-plugin-dts": "^4.5.0",
     "vitest": "^2.1.9"
-  },
-  "scripts": {
-    "clean": "rimraf dist tsconfig.tsbuildinfo",
-    "build": "vite build",
-    "test": "vitest",
-    "typecheck": "tsc --noEmit"
   }
-}
+}