evikit 2.3.2 → 2.4.0

package/index.js

@@ -1,243 +1,211 @@
-import { toStatic } from "hoofd/preact";
-import { h } from "preact";
-import {
-  ErrorBoundary,
-  hydrate as iso,
-  Router as IsoRouter,
-  LocationProvider,
-  prerender,
-} from "preact-iso";
-import { locationStub } from "preact-iso/prerender";
-import { useState } from "preact/hooks";
-
-import { flatten, primary, references, relations } from "./db.js";
-import {
-  a,
-  article,
-  b,
-  blockquote,
-  br,
-  button,
-  circle,
-  code,
-  details,
-  dialog,
-  div,
-  em,
-  fieldset,
-  figcaption,
-  figure,
-  footer,
-  form,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  header,
-  hr,
-  i,
-  img,
-  input,
-  label,
-  legend,
-  li,
-  main,
-  nav,
-  ol,
-  option,
-  p,
-  path,
-  pre,
-  section,
-  select,
-  small,
-  span,
-  strong,
-  summary,
-  svg,
-  title,
-  ul,
-} from "./html.js";
-import { getI18n, Po, RawI18nProvider, useI18n } from "./i18n.js";
-import {
-  dehydrate,
-  Hydrate,
-  QueryClient,
-  QueryClientProvider,
-  useQueryClient,
-} from "./query.js";
-import { queryApi, useApi } from "./use-api.js";
-import { useEnhance } from "./use-enhance.js";
-import { useStatus } from "./use-status.js";
-
-/**
- * @param {(props: { dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> } ) => import("preact").VNode} App
- * @param {string} renderTarget
- */
-export async function hydrate(App, renderTarget) {
-  if (typeof window !== "undefined") {
-    const app = document.querySelector(renderTarget);
-    if (!app) {
-      throw new Error(`${renderTarget} not found`);
-    }
-    let data;
-    const prerender = document.querySelector("#preact-prerender-data");
-    if (prerender) {
-      data = JSON.parse(prerender.textContent);
-      prerender.remove();
-    }
-
-    // If api and hydrate run in the same process, keep value from api.
-    // Avoid infinite recursion.
-    if (!Po.value) {
-      Po.set(
-        async (lang) =>
-          await (
-            await fetch(`${location.origin}/po/${encodeURIComponent(lang)}`)
-          ).json(),
-      );
-    }
-
-    iso(
-      h(App, {
-        dehydratedState: data?.dehydratedState,
-        // `window` matters. We want JSDOM navigator in tests, not Node.js one.
-        i18n: await getI18n(...window.navigator.languages),
-      }),
-      app,
-    );
-  }
-}
-
-/** @param {{ children?: import("preact").ComponentChildren, dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> }} props */
-export function Router({ children, dehydratedState, i18n }) {
-  const [queryClient] = useState(
-    () =>
-      new QueryClient({
-        defaultOptions: { queries: { staleTime: 60 * 1000 } },
-      }),
-  );
-
-  return h(
-    RawI18nProvider,
-    { value: /** @type {any} */ (i18n) },
-    h(
-      QueryClientProvider,
-      { client: queryClient },
-      h(
-        Hydrate,
-        { state: dehydratedState },
-        h(
-          LocationProvider,
-          null,
-          h(ErrorBoundary, null, h(IsoRouter, null, children)),
-        ),
-      ),
-    ),
-  );
-}
-
-/**
- * @param {(props: { dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> }) => import("preact").VNode} App
- * @param {{ lang?: string, url: string }} data
- */
-export async function ssr(App, data) {
-  const origin = process.env["ORIGIN"] || "http://localhost:5173";
-  const i18n = await getI18n(...(data.lang ? [data.lang] : []));
-
-  const queryClient = new QueryClient({
-    defaultOptions: { queries: { staleTime: 0 } },
-  });
-  await queryClient.prefetchQuery(
-    queryApi({ lang: i18n.getLocale(), origin, path: data.url }),
-  );
-  const dehydratedState = dehydrate(queryClient, {
-    shouldRedactErrors: (error) => {
-      const { name } = /** @type {any} */ (error);
-      return !(Number(name) && name == "404");
-    },
-  });
-
-  locationStub(data.url);
-  const { html, links } = await prerender(h(/** @type {any} */ (App), {}), {
-    props: { dehydratedState, i18n },
-  });
-  const { metas, title } = toStatic();
-
-  return {
-    data: { ...data, dehydratedState },
-    head: {
-      elements: new Set(
-        metas.map((props) => ({
-          props: Object.fromEntries(
-            Object.entries(props).map(([name, content]) => [
-              name,
-              String(content),
-            ]),
-          ),
-          type: "meta",
-        })),
-      ),
-      lang: i18n.getLocale(),
-      title,
-    },
-    html,
-    links,
-  };
-}
-
-export { flatten, primary, references, relations };
-
-export { getI18n, useApi, useEnhance, useI18n, useQueryClient, useStatus };
-
-export {
-  a,
-  article,
-  b,
-  blockquote,
-  br,
-  button,
-  circle,
-  code,
-  details,
-  dialog,
-  div,
-  em,
-  fieldset,
-  figcaption,
-  figure,
-  footer,
-  form,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  header,
-  hr,
-  i,
-  img,
-  input,
-  label,
-  legend,
-  li,
-  main,
-  nav,
-  ol,
-  option,
-  p,
-  path,
-  pre,
-  section,
-  select,
-  small,
-  span,
-  strong,
-  summary,
-  svg,
-  title,
-  ul,
-};
+import { toStatic } from "hoofd/preact";
+import { h } from "preact";
+import {
+  ErrorBoundary,
+  hydrate as iso,
+  Router as IsoRouter,
+  LocationProvider,
+  prerender,
+} from "preact-iso";
+import { locationStub } from "preact-iso/prerender";
+import { useState } from "preact/hooks";
+
+import { flatten, primary, references, relations } from "./db.js";
+import { HTMLElement } from "./html-element.js";
+import { getI18n, Po, RawI18nProvider, useI18n } from "./i18n.js";
+import {
+  dehydrate,
+  Hydrate,
+  QueryClient,
+  QueryClientProvider,
+  useQueryClient,
+} from "./query.js";
+import { queryApi, useApi } from "./use-api.js";
+import { useEnhance } from "./use-enhance.js";
+import { useStatus } from "./use-status.js";
+
+/**
+ * @param {(props: { dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> } ) => import("preact").VNode} App
+ * @param {string} renderTarget
+ */
+export async function hydrate(App, renderTarget) {
+  if (typeof window !== "undefined") {
+    const app = document.querySelector(renderTarget);
+    if (!app) {
+      throw new Error(`${renderTarget} not found`);
+    }
+    let data;
+    const prerender = document.querySelector("#preact-prerender-data");
+    if (prerender) {
+      data = JSON.parse(prerender.textContent);
+      prerender.remove();
+    }
+
+    // If api and hydrate run in the same process, keep value from api.
+    // Avoid infinite recursion.
+    if (!Po.value) {
+      Po.set(
+        async (lang) =>
+          await (
+            await fetch(`${location.origin}/po/${encodeURIComponent(lang)}`)
+          ).json(),
+      );
+    }
+
+    iso(
+      h(App, {
+        dehydratedState: data?.dehydratedState,
+        // `window` matters. We want JSDOM navigator in tests, not Node.js one.
+        i18n: await getI18n(...window.navigator.languages),
+      }),
+      app,
+    );
+  }
+}
+
+/** @param {{ children?: import("preact").ComponentChildren, dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> }} props */
+export function Router({ children, dehydratedState, i18n }) {
+  const [queryClient] = useState(
+    () =>
+      new QueryClient({
+        defaultOptions: { queries: { staleTime: 60 * 1000 } },
+      }),
+  );
+
+  return h(
+    RawI18nProvider,
+    { value: /** @type {any} */ (i18n) },
+    h(
+      QueryClientProvider,
+      { client: queryClient },
+      h(
+        Hydrate,
+        { state: dehydratedState },
+        h(
+          LocationProvider,
+          null,
+          h(ErrorBoundary, null, h(IsoRouter, null, children)),
+        ),
+      ),
+    ),
+  );
+}
+
+/**
+ * @param {(props: { dehydratedState?: ReturnType<import("./query.js").dehydrate> | undefined, i18n: ReturnType<import("./i18n.js").useI18n> }) => import("preact").VNode} App
+ * @param {{ lang?: string, url: string }} data
+ */
+export async function ssr(App, data) {
+  const origin = process.env["ORIGIN"] || "http://localhost:5173";
+  const i18n = await getI18n(...(data.lang ? [data.lang] : []));
+
+  const queryClient = new QueryClient({
+    defaultOptions: { queries: { staleTime: 0 } },
+  });
+  await queryClient.prefetchQuery(
+    queryApi({ lang: i18n.getLocale(), origin, path: data.url }),
+  );
+  const dehydratedState = dehydrate(queryClient, {
+    shouldRedactErrors: (error) => {
+      const { name } = /** @type {any} */ (error);
+      return !(Number(name) && name == "404");
+    },
+  });
+
+  locationStub(data.url);
+  const { html, links } = await prerender(h(/** @type {any} */ (App), {}), {
+    props: { dehydratedState, i18n },
+  });
+  const { metas, title } = toStatic();
+
+  return {
+    data: { ...data, dehydratedState },
+    head: {
+      elements: new Set(
+        metas.map((props) => ({
+          props: Object.fromEntries(
+            Object.entries(props).map(([name, content]) => [
+              name,
+              String(content),
+            ]),
+          ),
+          type: "meta",
+        })),
+      ),
+      lang: i18n.getLocale(),
+      title,
+    },
+    html,
+    links,
+  };
+}
+
+export const a = HTMLElement("a");
+export const address = HTMLElement("address");
+export const article = HTMLElement("article");
+export const aside = HTMLElement("aside");
+export const audio = HTMLElement("audio");
+export const b = HTMLElement("b");
+export const blockquote = HTMLElement("blockquote");
+export const br = HTMLElement("br");
+export const button = HTMLElement("button");
+export const canvas = HTMLElement("canvas");
+export const circle = HTMLElement("circle");
+export const code = HTMLElement("code");
+export const del = HTMLElement("del");
+export const details = HTMLElement("details");
+export const dialog = HTMLElement("dialog");
+export const div = HTMLElement("div");
+export const em = HTMLElement("em");
+export const fieldset = HTMLElement("fieldset");
+export const figcaption = HTMLElement("figcaption");
+export const figure = HTMLElement("figure");
+export const footer = HTMLElement("footer");
+export const form = HTMLElement("form");
+export const h1 = HTMLElement("h1");
+export const h2 = HTMLElement("h2");
+export const h3 = HTMLElement("h3");
+export const h4 = HTMLElement("h4");
+export const h5 = HTMLElement("h5");
+export const h6 = HTMLElement("h6");
+export const header = HTMLElement("header");
+export const hgroup = HTMLElement("hgroup");
+export const hr = HTMLElement("hr");
+export const i = HTMLElement("i");
+export const iframe = HTMLElement("iframe");
+export const img = HTMLElement("img");
+export const input = HTMLElement("input");
+export const ins = HTMLElement("ins");
+export const label = HTMLElement("label");
+export const legend = HTMLElement("legend");
+export const li = HTMLElement("li");
+export const main = HTMLElement("main");
+export const nav = HTMLElement("nav");
+export const ol = HTMLElement("ol");
+export const option = HTMLElement("option");
+export const p = HTMLElement("p");
+export const path = HTMLElement("path");
+export const picture = HTMLElement("picture");
+export const pre = HTMLElement("pre");
+export const section = HTMLElement("section");
+export const select = HTMLElement("select");
+export const small = HTMLElement("small");
+export const source = HTMLElement("source");
+export const span = HTMLElement("span");
+export const strong = HTMLElement("strong");
+export const sub = HTMLElement("sub");
+export const summary = HTMLElement("summary");
+export const sup = HTMLElement("sup");
+export const svg = HTMLElement("svg");
+export const table = HTMLElement("table");
+export const tbody = HTMLElement("tbody");
+export const td = HTMLElement("td");
+export const textarea = HTMLElement("textarea");
+export const thead = HTMLElement("thead");
+export const title = HTMLElement("title");
+export const tr = HTMLElement("tr");
+export const ul = HTMLElement("ul");
+export const video = HTMLElement("video");
+
+export { flatten, primary, references, relations };
+export { getI18n, useApi, useEnhance, useI18n, useQueryClient, useStatus };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "evikit",
   "description": "Preact/SQLite SSR framework for small web apps",
-  "version": "2.3.2",
+  "version": "2.4.0",
   "type": "module",
   "exports": {
     ".": "./index.js",