@swiftbrowser/react 0.26.9 → 0.27.0

package/dist/index.js

@@ -63,153 +63,41 @@ function usePlatform() {
 function useRedacted() {
   return useContext(ViewEnvironmentContext).redacted === true;
 }
-let currentUpdatePriority = 0;
-function detach(parent, child) {
-  const at = parent.children.indexOf(child);
-  if (at >= 0) parent.children.splice(at, 1);
-}
-const hostConfig = {
-  supportsMutation: true,
-  supportsPersistence: false,
-  supportsHydration: false,
-  isPrimaryRenderer: true,
-  noTimeout: -1,
-  scheduleTimeout: setTimeout,
-  cancelTimeout: clearTimeout,
-  supportsMicrotasks: true,
-  scheduleMicrotask: queueMicrotask,
-  getRootHostContext: () => ({}),
-  getChildHostContext: (parent) => parent,
-  getPublicInstance: (instance) => instance,
-  prepareForCommit: () => null,
-  resetAfterCommit: (tree) => tree.commit(),
-  preparePortalMount: () => {
-  },
-  shouldSetTextContent: () => false,
-  createInstance: (type, props, tree) => {
-    if (type !== "sb") throw new Error(`Unknown host element <${type}>: only SwiftUI components render here.`);
-    return tree.createInstance(props);
-  },
-  createTextInstance: (text) => {
-    throw new Error(`Text strings must be rendered within a <Text> component (got ${JSON.stringify(text)}).`);
-  },
-  appendInitialChild: (parent, child) => parent.children.push(child),
-  finalizeInitialChildren: () => false,
-  commitMount: () => {
-  },
-  commitUpdate: (instance, _type, _prev, next, handle) => {
-    const tree = treeOf(handle);
-    if (tree) tree.updateInstance(instance, next);
-    else {
-      instance.props = next.props ?? {};
-      instance.on = next.on;
-      instance.target = next.target;
-    }
-  },
-  appendChild: (parent, child) => {
-    detach(parent, child);
-    parent.children.push(child);
-  },
-  appendChildToContainer: (tree, child) => {
-    detach(tree.root, child);
-    tree.root.children.push(child);
-  },
-  insertBefore: (parent, child, before) => {
-    detach(parent, child);
-    const at = parent.children.indexOf(before);
-    parent.children.splice(at < 0 ? parent.children.length : at, 0, child);
-  },
-  insertInContainerBefore: (tree, child, before) => {
-    detach(tree.root, child);
-    const at = tree.root.children.indexOf(before);
-    tree.root.children.splice(at < 0 ? tree.root.children.length : at, 0, child);
-  },
-  removeChild: (parent, child) => detach(parent, child),
-  removeChildFromContainer: (tree, child) => detach(tree.root, child),
-  clearContainer: (tree) => {
-    tree.root.children = [];
-  },
-  resetTextContent: () => {
-  },
-  commitTextUpdate: () => {
-  },
-  hideInstance: (instance) => {
-    instance.hidden = true;
-  },
-  unhideInstance: (instance) => {
-    instance.hidden = false;
-  },
-  hideTextInstance: () => {
-  },
-  unhideTextInstance: () => {
-  },
-  detachDeletedInstance: () => {
-  },
-  getInstanceFromNode: () => null,
-  beforeActiveInstanceBlur: () => {
-  },
-  afterActiveInstanceBlur: () => {
-  },
-  prepareScopeUpdate: () => {
-  },
-  getInstanceFromScope: () => null,
-  setCurrentUpdatePriority: (priority) => {
-    currentUpdatePriority = priority;
-  },
-  getCurrentUpdatePriority: () => currentUpdatePriority,
-  resolveUpdatePriority: () => currentUpdatePriority !== 0 ? currentUpdatePriority : DefaultEventPriority,
-  resetFormInstance: () => {
-  },
-  requestPostPaintCallback: () => {
-  },
-  shouldAttemptEagerTransition: () => false,
-  trackSchedulerEvent: () => {
-  },
-  resolveEventType: () => null,
-  resolveEventTimeStamp: () => -1.1,
-  maySuspendCommit: () => false,
-  maySuspendCommitOnUpdate: () => false,
-  maySuspendCommitInSyncRender: () => false,
-  suspendOnActiveViewTransition: () => {
-  },
-  getSuspendedCommitReason: () => null,
-  bindToConsole: (methodName, args) => () => console[methodName]?.(...args),
-  preloadInstance: () => true,
-  startSuspendingCommit: () => null,
-  suspendInstance: () => {
-  },
-  waitForCommitToBeReady: () => null,
-  NotPendingTransition: null,
-  HostTransitionContext: createContext(null),
-  rendererVersion: "0.3.1",
-  rendererPackageName: "@swiftbrowser/react",
-  extraDevToolsConfig: null
-};
-function treeOf(handle) {
-  let fiber = handle;
-  while (fiber) {
-    if (fiber.tag === 3) return fiber.stateNode.containerInfo;
-    fiber = fiber.return;
-  }
-  return null;
-}
-const reconciler = Reconciler(hostConfig);
 const PREF_KIND = "$pref";
 const HOIST_KIND = "$hoist";
-function inheritTitleModes(screens, effective) {
+function inheritTitleModes(screens) {
   let below = "large";
   for (const screen of screens) {
-    const props = screen.kind === "navscreen" ? effective.get(screen)?.props : void 0;
-    if (!props) continue;
-    const depth = typeof props["depth"] === "number" ? props["depth"] : 0;
-    let mode = typeof props["displayMode"] === "string" ? props["displayMode"] : "automatic";
+    const entry = screen.kind === "navscreen" ? screen.entry : null;
+    if (!entry) continue;
+    const base = entry.base;
+    const depth = typeof base["depth"] === "number" ? base["depth"] : 0;
+    let mode = typeof base["displayMode"] === "string" ? base["displayMode"] : "automatic";
     if (mode === "automatic") {
-      if (depth > 0) props["displayMode"] = below;
+      if (depth > 0) {
+        if (entry.props["displayMode"] !== below) entry.props = { ...base, displayMode: below };
+      } else if (entry.props !== base) entry.props = base;
       mode = depth > 0 ? below : "large";
-    }
+    } else if (entry.props !== base) entry.props = base;
     below = mode === "inline" ? "inline" : "large";
   }
 }
+function markStale(node) {
+  for (let current = node; current && !current.stale; current = current.kind === "root" ? null : current.parent) current.stale = true;
+}
+function attach(parent, child, index) {
+  detach(parent, child);
+  if (index === void 0 || index < 0 || index > parent.children.length) parent.children.push(child);
+  else parent.children.splice(index, 0, child);
+  child.parent = parent;
+  markStale(parent);
+}
+function detach(parent, child) {
+  const at = parent.children.indexOf(child);
+  if (at >= 0) parent.children.splice(at, 1);
+  if (child.parent === parent) child.parent = null;
+  markStale(parent);
+}
 class HostTree {
   constructor(sink, options = {}) {
     this.sink = sink;
@@ -217,13 +105,14 @@ class HostTree {
   }
   sink;
   options;
-  root = { id: 0, kind: "root", children: [], committedChildren: [] };
+  root = { id: 0, kind: "root", children: [], committedChildren: [], parent: null, stale: true, entry: null };
   nextId = 1;
   /** Emitted elements by id, for event dispatch. */
   live = /* @__PURE__ */ new Map();
-  committedLive = /* @__PURE__ */ new Set();
   /** Ids whose element changed kind: removed at the end of the next flush. */
   retired = [];
+  /** Which flush is under way; an instance resolved in it carries the number. */
+  generation = 0;
   /** `withAnimation`: stamped on the next `commit`. */
   pendingAnimation;
   /** `withAnimation(_:completionCriteria:_:completion:)`: stamped on the next `commit` with its serial; the callback waits in `completions`. */
@@ -249,7 +138,13 @@ class HostTree {
       created: false,
       committedProps: null,
       committedParent: null,
-      committedChildren: []
+      committedChildren: [],
+      parent: null,
+      stale: true,
+      entry: null,
+      shown: false,
+      effectiveParent: null,
+      resolvedIn: 0
     };
   }
   updateInstance(instance, next) {
@@ -268,6 +163,12 @@ class HostTree {
     instance.props = next.props ?? {};
     instance.on = next.on;
     instance.target = next.target;
+    markStale(instance);
+  }
+  /** `node` is hidden or shown again (Suspense): it leaves or rejoins the emitted tree. */
+  setHidden(instance, hidden) {
+    instance.hidden = hidden;
+    markStale(instance);
   }
   /** Emit the ops for everything that changed since the last commit. */
   commit() {
@@ -279,68 +180,134 @@ class HostTree {
     this.pendingAnimation = void 0;
     const completion = this.pendingCompletion;
     this.pendingCompletion = void 0;
-    const effective = /* @__PURE__ */ new Map();
-    const rootEffective = { props: {}, children: [], hoisted: [] };
-    effective.set(this.root, rootEffective);
-    const visit = (child, sink, ctx) => {
+    const generation = ++this.generation;
+    const root = this.root;
+    const rootEntry = { props: {}, base: {}, children: [], hoisted: [], escaping: [] };
+    const previousRoot = root.entry;
+    root.entry = rootEntry;
+    const resolved = [];
+    const path = [];
+    const targetOf = (target, ctx, hoist) => {
+      if (target === "root" || target === void 0) return root;
+      return ctx[target] ?? (hoist || this.options.remote ? root : void 0);
+    };
+    const keep = (contribution, target) => {
+      for (let i = path.length - 1; i >= 0; i--) {
+        const node = path[i];
+        if (node === target) return;
+        node.entry.escaping.push(contribution);
+      }
+    };
+    const assign = (target, props) => {
+      const entry = target.entry;
+      if (target.kind !== "root" && entry.props === target.props) {
+        entry.props = { ...entry.props };
+        entry.base = entry.props;
+      }
+      Object.assign(entry.props, props);
+      if (entry.base !== entry.props) Object.assign(entry.base, props);
+    };
+    const contribute = (contribution, ctx) => {
+      if (contribution.kind === "pref") {
+        const target = targetOf(contribution.target, ctx, false);
+        if (target) assign(target, contribution.props);
+        keep(contribution, target);
+      } else {
+        const target = targetOf(contribution.target, ctx, true);
+        target.entry.hoisted.push(contribution.node);
+        contribution.node.effectiveParent = target;
+        keep(contribution, target);
+      }
+    };
+    const visit = (child, sink, owner, ctx, hoistedTo) => {
       if (child.hidden) return;
       if (child.kind === PREF_KIND) {
-        const target = child.target === "root" || child.target === void 0 ? this.root : ctx[child.target] ?? (this.options.remote ? this.root : void 0);
-        const entry2 = target ? effective.get(target) : void 0;
-        if (entry2) Object.assign(entry2.props, child.props);
+        contribute({ kind: "pref", target: child.target, props: child.props }, ctx);
         return;
       }
       if (child.kind === HOIST_KIND) {
-        const target = (child.target && child.target !== "root" ? ctx[child.target] : void 0) ?? this.root;
-        const entry2 = effective.get(target);
-        for (const grandchild of child.children) visit(grandchild, entry2.hoisted, ctx);
+        const target = targetOf(child.target, ctx, true);
+        for (const grandchild of child.children) visit(grandchild, target.entry.hoisted, target, ctx, child.target ?? "root");
         return;
       }
-      const entry = { props: { ...child.props }, children: [], hoisted: [] };
-      effective.set(child, entry);
+      if (hoistedTo !== void 0) {
+        child.effectiveParent = owner;
+        keep({ kind: "hoist", target: hoistedTo ?? void 0, node: child }, owner);
+      }
       sink.push(child);
+      if (!child.stale && child.entry) {
+        child.effectiveParent = owner;
+        child.shown = true;
+        for (const contribution of child.entry.escaping) contribute(contribution, ctx);
+        return;
+      }
+      const entry = { props: child.props, base: child.props, children: [], hoisted: [], escaping: [] };
+      resolved.push([child, child.entry]);
+      child.entry = entry;
+      child.stale = false;
+      child.shown = true;
+      child.effectiveParent = owner;
+      child.resolvedIn = generation;
       const next = child.kind === "navscreen" ? { ...ctx, navscreen: child } : child.kind === "sheet" ? { ...ctx, sheet: child } : ctx;
-      for (const grandchild of child.children) visit(grandchild, entry.children, next);
+      path.push(child);
+      for (const grandchild of child.children) visit(grandchild, entry.children, child, next, void 0);
+      path.pop();
     };
-    for (const child of this.root.children) visit(child, rootEffective.children, {});
-    for (const entry of effective.values()) {
+    for (const child of root.children) visit(child, rootEntry.children, root, {}, void 0);
+    root.stale = false;
+    if (rootEntry.hoisted.length > 0) rootEntry.children.push(...rootEntry.hoisted);
+    for (const [node] of resolved) {
+      const entry = node.entry;
       if (entry.hoisted.length > 0) entry.children.push(...entry.hoisted);
     }
-    for (const [node, entry] of effective) {
-      if (node !== this.root && node.kind === "navstack") inheritTitleModes(entry.children, effective);
-    }
-    const live = /* @__PURE__ */ new Set();
-    const parentOf = /* @__PURE__ */ new Map();
-    for (const [node, entry] of effective) {
-      for (const child of entry.children) {
-        live.add(child);
-        parentOf.set(child, node);
-      }
+    for (const [node] of resolved) {
+      if (node.kind === "navstack") inheritTitleModes(node.entry.children);
     }
     const ops = [];
-    const dead = /* @__PURE__ */ new Set();
-    for (const instance of this.committedLive) if (!live.has(instance)) dead.add(instance);
-    for (const instance of dead) {
-      const parent = instance.committedParent;
-      if (parent && parent !== this.root && dead.has(parent)) continue;
-      ops.push({ op: "remove", id: instance.id });
-    }
-    for (const instance of dead) {
+    const left = [];
+    const arrived = /* @__PURE__ */ new Set();
+    const compare = (before, after) => {
+      if (!before) {
+        for (const child of after) arrived.add(child);
+        return;
+      }
+      let same = before.length === after.length;
+      for (let i = 0; same && i < after.length; i++) if (before[i] !== after[i]) same = false;
+      if (same) return;
+      const now = new Set(after);
+      for (const child of before) if (!now.has(child)) left.push(child);
+      const then = new Set(before);
+      for (const child of after) if (!then.has(child)) arrived.add(child);
+    };
+    compare(previousRoot?.children, rootEntry.children);
+    for (const [node, previous] of resolved) compare(previous?.children, node.entry.children);
+    const gone = (instance) => {
       this.live.delete(instance.id);
+      instance.shown = false;
       instance.created = false;
       instance.committedProps = null;
       instance.committedParent = null;
       instance.committedChildren = [];
+      instance.stale = true;
+      const entry = instance.entry;
+      if (entry) {
+        for (const child of entry.children) if (child.effectiveParent === instance) gone(child);
+      }
+    };
+    for (const instance of left) {
+      if (!instance.shown || arrived.has(instance)) continue;
+      ops.push({ op: "remove", id: instance.id });
+      gone(instance);
     }
     const emit = (parent, entry) => {
-      const current = parent.committedChildren.filter((child) => live.has(child) && parentOf.get(child) === parent);
+      const current = parent.committedChildren.filter((child) => child.shown && child.effectiveParent === parent);
       entry.children.forEach((child, index) => {
-        const childEntry = effective.get(child);
+        const childEntry = child.entry;
         if (!child.created) {
           ops.push({ op: "create", id: child.id, kind: child.kind, props: childEntry.props });
           child.created = true;
           this.live.set(child.id, child);
-        } else if (!deepEqual(childEntry.props, child.committedProps)) {
+        } else if (childEntry.props !== child.committedProps && !deepEqual(childEntry.props, child.committedProps)) {
           ops.push({ op: "update", id: child.id, props: childEntry.props });
         }
         child.committedProps = childEntry.props;
@@ -351,21 +318,20 @@ class HostTree {
           current.splice(index, 0, child);
         }
         child.committedParent = parent;
-        emit(child, childEntry);
+        if (child.resolvedIn === generation) emit(child, childEntry);
       });
       parent.committedChildren = entry.children;
     };
-    emit(this.root, rootEffective);
+    emit(root, rootEntry);
     for (const id of this.retired) ops.push({ op: "remove", id });
     this.retired = [];
-    this.committedLive = live;
     if (this.options.remote) {
-      if (!deepEqual(rootEffective.props, this.committedRootProps)) {
-        ops.push({ op: "update", id: 0, props: rootEffective.props });
-        this.committedRootProps = rootEffective.props;
+      if (!deepEqual(rootEntry.props, this.committedRootProps)) {
+        ops.push({ op: "update", id: 0, props: rootEntry.props });
+        this.committedRootProps = rootEntry.props;
       }
     } else {
-      const scheme = rootEffective.props["colorScheme"];
+      const scheme = rootEntry.props["colorScheme"];
       const next = scheme === void 0 ? this.committedColorScheme === void 0 ? void 0 : null : scheme;
       if (next !== void 0 && next !== this.committedColorScheme) {
         ops.push({ op: "update", id: 0, props: { colorScheme: next } });
@@ -422,6 +388,132 @@ function deepEqual(a, b) {
   if (keys.length !== Object.keys(right).length) return false;
   return keys.every((key) => key in right && deepEqual(left[key], right[key]));
 }
+let currentUpdatePriority = 0;
+const hostConfig = {
+  supportsMutation: true,
+  supportsPersistence: false,
+  supportsHydration: false,
+  isPrimaryRenderer: true,
+  noTimeout: -1,
+  scheduleTimeout: setTimeout,
+  cancelTimeout: clearTimeout,
+  supportsMicrotasks: true,
+  scheduleMicrotask: queueMicrotask,
+  getRootHostContext: () => ({}),
+  getChildHostContext: (parent) => parent,
+  getPublicInstance: (instance) => instance,
+  prepareForCommit: () => null,
+  resetAfterCommit: (tree) => tree.commit(),
+  preparePortalMount: () => {
+  },
+  shouldSetTextContent: () => false,
+  createInstance: (type, props, tree) => {
+    if (type !== "sb") throw new Error(`Unknown host element <${type}>: only SwiftUI components render here.`);
+    return tree.createInstance(props);
+  },
+  createTextInstance: (text) => {
+    throw new Error(`Text strings must be rendered within a <Text> component (got ${JSON.stringify(text)}).`);
+  },
+  appendInitialChild: (parent, child) => attach(parent, child),
+  finalizeInitialChildren: () => false,
+  commitMount: () => {
+  },
+  commitUpdate: (instance, _type, _prev, next, handle) => {
+    const tree = treeOf(handle);
+    if (tree) tree.updateInstance(instance, next);
+    else {
+      instance.props = next.props ?? {};
+      instance.on = next.on;
+      instance.target = next.target;
+      markStale(instance);
+    }
+  },
+  appendChild: (parent, child) => attach(parent, child),
+  appendChildToContainer: (tree, child) => attach(tree.root, child),
+  insertBefore: (parent, child, before) => {
+    detach(parent, child);
+    const at = parent.children.indexOf(before);
+    attach(parent, child, at < 0 ? parent.children.length : at);
+  },
+  insertInContainerBefore: (tree, child, before) => {
+    detach(tree.root, child);
+    const at = tree.root.children.indexOf(before);
+    attach(tree.root, child, at < 0 ? tree.root.children.length : at);
+  },
+  removeChild: (parent, child) => detach(parent, child),
+  removeChildFromContainer: (tree, child) => detach(tree.root, child),
+  clearContainer: (tree) => {
+    for (const child of tree.root.children) child.parent = null;
+    tree.root.children = [];
+    markStale(tree.root);
+  },
+  resetTextContent: () => {
+  },
+  commitTextUpdate: () => {
+  },
+  hideInstance: (instance) => {
+    instance.hidden = true;
+    markStale(instance);
+  },
+  unhideInstance: (instance) => {
+    instance.hidden = false;
+    markStale(instance);
+  },
+  hideTextInstance: () => {
+  },
+  unhideTextInstance: () => {
+  },
+  detachDeletedInstance: () => {
+  },
+  getInstanceFromNode: () => null,
+  beforeActiveInstanceBlur: () => {
+  },
+  afterActiveInstanceBlur: () => {
+  },
+  prepareScopeUpdate: () => {
+  },
+  getInstanceFromScope: () => null,
+  setCurrentUpdatePriority: (priority) => {
+    currentUpdatePriority = priority;
+  },
+  getCurrentUpdatePriority: () => currentUpdatePriority,
+  resolveUpdatePriority: () => currentUpdatePriority !== 0 ? currentUpdatePriority : DefaultEventPriority,
+  resetFormInstance: () => {
+  },
+  requestPostPaintCallback: () => {
+  },
+  shouldAttemptEagerTransition: () => false,
+  trackSchedulerEvent: () => {
+  },
+  resolveEventType: () => null,
+  resolveEventTimeStamp: () => -1.1,
+  maySuspendCommit: () => false,
+  maySuspendCommitOnUpdate: () => false,
+  maySuspendCommitInSyncRender: () => false,
+  suspendOnActiveViewTransition: () => {
+  },
+  getSuspendedCommitReason: () => null,
+  bindToConsole: (methodName, args) => () => console[methodName]?.(...args),
+  preloadInstance: () => true,
+  startSuspendingCommit: () => null,
+  suspendInstance: () => {
+  },
+  waitForCommitToBeReady: () => null,
+  NotPendingTransition: null,
+  HostTransitionContext: createContext(null),
+  rendererVersion: "0.3.1",
+  rendererPackageName: "@swiftbrowser/react",
+  extraDevToolsConfig: null
+};
+function treeOf(handle) {
+  let fiber = handle;
+  while (fiber) {
+    if (fiber.tag === 3) return fiber.stateNode.containerInfo;
+    fiber = fiber.return;
+  }
+  return null;
+}
+const reconciler = Reconciler(hostConfig);
 const DEFAULT_ENVIRONMENT = { colorScheme: "light", dynamicTypeSize: "large", horizontalSizeClass: "compact", scenePhase: "active", platform: "ios" };
 const roots = /* @__PURE__ */ new Set();
 const HostTreeContext = createContext(null);
@@ -2196,7 +2288,7 @@ function NavigationSplitView(props) {
   const detail = isValidElement(own.detail) && own.detail.type === NavigationStack ? own.detail : /* @__PURE__ */ jsx(NavigationStack, { children: own.detail });
   const sidebar = own.sidebarWidth !== void 0 ? sb("styled", { style: { splitColumnWidth: splitColumnWidthHint(own.sidebarWidth) } }, void 0, own.sidebar) : own.sidebar;
   return applyModifiers(
-    sb("navsplit", { sidebarVisible }, { tap: toggle }, [
+    sb("navsplit", { sidebarVisible }, { tap: toggle, columnwidth: (event) => own.onSidebarWidthChange?.(event.width) }, [
       /* @__PURE__ */ jsx(SplitColumn, { report, children: /* @__PURE__ */ jsx(NavigationStack, { children: sidebar }) }, "sidebar"),
       /* @__PURE__ */ jsx(SplitColumn, { report: null, children: detail }, "detail")
     ]),
@@ -2641,6 +2733,7 @@ const MODIFIER_KEYS = /* @__PURE__ */ new Set([
   "coordinateSpace",
   "contentTransition",
   "scrollDisabled",
+  "defaultMinListRowHeight",
   "scrollEdgeEffectStyle",
   "scrollEdgeEffectHidden",
   "contentMargins",
@@ -2830,7 +2923,8 @@ const STYLED_KEYS = /* @__PURE__ */ new Set([
   "containerRelativeFrame",
   "contentTransition",
   "scrollDisabled",
-  "textSelection"
+  "textSelection",
+  "defaultMinListRowHeight"
 ]);
 const ENVIRONMENT_KEYS = /* @__PURE__ */ new Set([
   "buttonStyle",
@@ -3254,6 +3348,8 @@ function apply(key, value, node, sides) {
     }
     case "scrollDisabled":
       return styled({ scrollDisabled: value === true }, node);
+    case "defaultMinListRowHeight":
+      return typeof value === "number" && Number.isFinite(value) ? styled({ defaultMinListRowHeight: Math.max(0, value) }, node) : styled({}, node);
     case "textSelection":
       return styled({ textSelection: value === "enabled" }, node);
     case "contentTransition": {