@flemo/react 1.7.1 → 1.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/index.mjs +208 -208
  2. package/package.json +4 -4
package/dist/index.mjs CHANGED
@@ -1,24 +1,24 @@
1
1
  import e, { Activity as t, Children as n, createContext as r, isValidElement as i, useContext as a, useEffect as o, useId as s, useImperativeHandle as c, useInsertionEffect as l, useLayoutEffect as u, useReducer as ee, useRef as d, useState as f } from "react";
2
- import { animHoldKey as te, appendParamsQuery as p, buildRoutePath as m, computeBarRiding as h, computeScreenFreeze as ne, consumeSelfInducedPop as g, createAnimHoldCoordinator as _, createBrowserHistoryDriver as v, createBrowserHistoryDriver as y, createDecorator as b, createHistoryStore as re, createNavigateStore as x, createNavigationController as S, createPartTransition as C, createRawDecorator as w, createRawPartTransition as T, createRawTransition as E, createRouterScope as D, createScreenSelector as O, createScreenStore as k, createStepController as ie, createSwipeController as A, createTransition as j, createTransitionEngine as ae, createTransitionStore as M, decoratorMap as oe, eagerlyDecodeImages as se, ensureScopeHistorySync as ce, enteringInitialStyle as le, getMatchedPathPattern as N, isOpaqueColor as ue, isServer as de, markSelfInducedPop as fe, matchesPathname as pe, observeBarHeight as me, observeViewportScrollHeight as he, partTransitionMap as ge, readStepParams as P, registerTransitionDefinitions as _e, releaseScopeHistorySync as ve, resolveTransition as ye, seedRouterEntry as be, subscribeStepParamsRestore as xe } from "@flemo/core";
3
- import { jsx as F, jsxs as Se } from "react/jsx-runtime";
2
+ import { animHoldKey as te, appendParamsQuery as p, buildRoutePath as m, computeBarRiding as h, computeScreenFreeze as ne, consumeSelfInducedPop as g, createAnimHoldCoordinator as _, createBrowserHistoryDriver as v, createBrowserHistoryDriver as y, createDecorator as b, createHistoryStore as re, createNavigateStore as x, createNavigationController as S, createPartTransition as C, createRawDecorator as w, createRawPartTransition as T, createRawTransition as E, createRouterScope as D, createScreenSelector as O, createScreenStore as k, createStepController as A, createSwipeController as j, createTransition as M, createTransitionEngine as ie, createTransitionStore as ae, decoratorMap as oe, eagerlyDecodeImages as se, ensureScopeHistorySync as ce, enteringInitialStyle as le, getMatchedPathPattern as ue, isOpaqueColor as de, isServer as N, markSelfInducedPop as fe, matchesPathname as pe, observeBarHeight as me, observeViewportScrollHeight as he, partTransitionMap as ge, readStepParams as P, registerTransitionDefinitions as F, releaseScopeHistorySync as _e, resolveTransition as ve, seedRouterEntry as ye, subscribeStepParamsRestore as be } from "@flemo/core";
3
+ import { jsx as I, jsxs as xe } from "react/jsx-runtime";
4
4
  //#region src/stores/StoreContext.ts
5
- var I = r(null);
5
+ var L = r(null);
6
6
  //#endregion
7
7
  //#region src/stores/useStores.ts
