@tanstack/router-devtools 1.112.18 → 1.114.0
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/index.cjs +12 -4
- package/dist/cjs/index.cjs.map +1 -1
- package/dist/cjs/index.d.cts +2 -2
- package/dist/esm/index.d.ts +2 -2
- package/dist/esm/index.js +6 -4
- package/dist/esm/index.js.map +1 -1
- package/package.json +3 -2
- package/src/index.tsx +6 -2
- package/dist/cjs/AgeTicker.cjs +0 -58
- package/dist/cjs/AgeTicker.cjs.map +0 -1
- package/dist/cjs/AgeTicker.d.cts +0 -5
- package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs +0 -421
- package/dist/cjs/BaseTanStackRouterDevtoolsPanel.cjs.map +0 -1
- package/dist/cjs/BaseTanStackRouterDevtoolsPanel.d.cts +0 -3
- package/dist/cjs/Explorer.cjs +0 -310
- package/dist/cjs/Explorer.cjs.map +0 -1
- package/dist/cjs/Explorer.d.cts +0 -46
- package/dist/cjs/TanStackRouterDevtools.cjs +0 -177
- package/dist/cjs/TanStackRouterDevtools.cjs.map +0 -1
- package/dist/cjs/TanStackRouterDevtools.d.cts +0 -41
- package/dist/cjs/TanStackRouterDevtoolsPanel.cjs +0 -21
- package/dist/cjs/TanStackRouterDevtoolsPanel.cjs.map +0 -1
- package/dist/cjs/TanStackRouterDevtoolsPanel.d.cts +0 -33
- package/dist/cjs/context.cjs +0 -18
- package/dist/cjs/context.cjs.map +0 -1
- package/dist/cjs/context.d.cts +0 -8
- package/dist/cjs/logo.cjs +0 -1012
- package/dist/cjs/logo.cjs.map +0 -1
- package/dist/cjs/logo.d.cts +0 -1
- package/dist/cjs/theme.d.cts +0 -34
- package/dist/cjs/tokens.cjs +0 -201
- package/dist/cjs/tokens.cjs.map +0 -1
- package/dist/cjs/tokens.d.cts +0 -298
- package/dist/cjs/useLocalStorage.cjs +0 -45
- package/dist/cjs/useLocalStorage.cjs.map +0 -1
- package/dist/cjs/useLocalStorage.d.cts +0 -1
- package/dist/cjs/useMediaQuery.d.cts +0 -1
- package/dist/cjs/useStyles.cjs +0 -570
- package/dist/cjs/useStyles.cjs.map +0 -1
- package/dist/cjs/useStyles.d.cts +0 -52
- package/dist/cjs/utils.cjs +0 -84
- package/dist/cjs/utils.cjs.map +0 -1
- package/dist/cjs/utils.d.cts +0 -23
- package/dist/esm/AgeTicker.d.ts +0 -5
- package/dist/esm/AgeTicker.js +0 -58
- package/dist/esm/AgeTicker.js.map +0 -1
- package/dist/esm/BaseTanStackRouterDevtoolsPanel.d.ts +0 -3
- package/dist/esm/BaseTanStackRouterDevtoolsPanel.js +0 -421
- package/dist/esm/BaseTanStackRouterDevtoolsPanel.js.map +0 -1
- package/dist/esm/Explorer.d.ts +0 -46
- package/dist/esm/Explorer.js +0 -292
- package/dist/esm/Explorer.js.map +0 -1
- package/dist/esm/TanStackRouterDevtools.d.ts +0 -41
- package/dist/esm/TanStackRouterDevtools.js +0 -177
- package/dist/esm/TanStackRouterDevtools.js.map +0 -1
- package/dist/esm/TanStackRouterDevtoolsPanel.d.ts +0 -33
- package/dist/esm/TanStackRouterDevtoolsPanel.js +0 -21
- package/dist/esm/TanStackRouterDevtoolsPanel.js.map +0 -1
- package/dist/esm/context.d.ts +0 -8
- package/dist/esm/context.js +0 -18
- package/dist/esm/context.js.map +0 -1
- package/dist/esm/logo.d.ts +0 -1
- package/dist/esm/logo.js +0 -1012
- package/dist/esm/logo.js.map +0 -1
- package/dist/esm/theme.d.ts +0 -34
- package/dist/esm/tokens.d.ts +0 -298
- package/dist/esm/tokens.js +0 -201
- package/dist/esm/tokens.js.map +0 -1
- package/dist/esm/useLocalStorage.d.ts +0 -1
- package/dist/esm/useLocalStorage.js +0 -46
- package/dist/esm/useLocalStorage.js.map +0 -1
- package/dist/esm/useMediaQuery.d.ts +0 -1
- package/dist/esm/useStyles.d.ts +0 -52
- package/dist/esm/useStyles.js +0 -553
- package/dist/esm/useStyles.js.map +0 -1
- package/dist/esm/utils.d.ts +0 -23
- package/dist/esm/utils.js +0 -84
- package/dist/esm/utils.js.map +0 -1
- package/src/AgeTicker.tsx +0 -73
- package/src/BaseTanStackRouterDevtoolsPanel.tsx +0 -488
- package/src/Explorer.tsx +0 -362
- package/src/TanStackRouterDevtools.tsx +0 -250
- package/src/TanStackRouterDevtoolsPanel.tsx +0 -54
- package/src/context.ts +0 -22
- package/src/logo.tsx +0 -817
- package/src/theme.tsx +0 -31
- package/src/tokens.ts +0 -305
- package/src/useLocalStorage.ts +0 -52
- package/src/useMediaQuery.ts +0 -41
- package/src/useStyles.tsx +0 -589
- package/src/utils.ts +0 -188
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TanStackRouterDevtools.js","sources":["../../src/TanStackRouterDevtools.tsx"],"sourcesContent":["import { clsx as cx } from 'clsx'\nimport React from 'react'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport { useIsMounted, useSafeState } from './utils'\nimport { BaseTanStackRouterDevtoolsPanel } from './BaseTanStackRouterDevtoolsPanel'\nimport useLocalStorage from './useLocalStorage'\nimport { TanStackLogo } from './logo'\nimport { useStyles } from './useStyles'\nimport type { AnyRouter } from '@tanstack/react-router'\n\ninterface DevtoolsOptions {\n /**\n * Set this true if you want the dev tools to default to being open\n */\n initialIsOpen?: boolean\n /**\n * Use this to add props to the panel. For example, you can add className, style (merge and override default style), etc.\n */\n panelProps?: React.DetailedHTMLProps<\n React.HTMLAttributes<HTMLDivElement>,\n HTMLDivElement\n >\n /**\n * Use this to add props to the close button. For example, you can add className, style (merge and override default style), onClick (extend default handler), etc.\n */\n closeButtonProps?: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >\n /**\n * Use this to add props to the toggle button. For example, you can add className, style (merge and override default style), onClick (extend default handler), etc.\n */\n toggleButtonProps?: React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >\n /**\n * The position of the TanStack Router logo to open and close the devtools panel.\n * Defaults to 'bottom-left'.\n */\n position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\n /**\n * Use this to render the devtools inside a different type of container element for a11y purposes.\n * Any string which corresponds to a valid intrinsic JSX element is allowed.\n * Defaults to 'footer'.\n */\n containerElement?: string | any\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router?: AnyRouter\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nexport function TanStackRouterDevtools(\n props: DevtoolsOptions,\n): React.ReactElement | null {\n const { shadowDOMTarget } = props\n\n return (\n <ShadowDomTargetContext.Provider value={shadowDOMTarget}>\n <FloatingTanStackRouterDevtools {...props} />\n </ShadowDomTargetContext.Provider>\n )\n}\n\nfunction FloatingTanStackRouterDevtools({\n initialIsOpen,\n panelProps = {},\n closeButtonProps = {},\n toggleButtonProps = {},\n position = 'bottom-left',\n containerElement: Container = 'footer',\n router,\n shadowDOMTarget,\n}: DevtoolsOptions): React.ReactElement | null {\n const [rootEl, setRootEl] = React.useState<HTMLDivElement>()\n const panelRef = React.useRef<HTMLDivElement>(null)\n const [isOpen, setIsOpen] = useLocalStorage(\n 'tanstackRouterDevtoolsOpen',\n initialIsOpen,\n )\n const [devtoolsHeight, setDevtoolsHeight] = useLocalStorage<number | null>(\n 'tanstackRouterDevtoolsHeight',\n null,\n )\n const [isResolvedOpen, setIsResolvedOpen] = useSafeState(false)\n const [isResizing, setIsResizing] = useSafeState(false)\n const isMounted = useIsMounted()\n const styles = useStyles()\n\n const handleDragStart = (\n panelElement: HTMLDivElement | null,\n startEvent: React.MouseEvent<HTMLDivElement, MouseEvent>,\n ) => {\n if (startEvent.button !== 0) return // Only allow left click for drag\n\n setIsResizing(true)\n\n const dragInfo = {\n originalHeight: panelElement?.getBoundingClientRect().height ?? 0,\n pageY: startEvent.pageY,\n }\n\n const run = (moveEvent: MouseEvent) => {\n const delta = dragInfo.pageY - moveEvent.pageY\n const newHeight = dragInfo.originalHeight + delta\n\n setDevtoolsHeight(newHeight)\n\n if (newHeight < 70) {\n setIsOpen(false)\n } else {\n setIsOpen(true)\n }\n }\n\n const unsub = () => {\n setIsResizing(false)\n document.removeEventListener('mousemove', run)\n document.removeEventListener('mouseUp', unsub)\n }\n\n document.addEventListener('mousemove', run)\n document.addEventListener('mouseup', unsub)\n }\n\n const isButtonClosed = isOpen ?? false\n\n React.useEffect(() => {\n setIsResolvedOpen(isOpen ?? false)\n }, [isOpen, isResolvedOpen, setIsResolvedOpen])\n\n React.useEffect(() => {\n if (isResolvedOpen) {\n const previousValue = rootEl?.parentElement?.style.paddingBottom\n\n const run = () => {\n const containerHeight = panelRef.current?.getBoundingClientRect().height\n if (rootEl?.parentElement) {\n rootEl.parentElement.style.paddingBottom = `${containerHeight}px`\n }\n }\n\n run()\n\n if (typeof window !== 'undefined') {\n window.addEventListener('resize', run)\n\n return () => {\n window.removeEventListener('resize', run)\n if (rootEl?.parentElement && typeof previousValue === 'string') {\n rootEl.parentElement.style.paddingBottom = previousValue\n }\n }\n }\n }\n return\n }, [isResolvedOpen, rootEl?.parentElement])\n\n React.useEffect(() => {\n if (rootEl) {\n const el = rootEl\n const fontSize = getComputedStyle(el).fontSize\n el.style.setProperty('--tsrd-font-size', fontSize)\n }\n }, [rootEl])\n\n const { style: panelStyle = {}, ...otherPanelProps } = panelProps\n\n const {\n style: closeButtonStyle = {},\n onClick: onCloseClick,\n ...otherCloseButtonProps\n } = closeButtonProps\n\n const {\n onClick: onToggleClick,\n className: toggleButtonClassName,\n ...otherToggleButtonProps\n } = toggleButtonProps\n\n // Do not render on the server\n if (!isMounted) return null\n\n const resolvedHeight = devtoolsHeight ?? 500\n\n return (\n <Container ref={setRootEl} className=\"TanStackRouterDevtools\">\n <DevtoolsOnCloseContext.Provider\n value={{\n onCloseClick: onCloseClick ?? (() => {}),\n }}\n >\n <BaseTanStackRouterDevtoolsPanel\n ref={panelRef as any}\n {...otherPanelProps}\n router={router}\n className={cx(\n styles.devtoolsPanelContainer,\n styles.devtoolsPanelContainerVisibility(!!isOpen),\n styles.devtoolsPanelContainerResizing(isResizing),\n styles.devtoolsPanelContainerAnimation(\n isResolvedOpen,\n resolvedHeight + 16,\n ),\n )}\n style={{\n height: resolvedHeight,\n ...panelStyle,\n }}\n isOpen={isResolvedOpen}\n setIsOpen={setIsOpen}\n handleDragStart={(e) => handleDragStart(panelRef.current, e)}\n shadowDOMTarget={shadowDOMTarget}\n />\n </DevtoolsOnCloseContext.Provider>\n\n <button\n type=\"button\"\n {...otherToggleButtonProps}\n aria-label=\"Open TanStack Router Devtools\"\n onClick={(e) => {\n setIsOpen(true)\n onToggleClick && onToggleClick(e)\n }}\n className={cx(\n styles.mainCloseBtn,\n styles.mainCloseBtnPosition(position),\n styles.mainCloseBtnAnimation(!isButtonClosed),\n toggleButtonClassName,\n )}\n >\n <div className={styles.mainCloseBtnIconContainer}>\n <div className={styles.mainCloseBtnIconOuter}>\n <TanStackLogo />\n </div>\n <div className={styles.mainCloseBtnIconInner}>\n <TanStackLogo />\n </div>\n </div>\n <div className={styles.mainCloseBtnDivider}>-</div>\n <div className={styles.routerLogoCloseButton}>TanStack Router</div>\n </button>\n </Container>\n )\n}\n"],"names":["React","_a","cx"],"mappings":"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"}
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
import { AnyRouter } from '@tanstack/react-router';
|
|
3
|
-
export interface DevtoolsPanelOptions {
|
|
4
|
-
/**
|
|
5
|
-
* The standard React style object used to style a component with inline styles
|
|
6
|
-
*/
|
|
7
|
-
style?: React.CSSProperties;
|
|
8
|
-
/**
|
|
9
|
-
* The standard React className property used to style a component with classes
|
|
10
|
-
*/
|
|
11
|
-
className?: string;
|
|
12
|
-
/**
|
|
13
|
-
* A boolean variable indicating whether the panel is open or closed
|
|
14
|
-
*/
|
|
15
|
-
isOpen?: boolean;
|
|
16
|
-
/**
|
|
17
|
-
* A function that toggles the open and close state of the panel
|
|
18
|
-
*/
|
|
19
|
-
setIsOpen: (isOpen: boolean) => void;
|
|
20
|
-
/**
|
|
21
|
-
* Handles the opening and closing the devtools panel
|
|
22
|
-
*/
|
|
23
|
-
handleDragStart?: (e: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;
|
|
24
|
-
/**
|
|
25
|
-
* A boolean variable indicating if the "lite" version of the library is being used
|
|
26
|
-
*/
|
|
27
|
-
router?: AnyRouter;
|
|
28
|
-
/**
|
|
29
|
-
* Use this to attach the devtool's styles to specific element in the DOM.
|
|
30
|
-
*/
|
|
31
|
-
shadowDOMTarget?: ShadowRoot;
|
|
32
|
-
}
|
|
33
|
-
export declare const TanStackRouterDevtoolsPanel: React.ForwardRefExoticComponent<DevtoolsPanelOptions & React.RefAttributes<HTMLDivElement>>;
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import React__default from "react";
|
|
3
|
-
import { ShadowDomTargetContext, DevtoolsOnCloseContext } from "./context.js";
|
|
4
|
-
import { BaseTanStackRouterDevtoolsPanel } from "./BaseTanStackRouterDevtoolsPanel.js";
|
|
5
|
-
const TanStackRouterDevtoolsPanel = React__default.forwardRef(function TanStackRouterDevtoolsPanel2(props, ref) {
|
|
6
|
-
const { shadowDOMTarget } = props;
|
|
7
|
-
return /* @__PURE__ */ jsx(ShadowDomTargetContext.Provider, { value: shadowDOMTarget, children: /* @__PURE__ */ jsx(
|
|
8
|
-
DevtoolsOnCloseContext.Provider,
|
|
9
|
-
{
|
|
10
|
-
value: {
|
|
11
|
-
onCloseClick: () => {
|
|
12
|
-
}
|
|
13
|
-
},
|
|
14
|
-
children: /* @__PURE__ */ jsx(BaseTanStackRouterDevtoolsPanel, { ref, ...props })
|
|
15
|
-
}
|
|
16
|
-
) });
|
|
17
|
-
});
|
|
18
|
-
export {
|
|
19
|
-
TanStackRouterDevtoolsPanel
|
|
20
|
-
};
|
|
21
|
-
//# sourceMappingURL=TanStackRouterDevtoolsPanel.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"TanStackRouterDevtoolsPanel.js","sources":["../../src/TanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import React from 'react'\nimport { DevtoolsOnCloseContext, ShadowDomTargetContext } from './context'\nimport { BaseTanStackRouterDevtoolsPanel } from './BaseTanStackRouterDevtoolsPanel'\nimport type { AnyRouter } from '@tanstack/react-router'\n\nexport interface DevtoolsPanelOptions {\n /**\n * The standard React style object used to style a component with inline styles\n */\n style?: React.CSSProperties\n /**\n * The standard React className 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: React.MouseEvent<HTMLDivElement, MouseEvent>) => void\n /**\n * A boolean variable indicating if the \"lite\" version of the library is being used\n */\n router?: AnyRouter\n /**\n * Use this to attach the devtool's styles to specific element in the DOM.\n */\n shadowDOMTarget?: ShadowRoot\n}\n\nexport const TanStackRouterDevtoolsPanel = React.forwardRef<\n HTMLDivElement,\n DevtoolsPanelOptions\n>(function TanStackRouterDevtoolsPanel(props, ref) {\n const { shadowDOMTarget } = props\n\n return (\n <ShadowDomTargetContext.Provider value={shadowDOMTarget}>\n <DevtoolsOnCloseContext.Provider\n value={{\n onCloseClick: () => {},\n }}\n >\n <BaseTanStackRouterDevtoolsPanel ref={ref} {...props} />\n </DevtoolsOnCloseContext.Provider>\n </ShadowDomTargetContext.Provider>\n )\n})\n"],"names":["React","TanStackRouterDevtoolsPanel"],"mappings":";;;;AAoCO,MAAM,8BAA8BA,eAAM,WAG/C,SAASC,6BAA4B,OAAO,KAAK;AAC3C,QAAA,EAAE,oBAAoB;AAE5B,SACG,oBAAA,uBAAuB,UAAvB,EAAgC,OAAO,iBACtC,UAAA;AAAA,IAAC,uBAAuB;AAAA,IAAvB;AAAA,MACC,OAAO;AAAA,QACL,cAAc,MAAM;AAAA,QAAA;AAAA,MACtB;AAAA,MAEA,UAAC,oBAAA,iCAAA,EAAgC,KAAW,GAAG,MAAO,CAAA;AAAA,IAAA;AAAA,EAAA,GAE1D;AAEJ,CAAC;"}
|
package/dist/esm/context.d.ts
DELETED
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
|
-
export declare const ShadowDomTargetContext: React.Context<ShadowRoot | undefined>;
|
|
3
|
-
export declare const DevtoolsOnCloseContext: React.Context<{
|
|
4
|
-
onCloseClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
5
|
-
} | undefined>;
|
|
6
|
-
export declare const useDevtoolsOnClose: () => {
|
|
7
|
-
onCloseClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
8
|
-
};
|
package/dist/esm/context.js
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
import React__default from "react";
|
|
2
|
-
const ShadowDomTargetContext = React__default.createContext(void 0);
|
|
3
|
-
const DevtoolsOnCloseContext = React__default.createContext(void 0);
|
|
4
|
-
const useDevtoolsOnClose = () => {
|
|
5
|
-
const context = React__default.useContext(DevtoolsOnCloseContext);
|
|
6
|
-
if (!context) {
|
|
7
|
-
throw new Error(
|
|
8
|
-
"useDevtoolsOnClose must be used within a TanStackRouterDevtools component"
|
|
9
|
-
);
|
|
10
|
-
}
|
|
11
|
-
return context;
|
|
12
|
-
};
|
|
13
|
-
export {
|
|
14
|
-
DevtoolsOnCloseContext,
|
|
15
|
-
ShadowDomTargetContext,
|
|
16
|
-
useDevtoolsOnClose
|
|
17
|
-
};
|
|
18
|
-
//# sourceMappingURL=context.js.map
|
package/dist/esm/context.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"context.js","sources":["../../src/context.ts"],"sourcesContent":["import React from 'react'\n\nexport const ShadowDomTargetContext = React.createContext<\n ShadowRoot | undefined\n>(undefined)\n\nexport const DevtoolsOnCloseContext = React.createContext<\n | {\n onCloseClick: (e: React.MouseEvent<HTMLButtonElement>) => void\n }\n | undefined\n>(undefined)\n\nexport const useDevtoolsOnClose = () => {\n const context = React.useContext(DevtoolsOnCloseContext)\n if (!context) {\n throw new Error(\n 'useDevtoolsOnClose must be used within a TanStackRouterDevtools component',\n )\n }\n return context\n}\n"],"names":["React"],"mappings":";AAEa,MAAA,yBAAyBA,eAAM,cAE1C,MAAS;AAEE,MAAA,yBAAyBA,eAAM,cAK1C,MAAS;AAEJ,MAAM,qBAAqB,MAAM;AAChC,QAAA,UAAUA,eAAM,WAAW,sBAAsB;AACvD,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAEK,SAAA;AACT;"}
|
package/dist/esm/logo.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function TanStackLogo(): import("react/jsx-runtime").JSX.Element;
|