@swiftbrowser/react 0.9.11 → 0.9.13

package/README.md

@@ -230,7 +230,11 @@ another sidebar row adds one (the first choice does not), and back or
 forward selects the row the entry recorded, through the row's own tap. The
 URL is left alone: an app that maps screens to paths sets them with
 `history.replaceState` on the entry the renderer made (a `pushState` of its
-own would add a second entry for the same screen).
+own would add a second entry for the same screen). When the app pops on its
+own (the bar's back button), the renderer's step back is asynchronous and
+the app's `replaceState` for what it shows now runs before it lands; the
+renderer sets that URL again on the entry it arrives at, so the address bar
+follows either back button.
 On a phone, a `fill` island follows the on-screen keyboard (`keyboard`,
 on by default for `fill`, or `mount(..., { keyboard: true })`): its height
 becomes a bottom inset, so a field, a bottom search field or a chat's
@@ -262,6 +266,10 @@ swapped item (`{playing ? <ToolbarItem>…stop…</ToolbarItem> :
 <ToolbarItem placement="bottomBar">{toolButtons}</ToolbarItem>
 ```
 
+`placement="largeTitle"` (iOS 26) puts a view in the large title row in
+place of the title's text, a logo beside the screen's name say; it scrolls
+away with the content and the bar shows `navigationTitle` once it has.
+
 ```tsx
 <List
   navigationTitle="Notes"
@@ -304,7 +312,11 @@ it as on iOS: `NavigationSplitView` is two columns when regular (the
 sidebar's toggle button hides and shows the sidebar) and one stack when
 compact, which pushes the detail while a `List(selection:)` in the sidebar
 has a selection and clears it on back (lists without a selection, and
-anything a sheet, popover or inspector presents, have no say); `.inspector` is a trailing panel when
+anything a sheet, popover or inspector presents, have no say). A detail
+that is a `NavigationStack` with a `path` binding keeps what it pushes in
+that binding in both widths, so an app that mirrors the path in the URL
+sees the same path on a phone as in a wide window, and a path it starts
+with (a reload onto a deep link) is shown over the detail; `.inspector` is a trailing panel when
 regular and a sheet when compact; `Table` shows every column under sortable
 titles when regular and the first column when compact.
 
@@ -333,6 +345,10 @@ scroll view's leading edge (or `scrollPositionAnchor`), and setting it
 scrolls there, on that scroll view's axes only. `proxy.scrollTo(id, anchor,
 { axes: 'horizontal' })` limits a reader's scroll the same way, so a pager
 inside a list leaves the list where it is.
+`onScrollVisibilityChange={(visible) => …}` (or `{ threshold, action }`,
+0.5 by default) is `.onScrollVisibilityChange`: it hears when that share
+of the view comes into its scroll view's visible area, below a bar the
+view scrolls under, or leaves it.
 Name a coordinate space with `coordinateSpace="page"` on the `ScrollView`
 (or any view), and a `GeometryReader` inside reads its frame there with
 `proxy.frame({ named: 'page' })`, updated as the page scrolls.

package/dist/components/split.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"split.d.ts","sourceRoot":"","sources":["../../src/components/split.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAoE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACzG,OAAO,EAAe,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAI5D,OAAO,EAA8B,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAI9E,MAAM,MAAM,6BAA6B,GAAG,WAAW,GAAG,KAAK,GAAG,cAAc,GAAG,YAAY,CAAC;AAEhG;;;;;GAKG;AACH,MAAM,WAAW,cAAc;IAC7B,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC;IAChE,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,qBAAqB,gDAA6C,CAAC;AAEhF,MAAM,WAAW,wBAAyB,SAAQ,aAAa;IAC7D,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,YAAY,CAAC,6BAA6B,CAAC,CAAC;IAC/D,wBAAwB,CAAC,EAAE,CAAC,UAAU,EAAE,6BAA6B,KAAK,IAAI,CAAC;CAChF;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,GAAG,SAAS,CAqD9E;AAoCD;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,EAAE,MAAM,UAAO,GAAG,IAAI,CAO/H;AAED,oGAAoG;AACpG,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,GAAG,SAAS,CAE9E"}
+{"version":3,"file":"split.d.ts","sourceRoot":"","sources":["../../src/components/split.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAoE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACzG,OAAO,EAAe,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAI5D,OAAO,EAA8B,KAAK,aAAa,EAAE,MAAM,cAAc,CAAC;AAI9E,MAAM,MAAM,6BAA6B,GAAG,WAAW,GAAG,KAAK,GAAG,cAAc,GAAG,YAAY,CAAC;AAEhG;;;;;GAKG;AACH,MAAM,WAAW,cAAc;IAC7B,MAAM,CAAC,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,GAAG,IAAI,CAAC;IAChE,OAAO,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAED,eAAO,MAAM,qBAAqB,gDAA6C,CAAC;AAEhF,MAAM,WAAW,wBAAyB,SAAQ,aAAa;IAC7D,OAAO,EAAE,SAAS,CAAC;IACnB,MAAM,EAAE,SAAS,CAAC;IAClB,gBAAgB,CAAC,EAAE,YAAY,CAAC,6BAA6B,CAAC,CAAC;IAC/D,wBAAwB,CAAC,EAAE,CAAC,UAAU,EAAE,6BAA6B,KAAK,IAAI,CAAC;CAChF;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,GAAG,SAAS,CAqD9E;AAwCD;;;;GAIG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,cAAc,GAAG,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,EAAE,MAAM,UAAO,GAAG,IAAI,CAO/H;AAED,oGAAoG;AACpG,wBAAgB,YAAY,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,GAAG,SAAS,CAE9E"}

package/dist/index.js

@@ -1416,7 +1416,9 @@ function SplitColumn({ report, children }) {
   return /* @__PURE__ */ jsx(NavigationContext.Provider, { value: null, children: /* @__PURE__ */ jsx(SplitSelectionContext.Provider, { value: report, children }) });
 }
 function CompactSplit({ sidebar, detail, selected, clear }) {
-  const [extra, setExtra] = useState([]);
+  const [internal, setInternal] = useState([]);
+  const detailStack = isValidElement(detail) && detail.type === NavigationStack ? detail.props : null;
+  const [extra, setExtra] = detailStack?.path !== void 0 ? readBinding(detailStack.path, detailStack.onPathChange) : [internal, setInternal];
   const base = selected ? [{ view: /* @__PURE__ */ jsx(DetailScope, { children: detail }) }] : [];
   const path = [...base, ...extra];
   const setPath = (next) => {
@@ -1674,6 +1676,8 @@ function toolbarPlacement(name) {
       return "leading";
     case "principal":
       return "principal";
+    case "largeTitle":
+      return "largeTitle";
     case "bottomBar":
       return "bottom";
     case "secondaryAction":
@@ -1750,6 +1754,7 @@ const MODIFIER_KEYS = /* @__PURE__ */ new Set([
   "alert",
   "confirmationDialog",
   "presentationDetents",
+  "onScrollVisibilityChange",
   "onTapGesture",
   "dragGesture",
   "magnifyGesture",
@@ -2091,6 +2096,10 @@ function apply(key, value, node, sides) {
     case "presentationDetents":
       sides.push(presentationDetents(value));
       return node;
+    case "onScrollVisibilityChange": {
+      const spec = typeof value === "function" ? { action: value } : value;
+      return sb("styled", { style: { scrollVisibility: { threshold: spec.threshold ?? 0.5 } } }, { scrollvisibility: (event) => spec.action(event.visible) }, node);
+    }
     case "onTapGesture":
       return sb("tapgesture", {}, { tap: value }, node);
     case "dragGesture": {