@wular/pnext 0.0.4 → 0.0.6

package/src/compat/react/dom-client.ts

@@ -5,111 +5,111 @@
  * browser bundles. Resource hints are no-ops here; they are only meaningful in the
  * server response-finalization pipeline.
  */
-import ReactCompat from 'preact/compat';
-import { useActionState } from './preact';
+import ReactCompat from 'preact/compat'
+import { useActionState } from './preact'
 
 const ReactDomCompat = Object.assign(ReactCompat, {
   preload,
   preconnect,
   prefetchDNS,
   preinit,
-});
+})
 
-export default ReactDomCompat;
+export default ReactDomCompat
 
 // The react-dom surface preact/compat provides (named, because preact/compat's
 // types use `export =` which blocks `export *`).
-export const render = ReactCompat.render;
-export const hydrate = ReactCompat.hydrate;
-export const createPortal = ReactCompat.createPortal;
-export const findDOMNode = ReactCompat.findDOMNode;
-export const flushSync = ReactCompat.flushSync;
-export const unmountComponentAtNode = ReactCompat.unmountComponentAtNode;
-export const unstable_batchedUpdates = ReactCompat.unstable_batchedUpdates;
-export const version = ReactCompat.version;
+export const render = ReactCompat.render
+export const hydrate = ReactCompat.hydrate
+export const createPortal = ReactCompat.createPortal
+export const findDOMNode = ReactCompat.findDOMNode
+export const flushSync = ReactCompat.flushSync
+export const unmountComponentAtNode = ReactCompat.unmountComponentAtNode
+export const unstable_batchedUpdates = ReactCompat.unstable_batchedUpdates
+export const version = ReactCompat.version
 
 function noOpRecordResourceHint() {
   // intentionally empty: client bundles do not build response headers.
 }
 
 export function preload(_href: string, _options?: { as?: string; crossOrigin?: string }) {
-  noOpRecordResourceHint();
+  noOpRecordResourceHint()
   // no-op on client; header collection happens in server response finalizers.
 }
 
 export function preconnect(_href: string, _options?: { crossOrigin?: string }) {
-  noOpRecordResourceHint();
+  noOpRecordResourceHint()
   // no-op on client; header collection happens in server response finalizers.
 }
 
 export function prefetchDNS(_href: string) {
-  noOpRecordResourceHint();
+  noOpRecordResourceHint()
   // no-op on client; header collection happens in server response finalizers.
 }
 
 export function preinit(_href: string, _options?: { as?: string; crossOrigin?: string }) {
-  noOpRecordResourceHint();
+  noOpRecordResourceHint()
   // no-op on client; header collection happens in server response finalizers.
 }
 
-export const useFormState = useActionState;
+export const useFormState = useActionState
 
 export interface FormStatusNotPending {
-  pending: false;
-  data: null;
-  method: null;
-  action: null;
+  pending: false
+  data: null
+  method: null
+  action: null
 }
 
 export interface FormStatusPending {
-  pending: true;
-  data: FormData;
-  method: string;
-  action: string | ((formData: FormData) => void | Promise<void>);
+  pending: true
+  data: FormData
+  method: string
+  action: string | ((formData: FormData) => void | Promise<void>)
 }
 
-export type FormStatus = FormStatusPending | FormStatusNotPending;
+export type FormStatus = FormStatusPending | FormStatusNotPending
 
 const NOT_PENDING: FormStatusNotPending = {
   pending: false,
   data: null,
   method: null,
   action: null,
-};
+}
 
 // Form-status store, fed by the client entry's function-form-action runtime.
