@tanstack/react-router-devtools 0.0.1-beta.45 → 0.0.1-beta.49

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.
@@ -71,20 +71,17 @@ const Info = utils.styled('span', {
71
71
  color: 'grey',
72
72
  fontSize: '.7em'
73
73
  });
74
- const Expander = _ref => {
75
- let {
76
- expanded,
77
- style = {}
78
- } = _ref;
79
- return /*#__PURE__*/React__namespace.createElement("span", {
80
- style: {
81
- display: 'inline-block',
82
- transition: 'all .1s ease',
83
- transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,
84
- ...style
85
- }
86
- }, "\u25B6");
87
- };
74
+ const Expander = ({
75
+ expanded,
76
+ style = {}
77
+ }) => /*#__PURE__*/React__namespace.createElement("span", {
78
+ style: {
79
+ display: 'inline-block',
80
+ transition: 'all .1s ease',
81
+ transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,
82
+ ...style
83
+ }
84
+ }, "\u25B6");
88
85
  /**
89
86
  * Chunk elements in the array by size
90
87
  *
@@ -104,19 +101,18 @@ function chunkArray(array, size) {
104
101
  }
105
102
  return result;
106
103
  }
107
- const DefaultRenderer = _ref2 => {
108
- let {
109
- handleEntry,
110
- label,
111
- value,
112
- subEntries = [],
113
- subEntryPages = [],
114
- type,
115
- expanded = false,
116
- toggleExpanded,
117
- pageSize,
118
- renderer
119
- } = _ref2;
104
+ const DefaultRenderer = ({
105
+ handleEntry,
106
+ label,
107
+ value,
108
+ subEntries = [],
109
+ subEntryPages = [],
110
+ type,
111
+ expanded = false,
112
+ toggleExpanded,
113
+ pageSize,
114
+ renderer
115
+ }) => {
120
116
  const [expandedPages, setExpandedPages] = React__namespace.useState([]);
121
117
  const [valueSnapshot, setValueSnapshot] = React__namespace.useState(undefined);
122
118
  const refreshValueSnapshot = () => {
@@ -149,14 +145,13 @@ const DefaultRenderer = _ref2 => {
149
145
  function isIterable(x) {
150
146
  return Symbol.iterator in x;
151
147
  }
152
- function Explorer(_ref3) {
153
- let {
154
- value,
155
- defaultExpanded,
156
- renderer = DefaultRenderer,
157
- pageSize = 100,
158
- ...rest
159
- } = _ref3;
148
+ function Explorer({
149
+ value,
150
+ defaultExpanded,
151
+ renderer = DefaultRenderer,
152
+ pageSize = 100,
153
+ ...rest
154
+ }) {
160
155
  const [expanded, setExpanded] = React__namespace.useState(Boolean(defaultExpanded));
161
156
  const toggleExpanded = React__namespace.useCallback(() => setExpanded(old => !old), []);
162
157
  let type = typeof value;
@@ -164,7 +159,7 @@ function Explorer(_ref3) {
164
159
  const makeProperty = sub => {
165
160
  const subDefaultExpanded = defaultExpanded === true ? {
166
161
  [sub.label]: true
167
- } : defaultExpanded == null ? void 0 : defaultExpanded[sub.label];
162
+ } : defaultExpanded?.[sub.label];
168
163
  return {
169
164
  ...sub,
170
165
  defaultExpanded: subDefaultExpanded
@@ -184,13 +179,10 @@ function Explorer(_ref3) {
184
179
  }));
185
180
  } else if (typeof value === 'object' && value !== null) {
186
181
  type = 'object';
187
- subEntries = Object.entries(value).map(_ref4 => {
188
- let [key, val] = _ref4;
189
- return makeProperty({
190
- label: key,
191
- value: val
192
- });
193
- });
182
+ subEntries = Object.entries(value).map(([key, val]) => makeProperty({
183
+ label: key,
184
+ value: val
185
+ }));
194
186
  }
195
187
  const subEntryPages = chunkArray(subEntries, pageSize);
196
188
  return renderer({
@@ -1 +1 @@
1
- {"version":3,"file":"Explorer.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { displayValue, styled } from './utils'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '.7rem',\n lineHeight: '1.7',\n outline: 'none',\n wordBreak: 'break-word',\n})\n\nexport const Label = styled('span', {\n color: 'white',\n})\n\nexport const LabelButton = styled('button', {\n cursor: 'pointer',\n color: 'white',\n})\n\nexport const ExpandButton = styled('button', {\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n})\n\nexport const Value = styled('span', (_props, theme) => ({\n color: theme.danger,\n}))\n\nexport const SubEntries = styled('div', {\n marginLeft: '.1em',\n paddingLeft: '1em',\n borderLeft: '2px solid rgba(0,0,0,.15)',\n})\n\nexport const Info = styled('span', {\n color: 'grey',\n fontSize: '.7em',\n})\n\ntype ExpanderProps = {\n expanded: boolean\n style?: React.CSSProperties\n}\n\nexport const Expander = ({ expanded, style = {} }: ExpanderProps) => (\n <span\n style={{\n display: 'inline-block',\n transition: 'all .1s ease',\n transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,\n ...style,\n }}\n >\n ▶\n </span>\n)\n\ntype Entry = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: HandleEntryFn\n label?: React.ReactNode\n value: unknown\n subEntries: Entry[]\n subEntryPages: Entry[][]\n type: string\n expanded: boolean\n toggleExpanded: () => void\n pageSize: number\n renderer?: Renderer\n}\n\n/**\n * Chunk elements in the array by size\n *\n * when the array cannot be chunked evenly by size, the last chunk will be\n * filled with the remaining elements\n *\n * @example\n * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]\n */\nexport function chunkArray<T>(array: T[], size: number): T[][] {\n if (size < 1) return []\n let i = 0\n const result: T[][] = []\n while (i < array.length) {\n result.push(array.slice(i, i + size))\n i = i + size\n }\n return result\n}\n\ntype Renderer = (props: RendererProps) => JSX.Element\n\nexport const DefaultRenderer: Renderer = ({\n handleEntry,\n label,\n value,\n subEntries = [],\n subEntryPages = [],\n type,\n expanded = false,\n toggleExpanded,\n pageSize,\n renderer,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n const [valueSnapshot, setValueSnapshot] = React.useState(undefined)\n\n const refreshValueSnapshot = () => {\n setValueSnapshot((value as () => any)())\n }\n\n return (\n <Entry>\n {subEntryPages.length ? (\n <>\n <ExpandButton onClick={() => toggleExpanded()}>\n <Expander expanded={expanded} /> {label}{' '}\n <Info>\n {String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : ''}\n {subEntries.length} {subEntries.length > 1 ? `items` : `item`}\n </Info>\n </ExpandButton>\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>\n {subEntries.map((entry, index) => handleEntry(entry))}\n </SubEntries>\n ) : (\n <SubEntries>\n {subEntryPages.map((entries, index) => (\n <div key={index}>\n <Entry>\n <LabelButton\n onClick={() =>\n setExpandedPages((old) =>\n old.includes(index)\n ? old.filter((d) => d !== index)\n : [...old, index],\n )\n }\n >\n <Expander expanded={expanded} /> [{index * pageSize} ...{' '}\n {index * pageSize + pageSize - 1}]\n </LabelButton>\n {expandedPages.includes(index) ? (\n <SubEntries>\n {entries.map((entry) => handleEntry(entry))}\n </SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : type === 'function' ? (\n <>\n <Explorer\n renderer={renderer}\n label={\n <button\n onClick={refreshValueSnapshot}\n style={{\n appearance: 'none',\n border: '0',\n background: 'transparent',\n }}\n >\n <Label>{label}</Label> 🔄{' '}\n </button>\n }\n value={valueSnapshot}\n defaultExpanded={{}}\n />\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype HandleEntryFn = (entry: Entry) => JSX.Element\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n}\n\ntype Property = {\n defaultExpanded?: boolean | Record<string, boolean>\n label: string\n value: unknown\n}\n\nfunction isIterable(x: any): x is Iterable<unknown> {\n return Symbol.iterator in x\n}\n\nexport default function Explorer({\n value,\n defaultExpanded,\n renderer = DefaultRenderer,\n pageSize = 100,\n ...rest\n}: ExplorerProps) {\n const [expanded, setExpanded] = React.useState(Boolean(defaultExpanded))\n const toggleExpanded = React.useCallback(() => setExpanded((old) => !old), [])\n\n let type: string = typeof value\n let subEntries: Property[] = []\n\n const makeProperty = (sub: { label: string; value: unknown }): Property => {\n const subDefaultExpanded =\n defaultExpanded === true\n ? { [sub.label]: true }\n : defaultExpanded?.[sub.label]\n return {\n ...sub,\n defaultExpanded: subDefaultExpanded,\n }\n }\n\n if (Array.isArray(value)) {\n type = 'array'\n subEntries = value.map((d, i) =>\n makeProperty({\n label: i.toString(),\n value: d,\n }),\n )\n } else if (\n value !== null &&\n typeof value === 'object' &&\n isIterable(value) &&\n typeof value[Symbol.iterator] === 'function'\n ) {\n type = 'Iterable'\n subEntries = Array.from(value, (val, i) =>\n makeProperty({\n label: i.toString(),\n value: val,\n }),\n )\n } else if (typeof value === 'object' && value !== null) {\n type = 'object'\n subEntries = Object.entries(value).map(([key, val]) =>\n makeProperty({\n label: key,\n value: val,\n }),\n )\n }\n\n const subEntryPages = chunkArray(subEntries, pageSize)\n\n return renderer({\n handleEntry: (entry) => (\n <Explorer\n key={entry.label}\n value={value}\n renderer={renderer}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["Entry","styled","fontFamily","fontSize","lineHeight","outline","wordBreak","Label","color","LabelButton","cursor","ExpandButton","font","background","border","padding","Value","_props","theme","danger","SubEntries","marginLeft","paddingLeft","borderLeft","Info","Expander","expanded","style","React","display","transition","transform","chunkArray","array","size","i","result","length","push","slice","DefaultRenderer","handleEntry","label","value","subEntries","subEntryPages","type","toggleExpanded","pageSize","renderer","expandedPages","setExpandedPages","useState","valueSnapshot","setValueSnapshot","undefined","refreshValueSnapshot","String","toLowerCase","map","entry","index","entries","old","includes","filter","d","appearance","displayValue","isIterable","x","Symbol","iterator","Explorer","defaultExpanded","rest","setExpanded","Boolean","useCallback","makeProperty","sub","subDefaultExpanded","Array","isArray","toString","from","val","Object","key","_extends"],"mappings":"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"}
1
+ {"version":3,"file":"Explorer.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { displayValue, styled } from './utils'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '.7rem',\n lineHeight: '1.7',\n outline: 'none',\n wordBreak: 'break-word',\n})\n\nexport const Label = styled('span', {\n color: 'white',\n})\n\nexport const LabelButton = styled('button', {\n cursor: 'pointer',\n color: 'white',\n})\n\nexport const ExpandButton = styled('button', {\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n})\n\nexport const Value = styled('span', (_props, theme) => ({\n color: theme.danger,\n}))\n\nexport const SubEntries = styled('div', {\n marginLeft: '.1em',\n paddingLeft: '1em',\n borderLeft: '2px solid rgba(0,0,0,.15)',\n})\n\nexport const Info = styled('span', {\n color: 'grey',\n fontSize: '.7em',\n})\n\ntype ExpanderProps = {\n expanded: boolean\n style?: React.CSSProperties\n}\n\nexport const Expander = ({ expanded, style = {} }: ExpanderProps) => (\n <span\n style={{\n display: 'inline-block',\n transition: 'all .1s ease',\n transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,\n ...style,\n }}\n >\n ▶\n </span>\n)\n\ntype Entry = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: HandleEntryFn\n label?: React.ReactNode\n value: unknown\n subEntries: Entry[]\n subEntryPages: Entry[][]\n type: string\n expanded: boolean\n toggleExpanded: () => void\n pageSize: number\n renderer?: Renderer\n}\n\n/**\n * Chunk elements in the array by size\n *\n * when the array cannot be chunked evenly by size, the last chunk will be\n * filled with the remaining elements\n *\n * @example\n * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]\n */\nexport function chunkArray<T>(array: T[], size: number): T[][] {\n if (size < 1) return []\n let i = 0\n const result: T[][] = []\n while (i < array.length) {\n result.push(array.slice(i, i + size))\n i = i + size\n }\n return result\n}\n\ntype Renderer = (props: RendererProps) => JSX.Element\n\nexport const DefaultRenderer: Renderer = ({\n handleEntry,\n label,\n value,\n subEntries = [],\n subEntryPages = [],\n type,\n expanded = false,\n toggleExpanded,\n pageSize,\n renderer,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n const [valueSnapshot, setValueSnapshot] = React.useState(undefined)\n\n const refreshValueSnapshot = () => {\n setValueSnapshot((value as () => any)())\n }\n\n return (\n <Entry>\n {subEntryPages.length ? (\n <>\n <ExpandButton onClick={() => toggleExpanded()}>\n <Expander expanded={expanded} /> {label}{' '}\n <Info>\n {String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : ''}\n {subEntries.length} {subEntries.length > 1 ? `items` : `item`}\n </Info>\n </ExpandButton>\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>\n {subEntries.map((entry, index) => handleEntry(entry))}\n </SubEntries>\n ) : (\n <SubEntries>\n {subEntryPages.map((entries, index) => (\n <div key={index}>\n <Entry>\n <LabelButton\n onClick={() =>\n setExpandedPages((old) =>\n old.includes(index)\n ? old.filter((d) => d !== index)\n : [...old, index],\n )\n }\n >\n <Expander expanded={expanded} /> [{index * pageSize} ...{' '}\n {index * pageSize + pageSize - 1}]\n </LabelButton>\n {expandedPages.includes(index) ? (\n <SubEntries>\n {entries.map((entry) => handleEntry(entry))}\n </SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : type === 'function' ? (\n <>\n <Explorer\n renderer={renderer}\n label={\n <button\n onClick={refreshValueSnapshot}\n style={{\n appearance: 'none',\n border: '0',\n background: 'transparent',\n }}\n >\n <Label>{label}</Label> 🔄{' '}\n </button>\n }\n value={valueSnapshot}\n defaultExpanded={{}}\n />\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype HandleEntryFn = (entry: Entry) => JSX.Element\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n}\n\ntype Property = {\n defaultExpanded?: boolean | Record<string, boolean>\n label: string\n value: unknown\n}\n\nfunction isIterable(x: any): x is Iterable<unknown> {\n return Symbol.iterator in x\n}\n\nexport default function Explorer({\n value,\n defaultExpanded,\n renderer = DefaultRenderer,\n pageSize = 100,\n ...rest\n}: ExplorerProps) {\n const [expanded, setExpanded] = React.useState(Boolean(defaultExpanded))\n const toggleExpanded = React.useCallback(() => setExpanded((old) => !old), [])\n\n let type: string = typeof value\n let subEntries: Property[] = []\n\n const makeProperty = (sub: { label: string; value: unknown }): Property => {\n const subDefaultExpanded =\n defaultExpanded === true\n ? { [sub.label]: true }\n : defaultExpanded?.[sub.label]\n return {\n ...sub,\n defaultExpanded: subDefaultExpanded,\n }\n }\n\n if (Array.isArray(value)) {\n type = 'array'\n subEntries = value.map((d, i) =>\n makeProperty({\n label: i.toString(),\n value: d,\n }),\n )\n } else if (\n value !== null &&\n typeof value === 'object' &&\n isIterable(value) &&\n typeof value[Symbol.iterator] === 'function'\n ) {\n type = 'Iterable'\n subEntries = Array.from(value, (val, i) =>\n makeProperty({\n label: i.toString(),\n value: val,\n }),\n )\n } else if (typeof value === 'object' && value !== null) {\n type = 'object'\n subEntries = Object.entries(value).map(([key, val]) =>\n makeProperty({\n label: key,\n value: val,\n }),\n )\n }\n\n const subEntryPages = chunkArray(subEntries, pageSize)\n\n return renderer({\n handleEntry: (entry) => (\n <Explorer\n key={entry.label}\n value={value}\n renderer={renderer}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["Entry","styled","fontFamily","fontSize","lineHeight","outline","wordBreak","Label","color","LabelButton","cursor","ExpandButton","font","background","border","padding","Value","_props","theme","danger","SubEntries","marginLeft","paddingLeft","borderLeft","Info","Expander","expanded","style","React","display","transition","transform","chunkArray","array","size","i","result","length","push","slice","DefaultRenderer","handleEntry","label","value","subEntries","subEntryPages","type","toggleExpanded","pageSize","renderer","expandedPages","setExpandedPages","useState","valueSnapshot","setValueSnapshot","undefined","refreshValueSnapshot","String","toLowerCase","map","entry","index","entries","old","includes","filter","d","appearance","displayValue","isIterable","x","Symbol","iterator","Explorer","defaultExpanded","rest","setExpanded","Boolean","useCallback","makeProperty","sub","subDefaultExpanded","Array","isArray","toString","from","val","Object","key","_extends"],"mappings":"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"}
@@ -56,16 +56,15 @@ function Logo(props) {
56
56
  }
57
57
  }, "ROUTER"));
58
58
  }
59
- function TanStackRouterDevtools(_ref) {
60
- let {
61
- initialIsOpen,
62
- panelProps = {},
63
- closeButtonProps = {},
64
- toggleButtonProps = {},
65
- position = 'bottom-left',
66
- containerElement: Container = 'footer',
67
- router
68
- } = _ref;
59
+ function TanStackRouterDevtools({
60
+ initialIsOpen,
61
+ panelProps = {},
62
+ closeButtonProps = {},
63
+ toggleButtonProps = {},
64
+ position = 'bottom-left',
65
+ containerElement: Container = 'footer',
66
+ router
67
+ }) {
69
68
  const rootRef = React__default["default"].useRef(null);
70
69
  const panelRef = React__default["default"].useRef(null);
71
70
  const [isOpen, setIsOpen] = useLocalStorage["default"]('tanstackRouterDevtoolsOpen', initialIsOpen);
@@ -78,12 +77,12 @@ function TanStackRouterDevtools(_ref) {
78
77
 
79
78
  setIsResizing(true);
80
79
  const dragInfo = {
81
- originalHeight: (panelElement == null ? void 0 : panelElement.getBoundingClientRect().height) ?? 0,
80
+ originalHeight: panelElement?.getBoundingClientRect().height ?? 0,
82
81
  pageY: startEvent.pageY
83
82
  };
84
83
  const run = moveEvent => {
85
84
  const delta = dragInfo.pageY - moveEvent.pageY;
86
- const newHeight = (dragInfo == null ? void 0 : dragInfo.originalHeight) + delta;
85
+ const newHeight = dragInfo?.originalHeight + delta;
87
86
  setDevtoolsHeight(newHeight);
88
87
  if (newHeight < 70) {
89
88
  setIsOpen(false);
@@ -129,12 +128,10 @@ function TanStackRouterDevtools(_ref) {
129
128
  }, [isResolvedOpen]);
130
129
  React__default["default"][isServer ? 'useEffect' : 'useLayoutEffect'](() => {
131
130
  if (isResolvedOpen) {
132
- var _rootRef$current, _rootRef$current$pare;
133
- const previousValue = (_rootRef$current = rootRef.current) == null ? void 0 : (_rootRef$current$pare = _rootRef$current.parentElement) == null ? void 0 : _rootRef$current$pare.style.paddingBottom;
131
+ const previousValue = rootRef.current?.parentElement?.style.paddingBottom;
134
132
  const run = () => {
135
- var _panelRef$current, _rootRef$current2;
136
- const containerHeight = (_panelRef$current = panelRef.current) == null ? void 0 : _panelRef$current.getBoundingClientRect().height;
137
- if ((_rootRef$current2 = rootRef.current) != null && _rootRef$current2.parentElement) {
133
+ const containerHeight = panelRef.current?.getBoundingClientRect().height;
134
+ if (rootRef.current?.parentElement) {
138
135
  rootRef.current.parentElement.style.paddingBottom = `${containerHeight}px`;
139
136
  }
140
137
  };
@@ -142,9 +139,8 @@ function TanStackRouterDevtools(_ref) {
142
139
  if (typeof window !== 'undefined') {
143
140
  window.addEventListener('resize', run);
144
141
  return () => {
145
- var _rootRef$current3;
146
142
  window.removeEventListener('resize', run);
147
- if ((_rootRef$current3 = rootRef.current) != null && _rootRef$current3.parentElement && typeof previousValue === 'string') {
143
+ if (rootRef.current?.parentElement && typeof previousValue === 'string') {
148
144
  rootRef.current.parentElement.style.paddingBottom = previousValue;
149
145
  }
150
146
  };
@@ -274,7 +270,6 @@ function TanStackRouterDevtools(_ref) {
274
270
  })) : null);
275
271
  }
276
272
  const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwardRef(function TanStackRouterDevtoolsPanel(props, ref) {
277
- var _Object$values, _Object$values$find, _router$store$current, _router$store$pending, _router$store$pending2, _last, _last2, _last3, _last4, _last5, _last6;
278
273
  const {
279
274
  isOpen = true,
280
275
  setIsOpen,
@@ -283,7 +278,7 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
283
278
  ...panelProps
284
279
  } = props;
285
280
  const routerContextValue = React__default["default"].useContext(reactRouter.routerContext);
286
- const router = userRouter ?? (routerContextValue == null ? void 0 : routerContextValue.router);
281
+ const router = userRouter ?? routerContextValue?.router;
287
282
  reactRouter.invariant(router, 'No router was found for the TanStack Router Devtools. Please place the devtools in the <RouterProvider> component tree or pass the router instance to the devtools manually.');
288
283
  reactRouter.useRouterStore();
289
284
  const [activeRouteId, setActiveRouteId] = useLocalStorage["default"]('tanstackRouterDevtoolsActiveRouteId', '');
@@ -291,11 +286,11 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
291
286
  React__default["default"].useEffect(() => {
292
287
  setActiveMatchId('');
293
288
  }, [activeRouteId]);
294
- const activeMatch = ((_Object$values = Object.values(router.store.matchCache)) == null ? void 0 : (_Object$values$find = _Object$values.find(d => d.match.matchId === activeMatchId)) == null ? void 0 : _Object$values$find.match) ?? ((_router$store$current = router.store.currentMatches) == null ? void 0 : _router$store$current.find(d => d.routeId === activeRouteId));
295
- const matchCacheValues = utils.multiSortBy(Object.keys(router.store.matchCache).filter(key => {
296
- const cacheEntry = router.store.matchCache[key];
289
+ const activeMatch = Object.values(router.store.state.matchCache)?.find(d => d.match.id === activeMatchId)?.match ?? router.store.state.currentMatches?.find(d => d.route.id === activeRouteId);
290
+ const matchCacheValues = utils.multiSortBy(Object.keys(router.store.state.matchCache).filter(key => {
291
+ const cacheEntry = router.store.state.matchCache[key];
297
292
  return cacheEntry.gc > Date.now();
298
- }).map(key => router.store.matchCache[key]), [d => d.match.store.isFetching ? -1 : 1, d => -d.match.store.updatedAt]);
293
+ }).map(key => router.store.state.matchCache[key]), [d => d.match.store.state.isFetching ? -1 : 1, d => -d.match.store.state.updatedAt]);
299
294
  return /*#__PURE__*/React__default["default"].createElement(theme.ThemeProvider, {
300
295
  theme: theme.defaultTheme
301
296
  }, /*#__PURE__*/React__default["default"].createElement(styledComponents.Panel, _rollupPluginBabelHelpers["extends"]({
@@ -420,12 +415,12 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
420
415
  top: 0,
421
416
  zIndex: 1
422
417
  }
423
- }, "Active Matches"), router.store.currentMatches.map((match, i) => {
418
+ }, "Active Matches"), router.store.state.currentMatches.map((match, i) => {
424
419
  return /*#__PURE__*/React__default["default"].createElement("div", {
425
- key: match.routeId || i,
420
+ key: match.route.id || i,
426
421
  role: "button",
427
- "aria-label": `Open match details for ${match.routeId}`,
428
- onClick: () => setActiveRouteId(activeRouteId === match.routeId ? '' : match.routeId),
422
+ "aria-label": `Open match details for ${match.route.id}`,
423
+ onClick: () => setActiveRouteId(activeRouteId === match.route.id ? '' : match.route.id),
429
424
  style: {
430
425
  display: 'flex',
431
426
  borderBottom: `solid 1px ${theme.defaultTheme.grayAlt}`,
@@ -450,8 +445,8 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
450
445
  style: {
451
446
  padding: '.5em'
452
447
  }
453
- }, `${match.matchId}`));
454
- }), (_router$store$pending = router.store.pendingMatches) != null && _router$store$pending.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
448
+ }, `${match.id}`));
449
+ }), router.store.state.pendingMatches?.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
455
450
  style: {
456
451
  marginTop: '2rem',
457
452
  padding: '.5em',
@@ -460,12 +455,12 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
460
455
  top: 0,
461
456
  zIndex: 1
462
457
  }
463
- }, "Pending Matches"), (_router$store$pending2 = router.store.pendingMatches) == null ? void 0 : _router$store$pending2.map((match, i) => {
458
+ }, "Pending Matches"), router.store.state.pendingMatches?.map((match, i) => {
464
459
  return /*#__PURE__*/React__default["default"].createElement("div", {
465
- key: match.routeId || i,
460
+ key: match.route.id || i,
466
461
  role: "button",
467
- "aria-label": `Open match details for ${match.routeId}`,
468
- onClick: () => setActiveRouteId(activeRouteId === match.routeId ? '' : match.routeId),
462
+ "aria-label": `Open match details for ${match.route.id}`,
463
+ onClick: () => setActiveRouteId(activeRouteId === match.route.id ? '' : match.route.id),
469
464
  style: {
470
465
  display: 'flex',
471
466
  borderBottom: `solid 1px ${theme.defaultTheme.grayAlt}`,
@@ -489,7 +484,7 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
489
484
  style: {
490
485
  padding: '.5em'
491
486
  }
492
- }, `${match.matchId}`));
487
+ }, `${match.id}`));
493
488
  })) : null, matchCacheValues.length ? /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("div", {
494
489
  style: {
495
490
  marginTop: '2rem',
@@ -505,7 +500,7 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
505
500
  }
506
501
  }, /*#__PURE__*/React__default["default"].createElement("div", null, "Match Cache"), /*#__PURE__*/React__default["default"].createElement(styledComponents.Button, {
507
502
  onClick: () => {
508
- router.setStore(s => s.matchCache = {});
503
+ router.store.setState(s => s.matchCache = {});
509
504
  }
510
505
  }, "Clear")), matchCacheValues.map((d, i) => {
511
506
  const {
@@ -513,10 +508,10 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
513
508
  gc
514
509
  } = d;
515
510
  return /*#__PURE__*/React__default["default"].createElement("div", {
516
- key: match.matchId || i,
511
+ key: match.id || i,
517
512
  role: "button",
518
- "aria-label": `Open match details for ${match.matchId}`,
519
- onClick: () => setActiveMatchId(activeMatchId === match.matchId ? '' : match.matchId),
513
+ "aria-label": `Open match details for ${match.id}`,
514
+ onClick: () => setActiveMatchId(activeMatchId === match.id ? '' : match.id),
520
515
  style: {
521
516
  display: 'flex',
522
517
  borderBottom: `solid 1px ${theme.defaultTheme.grayAlt}`,
@@ -548,7 +543,7 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
548
543
  borderRadius: '.25rem',
549
544
  transition: 'all .2s ease-out'
550
545
  }
551
- }), /*#__PURE__*/React__default["default"].createElement(styledComponents.Code, null, `${match.matchId}`)), /*#__PURE__*/React__default["default"].createElement("span", {
546
+ }), /*#__PURE__*/React__default["default"].createElement(styledComponents.Code, null, `${match.id}`)), /*#__PURE__*/React__default["default"].createElement("span", {
552
547
  style: {
553
548
  fontSize: '.7rem',
554
549
  opacity: '.5',
@@ -574,19 +569,19 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
574
569
  style: {
575
570
  lineHeight: '1.8em'
576
571
  }
577
- }, JSON.stringify(activeMatch.matchId, null, 2)))), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
572
+ }, JSON.stringify(activeMatch.id, null, 2)))), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
578
573
  style: {
579
574
  opacity: '.5'
580
575
  }
581
- }, "Status"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.store.status)), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
576
+ }, "Status"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.store.state.status)), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
582
577
  style: {
583
578
  opacity: '.5'
584
579
  }
