@tanstack/router-devtools-core 1.130.12 → 1.130.17
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/TanStackRouterDevtoolsPanelCore.cjs +27 -3
- package/dist/cjs/TanStackRouterDevtoolsPanelCore.cjs.map +1 -1
- package/dist/cjs/TanStackRouterDevtoolsPanelCore.d.cts +2 -0
- package/dist/esm/TanStackRouterDevtoolsPanelCore.d.ts +2 -0
- package/dist/esm/TanStackRouterDevtoolsPanelCore.js +27 -3
- package/dist/esm/TanStackRouterDevtoolsPanelCore.js.map +1 -1
- package/package.json +2 -2
- package/src/TanStackRouterDevtoolsPanelCore.tsx +32 -1
|
@@ -6,7 +6,7 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
|
|
|
6
6
|
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
7
7
|
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
8
8
|
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
9
|
-
var _router, _routerState, _shadowDOMTarget, _isMounted, _setIsOpen, _dispose, _Component;
|
|
9
|
+
var _router, _routerState, _style, _className, _shadowDOMTarget, _isMounted, _setIsOpen, _dispose, _Component;
|
|
10
10
|
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
11
11
|
const web = require("solid-js/web");
|
|
12
12
|
const solidJs = require("solid-js");
|
|
@@ -15,6 +15,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
15
15
|
constructor(config) {
|
|
16
16
|
__privateAdd(this, _router);
|
|
17
17
|
__privateAdd(this, _routerState);
|
|
18
|
+
__privateAdd(this, _style);
|
|
19
|
+
__privateAdd(this, _className);
|
|
18
20
|
__privateAdd(this, _shadowDOMTarget);
|
|
19
21
|
__privateAdd(this, _isMounted, false);
|
|
20
22
|
__privateAdd(this, _setIsOpen);
|
|
@@ -24,10 +26,14 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
24
26
|
router,
|
|
25
27
|
routerState,
|
|
26
28
|
shadowDOMTarget,
|
|
27
|
-
setIsOpen
|
|
29
|
+
setIsOpen,
|
|
30
|
+
style,
|
|
31
|
+
className
|
|
28
32
|
} = config;
|
|
29
33
|
__privateSet(this, _router, solidJs.createSignal(router));
|
|
30
34
|
__privateSet(this, _routerState, solidJs.createSignal(routerState));
|
|
35
|
+
__privateSet(this, _style, solidJs.createSignal(style));
|
|
36
|
+
__privateSet(this, _className, solidJs.createSignal(className));
|
|
31
37
|
__privateSet(this, _shadowDOMTarget, shadowDOMTarget);
|
|
32
38
|
__privateSet(this, _setIsOpen, setIsOpen);
|
|
33
39
|
}
|
|
@@ -38,6 +44,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
38
44
|
const dispose = web.render(() => {
|
|
39
45
|
const [router] = __privateGet(this, _router);
|
|
40
46
|
const [routerState] = __privateGet(this, _routerState);
|
|
47
|
+
const [style] = __privateGet(this, _style);
|
|
48
|
+
const [className] = __privateGet(this, _className);
|
|
41
49
|
const shadowDOMTarget = __privateGet(this, _shadowDOMTarget);
|
|
42
50
|
const setIsOpen = __privateGet(this, _setIsOpen);
|
|
43
51
|
let BaseTanStackRouterDevtoolsPanel;
|
|
@@ -60,7 +68,9 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
60
68
|
router,
|
|
61
69
|
routerState,
|
|
62
70
|
shadowDOMTarget,
|
|
63
|
-
setIsOpen
|
|
71
|
+
setIsOpen,
|
|
72
|
+
style,
|
|
73
|
+
className
|
|
64
74
|
});
|
|
65
75
|
}
|
|
66
76
|
});
|
|
@@ -84,6 +94,12 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
84
94
|
setRouterState(routerState) {
|
|
85
95
|
__privateGet(this, _routerState)[1](routerState);
|
|
86
96
|
}
|
|
97
|
+
setStyle(style) {
|
|
98
|
+
__privateGet(this, _style)[1](style);
|
|
99
|
+
}
|
|
100
|
+
setClassName(className) {
|
|
101
|
+
__privateGet(this, _className)[1](className);
|
|
102
|
+
}
|
|
87
103
|
setOptions(options) {
|
|
88
104
|
if (options.shadowDOMTarget !== void 0) {
|
|
89
105
|
__privateSet(this, _shadowDOMTarget, options.shadowDOMTarget);
|
|
@@ -94,10 +110,18 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
94
110
|
if (options.routerState !== void 0) {
|
|
95
111
|
this.setRouterState(options.routerState);
|
|
96
112
|
}
|
|
113
|
+
if (options.style !== void 0) {
|
|
114
|
+
this.setStyle(options.style);
|
|
115
|
+
}
|
|
116
|
+
if (options.className !== void 0) {
|
|
117
|
+
this.setClassName(options.className);
|
|
118
|
+
}
|
|
97
119
|
}
|
|
98
120
|
}
|
|
99
121
|
_router = new WeakMap();
|
|
100
122
|
_routerState = new WeakMap();
|
|
123
|
+
_style = new WeakMap();
|
|
124
|
+
_className = new WeakMap();
|
|
101
125
|
_shadowDOMTarget = new WeakMap();
|
|
102
126
|
_isMounted = new WeakMap();
|
|
103
127
|
_setIsOpen = new WeakMap();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TanStackRouterDevtoolsPanelCore.cjs","sources":["../../src/TanStackRouterDevtoolsPanelCore.tsx"],"sourcesContent":["import { render } from 'solid-js/web'\nimport { createSignal, lazy } from 'solid-js'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport type { JSX } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/router-core'\n\ninterface TanStackRouterDevtoolsPanelCoreOptions {\n /**\n * The standard React style object used to style a component with inline styles\n */\n style?: JSX.CSSProperties\n /**\n * The standard React class property used to style a component with classes\n */\n className?: string\n /**\n * A boolean variable indicating whether the panel is open or closed\n */\n isOpen?: boolean\n /**\n * A function that toggles the open and close state of the panel\n */\n setIsOpen?: (isOpen: boolean) => void\n /**\n * Handles the opening and closing the devtools panel\n */\n handleDragStart?: (e: any) => void\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router: AnyRouter\n\n routerState: any\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nclass TanStackRouterDevtoolsPanelCore {\n #router: any\n #routerState: any\n #shadowDOMTarget?: ShadowRoot\n #isMounted = false\n #setIsOpen?: (isOpen: boolean) => void\n #dispose?: () => void\n #Component: any\n\n constructor(config: TanStackRouterDevtoolsPanelCoreOptions) {\n const {
|
|
1
|
+
{"version":3,"file":"TanStackRouterDevtoolsPanelCore.cjs","sources":["../../src/TanStackRouterDevtoolsPanelCore.tsx"],"sourcesContent":["import { render } from 'solid-js/web'\nimport { createSignal, lazy } from 'solid-js'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport type { JSX } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/router-core'\n\ninterface TanStackRouterDevtoolsPanelCoreOptions {\n /**\n * The standard React style object used to style a component with inline styles\n */\n style?: JSX.CSSProperties\n /**\n * The standard React class property used to style a component with classes\n */\n className?: string\n /**\n * A boolean variable indicating whether the panel is open or closed\n */\n isOpen?: boolean\n /**\n * A function that toggles the open and close state of the panel\n */\n setIsOpen?: (isOpen: boolean) => void\n /**\n * Handles the opening and closing the devtools panel\n */\n handleDragStart?: (e: any) => void\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router: AnyRouter\n\n routerState: any\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nclass TanStackRouterDevtoolsPanelCore {\n #router: any\n #routerState: any\n #style: any\n #className: any\n #shadowDOMTarget?: ShadowRoot\n #isMounted = false\n #setIsOpen?: (isOpen: boolean) => void\n #dispose?: () => void\n #Component: any\n\n constructor(config: TanStackRouterDevtoolsPanelCoreOptions) {\n const {\n router,\n routerState,\n shadowDOMTarget,\n setIsOpen,\n style,\n className,\n } = config\n\n this.#router = createSignal(router)\n this.#routerState = createSignal(routerState)\n this.#style = createSignal(style)\n this.#className = createSignal(className)\n this.#shadowDOMTarget = shadowDOMTarget\n this.#setIsOpen = setIsOpen\n }\n\n mount<T extends HTMLElement>(el: T) {\n if (this.#isMounted) {\n throw new Error('Devtools is already mounted')\n }\n\n const dispose = render(() => {\n const [router] = this.#router\n const [routerState] = this.#routerState\n const [style] = this.#style\n const [className] = this.#className\n const shadowDOMTarget = this.#shadowDOMTarget\n const setIsOpen = this.#setIsOpen\n\n let BaseTanStackRouterDevtoolsPanel\n\n if (this.#Component) {\n BaseTanStackRouterDevtoolsPanel = this.#Component\n } else {\n BaseTanStackRouterDevtoolsPanel = lazy(\n () => import('./BaseTanStackRouterDevtoolsPanel'),\n )\n this.#Component = BaseTanStackRouterDevtoolsPanel\n }\n\n return (\n <ShadowDomTargetContext.Provider value={shadowDOMTarget}>\n <DevtoolsOnCloseContext.Provider\n value={{\n onCloseClick: () => {},\n }}\n >\n <BaseTanStackRouterDevtoolsPanel\n router={router}\n routerState={routerState}\n shadowDOMTarget={shadowDOMTarget}\n setIsOpen={setIsOpen}\n style={style}\n className={className}\n />\n </DevtoolsOnCloseContext.Provider>\n </ShadowDomTargetContext.Provider>\n )\n }, el)\n\n this.#isMounted = true\n this.#dispose = dispose\n }\n\n unmount() {\n if (!this.#isMounted) {\n throw new Error('Devtools is not mounted')\n }\n this.#dispose?.()\n this.#isMounted = false\n }\n\n setRouter(router: AnyRouter) {\n this.#router[1](router)\n }\n\n setRouterState(routerState: any) {\n this.#routerState[1](routerState)\n }\n\n setStyle(style: any) {\n this.#style[1](style)\n }\n\n setClassName(className: any) {\n this.#className[1](className)\n }\n\n setOptions(options: Partial<TanStackRouterDevtoolsPanelCoreOptions>) {\n if (options.shadowDOMTarget !== undefined) {\n this.#shadowDOMTarget = options.shadowDOMTarget\n }\n if (options.router !== undefined) {\n this.setRouter(options.router)\n }\n if (options.routerState !== undefined) {\n this.setRouterState(options.routerState)\n }\n\n if (options.style !== undefined) {\n this.setStyle(options.style)\n }\n\n if (options.className !== undefined) {\n this.setClassName(options.className)\n }\n }\n}\n\nexport { TanStackRouterDevtoolsPanelCore }\n"],"names":["TanStackRouterDevtoolsPanelCore","constructor","config","router","routerState","shadowDOMTarget","setIsOpen","style","className","createSignal","mount","el","Error","dispose","render","BaseTanStackRouterDevtoolsPanel","lazy","_$createComponent","ShadowDomTargetContext","Provider","value","children","DevtoolsOnCloseContext","onCloseClick","unmount","setRouter","setRouterState","setStyle","setClassName","setOptions","options","undefined"],"mappings":"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"}
|
|
@@ -38,6 +38,8 @@ declare class TanStackRouterDevtoolsPanelCore {
|
|
|
38
38
|
unmount(): void;
|
|
39
39
|
setRouter(router: AnyRouter): void;
|
|
40
40
|
setRouterState(routerState: any): void;
|
|
41
|
+
setStyle(style: any): void;
|
|
42
|
+
setClassName(className: any): void;
|
|
41
43
|
setOptions(options: Partial<TanStackRouterDevtoolsPanelCoreOptions>): void;
|
|
42
44
|
}
|
|
43
45
|
export { TanStackRouterDevtoolsPanelCore };
|
|
@@ -38,6 +38,8 @@ declare class TanStackRouterDevtoolsPanelCore {
|
|
|
38
38
|
unmount(): void;
|
|
39
39
|
setRouter(router: AnyRouter): void;
|
|
40
40
|
setRouterState(routerState: any): void;
|
|
41
|
+
setStyle(style: any): void;
|
|
42
|
+
setClassName(className: any): void;
|
|
41
43
|
setOptions(options: Partial<TanStackRouterDevtoolsPanelCoreOptions>): void;
|
|
42
44
|
}
|
|
43
45
|
export { TanStackRouterDevtoolsPanelCore };
|
|
@@ -5,7 +5,7 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
|
|
|
5
5
|
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
6
6
|
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
7
7
|
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
|
|
8
|
-
var _router, _routerState, _shadowDOMTarget, _isMounted, _setIsOpen, _dispose, _Component;
|
|
8
|
+
var _router, _routerState, _style, _className, _shadowDOMTarget, _isMounted, _setIsOpen, _dispose, _Component;
|
|
9
9
|
import { render, createComponent } from "solid-js/web";
|
|
10
10
|
import { createSignal, lazy } from "solid-js";
|
|
11
11
|
import { ShadowDomTargetContext, DevtoolsOnCloseContext } from "./context.js";
|
|
@@ -13,6 +13,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
13
13
|
constructor(config) {
|
|
14
14
|
__privateAdd(this, _router);
|
|
15
15
|
__privateAdd(this, _routerState);
|
|
16
|
+
__privateAdd(this, _style);
|
|
17
|
+
__privateAdd(this, _className);
|
|
16
18
|
__privateAdd(this, _shadowDOMTarget);
|
|
17
19
|
__privateAdd(this, _isMounted, false);
|
|
18
20
|
__privateAdd(this, _setIsOpen);
|
|
@@ -22,10 +24,14 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
22
24
|
router,
|
|
23
25
|
routerState,
|
|
24
26
|
shadowDOMTarget,
|
|
25
|
-
setIsOpen
|
|
27
|
+
setIsOpen,
|
|
28
|
+
style,
|
|
29
|
+
className
|
|
26
30
|
} = config;
|
|
27
31
|
__privateSet(this, _router, createSignal(router));
|
|
28
32
|
__privateSet(this, _routerState, createSignal(routerState));
|
|
33
|
+
__privateSet(this, _style, createSignal(style));
|
|
34
|
+
__privateSet(this, _className, createSignal(className));
|
|
29
35
|
__privateSet(this, _shadowDOMTarget, shadowDOMTarget);
|
|
30
36
|
__privateSet(this, _setIsOpen, setIsOpen);
|
|
31
37
|
}
|
|
@@ -36,6 +42,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
36
42
|
const dispose = render(() => {
|
|
37
43
|
const [router] = __privateGet(this, _router);
|
|
38
44
|
const [routerState] = __privateGet(this, _routerState);
|
|
45
|
+
const [style] = __privateGet(this, _style);
|
|
46
|
+
const [className] = __privateGet(this, _className);
|
|
39
47
|
const shadowDOMTarget = __privateGet(this, _shadowDOMTarget);
|
|
40
48
|
const setIsOpen = __privateGet(this, _setIsOpen);
|
|
41
49
|
let BaseTanStackRouterDevtoolsPanel;
|
|
@@ -58,7 +66,9 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
58
66
|
router,
|
|
59
67
|
routerState,
|
|
60
68
|
shadowDOMTarget,
|
|
61
|
-
setIsOpen
|
|
69
|
+
setIsOpen,
|
|
70
|
+
style,
|
|
71
|
+
className
|
|
62
72
|
});
|
|
63
73
|
}
|
|
64
74
|
});
|
|
@@ -82,6 +92,12 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
82
92
|
setRouterState(routerState) {
|
|
83
93
|
__privateGet(this, _routerState)[1](routerState);
|
|
84
94
|
}
|
|
95
|
+
setStyle(style) {
|
|
96
|
+
__privateGet(this, _style)[1](style);
|
|
97
|
+
}
|
|
98
|
+
setClassName(className) {
|
|
99
|
+
__privateGet(this, _className)[1](className);
|
|
100
|
+
}
|
|
85
101
|
setOptions(options) {
|
|
86
102
|
if (options.shadowDOMTarget !== void 0) {
|
|
87
103
|
__privateSet(this, _shadowDOMTarget, options.shadowDOMTarget);
|
|
@@ -92,10 +108,18 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
92
108
|
if (options.routerState !== void 0) {
|
|
93
109
|
this.setRouterState(options.routerState);
|
|
94
110
|
}
|
|
111
|
+
if (options.style !== void 0) {
|
|
112
|
+
this.setStyle(options.style);
|
|
113
|
+
}
|
|
114
|
+
if (options.className !== void 0) {
|
|
115
|
+
this.setClassName(options.className);
|
|
116
|
+
}
|
|
95
117
|
}
|
|
96
118
|
}
|
|
97
119
|
_router = new WeakMap();
|
|
98
120
|
_routerState = new WeakMap();
|
|
121
|
+
_style = new WeakMap();
|
|
122
|
+
_className = new WeakMap();
|
|
99
123
|
_shadowDOMTarget = new WeakMap();
|
|
100
124
|
_isMounted = new WeakMap();
|
|
101
125
|
_setIsOpen = new WeakMap();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TanStackRouterDevtoolsPanelCore.js","sources":["../../src/TanStackRouterDevtoolsPanelCore.tsx"],"sourcesContent":["import { render } from 'solid-js/web'\nimport { createSignal, lazy } from 'solid-js'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport type { JSX } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/router-core'\n\ninterface TanStackRouterDevtoolsPanelCoreOptions {\n /**\n * The standard React style object used to style a component with inline styles\n */\n style?: JSX.CSSProperties\n /**\n * The standard React class property used to style a component with classes\n */\n className?: string\n /**\n * A boolean variable indicating whether the panel is open or closed\n */\n isOpen?: boolean\n /**\n * A function that toggles the open and close state of the panel\n */\n setIsOpen?: (isOpen: boolean) => void\n /**\n * Handles the opening and closing the devtools panel\n */\n handleDragStart?: (e: any) => void\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router: AnyRouter\n\n routerState: any\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nclass TanStackRouterDevtoolsPanelCore {\n #router: any\n #routerState: any\n #shadowDOMTarget?: ShadowRoot\n #isMounted = false\n #setIsOpen?: (isOpen: boolean) => void\n #dispose?: () => void\n #Component: any\n\n constructor(config: TanStackRouterDevtoolsPanelCoreOptions) {\n const {
|
|
1
|
+
{"version":3,"file":"TanStackRouterDevtoolsPanelCore.js","sources":["../../src/TanStackRouterDevtoolsPanelCore.tsx"],"sourcesContent":["import { render } from 'solid-js/web'\nimport { createSignal, lazy } from 'solid-js'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport type { JSX } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/router-core'\n\ninterface TanStackRouterDevtoolsPanelCoreOptions {\n /**\n * The standard React style object used to style a component with inline styles\n */\n style?: JSX.CSSProperties\n /**\n * The standard React class property used to style a component with classes\n */\n className?: string\n /**\n * A boolean variable indicating whether the panel is open or closed\n */\n isOpen?: boolean\n /**\n * A function that toggles the open and close state of the panel\n */\n setIsOpen?: (isOpen: boolean) => void\n /**\n * Handles the opening and closing the devtools panel\n */\n handleDragStart?: (e: any) => void\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router: AnyRouter\n\n routerState: any\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nclass TanStackRouterDevtoolsPanelCore {\n #router: any\n #routerState: any\n #style: any\n #className: any\n #shadowDOMTarget?: ShadowRoot\n #isMounted = false\n #setIsOpen?: (isOpen: boolean) => void\n #dispose?: () => void\n #Component: any\n\n constructor(config: TanStackRouterDevtoolsPanelCoreOptions) {\n const {\n router,\n routerState,\n shadowDOMTarget,\n setIsOpen,\n style,\n className,\n } = config\n\n this.#router = createSignal(router)\n this.#routerState = createSignal(routerState)\n this.#style = createSignal(style)\n this.#className = createSignal(className)\n this.#shadowDOMTarget = shadowDOMTarget\n this.#setIsOpen = setIsOpen\n }\n\n mount<T extends HTMLElement>(el: T) {\n if (this.#isMounted) {\n throw new Error('Devtools is already mounted')\n }\n\n const dispose = render(() => {\n const [router] = this.#router\n const [routerState] = this.#routerState\n const [style] = this.#style\n const [className] = this.#className\n const shadowDOMTarget = this.#shadowDOMTarget\n const setIsOpen = this.#setIsOpen\n\n let BaseTanStackRouterDevtoolsPanel\n\n if (this.#Component) {\n BaseTanStackRouterDevtoolsPanel = this.#Component\n } else {\n BaseTanStackRouterDevtoolsPanel = lazy(\n () => import('./BaseTanStackRouterDevtoolsPanel'),\n )\n this.#Component = BaseTanStackRouterDevtoolsPanel\n }\n\n return (\n <ShadowDomTargetContext.Provider value={shadowDOMTarget}>\n <DevtoolsOnCloseContext.Provider\n value={{\n onCloseClick: () => {},\n }}\n >\n <BaseTanStackRouterDevtoolsPanel\n router={router}\n routerState={routerState}\n shadowDOMTarget={shadowDOMTarget}\n setIsOpen={setIsOpen}\n style={style}\n className={className}\n />\n </DevtoolsOnCloseContext.Provider>\n </ShadowDomTargetContext.Provider>\n )\n }, el)\n\n this.#isMounted = true\n this.#dispose = dispose\n }\n\n unmount() {\n if (!this.#isMounted) {\n throw new Error('Devtools is not mounted')\n }\n this.#dispose?.()\n this.#isMounted = false\n }\n\n setRouter(router: AnyRouter) {\n this.#router[1](router)\n }\n\n setRouterState(routerState: any) {\n this.#routerState[1](routerState)\n }\n\n setStyle(style: any) {\n this.#style[1](style)\n }\n\n setClassName(className: any) {\n this.#className[1](className)\n }\n\n setOptions(options: Partial<TanStackRouterDevtoolsPanelCoreOptions>) {\n if (options.shadowDOMTarget !== undefined) {\n this.#shadowDOMTarget = options.shadowDOMTarget\n }\n if (options.router !== undefined) {\n this.setRouter(options.router)\n }\n if (options.routerState !== undefined) {\n this.setRouterState(options.routerState)\n }\n\n if (options.style !== undefined) {\n this.setStyle(options.style)\n }\n\n if (options.className !== undefined) {\n this.setClassName(options.className)\n }\n }\n}\n\nexport { TanStackRouterDevtoolsPanelCore }\n"],"names":["TanStackRouterDevtoolsPanelCore","constructor","config","router","routerState","shadowDOMTarget","setIsOpen","style","className","createSignal","mount","el","Error","dispose","render","BaseTanStackRouterDevtoolsPanel","lazy","_$createComponent","ShadowDomTargetContext","Provider","value","children","DevtoolsOnCloseContext","onCloseClick","unmount","setRouter","setRouterState","setStyle","setClassName","setOptions","options","undefined"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/router-devtools-core",
|
|
3
|
-
"version": "1.130.
|
|
3
|
+
"version": "1.130.17",
|
|
4
4
|
"description": "Modern and scalable routing for Web applications",
|
|
5
5
|
"author": "Tanner Linsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
"tiny-invariant": "^1.3.3",
|
|
61
61
|
"csstype": "^3.0.10",
|
|
62
62
|
"solid-js": ">=1.9.5",
|
|
63
|
-
"@tanstack/router-core": "^1.130.
|
|
63
|
+
"@tanstack/router-core": "^1.130.17"
|
|
64
64
|
},
|
|
65
65
|
"peerDependenciesMeta": {
|
|
66
66
|
"csstype": {
|
|
@@ -40,6 +40,8 @@ interface TanStackRouterDevtoolsPanelCoreOptions {
|
|
|
40
40
|
class TanStackRouterDevtoolsPanelCore {
|
|
41
41
|
#router: any
|
|
42
42
|
#routerState: any
|
|
43
|
+
#style: any
|
|
44
|
+
#className: any
|
|
43
45
|
#shadowDOMTarget?: ShadowRoot
|
|
44
46
|
#isMounted = false
|
|
45
47
|
#setIsOpen?: (isOpen: boolean) => void
|
|
@@ -47,10 +49,19 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
47
49
|
#Component: any
|
|
48
50
|
|
|
49
51
|
constructor(config: TanStackRouterDevtoolsPanelCoreOptions) {
|
|
50
|
-
const {
|
|
52
|
+
const {
|
|
53
|
+
router,
|
|
54
|
+
routerState,
|
|
55
|
+
shadowDOMTarget,
|
|
56
|
+
setIsOpen,
|
|
57
|
+
style,
|
|
58
|
+
className,
|
|
59
|
+
} = config
|
|
51
60
|
|
|
52
61
|
this.#router = createSignal(router)
|
|
53
62
|
this.#routerState = createSignal(routerState)
|
|
63
|
+
this.#style = createSignal(style)
|
|
64
|
+
this.#className = createSignal(className)
|
|
54
65
|
this.#shadowDOMTarget = shadowDOMTarget
|
|
55
66
|
this.#setIsOpen = setIsOpen
|
|
56
67
|
}
|
|
@@ -63,6 +74,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
63
74
|
const dispose = render(() => {
|
|
64
75
|
const [router] = this.#router
|
|
65
76
|
const [routerState] = this.#routerState
|
|
77
|
+
const [style] = this.#style
|
|
78
|
+
const [className] = this.#className
|
|
66
79
|
const shadowDOMTarget = this.#shadowDOMTarget
|
|
67
80
|
const setIsOpen = this.#setIsOpen
|
|
68
81
|
|
|
@@ -89,6 +102,8 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
89
102
|
routerState={routerState}
|
|
90
103
|
shadowDOMTarget={shadowDOMTarget}
|
|
91
104
|
setIsOpen={setIsOpen}
|
|
105
|
+
style={style}
|
|
106
|
+
className={className}
|
|
92
107
|
/>
|
|
93
108
|
</DevtoolsOnCloseContext.Provider>
|
|
94
109
|
</ShadowDomTargetContext.Provider>
|
|
@@ -115,6 +130,14 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
115
130
|
this.#routerState[1](routerState)
|
|
116
131
|
}
|
|
117
132
|
|
|
133
|
+
setStyle(style: any) {
|
|
134
|
+
this.#style[1](style)
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
setClassName(className: any) {
|
|
138
|
+
this.#className[1](className)
|
|
139
|
+
}
|
|
140
|
+
|
|
118
141
|
setOptions(options: Partial<TanStackRouterDevtoolsPanelCoreOptions>) {
|
|
119
142
|
if (options.shadowDOMTarget !== undefined) {
|
|
120
143
|
this.#shadowDOMTarget = options.shadowDOMTarget
|
|
@@ -125,6 +148,14 @@ class TanStackRouterDevtoolsPanelCore {
|
|
|
125
148
|
if (options.routerState !== undefined) {
|
|
126
149
|
this.setRouterState(options.routerState)
|
|
127
150
|
}
|
|
151
|
+
|
|
152
|
+
if (options.style !== undefined) {
|
|
153
|
+
this.setStyle(options.style)
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
if (options.className !== undefined) {
|
|
157
|
+
this.setClassName(options.className)
|
|
158
|
+
}
|
|
128
159
|
}
|
|
129
160
|
}
|
|
130
161
|
|