-const pendingStack: FormStatusPending[] = [];
-const listeners = new Set<() => void>();
-let storeVersion = 0;
+const pendingStack: FormStatusPending[] = []
+const listeners = new Set<() => void>()
+let storeVersion = 0
 
 /** Called by the client runtime when a function form action starts/finishes. */
 export function __pnextPushFormStatus(status: FormStatusPending): () => void {
-  pendingStack.push(status);
-  notify();
+  pendingStack.push(status)
+  notify()
   return () => {
-    const index = pendingStack.indexOf(status);
-    if (index !== -1) pendingStack.splice(index, 1);
-    notify();
-  };
+    const index = pendingStack.indexOf(status)
+    if (index !== -1) pendingStack.splice(index, 1)
+    notify()
+  }
 }
 
 function notify() {
-  storeVersion += 1;
-  for (const listener of [...listeners]) listener();
+  storeVersion += 1
+  for (const listener of [...listeners]) listener()
 }
 
 function subscribe(listener: () => void) {
-  listeners.add(listener);
+  listeners.add(listener)
   return () => {
-    listeners.delete(listener);
-  };
+    listeners.delete(listener)
+  }
 }
 
 export function useFormStatus(): FormStatus {
-  ReactCompat.useSyncExternalStore(subscribe, () => storeVersion);
-  return pendingStack.length > 0 ? pendingStack[pendingStack.length - 1]! : NOT_PENDING;
+  ReactCompat.useSyncExternalStore(subscribe, () => storeVersion)
+  return pendingStack.length > 0 ? pendingStack[pendingStack.length - 1]! : NOT_PENDING
 }
 
 export function requestFormReset(form: HTMLFormElement) {
-  if (form && typeof form.reset === 'function') form.reset();
+  if (form && typeof form.reset === 'function') form.reset()
 }

package/src/compat/react/dom-react-server.ts

@@ -1,20 +1,14 @@
-import ReactDomCompat, {
-  preconnect,
-  prefetchDNS,
-  preinit,
-  preload,
-  version,
-} from './dom';
+import ReactDomCompat, { preconnect, prefetchDNS, preinit, preload, version } from './dom'
 
 const ReactDomServer = { ...ReactDomCompat } as typeof ReactDomCompat & {
-  useFormState?: unknown;
-  useFormStatus?: unknown;
-  requestFormReset?: unknown;
-};
+  useFormState?: unknown
+  useFormStatus?: unknown
+  requestFormReset?: unknown
+}
 
-delete ReactDomServer.useFormState;
-delete ReactDomServer.useFormStatus;
-delete ReactDomServer.requestFormReset;
+delete ReactDomServer.useFormState
+delete ReactDomServer.useFormStatus
+delete ReactDomServer.requestFormReset
 
-export { preconnect, prefetchDNS, preinit, preload, version };
-export default ReactDomServer;
+export { preconnect, prefetchDNS, preinit, preload, version }
+export default ReactDomServer

package/src/compat/react/dom-server.ts

@@ -6,28 +6,28 @@
  * server APIs (renderToReadableStream / renderToPipeableStream) have no direct
  * preact equivalent that fits a browser bundle, so they throw if invoked.
  */
-import ReactCompat from 'preact/compat';
+import ReactCompat from 'preact/compat'
 import {
   renderToStaticMarkup as preactRenderToStaticMarkup,
   renderToString as preactRenderToString,
   renderToStringAsync as preactRenderToStringAsync,
-} from 'preact-render-to-string';
+} from 'preact-render-to-string'
 
-export const version = ReactCompat.version;
-export const renderToString = preactRenderToString;
-export const renderToStaticMarkup = preactRenderToStaticMarkup;
-export const renderToStringAsync = preactRenderToStringAsync;
+export const version = ReactCompat.version
+export const renderToString = preactRenderToString
+export const renderToStaticMarkup = preactRenderToStaticMarkup
+export const renderToStringAsync = preactRenderToStringAsync
 
 function unsupportedStream(name: string): never {
-  throw new Error(`react-dom/server ${name} is not supported under pnext's preact runtime`);
+  throw new Error(`react-dom/server ${name} is not supported under pnext's preact runtime`)
 }
 
 export function renderToReadableStream(): never {
-  return unsupportedStream('renderToReadableStream');
+  return unsupportedStream('renderToReadableStream')
 }
 
 export function renderToPipeableStream(): never {
-  return unsupportedStream('renderToPipeableStream');
+  return unsupportedStream('renderToPipeableStream')
 }
 
 export default {
@@ -37,4 +37,4 @@ export default {
   renderToStringAsync,
   renderToReadableStream,
   renderToPipeableStream,
-};
+}

