@shopify/shop-minis-react 0.0.0-snapshot.20251219160956 → 0.0.0-snapshot.20251219164319
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.
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { useNavigate as
|
|
1
|
+
import { useNavigate as u, useLocation as m } from "../../shop-minis-react/node_modules/.pnpm/react-router@7.7.0_react-dom@19.1.0_react@19.1.0__react@19.1.0/node_modules/react-router/dist/development/chunk-EF7DTUVF.js";
|
|
2
2
|
import { DATA_NAVIGATION_TYPE_ATTRIBUTE as r } from "../../types/index.js";
|
|
3
|
-
function
|
|
4
|
-
const e =
|
|
3
|
+
function f() {
|
|
4
|
+
const e = u(), o = m();
|
|
5
5
|
return (t, n) => {
|
|
6
6
|
if (typeof t == "number") {
|
|
7
7
|
if (document.startViewTransition)
|
|
@@ -18,10 +18,10 @@ function d() {
|
|
|
18
18
|
return e(t);
|
|
19
19
|
return;
|
|
20
20
|
}
|
|
21
|
-
const a = t === o.pathname;
|
|
21
|
+
const a = t === o.pathname, s = t === "/";
|
|
22
22
|
if (document.startViewTransition)
|
|
23
23
|
document.startViewTransition(() => {
|
|
24
|
-
e(t, {
|
|
24
|
+
s ? e(-window.history.state.idx) : e(t, {
|
|
25
25
|
replace: a,
|
|
26
26
|
...n
|
|
27
27
|
}), n?.preventScrollReset !== !0 && window.scrollTo(0, 0);
|
|
@@ -37,6 +37,6 @@ function d() {
|
|
|
37
37
|
};
|
|
38
38
|
}
|
|
39
39
|
export {
|
|
40
|
-
|
|
40
|
+
f as useNavigateWithTransition
|
|
41
41
|
};
|
|
42
42
|
//# sourceMappingURL=useNavigateWithTransition.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useNavigateWithTransition.js","sources":["../../../src/hooks/navigation/useNavigateWithTransition.ts"],"sourcesContent":["import {useLocation, useNavigate, NavigateOptions} from 'react-router'\n\nimport {DATA_NAVIGATION_TYPE_ATTRIBUTE} from '../../types'\n\ntype UseNavigateWithTransitionReturns = (\n to: string | number,\n options?: NavigateOptions\n) => void | Promise<void>\n\nexport function useNavigateWithTransition(): UseNavigateWithTransitionReturns {\n const navigate = useNavigate()\n const location = useLocation()\n\n const transitionNavigate = (\n to: string | number,\n options?: NavigateOptions\n ) => {\n if (typeof to === 'number') {\n // Delta navigation - no options parameter\n if (document.startViewTransition) {\n const transition = document.startViewTransition(() => {\n navigate(to)\n })\n\n transition.finished\n .then(() => {\n document.documentElement.removeAttribute(\n DATA_NAVIGATION_TYPE_ATTRIBUTE\n )\n })\n .catch(error => {\n console.error('View transition error:', error)\n })\n } else {\n return navigate(to)\n }\n return\n }\n\n const isSameRoute = to === location.pathname\n\n // Path navigation - with options\n if (document.startViewTransition) {\n const transition = document.startViewTransition(() => {\n navigate(to, {\n
|
|
1
|
+
{"version":3,"file":"useNavigateWithTransition.js","sources":["../../../src/hooks/navigation/useNavigateWithTransition.ts"],"sourcesContent":["import {useLocation, useNavigate, NavigateOptions} from 'react-router'\n\nimport {DATA_NAVIGATION_TYPE_ATTRIBUTE} from '../../types'\n\ntype UseNavigateWithTransitionReturns = (\n to: string | number,\n options?: NavigateOptions\n) => void | Promise<void>\n\nexport function useNavigateWithTransition(): UseNavigateWithTransitionReturns {\n const navigate = useNavigate()\n const location = useLocation()\n\n const transitionNavigate = (\n to: string | number,\n options?: NavigateOptions\n ) => {\n if (typeof to === 'number') {\n // Delta navigation - no options parameter\n if (document.startViewTransition) {\n const transition = document.startViewTransition(() => {\n navigate(to)\n })\n\n transition.finished\n .then(() => {\n document.documentElement.removeAttribute(\n DATA_NAVIGATION_TYPE_ATTRIBUTE\n )\n })\n .catch(error => {\n console.error('View transition error:', error)\n })\n } else {\n return navigate(to)\n }\n return\n }\n\n const isSameRoute = to === location.pathname\n const isNavigatingToHomeRoute = to === '/'\n\n // Path navigation - with options\n if (document.startViewTransition) {\n const transition = document.startViewTransition(() => {\n if (isNavigatingToHomeRoute) {\n navigate(-window.history.state.idx)\n } else {\n navigate(to, {\n replace: isSameRoute,\n ...options,\n })\n }\n\n if (options?.preventScrollReset !== true) {\n window.scrollTo(0, 0)\n }\n })\n\n transition.finished\n .then(() => {\n document.documentElement.removeAttribute(\n DATA_NAVIGATION_TYPE_ATTRIBUTE\n )\n })\n .catch(error => {\n console.error('View transition error:', error)\n })\n } else {\n return navigate(to, options)\n }\n }\n\n return transitionNavigate\n}\n"],"names":["useNavigateWithTransition","navigate","useNavigate","location","useLocation","to","options","DATA_NAVIGATION_TYPE_ATTRIBUTE","error","isSameRoute","isNavigatingToHomeRoute"],"mappings":";;AASO,SAASA,IAA8D;AAC5E,QAAMC,IAAWC,EAAY,GACvBC,IAAWC,EAAY;AA8DtB,SA5DoB,CACzBC,GACAC,MACG;AACC,QAAA,OAAOD,KAAO,UAAU;AAE1B,UAAI,SAAS;AAKA,QAJQ,SAAS,oBAAoB,MAAM;AACpD,UAAAJ,EAASI,CAAE;AAAA,QAAA,CACZ,EAEU,SACR,KAAK,MAAM;AACV,mBAAS,gBAAgB;AAAA,YACvBE;AAAA,UACF;AAAA,QAAA,CACD,EACA,MAAM,CAASC,MAAA;AACN,kBAAA,MAAM,0BAA0BA,CAAK;AAAA,QAAA,CAC9C;AAAA;AAEH,eAAOP,EAASI,CAAE;AAEpB;AAAA,IAAA;AAGI,UAAAI,IAAcJ,MAAOF,EAAS,UAC9BO,IAA0BL,MAAO;AAGvC,QAAI,SAAS;AAgBA,MAfQ,SAAS,oBAAoB,MAAM;AACpD,QAAIK,IACFT,EAAS,CAAC,OAAO,QAAQ,MAAM,GAAG,IAElCA,EAASI,GAAI;AAAA,UACX,SAASI;AAAA,UACT,GAAGH;AAAA,QAAA,CACJ,GAGCA,GAAS,uBAAuB,MAC3B,OAAA,SAAS,GAAG,CAAC;AAAA,MACtB,CACD,EAEU,SACR,KAAK,MAAM;AACV,iBAAS,gBAAgB;AAAA,UACvBC;AAAA,QACF;AAAA,MAAA,CACD,EACA,MAAM,CAASC,MAAA;AACN,gBAAA,MAAM,0BAA0BA,CAAK;AAAA,MAAA,CAC9C;AAAA;AAEI,aAAAP,EAASI,GAAIC,CAAO;AAAA,EAE/B;AAGF;"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@shopify/shop-minis-react",
|
|
3
3
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
4
|
-
"version": "0.0.0-snapshot.
|
|
4
|
+
"version": "0.0.0-snapshot.20251219164319",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"type": "module",
|
|
7
7
|
"engines": {
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
"typescript": ">=5.0.0"
|
|
47
47
|
},
|
|
48
48
|
"dependencies": {
|
|
49
|
-
"@shopify/shop-minis-platform": "0.0.0-snapshot.
|
|
49
|
+
"@shopify/shop-minis-platform": "0.0.0-snapshot.20251219164319",
|
|
50
50
|
"@tailwindcss/vite": "4.1.8",
|
|
51
51
|
"@tanstack/react-query": "5.86.0",
|
|
52
52
|
"@types/color": "3.0.6",
|
|
@@ -290,15 +290,29 @@ describe('useNavigateWithTransition', () => {
|
|
|
290
290
|
})
|
|
291
291
|
})
|
|
292
292
|
|
|
293
|
-
it('handles navigation to root path', async () => {
|
|
293
|
+
it('handles navigation to root path using history delta', async () => {
|
|
294
|
+
// Mock history state with idx
|
|
295
|
+
const originalHistoryState = window.history.state
|
|
296
|
+
Object.defineProperty(window.history, 'state', {
|
|
297
|
+
value: {idx: 3},
|
|
298
|
+
writable: true,
|
|
299
|
+
configurable: true,
|
|
300
|
+
})
|
|
301
|
+
|
|
294
302
|
const {result} = renderHook(() => useNavigateWithTransition())
|
|
295
303
|
|
|
296
304
|
await act(async () => {
|
|
297
305
|
result.current('/')
|
|
298
306
|
})
|
|
299
307
|
|
|
300
|
-
|
|
301
|
-
|
|
308
|
+
// Should navigate back using delta based on history index
|
|
309
|
+
expect(mockNavigate).toHaveBeenCalledWith(-3)
|
|
310
|
+
|
|
311
|
+
// Restore original state
|
|
312
|
+
Object.defineProperty(window.history, 'state', {
|
|
313
|
+
value: originalHistoryState,
|
|
314
|
+
writable: true,
|
|
315
|
+
configurable: true,
|
|
302
316
|
})
|
|
303
317
|
})
|
|
304
318
|
|
|
@@ -38,14 +38,19 @@ export function useNavigateWithTransition(): UseNavigateWithTransitionReturns {
|
|
|
38
38
|
}
|
|
39
39
|
|
|
40
40
|
const isSameRoute = to === location.pathname
|
|
41
|
+
const isNavigatingToHomeRoute = to === '/'
|
|
41
42
|
|
|
42
43
|
// Path navigation - with options
|
|
43
44
|
if (document.startViewTransition) {
|
|
44
45
|
const transition = document.startViewTransition(() => {
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
46
|
+
if (isNavigatingToHomeRoute) {
|
|
47
|
+
navigate(-window.history.state.idx)
|
|
48
|
+
} else {
|
|
49
|
+
navigate(to, {
|
|
50
|
+
replace: isSameRoute,
|
|
51
|
+
...options,
|
|
52
|
+
})
|
|
53
|
+
}
|
|
49
54
|
|
|
50
55
|
if (options?.preventScrollReset !== true) {
|
|
51
56
|
window.scrollTo(0, 0)
|