@absolutejs/absolute 0.20.0-beta.169 → 0.20.0-beta.170

package/dist/react/hooks/index.js

@@ -1,4 +1,339 @@
 // @bun
+// src/utils/formActionProtocol.ts
+var ACTION_ERROR_ATTRIBUTE = "data-action-error", ACTION_FORM_ATTRIBUTE = "data-absolute-action", ACTION_MESSAGE_ATTRIBUTE = "data-action-message", ACTION_REQUEST_HEADER = "x-absolute-action", ACTION_STATUS_ATTRIBUTE = "data-action-status", ACTION_SUCCESS_ATTRIBUTE = "data-action-success", isRecord3 = (value) => typeof value === "object" && value !== null && !Array.isArray(value), isStringRecord = (value) => isRecord3(value) && Object.values(value).every((entry) => typeof entry === "string"), isOptionalString = (value) => value === undefined || typeof value === "string", isActionResult = (value) => {
+  if (!isRecord3(value))
+    return false;
+  if (value.status === "success")
+    return isOptionalString(value.redirect);
+  return value.status === "error" && isStringRecord(value.errors) && isOptionalString(value.message);
+};
+// src/react/hooks/useI18n.ts
+import {
+  createContext,
+  createElement,
+  useContext,
+  useMemo
+} from "react";
+
+// src/i18n/intlCache.ts
+var numberFormats = new Map;
+var dateTimeFormats = new Map;
+var pluralRules = new Map;
+var relativeTimeFormats = new Map;
+var listFormats = new Map;
+var cacheKey = (locale, options) => `${locale}|${options ? JSON.stringify(options) : ""}`;
+var cached = (cache, key, create) => {
+  const existing = cache.get(key);
+  if (existing)
+    return existing;
+  const created = create();
+  cache.set(key, created);
+  return created;
+};
+var getDateTimeFormat = (locale, options) => cached(dateTimeFormats, cacheKey(locale, options), () => new Intl.DateTimeFormat(locale, options));
+var getListFormat = (locale, options) => cached(listFormats, cacheKey(locale, options), () => new Intl.ListFormat(locale, options));
+var getNumberFormat = (locale, options) => cached(numberFormats, cacheKey(locale, options), () => new Intl.NumberFormat(locale, options));
+var getPluralRules = (locale, options) => cached(pluralRules, cacheKey(locale, options), () => new Intl.PluralRules(locale, options));
+var getRelativeTimeFormat = (locale, options) => cached(relativeTimeFormats, cacheKey(locale, options), () => new Intl.RelativeTimeFormat(locale, options));
+
+// src/i18n/formatMessage.ts
+var SYNTAX_CHARS = new Set(["{", "}", "#", "|"]);
+var WHITESPACE = /\s/;
+var isBranchKind = (value) => value === "plural" || value === "select" || value === "selectordinal";
+var skipWhitespace = (cursor) => {
+  while (cursor.index < cursor.source.length && WHITESPACE.test(cursor.source.charAt(cursor.index))) {
+    cursor.index += 1;
+  }
+};
+var syntaxError = (cursor, expected) => new SyntaxError(`Invalid ICU message (expected ${expected} at ${cursor.index}): ${cursor.source}`);
+var readToken = (cursor, stops) => {
+  const start = cursor.index;
+  while (cursor.index < cursor.source.length && !stops.includes(cursor.source.charAt(cursor.index))) {
+    cursor.index += 1;
+  }
+  return cursor.source.slice(start, cursor.index).trim();
+};
+var expectChar = (cursor, char) => {
+  skipWhitespace(cursor);
+  if (cursor.source.charAt(cursor.index) !== char)
+    throw syntaxError(cursor, `"${char}"`);
+  cursor.index += 1;
+};
+var readQuoted = (cursor, inPlural) => {
+  const next = cursor.source.charAt(cursor.index + 1);
+  if (next === "'") {
+    cursor.index += 2;
+    return "'";
+  }
+  const opensQuote = SYNTAX_CHARS.has(next) && (next !== "#" || inPlural);
+  if (!opensQuote) {
+    cursor.index += 1;
+    return "'";
+  }
+  cursor.index += 1;
+  let text = "";
+  while (cursor.index < cursor.source.length) {
+    const char = cursor.source.charAt(cursor.index);
+    const isEscapedQuote = char === "'" && cursor.source.charAt(cursor.index + 1) === "'";
+    if (char === "'" && !isEscapedQuote)
+      break;
+    text += char;
+    cursor.index += isEscapedQuote ? 2 : 1;
+  }
+  cursor.index += 1;
+  return text;
+};
+var pushText = (nodes, value) => {
+  const last = nodes[nodes.length - 1];
+  if (last?.kind === "text") {
+    last.value += value;
+    return;
+  }
+  nodes.push({ kind: "text", value });
+};
+var parseBranchOption = (cursor, kind, branches) => {
+  if (cursor.index >= cursor.source.length)
+    throw syntaxError(cursor, '"}"');
+  const selector = readToken(cursor, `{} 
+	\r`);
+  const offsetMatch = /^offset:(\d+)$/.exec(selector);
+  if (offsetMatch && kind !== "select") {
+    branches.offset = Number(offsetMatch[1]);
+    skipWhitespace(cursor);
+    return;
+  }
+  if (selector === "")
+    throw syntaxError(cursor, "a selector");
+  expectChar(cursor, "{");
+  branches.options[selector] = parseNodes(cursor, kind !== "select");
+  expectChar(cursor, "}");
+  skipWhitespace(cursor);
+};
+var parseBranchOptions = (cursor, kind) => {
+  const branches = { offset: 0, options: {} };
+  skipWhitespace(cursor);
+  while (cursor.source.charAt(cursor.index) !== "}") {
+    parseBranchOption(cursor, kind, branches);
+  }
+  if (branches.options.other === undefined)
+    throw syntaxError(cursor, 'an "other" branch');
+  return branches;
+};
+var parseArgument = (cursor) => {
+  skipWhitespace(cursor);
+  const name = readToken(cursor, ",}");
+  if (name === "")
+    throw syntaxError(cursor, "an argument name");
+  if (cursor.source.charAt(cursor.index) === "}") {
+    cursor.index += 1;
+    return { format: undefined, kind: "argument", name, style: undefined };
+  }
+  cursor.index += 1;
+  const format = readToken(cursor, ",}");
+  if (isBranchKind(format)) {
+    expectChar(cursor, ",");
+    const { offset, options } = parseBranchOptions(cursor, format);
+    expectChar(cursor, "}");
+    return { kind: format, name, offset, options };
+  }
+  let style;
+  if (cursor.source.charAt(cursor.index) === ",") {
+    cursor.index += 1;
+    style = readToken(cursor, "}");
+  }
+  expectChar(cursor, "}");
+  return { format, kind: "argument", name, style };
+};
+var parseNode = (cursor, inPlural, nodes) => {
+  const char = cursor.source.charAt(cursor.index);
+  if (char === "{") {
+    cursor.index += 1;
+    nodes.push(parseArgument(cursor));
+    return;
+  }
+  if (char === "#" && inPlural) {
+    cursor.index += 1;
+    nodes.push({ kind: "pound" });
+    return;
+  }
+  if (char === "'") {
+    pushText(nodes, readQuoted(cursor, inPlural));
+    return;
+  }
+  pushText(nodes, char);
+  cursor.index += 1;
+};
+var parseNodes = (cursor, inPlural) => {
+  const nodes = [];
+  while (cursor.index < cursor.source.length && cursor.source.charAt(cursor.index) !== "}") {
+    parseNode(cursor, inPlural, nodes);
+  }
+  return nodes;
+};
+var parseMessage = (source) => {
+  const cursor = { index: 0, source };
+  const nodes = parseNodes(cursor, false);
+  if (cursor.index < source.length)
+    throw syntaxError(cursor, "end of message");
+  return nodes;
+};
+var parsedCache = new Map;
+var parseCached = (source) => {
+  const cached = parsedCache.get(source);
+  if (cached)
+    return cached;
+  let parsed;
+  try {
+    parsed = parseMessage(source);
+  } catch (error) {
+    parsed = error instanceof SyntaxError ? error : new SyntaxError(String(error));
+  }
+  parsedCache.set(source, parsed);
+  return parsed;
+};
+var INTEGER_OPTIONS = { maximumFractionDigits: 0 };
+var PERCENT_OPTIONS = { style: "percent" };
+var numberOptions = (style) => {
+  if (style === "integer")
+    return INTEGER_OPTIONS;
+  if (style === "percent")
+    return PERCENT_OPTIONS;
+  const currency = /^::currency\/([A-Za-z]{3})$/.exec(style ?? "");
+  const options = currency?.[1] ? { currency: currency[1].toUpperCase(), style: "currency" } : {};
+  return options;
+};
+var toDate = (value) => {
+  if (value instanceof Date)
+    return value;
+  if (typeof value === "number" || typeof value === "string")
+    return new Date(value);
+  return;
+};
+var dateStyleOf = (style) => {
+  if (style === "full" || style === "long" || style === "short")
+    return style;
+  return "medium";
+};
+var formatDateArgument = (locale, value, format, style) => {
+  const date = toDate(value);
+  if (!date || Number.isNaN(date.getTime()))
+    return String(value);
+  const resolvedStyle = dateStyleOf(style);
+  const options = format === "date" ? { dateStyle: resolvedStyle } : { timeStyle: resolvedStyle };
+  return getDateTimeFormat(locale, options).format(date);
+};
+var formatValue = (locale, value) => {
+  if (typeof value === "number" || typeof value === "bigint")
+    return getNumberFormat(locale).format(value);
+  if (value instanceof Date)
+    return getDateTimeFormat(locale).format(value);
+  return String(value);
+};
+var formatArgument = (locale, node, params) => {
+  if (!(node.name in params))
+    return `{${node.name}}`;
+  const value = params[node.name];
+  if (node.format === "number") {
+    const numeric = typeof value === "bigint" ? value : Number(value);
+    return getNumberFormat(locale, numberOptions(node.style)).format(numeric);
+  }
+  if (node.format === "date" || node.format === "time")
+    return formatDateArgument(locale, value, node.format, node.style);
+  return formatValue(locale, value);
+};
+var selectBranch = (locale, node, value) => {
+  if (node.kind === "select") {
+    return node.options[String(value)] ?? node.options.other ?? [];
+  }
+  const numeric = Number(value);
+  const exact = node.options[`=${numeric}`];
+  if (exact)
+    return exact;
+  const category = getPluralRules(locale, {
+    type: node.kind === "selectordinal" ? "ordinal" : "cardinal"
+  }).select(numeric - node.offset);
+  return node.options[category] ?? node.options.other ?? [];
+};
+var formatNodes = (locale, nodes, params, pound) => nodes.map((node) => {
+  if (node.kind === "text")
+    return node.value;
+  if (node.kind === "pound")
+    return pound ?? "#";
+  if (node.kind === "argument")
+    return formatArgument(locale, node, params);
+  if (!(node.name in params))
+    return `{${node.name}}`;
+  const value = params[node.name];
+  const branch = selectBranch(locale, node, value);
+  const branchPound = node.kind === "select" ? pound : getNumberFormat(locale).format(Number(value) - node.offset);
+  return formatNodes(locale, branch, params, branchPound);
+}).join("");
+var formatMessage = (locale, message, params = {}) => {
+  if (!message.includes("{") && !message.includes("'"))
+    return message;
+  const parsed = parseCached(message);
+  if (parsed instanceof SyntaxError)
+    return message;
+  return formatNodes(locale, parsed, params, undefined);
+};
+
+// src/i18n/translator.ts
+var isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+var lookupMessage = (messages, key) => {
+  let node = messages;
+  for (const segment of key.split(".")) {
+    if (typeof node !== "object")
+      return;
+    node = node[segment];
+  }
+  return typeof node === "string" ? node : undefined;
+};
+var isMessageTreeValue = (value) => typeof value === "string" || isMessageTree(value);
+var isI18nPayload = (value) => isRecord(value) && typeof value.locale === "string" && typeof value.defaultLocale === "string" && (value.dir === "ltr" || value.dir === "rtl") && isMessageTree(value.messages);
+var isMessageTree = (value) => isRecord(value) && Object.values(value).every(isMessageTreeValue);
+var toDate2 = (value) => value instanceof Date ? value : new Date(value);
+var warnedKeys = new Set;
+var warnMissing = (locale, key) => {
+  const id = `${locale}:${key}`;
+  if (warnedKeys.has(id))
+    return;
+  warnedKeys.add(id);
+  console.warn(`[i18n] Missing message "${key}" for locale "${locale}"`);
+};
+var createTranslator = (payload) => {
+  const { locale, messages } = payload;
+  const t = (key, ...args) => {
+    const message = lookupMessage(messages, key);
+    if (message === undefined) {
+      warnMissing(locale, key);
+      return key;
+    }
+    const [params] = args;
+    return formatMessage(locale, message, isRecord(params) ? params : {});
+  };
+  const translator = {
+    dir: payload.dir,
+    locale,
+    t,
+    formatDate: (value, options) => getDateTimeFormat(locale, options).format(toDate2(value)),
+    formatList: (items, options) => getListFormat(locale, options).format(items),
+    formatNumber: (value, options) => getNumberFormat(locale, options).format(value),
+    formatRelativeTime: (value, unit, options) => getRelativeTimeFormat(locale, options).format(value, unit),
+    has: (key) => lookupMessage(messages, key) !== undefined
+  };
+  return translator;
+};
+
+// src/react/hooks/useI18n.ts
+var I18nContext = createContext(null);
+var I18nProvider = ({ value, children }) => createElement(I18nContext.Provider, { value }, children);
+var useI18n = () => {
+  const payload = useContext(I18nContext);
+  if (payload === null) {
+    throw new Error("useI18n must be used within an I18nProvider");
+  }
+  return useMemo(() => createTranslator(payload), [payload]);
+};
 // src/react/hooks/useIslandStore.ts
 import { useSyncExternalStore } from "react";
 