8
- function L() {
9
- let e = a(I);
8
+ function R() {
9
+ let e = a(L);
10
10
  if (!e) throw Error("flemo stores are missing. Render inside a <Router>.");
11
11
  return e;
12
12
  }
13
13
  //#endregion
14
14
  //#region src/history/HistoryListener.tsx
15
- function Ce() {
16
- let e = L();
17
- return o(() => (ce(e), () => ve(e)), [e]), null;
15
+ function z() {
16
+ let e = R();
17
+ return o(() => (ce(e), () => _e(e)), [e]), null;
18
18
  }
19
19
  //#endregion
20
20
  //#region src/screen/ScreenContext.ts
21
- var R = r({
21
+ var B = r({
22
22
  id: "",
23
23
  isActive: !1,
24
24
  isRoot: !0,
@@ -33,15 +33,15 @@ var R = r({
33
33
  });
34
34
  //#endregion
35
35
  //#region src/screen/useScreen.ts
36
- function z() {
37
- return a(R);
36
+ function V() {
37
+ return a(B);
38
38
  }
39
39
  //#endregion
40
40
  //#region src/screen/ParamsProvider/ParamsContext.ts
41
- var we = r({}), Te = r(() => {});
41
+ var Se = r({}), H = r(() => {});
42
42
  //#endregion
43
43
  //#region src/screen/ParamsProvider/ParamsReducer.ts
44
- function Ee(e, t) {
44
+ function Ce(e, t) {
45
45
  switch (t.type) {
46
46
  case "SET": return t.params;
47
47
  default: return e;
@@ -49,10 +49,10 @@ function Ee(e, t) {
49
49
  }
50
50
  //#endregion
51
51
  //#region src/screen/ParamsProvider/ParamsProvider.tsx
52
- function De({ children: e }) {
53
- let { isActive: t, params: n } = z(), { driver: r } = L(), [i, a] = ee(Ee, n);
52
+ function we({ children: e }) {
53
+ let { isActive: t, params: n } = V(), { driver: r } = R(), [i, a] = ee(Ce, n);
54
54
  return o(() => {
55
- if (t) return xe(r, (e) => a({
55
+ if (t) return be(r, (e) => a({
56
56
  type: "SET",
57
57
  params: e
58
58
  }));
@@ -60,9 +60,9 @@ function De({ children: e }) {
60
60
  t,
61
61
  a,
62
62
  r
63
- ]), /* @__PURE__ */ F(Te.Provider, {
63
+ ]), /* @__PURE__ */ I(H.Provider, {
64
64
  value: a,
65
- children: /* @__PURE__ */ F(we.Provider, {
65
+ children: /* @__PURE__ */ I(Se.Provider, {
66
66
  value: i,
67
67
  children: e
68
68
  })
@@ -70,42 +70,42 @@ function De({ children: e }) {
70
70
  }
71
71
  //#endregion
72
72
  //#region ../../node_modules/.pnpm/zustand@5.0.14_@types+react@19.2.17_react@19.2.7/node_modules/zustand/esm/react.mjs
73
- var B = (e) => e;
74
- function V(t, n = B) {
73
+ var Te = (e) => e;
74
+ function U(t, n = Te) {
75
75
  let r = e.useSyncExternalStore(t.subscribe, e.useCallback(() => n(t.getState()), [t, n]), e.useCallback(() => n(t.getInitialState()), [t, n]));
76
76
  return e.useDebugValue(r), r;
77
77
  }
78
78
  //#endregion
79
79
  //#region src/stores/useHistoryStore.ts
80
- function H(e) {
81
- return V(L().history, e);
80
+ function W(e) {
81
+ return U(R().history, e);
82
82
  }
83
83
  //#endregion
84
84
  //#region src/renderer/Renderer.tsx
85
- function U({ children: e }) {
86
- let t = H((e) => e.index), r = H((e) => e.histories), i = L();
85
+ function G({ children: e }) {
86
+ let t = W((e) => e.index), r = W((e) => e.histories), i = R();
87
87
  return O(r, t).map((t) => {
88
88
  let [r] = n.toArray(e).filter((e) => pe(e.props.path, t.pathname));
89
- return r ? /* @__PURE__ */ F(R.Provider, {
89
+ return r ? /* @__PURE__ */ I(B.Provider, {
90
90
  value: {
91
91
  ...t,
92
92
  navigateStore: i.navigate,
93
- routePath: N(r.props.path, t.pathname)
93
+ routePath: ue(r.props.path, t.pathname)
94
94
  },
95
- children: /* @__PURE__ */ F(De, { children: r })
95
+ children: /* @__PURE__ */ I(we, { children: r })
96
96
  }, t.id) : null;
97
97
  });
98
98
  }
99
99
  //#endregion
100
100
  //#region src/screen/ScreenViewportContext.ts
101
- var W = r({ contained: !1 });
102
- function Oe() {
103
- return a(W);
101
+ var K = r({ contained: !1 });
102
+ function Ee() {
103
+ return a(K);
104
104
  }
105
105
  //#endregion
106
106
  //#region src/transition/styles.ts
107
- function G(e, t, n = []) {
108
- l(() => _e(e, t, n), [
107
+ function q(e, t, n = []) {
108
+ l(() => F(e, t, n), [
109
109
  e,
110
110
  t,
111
111
  n
@@ -113,44 +113,44 @@ function G(e, t, n = []) {
113
113
  }
114
114
  //#endregion
115
115
  //#region src/RouterDepthContext.ts
116
- var K = r(0), q = { contained: !0 };
117
- function ke({ children: e, className: t, style: n }) {
118
- return /* @__PURE__ */ F("div", {
116
+ var J = r(0), De = { contained: !0 };
117
+ function Y({ children: e, className: t, style: n }) {
118
+ return /* @__PURE__ */ I("div", {
119
119
  className: t,
120
120
  style: {
121
121
  position: "relative",
122
122
  overflow: "hidden",
123
123
  ...n
124
124
  },
125
- children: /* @__PURE__ */ F(W.Provider, {
126
- value: q,
127
- children: /* @__PURE__ */ F(U, { children: e })
125
+ children: /* @__PURE__ */ I(K.Provider, {
126
+ value: De,
127
+ children: /* @__PURE__ */ I(G, { children: e })
128
128
  })
129
129
  });
130
130
  }
131
131
  //#endregion
132
132
  //#region src/Router.tsx
133
- function Ae(e) {
133
+ function Oe(e) {
134
134
  let t = null;
135
135
  return n.forEach(e, (e) => {
136
136
  if (t || !i(e)) return;
137
- if (e.type === ke) {
137
+ if (e.type === Y) {
138
138
  t = n.toArray(e.props.children).filter(i);
139
139
  return;
140
140
  }
141
141
  let r = e.props.children;
142
142
  if (r) {
143
- let e = Ae(r);
143
+ let e = Oe(r);
144
144
  e && (t = e);
145
145
  }
146
146
  }), t;
147
147
  }
148
- var je = typeof window > "u" ? o : u, Me = [], Ne = [], Pe = [], J = { contained: !0 };
149
- function Y({ children: e, initPath: t = "/", defaultTransitionName: r = "cupertino", transitions: i = Me, decorators: c = Ne, partTransitions: l = Pe, history: u = "browser", createDriver: ee, className: d, style: te }) {
150
- let p = a(K), m = p > 0, h = u === "memory", ne = s(), g = a(R), _ = a(I), v = m && g.id ? `_F_${_?.routerKey ?? ""}${g.id}_` : ne, b = Ae(e), re = b !== null, x = m ? null : _, S = x !== null, C = ee ?? y, [w] = f(() => h ? null : C(S ? void 0 : v)), T = !m && !h && !de(), E = T && w ? w.readPathname() : t || "/", O = E.indexOf("?"), k = (O >= 0 ? E.slice(0, O) : E) || "/", ie = T ? window.location.search : O >= 0 ? E.slice(O) : "", [A] = f(() => D({
148
+ var ke = typeof window > "u" ? o : u, Ae = [], je = [], Me = [], Ne = { contained: !0 };
149
+ function X({ children: e, initPath: t = "/", defaultTransitionName: r = "cupertino", transitions: i = Ae, decorators: c = je, partTransitions: l = Me, history: u = "browser", createDriver: ee, className: d, style: te }) {
150
+ let p = a(J), m = p > 0, h = u === "memory", ne = s(), g = a(B), _ = a(L), v = m && g.id ? `_F_${_?.routerKey ?? ""}${g.id}_` : ne, b = Oe(e), re = b !== null, x = m ? null : _, S = x !== null, C = ee ?? y, [w] = f(() => h ? null : C(S ? void 0 : v)), T = !m && !h && !N(), E = T && w ? w.readPathname() : t || "/", O = E.indexOf("?"), k = (O >= 0 ? E.slice(0, O) : E) || "/", A = T ? window.location.search : O >= 0 ? E.slice(O) : "", [j] = f(() => D({
151
151
  routePaths: (b ?? n.toArray(e)).map((e) => e.props.path).flat(),
152
152
  pathname: k,
153
- search: ie,
153
+ search: A,
154
154
  defaultTransitionName: r,
155
155
  memory: h,
156
156
  browserDriver: w,
@@ -159,16 +159,16 @@ function Y({ children: e, initPath: t = "/", defaultTransitionName: r = "cuperti
159
159
  zoneEntryId: m && !S && g.id || void 0,
160
160
  persistKey: m && !h && !S ? v : void 0
161
161
  }));
162
- A.transition.setState({ defaultTransitionName: r }), je(() => (A.life.alive = !0, () => {
163
- A.life.alive = !1;
164
- }), [A]), G(i, c, l), o(() => {
165
- h || !w || be({
162
+ j.transition.setState({ defaultTransitionName: r }), ke(() => (j.life.alive = !0, () => {
163
+ j.life.alive = !1;
164
+ }), [j]), q(i, c, l), o(() => {
165
+ h || !w || ye({
166
166
  driver: w,
167
167
  routerKey: S ? null : v,
168
168
  nested: m && !S,
169
169
  seedPathname: k,
170
170
  defaultTransitionName: r,
171
- rootParams: A.history.getState().histories[0]?.params ?? {}
171
+ rootParams: j.history.getState().histories[0]?.params ?? {}
172
172
  });
173
173
  }, [
174
174
  h,
@@ -177,45 +177,45 @@ function Y({ children: e, initPath: t = "/", defaultTransitionName: r = "cuperti
177
177
  v,
178
178
  k,
179
179
  r,
180
- A.history,
180
+ j.history,
181
181
  w
182
182
  ]);
183
- let j = re ? e : /* @__PURE__ */ F(U, { children: e }), ae = /* @__PURE__ */ F(K.Provider, {
183
+ let M = re ? e : /* @__PURE__ */ I(G, { children: e }), ie = /* @__PURE__ */ I(J.Provider, {
184
184
  value: p + 1,
185
- children: /* @__PURE__ */ Se(I.Provider, {
186
- value: A,
187
- children: [!h && /* @__PURE__ */ F(Ce, {}), m ? /* @__PURE__ */ F(W.Provider, {
188
- value: J,
189
- children: j
190
- }) : j]
185
+ children: /* @__PURE__ */ xe(L.Provider, {
186
+ value: j,
187
+ children: [!h && /* @__PURE__ */ I(z, {}), m ? /* @__PURE__ */ I(K.Provider, {
188
+ value: Ne,
189
+ children: M
190
+ }) : M]
191
191
  })
192
192
  });
193
- return m ? /* @__PURE__ */ F("div", {
193
+ return m ? /* @__PURE__ */ I("div", {
194
194
  className: d,
195
195
  style: {
196
196
  position: "relative",
197
197
  overflow: "hidden",
198
198
  ...te
199
199
  },
200
- children: ae
201
- }) : ae;
200
+ children: ie
201
+ }) : ie;
202
202
  }
203
203
  //#endregion
204
204
  //#region src/Route.tsx
205
- function Fe({ element: e }) {
205
+ function Pe({ element: e }) {
206
206
  return e;
207
207
  }
208
208
  //#endregion
209
209
  //#region src/utils/buildRoutePath.ts
210
- function Ie(e, t) {
210
+ function Fe(e, t) {
211
211
  return m(e, t);
212
212
  }
213
213
  //#endregion
214
214
  //#region src/navigate/useNavigate.ts
215
- function X() {
216
- let e = L(), t = S({
215
+ function Ie() {
216
+ let e = R(), t = S({
217
217
  stores: e,
218
- buildPathname: (e, t) => Ie(e, t),
218
+ buildPathname: (e, t) => Fe(e, t),
219
219
  driver: e.driver,
220
220
  markSelfInduced: e.markSelfInduced
221
221
  });
@@ -228,20 +228,20 @@ function X() {
228
228
  //#endregion
229
229
  //#region src/navigate/usePathname.ts
230
230
  function Le() {
231
- return H((e) => e.histories[e.pendingIndex]?.pathname ?? "/");
231
+ return W((e) => e.histories[e.pendingIndex]?.pathname ?? "/");
232
232
  }
233
233
  //#endregion
234
234
  //#region src/navigate/useStep.ts
235
- function Z() {
236
- let { routePath: e } = z(), t = L(), n = a(Te), { driver: r, markSelfInduced: i } = t, [s, c] = f(null);
235
+ function Re() {
236
+ let { routePath: e } = V(), t = R(), n = a(H), { driver: r, markSelfInduced: i } = t, [s, c] = f(null);
237
237
  o(() => {
238
238
  if (!e) return c(P(r.readState())), r.subscribe((e) => c(P(e.state)));
239
239
  }, [e, r]);
240
- let l = ie({
240
+ let l = A({
241
241
  stores: t,
242
242
  driver: r,
243
243
  markSelfInduced: i,
244
- buildStepPathname: (t) => e ? Ie(e, t).pathname : p(r.readPathname(), t),
244
+ buildStepPathname: (t) => e ? Fe(e, t).pathname : p(r.readPathname(), t),
245
245
  applyParams: (t) => {
246
246
  n({
247
247
  type: "SET",
@@ -258,13 +258,13 @@ function Z() {
258
258
  }
259
259
  //#endregion
260
260
  //#region src/screen/ParamsProvider/useParams.ts
261
- function Q() {
262
- return a(we);
261
+ function Z() {
262
+ return a(Se);
263
263
  }
264
264
  //#endregion
265
265
  //#region src/screen/ScreenFreeze.tsx
266
- function Re({ freeze: e, children: n }) {
267
- return /* @__PURE__ */ F(t, {
266
+ function Q({ freeze: e, children: n }) {
267
+ return /* @__PURE__ */ I(t, {
268
268
  mode: e ? "hidden" : "visible",
269
269
  children: n
270
270
  });
@@ -279,15 +279,15 @@ function Be(e) {
279
279
  //#endregion
280
280
  //#region src/stores/useNavigateStore.ts
281
281
  function Ve(e) {
282
- return V(L().navigate, e);
282
+ return U(R().navigate, e);
283
283
  }
284
284
  //#endregion
285
285
  //#region src/screen/ScreenDecorator.tsx
286
286
  function He({ ref: e, style: t, ...n }) {
287
- let { isActive: r, transitionName: i } = z(), a = d(null);
287
+ let { isActive: r, transitionName: i } = V(), a = d(null);
288
288
  c(e, () => a.current);
289
- let o = Ve((e) => e.status), { decoratorName: s } = ye(i), l = oe.get(s);
290
- return l ? /* @__PURE__ */ F("div", {
289
+ let o = Ve((e) => e.status), { decoratorName: s } = ve(i), l = oe.get(s);
290
+ return l ? /* @__PURE__ */ I("div", {
291
291
  ref: a,
292
292
  "data-flemo-decorator": !0,
293
293
  "data-flemo-decorator-name": l.name,
@@ -320,94 +320,94 @@ function Ue() {
320
320
  //#endregion
321
321
  //#region src/stores/useScreenStore.ts
322
322
  function $(e) {
323
- return V(L().screen, e);
323
+ return U(R().screen, e);
324
324
  }
325
325
  //#endregion
326
326
  //#region src/screen/ScreenMotion.tsx
327
327
  function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigationBarHeight: r, systemNavigationBarColor: i, sharedTopBar: a, sharedBottomBar: s, topBar: c, bottomBar: l, hideStatusBar: ee, hideSystemNavigationBar: p, backgroundColor: m = "white", contentScrollable: g = !0, ..._ }) {
328
- let { id: v, isActive: y, isRoot: b, isPrev: re, zIndex: x, transitionName: S, prevTransitionName: C } = z(), { contained: w } = Oe(), T = w ? "absolute" : "fixed", E = L(), D = Ve((e) => e.status), O = $((e) => e.dragStatus), k = $((e) => e.replaceTransitionStatus), ie = E.screen.getState().setDragStatus, j = E.screen.getState().setReplaceTransitionStatus, M = H((e) => e.index), ce = H((e) => e.histories), N = y ? ce[M - 1]?.id : ce[M]?.id, de = $((e) => N ? e.sharedBars[N] : void 0), fe = $((e) => N ? e.screenSurfaces[N] : void 0), pe = d(null);
329
- pe.current ||= ae({
328
+ let { id: v, isActive: y, isRoot: b, isPrev: re, zIndex: x, transitionName: S, prevTransitionName: C } = V(), { contained: w } = Ee(), T = w ? "absolute" : "fixed", E = R(), D = W((e) => e.index), O = W((e) => e.histories), k = y || x === D - 1, A = Ve((e) => k ? e.status : "COMPLETED"), M = $((e) => e.dragStatus), ae = $((e) => e.replaceTransitionStatus), ce = E.screen.getState().setDragStatus, ue = E.screen.getState().setReplaceTransitionStatus, N = y ? O[D - 1]?.id : O[D]?.id, fe = $((e) => N ? e.sharedBars[N] : void 0), pe = $((e) => N ? e.screenSurfaces[N] : void 0), he = d(null);
329
+ he.current ||= ie({
330
330
  getTransitionTaskId: () => E.navigate.getState().transitionTaskId,
331
- setDragStatus: ie,
332
- setReplaceTransitionStatus: j
331
+ setDragStatus: ce,
332
+ setReplaceTransitionStatus: ue
333
333
  });
334
- let he = pe.current, ge = d(null);
335
- ge.current ||= Be(E.navigate);
336
- let P = ye(S), { initial: _e, swipeDirection: ve, decoratorName: be } = P, xe = oe.get(be), { viewportScrollHeight: I } = Ue(), Ce = I > 0, [R, we] = f(0), [Te, Ee] = f(0), De = d(null), B = d(null), V = d(null), U = d(null), W = d(null), G = d({
337
- transition: P,
338
- decorator: xe,
334
+ let ge = he.current, P = d(null);
335
+ P.current ||= Be(E.navigate);
336
+ let F = ve(S), { initial: _e, swipeDirection: ye, decoratorName: be } = F, L = oe.get(be), { viewportScrollHeight: z } = Ue(), B = z > 0, [Se, H] = f(0), [Ce, we] = f(0), Te = d(null), U = d(null), G = d(null), K = d(null), q = d(null), J = d({
337
+ transition: F,
338
+ decorator: L,
339
339
  hasSharedTopBar: !!a,
340
340
  hasSharedBottomBar: !!s,
341
- viewportScrollHeight: I,
341
+ viewportScrollHeight: z,
342
342
  isRoot: b,
343
343
  isActive: y,
344
- status: D,
345
- dragStatus: O,
346
- index: M
344
+ status: A,
345
+ dragStatus: M,
346
+ index: D
347
347
  });
348
- G.current = {
349
- transition: P,
350
- decorator: xe,
348
+ J.current = {
349
+ transition: F,
350
+ decorator: L,
351
351
  hasSharedTopBar: !!a,
352
352
  hasSharedBottomBar: !!s,
353
- viewportScrollHeight: I,
353
+ viewportScrollHeight: z,
354
354
  isRoot: b,
355
355
  isActive: y,
356
- status: D,
357
- dragStatus: O,
358
- index: M
356
+ status: A,
357
+ dragStatus: M,
358
+ index: D
359
359
  };
360
- let K = d(null);
361
- K.current ||= A({
362
- getTransition: () => G.current.transition,
363
- getDecorator: () => G.current.decorator,
360
+ let De = d(null);
361
+ De.current ||= j({
362
+ getTransition: () => J.current.transition,
363
+ getDecorator: () => J.current.decorator,
364
364
  getElements: () => ({
365
- scope: B.current,
366
- screenContainer: De.current,
367
- decorator: V.current,
368
- sharedTopBar: U.current,
369
- sharedBottomBar: W.current
365
+ scope: U.current,
366
+ screenContainer: Te.current,
367
+ decorator: G.current,
368
+ sharedTopBar: K.current,
369
+ sharedBottomBar: q.current
370
370
  }),
371
- hasSharedTopBar: () => G.current.hasSharedTopBar,
372
- hasSharedBottomBar: () => G.current.hasSharedBottomBar,
373
- getViewportScrollHeight: () => G.current.viewportScrollHeight,
371
+ hasSharedTopBar: () => J.current.hasSharedTopBar,
372
+ hasSharedBottomBar: () => J.current.hasSharedBottomBar,
373
+ getViewportScrollHeight: () => J.current.viewportScrollHeight,
374
374
  isReadyForDrag: () => {
375
- let e = G.current;
375
+ let e = J.current;
376
376
  return !e.isRoot && e.isActive && e.status === "COMPLETED" && e.dragStatus === "IDLE" && !!e.transition.swipeDirection && e.viewportScrollHeight < 10;
377
377
  },
378
378
  getPartnerBars: () => {
379
- let e = G.current, t = E.history.getState().histories, n = e.isActive ? t[e.index - 1]?.id : t[e.index]?.id;
379
+ let e = J.current, t = E.history.getState().histories, n = e.isActive ? t[e.index - 1]?.id : t[e.index]?.id;
380
380
  return n ? E.screen.getState().sharedBars[n] : void 0;
381
381
  },
382
- setDragStatus: ie,
382
+ setDragStatus: ce,
383
383
  back: () => window.history.back()
384
384
  });
385
- let q = K.current, ke = (e) => q.pointerDown(e.nativeEvent), Ae = (e) => q.pointerMove(e.nativeEvent), je = (e) => q.pointerUp(e.nativeEvent);
385
+ let Y = De.current, Oe = (e) => Y.pointerDown(e.nativeEvent), ke = (e) => Y.pointerMove(e.nativeEvent), Ae = (e) => Y.pointerUp(e.nativeEvent);
386
386
  o(() => {
387
- se(B.current);
387
+ se(U.current);
388
388
  }, []), o(() => {
389
- let e = B.current;
389
+ let e = U.current;
390
390
  if (!e) return;
391
391
  let t = (e) => {
392
- q.shouldPreventTouch() && e.preventDefault(), e.target?.dataset.swipeAtEdgeBar === "true" && e.preventDefault();
392
+ Y.shouldPreventTouch() && e.preventDefault(), e.target?.dataset.swipeAtEdgeBar === "true" && e.preventDefault();
393
393
  };
394
394
  return e.addEventListener("touchmove", t, { passive: !1 }), () => {
395
395
  e.removeEventListener("touchmove", t);
396
396
  };
397
- }, [q]), u(() => {
398
- let e = U.current;
397
+ }, [Y]), u(() => {
398
+ let e = K.current;
399
399
  if (!e) {
400
- we(0);
400
+ H(0);
401
401
  return;
402
402
  }
403
- return me(e, we);
403
+ return me(e, H);
404
404
  }, [a]), u(() => {
405
- let e = W.current;
405
+ let e = q.current;
406
406
  if (!e) {
407
- Ee(0);
407
+ we(0);
408
408
  return;
409
409
  }
410
- return me(e, Ee);
410
+ return me(e, we);
411
411
  }, [s]), u(() => {
412
412
  let { registerSharedBars: e, unregisterSharedBars: t } = E.screen.getState();
413
413
  return e(v, {
@@ -420,84 +420,84 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
420
420
  s,
421
421
  E.screen
422
422
  ]), u(() => {
423
- let e = B.current;
423
+ let e = U.current;
424
424
  if (!e) return;
425
425
  let { registerScreenSurface: t, unregisterScreenSurface: n } = E.screen.getState();
426
- return t(v, { opaqueBackground: ue(getComputedStyle(e).backgroundColor) }), () => n(v);
426
+ return t(v, { opaqueBackground: de(getComputedStyle(e).backgroundColor) }), () => n(v);
427
427
  }, [
428
428
  v,
429
429
  m,
430
- D,
430
+ A,
431
431
  E.screen
432
432
  ]);
433
- let Me = y || x === M - 1, { app: Ne, nav: Pe } = h({
434
- status: D,
435
- isTopOrTopPrev: Me,
433
+ let je = k, { app: Me, nav: Ne } = h({
434
+ status: A,
435
+ isTopOrTopPrev: je,
436
436
  hasTopBar: !!a,
437
437
  hasNavBar: !!s,
438
- partnerBars: de
439
- }), J = te({
440
- status: D,
441
- isTopOrTopPrev: Me,
438
+ partnerBars: fe
439
+ }), X = te({
440
+ status: A,
441
+ isTopOrTopPrev: je,
442
442
  transitionName: S
443
- }), Y = ne({
443
+ }), Pe = ne({
444
444
  isActive: y,
445
445
  isPrev: re,
446
446
  zIndex: x,
447
- index: M,
448
- status: D,
449
- dragStatus: O,
450
- replaceTransitionStatus: k
451
- }), Fe = d(Y), Ie = d(J !== null && Y), [X, Le] = f({
452
- key: J,
453
- released: J === null
447
+ index: D,
448
+ status: A,
449
+ dragStatus: M,
450
+ replaceTransitionStatus: ae
451
+ }), Fe = d(Pe), Ie = d(X !== null && Pe), [Le, Re] = f({
452
+ key: X,
453
+ released: X === null
454
454
  });
455
- X.key !== J && (Le({
456
- key: J,
457
- released: J === null
458
- }), Ie.current = J !== null && Fe.current), Fe.current = Y;
459
- let Z = J !== null && X.key === J && !X.released, Q = Z ? !y && fe?.opaqueBackground ? "park" : y && (D === "PUSHING" || D === "REPLACING") && fe?.opaqueBackground ? "park-under" : "true" : "false";
460
- u(() => he.driveScreenLifecycle({
455
+ Le.key !== X && (Re({
456
+ key: X,
457
+ released: X === null
458
+ }), Ie.current = X !== null && Fe.current), Fe.current = Pe;
459
+ let Z = X !== null && Le.key === X && !Le.released, Q = Z ? !y && pe?.opaqueBackground ? "park" : y && (A === "PUSHING" || A === "REPLACING") && pe?.opaqueBackground ? "park-under" : "true" : "false";
460
+ u(() => ge.driveScreenLifecycle({
461
461
  getElements: () => ({
462
- scope: B.current,
463
- decorator: V.current,
464
- bars: [U.current, W.current]
462
+ scope: U.current,
463
+ decorator: G.current,
464
+ bars: [K.current, q.current]
465
465
  }),
466
466
  transitionName: S,
467
467
  prevTransitionName: C,
468
- status: D,
468
+ status: A,
469
469
  isActive: y,
470
470
  animHoldReleased: !Z
471
471
  }), [
472
- he,
473
- D,
472
+ ge,
473
+ A,
474
474
  y,
475
475
  C,
476
476
  S,
477
477
  Z
478
478
  ]), o(() => {
479
- if (!Z || J === null) return;
480
- let e = J, t = E.navigate.getState().transitionTaskId, n = t === null ? e : `${e}#${t}`;
481
- return ge.current.join(n, () => Le((t) => t.key === e && !t.released ? {
479
+ if (!Z || X === null) return;
480
+ let e = X, t = E.navigate.getState().transitionTaskId, n = t === null ? e : `${e}#${t}`;
481
+ return P.current.join(n, () => Re((t) => t.key === e && !t.released ? {
482
482
  key: e,
483
483
  released: !0
484
484
  } : t), {
485
- scope: B.current,
485
+ scope: U.current,
486
486
  decodeWait: Ie.current
487
487
  });
488
488
  }, [
489
489
  Z,
490
- J,
490
+ X,
491
491
  Q,
492
492
  E.navigate
493
493
  ]);
494
- let Re = Q === "park-under" ? {} : le({
494
+ let ze = Q === "park-under" ? {} : le({
495
495
  initial: _e,
496
496
  isActive: y,
497
- status: D
497
+ status: A
498
498
  });
499
- return /* @__PURE__ */ Se("div", {
500
- ref: De,
499
+ return /* @__PURE__ */ xe("div", {
500
+ ref: Te,
501
501
  style: {
502
502
  position: T,
503
503
  top: 0,
@@ -512,7 +512,7 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
512
512
  overscrollBehavior: "contain"
513
513
  },
514
514
  children: [
515
- /* @__PURE__ */ F("div", {
515
+ /* @__PURE__ */ I("div", {
516
516
  "data-swipe-at-edge-bar": !0,
517
517
  style: {
518
518
  position: T,
@@ -523,16 +523,16 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
523
523
  zIndex: 1
524
524
  }
525
525
  }),
526
- /* @__PURE__ */ Se("div", {
527
- ref: B,
526
+ /* @__PURE__ */ xe("div", {
527
+ ref: U,
528
528
  ..._,
529
- onPointerDown: ke,
530
- onPointerMove: Ae,
531
- onPointerUp: je,
532
- onPointerCancel: je,
529
+ onPointerDown: Oe,
530
+ onPointerMove: ke,
531
+ onPointerUp: Ae,
532
+ onPointerCancel: Ae,
533
533
  "data-flemo-screen": !0,
534
534
  "data-flemo-transition": S,
535
- "data-flemo-status": D,
535
+ "data-flemo-status": A,
536
536
  "data-flemo-active": y ? "true" : "false",
537
537
  "data-flemo-anim-hold": Q,
538
538
  style: {
@@ -541,14 +541,14 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
541
541
  height: "100%",
542
542
  backgroundColor: m,
543
543
  overflowY: g ? void 0 : "auto",
544
- touchAction: ve === "x" ? "pan-y" : ve === "y" ? "pan-x" : "auto",
545
- ...Re,
544
+ touchAction: ye === "x" ? "pan-y" : ye === "y" ? "pan-x" : "auto",
545
+ ...ze,
546
546
  ..._.style
547
547
  },
548
548
  children: [
549
- !ee && t && /* @__PURE__ */ F("div", {
549
+ !ee && t && /* @__PURE__ */ I("div", {
550
550
  style: { minHeight: t },
551
- children: /* @__PURE__ */ F("div", { style: {
551
+ children: /* @__PURE__ */ I("div", { style: {
552
552
  position: T,
553
553
  top: 0,
554
554
  width: "100%",
@@ -556,12 +556,12 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
556
556
  backgroundColor: n
557
557
  } })
558
558
  }),
559
- a && /* @__PURE__ */ F("div", { style: {
559
+ a && /* @__PURE__ */ I("div", { style: {
560
560
  width: "100%",
561
- minHeight: R
561
+ minHeight: Se
562
562
  } }),
563
563
  c,
564
- /* @__PURE__ */ F("div", {
564
+ /* @__PURE__ */ I("div", {
565
565
  style: {
566
566
  display: "flex",
567
567
  flexDirection: "column",
@@ -571,17 +571,17 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
571
571
  children: e
572
572
  }),
573
573
  l,
574
- s && /* @__PURE__ */ F("div", { style: {
575
- display: Ce ? "none" : void 0,
574
+ s && /* @__PURE__ */ I("div", { style: {
575
+ display: B ? "none" : void 0,
576
576
  width: "100%",
577
- minHeight: Te
577
+ minHeight: Ce
578
578
  } }),
579
- !p && r && /* @__PURE__ */ F("div", {
579
+ !p && r && /* @__PURE__ */ I("div", {
580
580
  style: {
581
- display: Ce ? "none" : void 0,
581
+ display: B ? "none" : void 0,
582
582
  minHeight: r
583
583
  },
584
- children: /* @__PURE__ */ F("div", { style: {
584
+ children: /* @__PURE__ */ I("div", { style: {
585
585
  position: T,
586
586
  bottom: 0,
587
587
  width: "100%",
@@ -591,13 +591,13 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
591
591
  })
592
592
  ]
593
593
  }),
594
- a && /* @__PURE__ */ F("div", {
595
- ref: U,
594
+ a && /* @__PURE__ */ I("div", {
595
+ ref: K,
596
596
  "data-flemo-bar": "app",
597
597
  "data-flemo-bar-transition": S,
598
- "data-flemo-bar-status": D,
598
+ "data-flemo-bar-status": A,
599
599
  "data-flemo-bar-active": y ? "true" : "false",
600
- "data-flemo-bar-riding": Ne ? "true" : "false",
600
+ "data-flemo-bar-riding": Me ? "true" : "false",
601
601
  "data-flemo-anim-hold": Q,
602
602
  style: {
603
603
  position: T,
@@ -608,16 +608,16 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
608
608
  },
609
609
  children: a
610
610
  }),
611
- s && /* @__PURE__ */ F("div", {
612
- ref: W,
611
+ s && /* @__PURE__ */ I("div", {
612
+ ref: q,
613
613
  "data-flemo-bar": "nav",
614
614
  "data-flemo-bar-transition": S,
615
- "data-flemo-bar-status": D,
615
+ "data-flemo-bar-status": A,
616
616
  "data-flemo-bar-active": y ? "true" : "false",
617
- "data-flemo-bar-riding": Pe ? "true" : "false",
617
+ "data-flemo-bar-riding": Ne ? "true" : "false",
618
618
  "data-flemo-anim-hold": Q,
619
619
  style: {
620
- display: Ce ? "none" : void 0,
620
+ display: B ? "none" : void 0,
621
621
  position: T,
622
622
  bottom: p ? 0 : r,
623
623
  left: 0,
@@ -626,11 +626,11 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
626
626
  },
627
627
  children: s
628
628
  }),
629
- xe && /* @__PURE__ */ F(He, {
630
- ref: V,
629
+ L && /* @__PURE__ */ I(He, {
630
+ ref: G,
631
631
  "data-flemo-anim-hold": Q
632
632
  }),
633
- /* @__PURE__ */ F("div", {
633
+ /* @__PURE__ */ I("div", {
634
634
  "data-swipe-at-edge-bar": !0,
635
635
  style: {
636
636
  position: T,
@@ -647,18 +647,18 @@ function We({ children: e, statusBarHeight: t, statusBarColor: n, systemNavigati
647
647
  //#endregion
648
648
  //#region src/screen/Screen.tsx
649
649
  function Ge({ children: e, ...t }) {
650
- let { isActive: n, isPrev: r, zIndex: i } = z();
651
- return /* @__PURE__ */ F(Re, {
650
+ let { isActive: n, isPrev: r, zIndex: i } = V();
651
+ return /* @__PURE__ */ I(Q, {
652
652
  freeze: ne({
653
653
  isActive: n,
654
654
  isPrev: r,
655
655
  zIndex: i,
656
- index: H((e) => e.index),
656
+ index: W((e) => e.index),
657
657
  status: Ve((e) => e.status),
658
658
  dragStatus: $((e) => e.dragStatus),
659
659
  replaceTransitionStatus: $((e) => e.replaceTransitionStatus)
660
660
  }),
661
- children: /* @__PURE__ */ F(We, {
661
+ children: /* @__PURE__ */ I(We, {
662
662
  ...t,
663
663
  children: e
664
664
  })
@@ -667,11 +667,11 @@ function Ge({ children: e, ...t }) {
667
667
  //#endregion
668
668
  //#region src/screen/Part.tsx
669
669
  function Ke({ ref: e, name: t, style: n, children: r, ...i }) {
670
- let { isActive: a, navigateStore: o } = z(), s = L();
671
- return /* @__PURE__ */ F("div", {
670
+ let { isActive: a, navigateStore: o } = V(), s = R();
671
+ return /* @__PURE__ */ I("div", {
672
672
  ref: e,
673
673
  "data-flemo-part-name": t,
674
- "data-flemo-status": V(o ?? s.navigate, (e) => e.status),
674
+ "data-flemo-status": U(o ?? s.navigate, (e) => e.status),
675
675
  "data-flemo-active": a ? "true" : "false",
676
676
  style: n,
677
677
  ...i,
@@ -684,17 +684,17 @@ function qe({ children: e }) {
684
684
  let [t] = f(() => ({
685
685
  history: re(),
686
686
  navigate: x(),
687
- transition: M(),
687
+ transition: ae(),
688
688
  screen: k(),
689
689
  driver: y(),
690
690
  markSelfInduced: fe,
691
691
  consume: g,
692
692
  life: { alive: !0 }
693
693
  }));
694
- return /* @__PURE__ */ F(I.Provider, {
694
+ return /* @__PURE__ */ I(L.Provider, {
695
695
  value: t,
696
696
  children: e
697
697
  });
698
698
  }
699
699
  //#endregion
700
- export { Ke as Part, Fe as Route, Y as Router, qe as RouterScopeProvider, Ge as Screen, R as ScreenContext, He as ScreenDecorator, Re as ScreenFreeze, We as ScreenMotion, ke as Slot, v as createBrowserHistoryDriver, b as createDecorator, C as createPartTransition, w as createRawDecorator, T as createRawPartTransition, E as createRawTransition, j as createTransition, ge as partTransitionMap, H as useHistoryStore, X as useNavigate, Ve as useNavigateStore, Q as useParams, Le as usePathname, z as useScreen, $ as useScreenStore, Z as useStep, L as useStores, Ue as useViewportScrollHeight };
700
+ export { Ke as Part, Pe as Route, X as Router, qe as RouterScopeProvider, Ge as Screen, B as ScreenContext, He as ScreenDecorator, Q as ScreenFreeze, We as ScreenMotion, Y as Slot, v as createBrowserHistoryDriver, b as createDecorator, C as createPartTransition, w as createRawDecorator, T as createRawPartTransition, E as createRawTransition, M as createTransition, ge as partTransitionMap, W as useHistoryStore, Ie as useNavigate, Ve as useNavigateStore, Z as useParams, Le as usePathname, V as useScreen, $ as useScreenStore, Re as useStep, R as useStores, Ue as useViewportScrollHeight };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@flemo/react",
3
- "version": "1.7.1",
3
+ "version": "1.7.2",
4
4
  "description": "React bindings for flemo: Router, Route, Screen, and the screen-transition runtime.",
5
5
  "main": "./dist/index.mjs",
6
6
  "module": "./dist/index.mjs",
@@ -36,7 +36,7 @@
36
36
  "dependencies": {
37
37
  "path-to-regexp": "^8.4.2",
38
38
  "zustand": "^5.0.14",
39
- "@flemo/core": "1.19.1"
39
+ "@flemo/core": "1.20.0"
40
40
  },
41
41
  "devDependencies": {
42
42
  "@testing-library/jest-dom": "^6.9.1",
@@ -54,8 +54,8 @@
54
54
  "vite": "^8.0.16",
55
55
  "vite-plugin-dts": "^5.0.2",
56
56
  "vitest": "^4.1.9",
57
- "@flemo/tsconfig": "0.0.0",
58
- "@flemo/eslint-config": "0.0.0"
57
+ "@flemo/eslint-config": "0.0.0",
58
+ "@flemo/tsconfig": "0.0.0"
59
59
  },
60
60
  "peerDependencies": {
61
61
  "react": "^19.2.7",