585
- }, "Invalid"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.store.isInvalid.toString())), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
580
+ }, "Invalid"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.getIsInvalid().toString())), /*#__PURE__*/React__default["default"].createElement("tr", null, /*#__PURE__*/React__default["default"].createElement("td", {
586
581
  style: {
587
582
  opacity: '.5'
588
583
  }
589
- }, "Last Updated"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.store.updatedAt ? new Date(activeMatch.store.updatedAt).toLocaleTimeString() : 'N/A'))))), /*#__PURE__*/React__default["default"].createElement("div", {
584
+ }, "Last Updated"), /*#__PURE__*/React__default["default"].createElement("td", null, activeMatch.store.state.updatedAt ? new Date(activeMatch.store.state.updatedAt).toLocaleTimeString() : 'N/A'))))), /*#__PURE__*/React__default["default"].createElement("div", {
590
585
  style: {
591
586
  background: theme.defaultTheme.backgroundAlt,
592
587
  padding: '.5em',
@@ -654,9 +649,9 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
654
649
  style: {
655
650
  padding: '.5em'
656
651
  }
657
- }, Object.keys(((_last = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last.store.loaderData) || {}).length ? /*#__PURE__*/React__default["default"].createElement(Explorer["default"], {
658
- value: ((_last2 = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last2.store.loaderData) || {},
659
- defaultExpanded: Object.keys(((_last3 = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last3.store.loaderData) || {}).reduce((obj, next) => {
652
+ }, Object.keys(reactRouter.last(router.store.state.currentMatches)?.store.state.loaderData || {}).length ? /*#__PURE__*/React__default["default"].createElement(Explorer["default"], {
653
+ value: reactRouter.last(router.store.state.currentMatches)?.store.state.loaderData || {},
654
+ defaultExpanded: Object.keys(reactRouter.last(router.store.state.currentMatches)?.store.state.loaderData || {}).reduce((obj, next) => {
660
655
  obj[next] = {};
661
656
  return obj;
662
657
  }, {})
@@ -677,9 +672,9 @@ const TanStackRouterDevtoolsPanel = /*#__PURE__*/React__default["default"].forwa
677
672
  style: {
678
673
  padding: '.5em'
679
674
  }
680
- }, Object.keys(((_last4 = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last4.store.search) || {}).length ? /*#__PURE__*/React__default["default"].createElement(Explorer["default"], {
681
- value: ((_last5 = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last5.store.search) || {},
682
- defaultExpanded: Object.keys(((_last6 = reactRouter.last(router.store.currentMatches)) == null ? void 0 : _last6.store.search) || {}).reduce((obj, next) => {
675
+ }, Object.keys(reactRouter.last(router.store.state.currentMatches)?.store.state.search || {}).length ? /*#__PURE__*/React__default["default"].createElement(Explorer["default"], {
676
+ value: reactRouter.last(router.store.state.currentMatches)?.store.state.search || {},
677
+ defaultExpanded: Object.keys(reactRouter.last(router.store.state.currentMatches)?.store.state.search || {}).reduce((obj, next) => {
683
678
  obj[next] = {};
684
679
  return obj;
685
680
  }, {})