@@ -105,14 +440,14 @@ var useIslandStore = (store, selector) => useSyncExternalStore((listener) => sub
 }), () => readIslandStore(store, selector), () => getIslandStoreServerSnapshot(store, selector));
 // src/react/hooks/useMediaQuery.ts
 import {
-  createContext,
-  useContext,
+  createContext as createContext2,
+  useContext as useContext2,
   useSyncExternalStore as useSyncExternalStore2
 } from "react";
-var UserAgentContext = createContext(null);
+var UserAgentContext = createContext2(null);
 var UserAgentProvider = UserAgentContext.Provider;
 var useUserAgentType = () => {
-  const context = useContext(UserAgentContext);
+  const context = useContext2(UserAgentContext);
   if (context === null) {
     throw new Error("useMediaQuery must be used within a UserAgentProvider");
   }
@@ -188,6 +523,20 @@ var useMediaQuery = (customBreakpoints = defaultBreakpoints) => {
 // src/react/hooks/usePrefetch.ts
 import { useCallback, useEffect, useRef } from "react";
 
+// src/dev/client/cspNonce.ts
+var applyPageNonce = (element) => {
+  const nonce = readPageNonce();
+  if (nonce)
+    element.nonce = nonce;
+  return element;
+};
+var readPageNonce = () => {
+  if (typeof document === "undefined")
+    return;
+  const carrier = document.querySelector("script[nonce], style[nonce]");
+  return carrier?.nonce || undefined;
+};
+
 // src/client/prefetch.ts
 var PREFETCH_CACHE_LIMIT = 16;
 var HOVER_DEBOUNCE_MS = 250;
@@ -206,7 +555,7 @@ var prefetchedStyles = new Set;
 var liveSpeculationRules = new Map;
 var offlineResponse = () => new Response(null, { status: 0 });
 var storageKind = (kind) => kind === "route" ? "document" : kind;
-var cacheKey = (kind, url) => `${storageKind(kind)}:${url}`;
+var cacheKey2 = (kind, url) => `${storageKind(kind)}:${url}`;
 var resolveHref = (url) => {
   if (typeof window === "undefined")
     return url;
@@ -379,13 +728,13 @@ var preloadModule = (href) => {
   injectLink("modulepreload", href);
   return true;
 };
-var isRecord = (value) => typeof value === "object" && value !== null;
+var isRecord2 = (value) => typeof value === "object" && value !== null;
 var isHref = (value) => typeof value === "string" && value.length > 0;
 var warmRouteDataAssets = (envelope) => {
-  if (!isRecord(envelope))
+  if (!isRecord2(envelope))
     return;
   const { assets } = envelope;
-  if (!isRecord(assets))
+  if (!isRecord2(assets))
     return;
   const { client, css, index } = assets;
   for (const href of [index, client].filter(isHref))
@@ -431,7 +780,7 @@ var prefetch = (url, options = {}) => {
     prefetch(url, { kind: "data" });
     return;
   }
-  const key = cacheKey(kind, url);
+  const key = cacheKey2(kind, url);
   const existing = cache.get(key);
   if (existing) {
     touch(key, existing);
@@ -462,7 +811,7 @@ var speculate = (url) => {
     liveSpeculationRules.get(oldest.value)?.remove();
     liveSpeculationRules.delete(oldest.value);
   }
-  const script = document.createElement("script");
+  const script = applyPageNonce(document.createElement("script"));
   script.type = "speculationrules";
   script.textContent = JSON.stringify({
     prerender: [{ eagerness: "immediate", urls: [url] }]
@@ -481,6 +830,7 @@ var scheduleHoverPrefetch = (url, options = {}) => {
     prefetch(url, { kind: options.kind ?? "route" });
     if (options.prerender)
       speculate(url);
+    options.onPrefetch?.();
   }, HOVER_DEBOUNCE_MS);
   return {
     cancel: () => window.clearTimeout(timer)
@@ -495,8 +845,10 @@ var handleIntersections = (entries) => {
     const target = viewportTargets.get(entry.target);
     viewportObserver?.unobserve(entry.target);
     viewportTargets.delete(entry.target);
-    if (target)
-      prefetch(target.url, target.options);
+    if (!target)
+      continue;
+    prefetch(target.url, { kind: target.options.kind });
+    target.options.onVisible?.();
   }
 };
 var getViewportObserver = () => {
@@ -576,12 +928,126 @@ var usePrefetch = (href, options = {}) => {
     ref: elementRef
   };
 };
+// src/react/hooks/useFormAction.ts
+import {
+  useCallback as useCallback2,
+  useEffect as useEffect2,
+  useRef as useRef2,
+  useState
+} from "react";
+
+// src/client/formActions.ts
+var failure = (message) => ({
+  errors: {},
+  message,
+  status: "error"
+});
+var readPayload = async (response) => {
+  try {
+    const payload = await response.json();
+    return payload;
+  } catch {
+    return;
+  }
+};
+var formActionReducer = (path) => async (_previous, body) => submitFormAction(path, body);
+var submitFormAction = async (path, body, options = {}) => {
+  const response = await fetch(path, {
+    body,
+    credentials: "same-origin",
+    headers: { accept: "application/json", [ACTION_REQUEST_HEADER]: "1" },
+    method: "POST",
+    signal: options.signal
+  }).catch((error) => {
+    if (options.signal?.aborted)
+      throw error;
+    return;
+  });
+  if (!response) {
+    const result = failure("Network error: the form was not sent.");
+    return result;
+  }
+  const payload = await readPayload(response);
+  if (isActionResult(payload))
+    return payload;
+  const result = failure(`The server could not handle the form (HTTP ${response.status}).`);
+  return result;
+};
+
+// src/react/hooks/useFormAction.ts
+var IDLE = { status: "idle" };
+var submitterOf = (event) => {
+  const { nativeEvent } = event;
+  return "submitter" in nativeEvent && nativeEvent.submitter instanceof HTMLElement ? nativeEvent.submitter : null;
+};
+var useFormAction = (path, options = {}) => {
+  const [state, setState] = useState(() => options.initialState ?? IDLE);
+  const [pending, setPending] = useState(false);
+  const controllerRef = useRef2(null);
+  const resetOnSuccess = options.resetOnSuccess !== false;
+  useEffect2(() => () => controllerRef.current?.abort(), []);
+  const submit = useCallback2(async (body) => {
+    controllerRef.current?.abort();
+    const controller = new AbortController;
+    controllerRef.current = controller;
+    setPending(true);
+    try {
+      const result = await submitFormAction(path, body, {
+        signal: controller.signal
+      });
+      setState(result);
+      if (result.status === "success" && result.redirect)
+        window.location.assign(result.redirect);
+      return result;
+    } finally {
+      if (controllerRef.current === controller)
+        setPending(false);
+    }
+  }, [path]);
+  const onSubmit = useCallback2((event) => {
+    event.preventDefault();
+    const form = event.currentTarget;
+    const body = new FormData(form, submitterOf(event));
+    const clearOnSuccess = async () => {
+      const result = await submit(body);
+      if (result.status === "success" && !result.redirect && resetOnSuccess)
+        form.reset();
+    };
+    clearOnSuccess().catch(() => {
+      return;
+    });
+  }, [resetOnSuccess, submit]);
+  const reset = useCallback2(() => setState(IDLE), []);
+  const errors = state.status === "error" ? state.errors : {};
+  const values = state.status === "error" ? state.values ?? {} : {};
+  return {
+    data: state.status === "success" ? state.data : undefined,
+    errors,
+    formProps: {
+      action: path,
+      encType: "multipart/form-data",
+      method: "post",
+      onSubmit
+    },
+    message: state.status === "error" ? state.message : undefined,
+    pending,
+    reset,
+    state,
+    submit,
+    values
+  };
+};
 export {
+  I18nProvider,
   UserAgentProvider,
+  formActionReducer,
+  submitFormAction,
+  useFormAction,
+  useI18n,
   useIslandStore,
   useMediaQuery,
   usePrefetch
 };
 
-//# debugId=6C56035ACADC29DB64756E2164756E21
+//# debugId=B1E13CF34C32092B64756E2164756E21
 //# sourceMappingURL=index.js.map