package/src/compat/react/dom.ts

@@ -13,39 +13,39 @@
  * - requestFormReset: passthrough to form.reset(); the client runtime resets
  *   uncontrolled forms after a successful action itself.
  */
-import ReactCompat from 'preact/compat';
-import { useActionState } from './preact';
-import { registerResourceHint } from '../../render/resource-hints';
+import ReactCompat from 'preact/compat'
+import { useActionState } from './preact'
+import { registerResourceHint } from '../../render/resource-hints'
 
 const ReactDomCompat = Object.assign(ReactCompat, {
   preload,
   preconnect,
   prefetchDNS,
   preinit,
-});
+})
 
-export default ReactDomCompat;
+export default ReactDomCompat
 
 // The react-dom surface preact/compat provides (named, because preact/compat's
 // types use `export =` which blocks `export *`).
-export const render = ReactCompat.render;
-export const hydrate = ReactCompat.hydrate;
-export const createPortal = ReactCompat.createPortal;
-export const findDOMNode = ReactCompat.findDOMNode;
-export const flushSync = ReactCompat.flushSync;
-export const unmountComponentAtNode = ReactCompat.unmountComponentAtNode;
-export const unstable_batchedUpdates = ReactCompat.unstable_batchedUpdates;
-export const version = ReactCompat.version;
+export const render = ReactCompat.render
+export const hydrate = ReactCompat.hydrate
+export const createPortal = ReactCompat.createPortal
+export const findDOMNode = ReactCompat.findDOMNode
+export const flushSync = ReactCompat.flushSync
+export const unmountComponentAtNode = ReactCompat.unmountComponentAtNode
+export const unstable_batchedUpdates = ReactCompat.unstable_batchedUpdates
+export const version = ReactCompat.version
 
 export function preload(
   href: string,
   options?: {
-    as?: string;
-    crossOrigin?: string;
-    type?: string;
-    fetchPriority?: string;
-    media?: string;
-    nonce?: string;
+    as?: string
+    crossOrigin?: string
+    type?: string
+    fetchPriority?: string
+    media?: string
+    nonce?: string
   },
 ) {
   registerResourceHint({
@@ -61,7 +61,7 @@ export function preload(
     ...(options?.crossOrigin
       ? { crossOrigin: options.crossOrigin as 'anonymous' | 'use-credentials' | '' }
       : {}),
-  });
+  })
 }
 
 export function preconnect(href: string, options?: { crossOrigin?: string }) {
@@ -71,11 +71,11 @@ export function preconnect(href: string, options?: { crossOrigin?: string }) {
     ...(options?.crossOrigin
       ? { crossOrigin: options.crossOrigin as 'anonymous' | 'use-credentials' | '' }
       : {}),
-  });
+  })
 }
 
 export function prefetchDNS(href: string) {
-  registerResourceHint({ rel: 'dns-prefetch', url: href });
+  registerResourceHint({ rel: 'dns-prefetch', url: href })
 }
 
 export function preinit(href: string, options?: { as?: string; crossOrigin?: string }) {
@@ -86,69 +86,69 @@ export function preinit(href: string, options?: { as?: string; crossOrigin?: str
     ...(options?.crossOrigin
       ? { crossOrigin: options.crossOrigin as 'anonymous' | 'use-credentials' | '' }
       : {}),
-  });
+  })
 }
 
