@tanstack/react-router 1.34.6 → 1.34.7
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.
- package/dist/cjs/useBlocker.cjs +15 -14
- package/dist/cjs/useBlocker.cjs.map +1 -1
- package/dist/esm/useBlocker.js +15 -14
- package/dist/esm/useBlocker.js.map +1 -1
- package/package.json +1 -1
- package/src/useBlocker.tsx +14 -17
package/dist/cjs/useBlocker.cjs
CHANGED
|
@@ -32,29 +32,30 @@ function useBlocker(blockerFnOrOpts, condition) {
|
|
|
32
32
|
reset: () => {
|
|
33
33
|
}
|
|
34
34
|
});
|
|
35
|
-
const createPromise = () => new Promise((resolve) => {
|
|
36
|
-
setResolver({
|
|
37
|
-
status: "idle",
|
|
38
|
-
proceed: () => resolve(true),
|
|
39
|
-
reset: () => resolve(false)
|
|
40
|
-
});
|
|
41
|
-
});
|
|
42
|
-
const [promise, setPromise] = React__namespace.useState(createPromise);
|
|
43
35
|
React__namespace.useEffect(() => {
|
|
44
36
|
const blockerFnComposed = async () => {
|
|
45
37
|
if (blockerFn) {
|
|
46
38
|
return await blockerFn();
|
|
47
39
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
40
|
+
const promise = new Promise((resolve) => {
|
|
41
|
+
setResolver({
|
|
42
|
+
status: "blocked",
|
|
43
|
+
proceed: () => resolve(true),
|
|
44
|
+
reset: () => resolve(false)
|
|
45
|
+
});
|
|
46
|
+
});
|
|
52
47
|
const canNavigateAsync = await promise;
|
|
53
|
-
|
|
48
|
+
setResolver({
|
|
49
|
+
status: "idle",
|
|
50
|
+
proceed: () => {
|
|
51
|
+
},
|
|
52
|
+
reset: () => {
|
|
53
|
+
}
|
|
54
|
+
});
|
|
54
55
|
return canNavigateAsync;
|
|
55
56
|
};
|
|
56
57
|
return !blockerCondition ? void 0 : history.block(blockerFnComposed);
|
|
57
|
-
}, [blockerFn, blockerCondition, history
|
|
58
|
+
}, [blockerFn, blockerCondition, history]);
|
|
58
59
|
return resolver;
|
|
59
60
|
}
|
|
60
61
|
function Block({ blockerFn, condition, children }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBlocker.cjs","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\ntype BlockerResolver = {\n status: 'idle' | 'blocked'\n proceed: () => void\n reset: () => void\n}\n\ntype BlockerOpts = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n}\n\nexport function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver\n\n/**\n * @deprecated Use the BlockerOpts object syntax instead\n */\nexport function useBlocker(\n blockerFn?: BlockerFn,\n condition?: boolean | any,\n): BlockerResolver\n\nexport function useBlocker(\n blockerFnOrOpts?: BlockerFn | BlockerOpts,\n condition?: boolean | any,\n): BlockerResolver {\n const { blockerFn, blockerCondition } = blockerFnOrOpts\n ? typeof blockerFnOrOpts === 'function'\n ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true }\n : {\n blockerFn: blockerFnOrOpts.blockerFn,\n blockerCondition: blockerFnOrOpts.condition ?? true,\n }\n : { blockerFn: undefined, blockerCondition: condition ?? true }\n const { history } = useRouter()\n\n const [resolver, setResolver] = React.useState<BlockerResolver>({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n
|
|
1
|
+
{"version":3,"file":"useBlocker.cjs","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\ntype BlockerResolver = {\n status: 'idle' | 'blocked'\n proceed: () => void\n reset: () => void\n}\n\ntype BlockerOpts = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n}\n\nexport function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver\n\n/**\n * @deprecated Use the BlockerOpts object syntax instead\n */\nexport function useBlocker(\n blockerFn?: BlockerFn,\n condition?: boolean | any,\n): BlockerResolver\n\nexport function useBlocker(\n blockerFnOrOpts?: BlockerFn | BlockerOpts,\n condition?: boolean | any,\n): BlockerResolver {\n const { blockerFn, blockerCondition } = blockerFnOrOpts\n ? typeof blockerFnOrOpts === 'function'\n ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true }\n : {\n blockerFn: blockerFnOrOpts.blockerFn,\n blockerCondition: blockerFnOrOpts.condition ?? true,\n }\n : { blockerFn: undefined, blockerCondition: condition ?? true }\n const { history } = useRouter()\n\n const [resolver, setResolver] = React.useState<BlockerResolver>({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n React.useEffect(() => {\n const blockerFnComposed = async () => {\n // If a function is provided, it takes precedence over the promise blocker\n if (blockerFn) {\n return await blockerFn()\n }\n\n const promise = new Promise<boolean>((resolve) => {\n setResolver({\n status: 'blocked',\n proceed: () => resolve(true),\n reset: () => resolve(false),\n })\n })\n\n const canNavigateAsync = await promise\n\n setResolver({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n return canNavigateAsync\n }\n\n return !blockerCondition ? undefined : history.block(blockerFnComposed)\n }, [blockerFn, blockerCondition, history])\n\n return resolver\n}\n\nexport function Block({ blockerFn, condition, children }: PromptProps) {\n const resolver = useBlocker({ blockerFn, condition })\n return children\n ? typeof children === 'function'\n ? children(resolver)\n : children\n : null\n}\n\nexport type PromptProps = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n children?: ReactNode | (({ proceed, reset }: BlockerResolver) => ReactNode)\n}\n"],"names":["useRouter","React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AA0BgB,SAAA,WACd,iBACA,WACiB;AACjB,QAAM,EAAE,WAAW,qBAAqB,kBACpC,OAAO,oBAAoB,aACzB,EAAE,WAAW,iBAAiB,kBAAkB,aAAa,SAC7D;AAAA,IACE,WAAW,gBAAgB;AAAA,IAC3B,kBAAkB,gBAAgB,aAAa;AAAA,EAAA,IAEnD,EAAE,WAAW,QAAW,kBAAkB,aAAa;AACrD,QAAA,EAAE,YAAYA,UAAAA;AAEpB,QAAM,CAAC,UAAU,WAAW,IAAIC,iBAAM,SAA0B;AAAA,IAC9D,QAAQ;AAAA,IACR,SAAS,MAAM;AAAA,IAAC;AAAA,IAChB,OAAO,MAAM;AAAA,IAAC;AAAA,EAAA,CACf;AAEDA,mBAAM,UAAU,MAAM;AACpB,UAAM,oBAAoB,YAAY;AAEpC,UAAI,WAAW;AACb,eAAO,MAAM,UAAU;AAAA,MACzB;AAEA,YAAM,UAAU,IAAI,QAAiB,CAAC,YAAY;AACpC,oBAAA;AAAA,UACV,QAAQ;AAAA,UACR,SAAS,MAAM,QAAQ,IAAI;AAAA,UAC3B,OAAO,MAAM,QAAQ,KAAK;AAAA,QAAA,CAC3B;AAAA,MAAA,CACF;AAED,YAAM,mBAAmB,MAAM;AAEnB,kBAAA;AAAA,QACV,QAAQ;AAAA,QACR,SAAS,MAAM;AAAA,QAAC;AAAA,QAChB,OAAO,MAAM;AAAA,QAAC;AAAA,MAAA,CACf;AAEM,aAAA;AAAA,IAAA;AAGT,WAAO,CAAC,mBAAmB,SAAY,QAAQ,MAAM,iBAAiB;AAAA,EACrE,GAAA,CAAC,WAAW,kBAAkB,OAAO,CAAC;AAElC,SAAA;AACT;AAEO,SAAS,MAAM,EAAE,WAAW,WAAW,YAAyB;AACrE,QAAM,WAAW,WAAW,EAAE,WAAW,UAAW,CAAA;AACpD,SAAO,WACH,OAAO,aAAa,aAClB,SAAS,QAAQ,IACjB,WACF;AACN;;;"}
|
package/dist/esm/useBlocker.js
CHANGED
|
@@ -13,29 +13,30 @@ function useBlocker(blockerFnOrOpts, condition) {
|
|
|
13
13
|
reset: () => {
|
|
14
14
|
}
|
|
15
15
|
});
|
|
16
|
-
const createPromise = () => new Promise((resolve) => {
|
|
17
|
-
setResolver({
|
|
18
|
-
status: "idle",
|
|
19
|
-
proceed: () => resolve(true),
|
|
20
|
-
reset: () => resolve(false)
|
|
21
|
-
});
|
|
22
|
-
});
|
|
23
|
-
const [promise, setPromise] = React.useState(createPromise);
|
|
24
16
|
React.useEffect(() => {
|
|
25
17
|
const blockerFnComposed = async () => {
|
|
26
18
|
if (blockerFn) {
|
|
27
19
|
return await blockerFn();
|
|
28
20
|
}
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
21
|
+
const promise = new Promise((resolve) => {
|
|
22
|
+
setResolver({
|
|
23
|
+
status: "blocked",
|
|
24
|
+
proceed: () => resolve(true),
|
|
25
|
+
reset: () => resolve(false)
|
|
26
|
+
});
|
|
27
|
+
});
|
|
33
28
|
const canNavigateAsync = await promise;
|
|
34
|
-
|
|
29
|
+
setResolver({
|
|
30
|
+
status: "idle",
|
|
31
|
+
proceed: () => {
|
|
32
|
+
},
|
|
33
|
+
reset: () => {
|
|
34
|
+
}
|
|
35
|
+
});
|
|
35
36
|
return canNavigateAsync;
|
|
36
37
|
};
|
|
37
38
|
return !blockerCondition ? void 0 : history.block(blockerFnComposed);
|
|
38
|
-
}, [blockerFn, blockerCondition, history
|
|
39
|
+
}, [blockerFn, blockerCondition, history]);
|
|
39
40
|
return resolver;
|
|
40
41
|
}
|
|
41
42
|
function Block({ blockerFn, condition, children }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBlocker.js","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\ntype BlockerResolver = {\n status: 'idle' | 'blocked'\n proceed: () => void\n reset: () => void\n}\n\ntype BlockerOpts = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n}\n\nexport function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver\n\n/**\n * @deprecated Use the BlockerOpts object syntax instead\n */\nexport function useBlocker(\n blockerFn?: BlockerFn,\n condition?: boolean | any,\n): BlockerResolver\n\nexport function useBlocker(\n blockerFnOrOpts?: BlockerFn | BlockerOpts,\n condition?: boolean | any,\n): BlockerResolver {\n const { blockerFn, blockerCondition } = blockerFnOrOpts\n ? typeof blockerFnOrOpts === 'function'\n ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true }\n : {\n blockerFn: blockerFnOrOpts.blockerFn,\n blockerCondition: blockerFnOrOpts.condition ?? true,\n }\n : { blockerFn: undefined, blockerCondition: condition ?? true }\n const { history } = useRouter()\n\n const [resolver, setResolver] = React.useState<BlockerResolver>({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n
|
|
1
|
+
{"version":3,"file":"useBlocker.js","sources":["../../src/useBlocker.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useRouter } from './useRouter'\nimport type { BlockerFn } from '@tanstack/history'\nimport type { ReactNode } from './route'\n\ntype BlockerResolver = {\n status: 'idle' | 'blocked'\n proceed: () => void\n reset: () => void\n}\n\ntype BlockerOpts = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n}\n\nexport function useBlocker(blockerFnOrOpts?: BlockerOpts): BlockerResolver\n\n/**\n * @deprecated Use the BlockerOpts object syntax instead\n */\nexport function useBlocker(\n blockerFn?: BlockerFn,\n condition?: boolean | any,\n): BlockerResolver\n\nexport function useBlocker(\n blockerFnOrOpts?: BlockerFn | BlockerOpts,\n condition?: boolean | any,\n): BlockerResolver {\n const { blockerFn, blockerCondition } = blockerFnOrOpts\n ? typeof blockerFnOrOpts === 'function'\n ? { blockerFn: blockerFnOrOpts, blockerCondition: condition ?? true }\n : {\n blockerFn: blockerFnOrOpts.blockerFn,\n blockerCondition: blockerFnOrOpts.condition ?? true,\n }\n : { blockerFn: undefined, blockerCondition: condition ?? true }\n const { history } = useRouter()\n\n const [resolver, setResolver] = React.useState<BlockerResolver>({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n React.useEffect(() => {\n const blockerFnComposed = async () => {\n // If a function is provided, it takes precedence over the promise blocker\n if (blockerFn) {\n return await blockerFn()\n }\n\n const promise = new Promise<boolean>((resolve) => {\n setResolver({\n status: 'blocked',\n proceed: () => resolve(true),\n reset: () => resolve(false),\n })\n })\n\n const canNavigateAsync = await promise\n\n setResolver({\n status: 'idle',\n proceed: () => {},\n reset: () => {},\n })\n\n return canNavigateAsync\n }\n\n return !blockerCondition ? undefined : history.block(blockerFnComposed)\n }, [blockerFn, blockerCondition, history])\n\n return resolver\n}\n\nexport function Block({ blockerFn, condition, children }: PromptProps) {\n const resolver = useBlocker({ blockerFn, condition })\n return children\n ? typeof children === 'function'\n ? children(resolver)\n : children\n : null\n}\n\nexport type PromptProps = {\n blockerFn?: BlockerFn\n condition?: boolean | any\n children?: ReactNode | (({ proceed, reset }: BlockerResolver) => ReactNode)\n}\n"],"names":[],"mappings":";;AA0BgB,SAAA,WACd,iBACA,WACiB;AACjB,QAAM,EAAE,WAAW,qBAAqB,kBACpC,OAAO,oBAAoB,aACzB,EAAE,WAAW,iBAAiB,kBAAkB,aAAa,SAC7D;AAAA,IACE,WAAW,gBAAgB;AAAA,IAC3B,kBAAkB,gBAAgB,aAAa;AAAA,EAAA,IAEnD,EAAE,WAAW,QAAW,kBAAkB,aAAa;AACrD,QAAA,EAAE,YAAY;AAEpB,QAAM,CAAC,UAAU,WAAW,IAAI,MAAM,SAA0B;AAAA,IAC9D,QAAQ;AAAA,IACR,SAAS,MAAM;AAAA,IAAC;AAAA,IAChB,OAAO,MAAM;AAAA,IAAC;AAAA,EAAA,CACf;AAED,QAAM,UAAU,MAAM;AACpB,UAAM,oBAAoB,YAAY;AAEpC,UAAI,WAAW;AACb,eAAO,MAAM,UAAU;AAAA,MACzB;AAEA,YAAM,UAAU,IAAI,QAAiB,CAAC,YAAY;AACpC,oBAAA;AAAA,UACV,QAAQ;AAAA,UACR,SAAS,MAAM,QAAQ,IAAI;AAAA,UAC3B,OAAO,MAAM,QAAQ,KAAK;AAAA,QAAA,CAC3B;AAAA,MAAA,CACF;AAED,YAAM,mBAAmB,MAAM;AAEnB,kBAAA;AAAA,QACV,QAAQ;AAAA,QACR,SAAS,MAAM;AAAA,QAAC;AAAA,QAChB,OAAO,MAAM;AAAA,QAAC;AAAA,MAAA,CACf;AAEM,aAAA;AAAA,IAAA;AAGT,WAAO,CAAC,mBAAmB,SAAY,QAAQ,MAAM,iBAAiB;AAAA,EACrE,GAAA,CAAC,WAAW,kBAAkB,OAAO,CAAC;AAElC,SAAA;AACT;AAEO,SAAS,MAAM,EAAE,WAAW,WAAW,YAAyB;AACrE,QAAM,WAAW,WAAW,EAAE,WAAW,UAAW,CAAA;AACpD,SAAO,WACH,OAAO,aAAa,aAClB,SAAS,QAAQ,IACjB,WACF;AACN;"}
|
package/package.json
CHANGED
package/src/useBlocker.tsx
CHANGED
|
@@ -44,17 +44,6 @@ export function useBlocker(
|
|
|
44
44
|
reset: () => {},
|
|
45
45
|
})
|
|
46
46
|
|
|
47
|
-
const createPromise = () =>
|
|
48
|
-
new Promise<boolean>((resolve) => {
|
|
49
|
-
setResolver({
|
|
50
|
-
status: 'idle',
|
|
51
|
-
proceed: () => resolve(true),
|
|
52
|
-
reset: () => resolve(false),
|
|
53
|
-
})
|
|
54
|
-
})
|
|
55
|
-
|
|
56
|
-
const [promise, setPromise] = React.useState(createPromise)
|
|
57
|
-
|
|
58
47
|
React.useEffect(() => {
|
|
59
48
|
const blockerFnComposed = async () => {
|
|
60
49
|
// If a function is provided, it takes precedence over the promise blocker
|
|
@@ -62,19 +51,27 @@ export function useBlocker(
|
|
|
62
51
|
return await blockerFn()
|
|
63
52
|
}
|
|
64
53
|
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
54
|
+
const promise = new Promise<boolean>((resolve) => {
|
|
55
|
+
setResolver({
|
|
56
|
+
status: 'blocked',
|
|
57
|
+
proceed: () => resolve(true),
|
|
58
|
+
reset: () => resolve(false),
|
|
59
|
+
})
|
|
60
|
+
})
|
|
61
|
+
|
|
69
62
|
const canNavigateAsync = await promise
|
|
70
63
|
|
|
71
|
-
|
|
64
|
+
setResolver({
|
|
65
|
+
status: 'idle',
|
|
66
|
+
proceed: () => {},
|
|
67
|
+
reset: () => {},
|
|
68
|
+
})
|
|
72
69
|
|
|
73
70
|
return canNavigateAsync
|
|
74
71
|
}
|
|
75
72
|
|
|
76
73
|
return !blockerCondition ? undefined : history.block(blockerFnComposed)
|
|
77
|
-
}, [blockerFn, blockerCondition, history
|
|
74
|
+
}, [blockerFn, blockerCondition, history])
|
|
78
75
|
|
|
79
76
|
return resolver
|
|
80
77
|
}
|