-export const useFormState = useActionState;
+export const useFormState = useActionState
 
 export interface FormStatusNotPending {
-  pending: false;
-  data: null;
-  method: null;
-  action: null;
+  pending: false
+  data: null
+  method: null
+  action: null
 }
 
 export interface FormStatusPending {
-  pending: true;
-  data: FormData;
-  method: string;
-  action: string | ((formData: FormData) => void | Promise<void>);
+  pending: true
+  data: FormData
+  method: string
+  action: string | ((formData: FormData) => void | Promise<void>)
 }
 
-export type FormStatus = FormStatusPending | FormStatusNotPending;
+export type FormStatus = FormStatusPending | FormStatusNotPending
 
 const NOT_PENDING: FormStatusNotPending = {
   pending: false,
   data: null,
   method: null,
   action: null,
-};
+}
 
 // Form-status store, fed by the client entry's function-form-action runtime.
-const pendingStack: FormStatusPending[] = [];
-const listeners = new Set<() => void>();
-let storeVersion = 0;
+const pendingStack: FormStatusPending[] = []
+const listeners = new Set<() => void>()
+let storeVersion = 0
 
 /** Called by the client runtime when a function form action starts/finishes. */
 export function __pnextPushFormStatus(status: FormStatusPending): () => void {
-  pendingStack.push(status);
-  notify();
+  pendingStack.push(status)
+  notify()
   return () => {
-    const index = pendingStack.indexOf(status);
-    if (index !== -1) pendingStack.splice(index, 1);
-    notify();
-  };
+    const index = pendingStack.indexOf(status)
+    if (index !== -1) pendingStack.splice(index, 1)
+    notify()
+  }
 }
 
 function notify() {
-  storeVersion += 1;
-  for (const listener of [...listeners]) listener();
+  storeVersion += 1
+  for (const listener of [...listeners]) listener()
 }
 
 function subscribe(listener: () => void) {
-  listeners.add(listener);
+  listeners.add(listener)
   return () => {
-    listeners.delete(listener);
-  };
+    listeners.delete(listener)
+  }
 }
 
 export function useFormStatus(): FormStatus {
-  ReactCompat.useSyncExternalStore(subscribe, () => storeVersion);
-  return pendingStack.length > 0 ? pendingStack[pendingStack.length - 1]! : NOT_PENDING;
+  ReactCompat.useSyncExternalStore(subscribe, () => storeVersion)
+  return pendingStack.length > 0 ? pendingStack[pendingStack.length - 1]! : NOT_PENDING
 }
 
 export function requestFormReset(form: HTMLFormElement) {
-  if (form && typeof form.reset === 'function') form.reset();
+  if (form && typeof form.reset === 'function') form.reset()
 }
 
-Object.assign(ReactDomCompat, { useFormState, useFormStatus, requestFormReset });
+Object.assign(ReactDomCompat, { useFormState, useFormStatus, requestFormReset })

package/src/compat/react/hooks-extra.ts

@@ -1,5 +1,5 @@
-import { options, type VNode } from 'preact';
-import { useCallback, useRef, useState } from 'preact/hooks';
+import { options, type VNode } from 'preact'
+import { useCallback, useRef, useState } from 'preact/hooks'
 
 // React 19 hooks (use, useActionState, useOptimistic, useTransition) implemented directly on
 // preact/hooks so a suspense-free client bundle can ship them without preact/compat. The full shim
@@ -10,24 +10,24 @@ import { useCallback, useRef, useState } from 'preact/hooks';
 // hooks have a current component. Server-side tree resolution invokes some client components as plain
 // functions, outside any preact render, where hooks would throw - useActionState/useOptimistic fall back
 // to SSR-equivalent static values there instead.
-let renderInFlight = false;
+let renderInFlight = false
 
 export function hooksUsable(): boolean {
-  return renderInFlight;
+  return renderInFlight
 }
 
 {
-  const anyOptions = options as unknown as Record<string, unknown>;
-  const previousRender = anyOptions.__r as ((vnode: VNode) => void) | undefined;
+  const anyOptions = options as unknown as Record<string, unknown>
+  const previousRender = anyOptions.__r as ((vnode: VNode) => void) | undefined
   anyOptions.__r = (vnode: VNode) => {
-    renderInFlight = true;
-    previousRender?.(vnode);
-  };
-  const previousDiffed = options.diffed?.bind(options);
+    renderInFlight = true
+    previousRender?.(vnode)
+  }
+  const previousDiffed = options.diffed?.bind(options)
   options.diffed = vnode => {
-    renderInFlight = false;
-    previousDiffed?.(vnode);
-  };
+    renderInFlight = false
+    previousDiffed?.(vnode)
+  }
 }
 
 /**
@@ -38,27 +38,27 @@ export function hooksUsable(): boolean {
  * while ANY is in flight - matching React.
  */
 export function useTransition(): [boolean, (callback: () => void | Promise<void>) => void] {
-  if (!hooksUsable()) return [false, callback => void callback()];
-  const [pending, setPending] = useState(0);
+  if (!hooksUsable()) return [false, callback => void callback()]
+  const [pending, setPending] = useState(0)
   const startTransition = useCallback((callback: () => void | Promise<void>) => {
-    const mpaBefore = (globalThis as { __pnextMpaNavigation?: number }).__pnextMpaNavigation ?? 0;
-    let result: void | Promise<void>;
+    const mpaBefore = (globalThis as { __pnextMpaNavigation?: number }).__pnextMpaNavigation ?? 0
+    let result: void | Promise<void>
     try {
-      result = callback();
+      result = callback()
     } catch {
-      return;
+      return
     }
-    const mpaAfter = (globalThis as { __pnextMpaNavigation?: number }).__pnextMpaNavigation ?? 0;
+    const mpaAfter = (globalThis as { __pnextMpaNavigation?: number }).__pnextMpaNavigation ?? 0
     if (mpaAfter !== mpaBefore) {
-      setPending(count => count + 1);
-      return;
+      setPending(count => count + 1)
+      return
     }
     if (result && typeof (result as PromiseLike<unknown>).then === 'function') {
-      setPending(count => count + 1);
-      void Promise.resolve(result).finally(() => setPending(count => count - 1));
+      setPending(count => count + 1)
+      void Promise.resolve(result).finally(() => setPending(count => count - 1))
     }
-  }, []);
-  return [pending > 0, startTransition];
+  }, [])
+  return [pending > 0, startTransition]
 }
 
 /**
@@ -70,12 +70,12 @@ export function useOptimistic<State, Payload = State>(
   passthrough: State,
   reducer?: (state: State, payload: Payload) => State,
 ): [State, (payload: Payload) => void] {
-  if (!hooksUsable()) return [passthrough, () => undefined];
-  const [optimistic, setOptimistic] = useState<{ value: State } | null>(null);
-  const lastBase = useRef(passthrough);
+  if (!hooksUsable()) return [passthrough, () => undefined]
+  const [optimistic, setOptimistic] = useState<{ value: State } | null>(null)
+  const lastBase = useRef(passthrough)
   if (lastBase.current !== passthrough) {
-    lastBase.current = passthrough;
-    if (optimistic) setOptimistic(null);
+    lastBase.current = passthrough
+    if (optimistic) setOptimistic(null)
   }
   const dispatch = useCallback(
     (payload: Payload) => {
@@ -83,10 +83,9 @@ export function useOptimistic<State, Payload = State>(
         value: reducer
           ? reducer(current ? current.value : lastBase.current, payload)
           : (payload as unknown as State),
-      }));
+      }))
     },
     [reducer],
-  );
-  return [optimistic ? optimistic.value : passthrough, dispatch];
+  )
+  return [optimistic ? optimistic.value : passthrough, dispatch]
 }
-