@tanstack/solid-router-devtools - npm Package Compare versions

Comparing version 1.167.0 to 1.167.1-pre.0

dist/cjs/index.cjs.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.cjs","names":["Devtools","DevtoolsPanel","TanStackRouterDevtools","process","env","NODE_ENV","TanStackRouterDevtoolsInProd","TanStackRouterDevtoolsPanel","TanStackRouterDevtoolsPanelInProd"],"sources":["../../src/index.tsx"],"sourcesContent":["import * as Devtools from './TanStackRouterDevtools'\nimport * as DevtoolsPanel from './TanStackRouterDevtoolsPanel'\n\nexport const TanStackRouterDevtools: (typeof Devtools)['TanStackRouterDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsInProd: (typeof Devtools)['TanStackRouterDevtools'] =\n  Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsPanel: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : DevtoolsPanel.TanStackRouterDevtoolsPanel\n\nexport const TanStackRouterDevtoolsPanelInProd: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  DevtoolsPanel.TanStackRouterDevtoolsPanel\n"],"mappings":";;;;AAGA,IAAaE,yBAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;AACV,QAAO;;AAIf,IAAaI,+BAAAA,+BAAAA;AAGb,IAAaC,8BAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;AACV,QAAO;;AAIf,IAAaC,oCAAAA,oCAAAA"}
+{"version":3,"file":"index.cjs","names":["Devtools","DevtoolsPanel","TanStackRouterDevtools","process","env","NODE_ENV","TanStackRouterDevtoolsInProd","TanStackRouterDevtoolsPanel","TanStackRouterDevtoolsPanelInProd"],"sources":["../../src/index.tsx"],"sourcesContent":["import * as Devtools from './TanStackRouterDevtools'\nimport * as DevtoolsPanel from './TanStackRouterDevtoolsPanel'\n\nexport const TanStackRouterDevtools: (typeof Devtools)['TanStackRouterDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsInProd: (typeof Devtools)['TanStackRouterDevtools'] =\n  Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsPanel: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : DevtoolsPanel.TanStackRouterDevtoolsPanel\n\nexport const TanStackRouterDevtoolsPanelInProd: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  DevtoolsPanel.TanStackRouterDevtoolsPanel\n"],"mappings":";;;;AAGA,IAAaE,yBAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;CACV,OAAO;AACT,IAAA,+BAAA;AAGN,IAAaI,+BAAAA,+BAAAA;AAGb,IAAaC,8BAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;CACV,OAAO;AACT,IAAA,oCAAA;AAGN,IAAaC,oCAAAA,oCAAAA"}

dist/cjs/TanStackRouterDevtools.cjs.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"TanStackRouterDevtools.cjs","names":["useRouter","useRouterState","TanStackRouterDevtoolsCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsOptions","initialIsOpen","panelProps","HTMLAttributes","HTMLDivElement","closeButtonProps","ButtonHTMLAttributes","HTMLButtonElement","toggleButtonProps","position","containerElement","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtools","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtools.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsOptions {\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?: JSX.HTMLAttributes<HTMLDivElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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   * The router instance to use for the devtools.\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 TanStackRouterDevtools: Component<\n  TanStackRouterDevtoolsOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(new TanStackRouterDevtoolsCore(usedProps))\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      initialIsOpen: usedProps.initialIsOpen,\n      panelProps: usedProps.panelProps,\n      closeButtonProps: usedProps.closeButtonProps,\n      toggleButtonProps: usedProps.toggleButtonProps,\n      position: usedProps.position,\n      containerElement: usedProps.containerElement,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AA4CA,IAAawB,0BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,WAAAA,GAAAA,uBAAAA,YAAqB;CAChD,MAAMO,qBAAAA,GAAAA,uBAAAA,gBAAmC,EAAEP,QAAQM,cAAc,CAAC;CAElE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;EACd;CAED,IAAIG;CACJ,MAAM,CAACC,aAAAA,GAAAA,SAAAA,cAAyB,IAAI9B,+BAAAA,2BAA2B2B,UAAU,CAAC;AAG1E1B,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB6B,YAAU,CAACC,UAAUJ,UAAUR,OAAO;GACtC;AAEFlB,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB6B,YAAU,CAACE,eAAeL,UAAUC,YAAY;GAChD;AAEF3B,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB6B,YAAU,CAACG,WAAW;GACpBxB,eAAekB,UAAUlB;GACzBC,YAAYiB,UAAUjB;GACtBG,kBAAkBc,UAAUd;GAC5BG,mBAAmBW,UAAUX;GAC7BC,UAAUU,UAAUV;GACpBC,kBAAkBS,UAAUT;GAC5BE,iBAAiBO,UAAUP;GAC5B,CAAC;GACF;AAEFhB,EAAAA,GAAAA,SAAAA,eAAc;AACZ,MAAIyB,YAAY;AACdC,aAAU,CAACI,MAAML,WAAW;AAE5B1B,IAAAA,GAAAA,SAAAA,iBAAgB;AACd2B,cAAU,CAACK,SAAS;KACpB;;GAEJ;AAEF,eAAA;EAAA,IAAAC,OAAAC,QAAA;EAAA,IAAAC,QAEcT;AAAU,SAAAS,UAAA,cAAA,GAAA,aAAA,KAAAA,OAAAF,KAAA,GAAVP,aAAUO;AAAA,SAAAA;KAAA"}
+{"version":3,"file":"TanStackRouterDevtools.cjs","names":["useRouter","useRouterState","TanStackRouterDevtoolsCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsOptions","initialIsOpen","panelProps","HTMLAttributes","HTMLDivElement","closeButtonProps","ButtonHTMLAttributes","HTMLButtonElement","toggleButtonProps","position","containerElement","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtools","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtools.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsOptions {\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?: JSX.HTMLAttributes<HTMLDivElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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   * The router instance to use for the devtools.\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 TanStackRouterDevtools: Component<\n  TanStackRouterDevtoolsOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(new TanStackRouterDevtoolsCore(usedProps))\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      initialIsOpen: usedProps.initialIsOpen,\n      panelProps: usedProps.panelProps,\n      closeButtonProps: usedProps.closeButtonProps,\n      toggleButtonProps: usedProps.toggleButtonProps,\n      position: usedProps.position,\n      containerElement: usedProps.containerElement,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AA4CA,IAAawB,0BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,WAAAA,GAAAA,uBAAAA,WAAoB;CAC/C,MAAMO,qBAAAA,GAAAA,uBAAAA,gBAAmC,EAAEP,QAAQM,aAAa,CAAC;CAEjE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;CACf;CAEA,IAAIG;CACJ,MAAM,CAACC,aAAAA,GAAAA,SAAAA,cAAyB,IAAI9B,+BAAAA,2BAA2B2B,SAAS,CAAC;CAGzE1B,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB6B,SAAS,EAAEC,UAAUJ,UAAUR,MAAM;CACvC,CAAC;CAEDlB,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB6B,SAAS,EAAEE,eAAeL,UAAUC,WAAW;CACjD,CAAC;CAED3B,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB6B,SAAS,EAAEG,WAAW;GACpBxB,eAAekB,UAAUlB;GACzBC,YAAYiB,UAAUjB;GACtBG,kBAAkBc,UAAUd;GAC5BG,mBAAmBW,UAAUX;GAC7BC,UAAUU,UAAUV;GACpBC,kBAAkBS,UAAUT;GAC5BE,iBAAiBO,UAAUP;EAC7B,CAAC;CACH,CAAC;CAEDhB,CAAAA,GAAAA,SAAAA,eAAc;EACZ,IAAIyB,YAAY;GACdC,SAAS,EAAEI,MAAML,UAAU;GAE3B1B,CAAAA,GAAAA,SAAAA,iBAAgB;IACd2B,SAAS,EAAEK,QAAQ;GACrB,CAAC;EACH;CACF,CAAC;CAED,cAAA;EAAA,IAAAC,OAAAC,OAAA;EAAA,IAAAC,QAEcT;EAAU,OAAAS,UAAA,cAAA,GAAA,aAAA,KAAAA,OAAAF,IAAA,IAAVP,aAAUO;EAAA,OAAAA;CAAA,GAAA;AAG1B"}

dist/cjs/TanStackRouterDevtoolsPanel.cjs.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"TanStackRouterDevtoolsPanel.cjs","names":["useRouter","useRouterState","TanStackRouterDevtoolsPanelCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsPanelOptions","style","CSSProperties","className","isOpen","setIsOpen","handleDragStart","e","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtoolsPanel","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","HTMLDivElement","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsPanelCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsPanelOptions {\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   * Use this to attach the devtool's styles to specific element in the DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n}\n\nexport const TanStackRouterDevtoolsPanel: Component<\n  TanStackRouterDevtoolsPanelOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(\n    new TanStackRouterDevtoolsPanelCore(usedProps),\n  )\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      className: usedProps.className,\n      style: usedProps.style,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AAqCA,IAAaqB,+BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,WAAAA,GAAAA,uBAAAA,YAAqB;CAChD,MAAMO,qBAAAA,GAAAA,uBAAAA,gBAAmC,EAAEP,QAAQM,cAAc,CAAC;CAElE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;EACd;CAED,IAAIG;CACJ,MAAM,CAACE,aAAAA,GAAAA,SAAAA,cACL,IAAI5B,+BAAAA,gCAAgCwB,UACtC,CAAC;AAGDvB,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB2B,YAAU,CAACC,UAAUL,UAAUR,OAAO;GACtC;AAEFf,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB2B,YAAU,CAACE,eAAeN,UAAUC,YAAY;GAChD;AAEFxB,EAAAA,GAAAA,SAAAA,oBAAmB;AACjB2B,YAAU,CAACG,WAAW;GACpBpB,WAAWa,UAAUb;GACrBF,OAAOe,UAAUf;GACjBQ,iBAAiBO,UAAUP;GAC5B,CAAC;GACF;AAEFb,EAAAA,GAAAA,SAAAA,eAAc;AACZ,MAAIsB,YAAY;AACdE,aAAU,CAACI,MAAMN,WAAW;AAE5BvB,IAAAA,GAAAA,SAAAA,iBAAgB;AACdyB,cAAU,CAACK,SAAS;KACpB;;GAEJ;AAEF,eAAA;EAAA,IAAAC,OAAAC,QAAA;EAAA,IAAAC,QAEcV;AAAU,SAAAU,UAAA,cAAA,GAAA,aAAA,KAAAA,OAAAF,KAAA,GAAVR,aAAUQ;AAAA,SAAAA;KAAA"}
+{"version":3,"file":"TanStackRouterDevtoolsPanel.cjs","names":["useRouter","useRouterState","TanStackRouterDevtoolsPanelCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsPanelOptions","style","CSSProperties","className","isOpen","setIsOpen","handleDragStart","e","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtoolsPanel","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","HTMLDivElement","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsPanelCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsPanelOptions {\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   * Use this to attach the devtool's styles to specific element in the DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n}\n\nexport const TanStackRouterDevtoolsPanel: Component<\n  TanStackRouterDevtoolsPanelOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(\n    new TanStackRouterDevtoolsPanelCore(usedProps),\n  )\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      className: usedProps.className,\n      style: usedProps.style,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AAqCA,IAAaqB,+BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,WAAAA,GAAAA,uBAAAA,WAAoB;CAC/C,MAAMO,qBAAAA,GAAAA,uBAAAA,gBAAmC,EAAEP,QAAQM,aAAa,CAAC;CAEjE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;CACf;CAEA,IAAIG;CACJ,MAAM,CAACE,aAAAA,GAAAA,SAAAA,cACL,IAAI5B,+BAAAA,gCAAgCwB,SAAS,CAC/C;CAGAvB,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB2B,SAAS,EAAEC,UAAUL,UAAUR,MAAM;CACvC,CAAC;CAEDf,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB2B,SAAS,EAAEE,eAAeN,UAAUC,WAAW;CACjD,CAAC;CAEDxB,CAAAA,GAAAA,SAAAA,oBAAmB;EACjB2B,SAAS,EAAEG,WAAW;GACpBpB,WAAWa,UAAUb;GACrBF,OAAOe,UAAUf;GACjBQ,iBAAiBO,UAAUP;EAC7B,CAAC;CACH,CAAC;CAEDb,CAAAA,GAAAA,SAAAA,eAAc;EACZ,IAAIsB,YAAY;GACdE,SAAS,EAAEI,MAAMN,UAAU;GAE3BvB,CAAAA,GAAAA,SAAAA,iBAAgB;IACdyB,SAAS,EAAEK,QAAQ;GACrB,CAAC;EACH;CACF,CAAC;CAED,cAAA;EAAA,IAAAC,OAAAC,OAAA;EAAA,IAAAC,QAEcV;EAAU,OAAAU,UAAA,cAAA,GAAA,aAAA,KAAAA,OAAAF,IAAA,IAAVR,aAAUQ;EAAA,OAAAA;CAAA,GAAA;AAG1B"}

dist/esm/index.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.js","names":["Devtools","DevtoolsPanel","TanStackRouterDevtools","process","env","NODE_ENV","TanStackRouterDevtoolsInProd","TanStackRouterDevtoolsPanel","TanStackRouterDevtoolsPanelInProd"],"sources":["../../src/index.tsx"],"sourcesContent":["import * as Devtools from './TanStackRouterDevtools'\nimport * as DevtoolsPanel from './TanStackRouterDevtoolsPanel'\n\nexport const TanStackRouterDevtools: (typeof Devtools)['TanStackRouterDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsInProd: (typeof Devtools)['TanStackRouterDevtools'] =\n  Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsPanel: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : DevtoolsPanel.TanStackRouterDevtoolsPanel\n\nexport const TanStackRouterDevtoolsPanelInProd: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  DevtoolsPanel.TanStackRouterDevtoolsPanel\n"],"mappings":";;;AAGA,IAAaE,yBAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;AACV,QAAO;IAETF;AAEN,IAAaM,+BACXN;AAEF,IAAaO,8BAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;AACV,QAAO;IAETN;AAEN,IAAaO,oCACXP"}
+{"version":3,"file":"index.js","names":["Devtools","DevtoolsPanel","TanStackRouterDevtools","process","env","NODE_ENV","TanStackRouterDevtoolsInProd","TanStackRouterDevtoolsPanel","TanStackRouterDevtoolsPanelInProd"],"sources":["../../src/index.tsx"],"sourcesContent":["import * as Devtools from './TanStackRouterDevtools'\nimport * as DevtoolsPanel from './TanStackRouterDevtoolsPanel'\n\nexport const TanStackRouterDevtools: (typeof Devtools)['TanStackRouterDevtools'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsInProd: (typeof Devtools)['TanStackRouterDevtools'] =\n  Devtools.TanStackRouterDevtools\n\nexport const TanStackRouterDevtoolsPanel: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  process.env.NODE_ENV !== 'development'\n    ? function () {\n        return null\n      }\n    : DevtoolsPanel.TanStackRouterDevtoolsPanel\n\nexport const TanStackRouterDevtoolsPanelInProd: (typeof DevtoolsPanel)['TanStackRouterDevtoolsPanel'] =\n  DevtoolsPanel.TanStackRouterDevtoolsPanel\n"],"mappings":";;;AAGA,IAAaE,yBAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;CACV,OAAO;AACT,IACAF;AAEN,IAAaM,+BACXN;AAEF,IAAaO,8BAAAA,QAAAA,IAAAA,aACc,gBACrB,WAAY;CACV,OAAO;AACT,IACAN;AAEN,IAAaO,oCACXP"}

dist/esm/TanStackRouterDevtools.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"TanStackRouterDevtools.js","names":["useRouter","useRouterState","TanStackRouterDevtoolsCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsOptions","initialIsOpen","panelProps","HTMLAttributes","HTMLDivElement","closeButtonProps","ButtonHTMLAttributes","HTMLButtonElement","toggleButtonProps","position","containerElement","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtools","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtools.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsOptions {\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?: JSX.HTMLAttributes<HTMLDivElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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   * The router instance to use for the devtools.\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 TanStackRouterDevtools: Component<\n  TanStackRouterDevtoolsOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(new TanStackRouterDevtoolsCore(usedProps))\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      initialIsOpen: usedProps.initialIsOpen,\n      panelProps: usedProps.panelProps,\n      closeButtonProps: usedProps.closeButtonProps,\n      toggleButtonProps: usedProps.toggleButtonProps,\n      position: usedProps.position,\n      containerElement: usedProps.containerElement,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AA4CA,IAAawB,0BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,UAAUrB,WAAW;CAChD,MAAM4B,oBAAoB3B,eAAe,EAAEoB,QAAQM,cAAc,CAAC;CAElE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;EACd;CAED,IAAIG;CACJ,MAAM,CAACC,YAAY5B,aAAa,IAAIF,2BAA2B2B,UAAU,CAAC;AAG1E1B,oBAAmB;AACjB6B,YAAU,CAACC,UAAUJ,UAAUR,OAAO;GACtC;AAEFlB,oBAAmB;AACjB6B,YAAU,CAACE,eAAeL,UAAUC,YAAY;GAChD;AAEF3B,oBAAmB;AACjB6B,YAAU,CAACG,WAAW;GACpBxB,eAAekB,UAAUlB;GACzBC,YAAYiB,UAAUjB;GACtBG,kBAAkBc,UAAUd;GAC5BG,mBAAmBW,UAAUX;GAC7BC,UAAUU,UAAUV;GACpBC,kBAAkBS,UAAUT;GAC5BE,iBAAiBO,UAAUP;GAC5B,CAAC;GACF;AAEFhB,eAAc;AACZ,MAAIyB,YAAY;AACdC,aAAU,CAACI,MAAML,WAAW;AAE5B1B,mBAAgB;AACd2B,cAAU,CAACK,SAAS;KACpB;;GAEJ;AAEF,eAAA;EAAA,IAAAC,OAAAC,QAAA;EAAA,IAAAC,QAEcT;AAAU,SAAAS,UAAA,aAAAC,IAAAD,OAAAF,KAAA,GAAVP,aAAUO;AAAA,SAAAA;KAAA"}
+{"version":3,"file":"TanStackRouterDevtools.js","names":["useRouter","useRouterState","TanStackRouterDevtoolsCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsOptions","initialIsOpen","panelProps","HTMLAttributes","HTMLDivElement","closeButtonProps","ButtonHTMLAttributes","HTMLButtonElement","toggleButtonProps","position","containerElement","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtools","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtools.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsOptions {\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?: JSX.HTMLAttributes<HTMLDivElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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?: JSX.ButtonHTMLAttributes<HTMLButtonElement>\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   * The router instance to use for the devtools.\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 TanStackRouterDevtools: Component<\n  TanStackRouterDevtoolsOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(new TanStackRouterDevtoolsCore(usedProps))\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      initialIsOpen: usedProps.initialIsOpen,\n      panelProps: usedProps.panelProps,\n      closeButtonProps: usedProps.closeButtonProps,\n      toggleButtonProps: usedProps.toggleButtonProps,\n      position: usedProps.position,\n      containerElement: usedProps.containerElement,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AA4CA,IAAawB,0BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,UAAUrB,UAAU;CAC/C,MAAM4B,oBAAoB3B,eAAe,EAAEoB,QAAQM,aAAa,CAAC;CAEjE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;CACf;CAEA,IAAIG;CACJ,MAAM,CAACC,YAAY5B,aAAa,IAAIF,2BAA2B2B,SAAS,CAAC;CAGzE1B,mBAAmB;EACjB6B,SAAS,EAAEC,UAAUJ,UAAUR,MAAM;CACvC,CAAC;CAEDlB,mBAAmB;EACjB6B,SAAS,EAAEE,eAAeL,UAAUC,WAAW;CACjD,CAAC;CAED3B,mBAAmB;EACjB6B,SAAS,EAAEG,WAAW;GACpBxB,eAAekB,UAAUlB;GACzBC,YAAYiB,UAAUjB;GACtBG,kBAAkBc,UAAUd;GAC5BG,mBAAmBW,UAAUX;GAC7BC,UAAUU,UAAUV;GACpBC,kBAAkBS,UAAUT;GAC5BE,iBAAiBO,UAAUP;EAC7B,CAAC;CACH,CAAC;CAEDhB,cAAc;EACZ,IAAIyB,YAAY;GACdC,SAAS,EAAEI,MAAML,UAAU;GAE3B1B,gBAAgB;IACd2B,SAAS,EAAEK,QAAQ;GACrB,CAAC;EACH;CACF,CAAC;CAED,cAAA;EAAA,IAAAC,OAAAC,OAAA;EAAA,IAAAC,QAEcT;EAAU,OAAAS,UAAA,aAAAC,IAAAD,OAAAF,IAAA,IAAVP,aAAUO;EAAA,OAAAA;CAAA,GAAA;AAG1B"}

dist/esm/TanStackRouterDevtoolsPanel.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"TanStackRouterDevtoolsPanel.js","names":["useRouter","useRouterState","TanStackRouterDevtoolsPanelCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsPanelOptions","style","CSSProperties","className","isOpen","setIsOpen","handleDragStart","e","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtoolsPanel","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","HTMLDivElement","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsPanelCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsPanelOptions {\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   * Use this to attach the devtool's styles to specific element in the DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n}\n\nexport const TanStackRouterDevtoolsPanel: Component<\n  TanStackRouterDevtoolsPanelOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(\n    new TanStackRouterDevtoolsPanelCore(usedProps),\n  )\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      className: usedProps.className,\n      style: usedProps.style,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AAqCA,IAAaqB,+BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,UAAUlB,WAAW;CAChD,MAAMyB,oBAAoBxB,eAAe,EAAEiB,QAAQM,cAAc,CAAC;CAElE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;EACd;CAED,IAAIG;CACJ,MAAM,CAACE,YAAY1B,aACjB,IAAIF,gCAAgCwB,UACtC,CAAC;AAGDvB,oBAAmB;AACjB2B,YAAU,CAACC,UAAUL,UAAUR,OAAO;GACtC;AAEFf,oBAAmB;AACjB2B,YAAU,CAACE,eAAeN,UAAUC,YAAY;GAChD;AAEFxB,oBAAmB;AACjB2B,YAAU,CAACG,WAAW;GACpBpB,WAAWa,UAAUb;GACrBF,OAAOe,UAAUf;GACjBQ,iBAAiBO,UAAUP;GAC5B,CAAC;GACF;AAEFb,eAAc;AACZ,MAAIsB,YAAY;AACdE,aAAU,CAACI,MAAMN,WAAW;AAE5BvB,mBAAgB;AACdyB,cAAU,CAACK,SAAS;KACpB;;GAEJ;AAEF,eAAA;EAAA,IAAAC,OAAAC,QAAA;EAAA,IAAAC,QAEcV;AAAU,SAAAU,UAAA,aAAAC,IAAAD,OAAAF,KAAA,GAAVR,aAAUQ;AAAA,SAAAA;KAAA"}
+{"version":3,"file":"TanStackRouterDevtoolsPanel.js","names":["useRouter","useRouterState","TanStackRouterDevtoolsPanelCore","createEffect","createSignal","onCleanup","onMount","AnyRouter","Component","JSX","TanStackRouterDevtoolsPanelOptions","style","CSSProperties","className","isOpen","setIsOpen","handleDragStart","e","router","shadowDOMTarget","ShadowRoot","TanStackRouterDevtoolsPanel","props","Element","activeRouter","activeRouterState","usedProps","routerState","devToolRef","HTMLDivElement","devtools","setRouter","setRouterState","setOptions","mount","unmount","_el$","_tmpl$","_ref$","_$use"],"sources":["../../src/TanStackRouterDevtoolsPanel.tsx"],"sourcesContent":["import { useRouter, useRouterState } from '@tanstack/solid-router'\nimport { TanStackRouterDevtoolsPanelCore } from '@tanstack/router-devtools-core'\nimport { createEffect, createSignal, onCleanup, onMount } from 'solid-js'\nimport type { AnyRouter } from '@tanstack/solid-router'\nimport type { Component, JSX } from 'solid-js'\n\nexport interface TanStackRouterDevtoolsPanelOptions {\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   * Use this to attach the devtool's styles to specific element in the DOM.\n   */\n  shadowDOMTarget?: ShadowRoot\n}\n\nexport const TanStackRouterDevtoolsPanel: Component<\n  TanStackRouterDevtoolsPanelOptions\n> = (props): JSX.Element | null => {\n  const activeRouter = props.router ?? useRouter()\n  const activeRouterState = useRouterState({ router: activeRouter })\n\n  const usedProps = {\n    ...props,\n    router: activeRouter,\n    routerState: activeRouterState,\n  }\n\n  let devToolRef: HTMLDivElement | undefined\n  const [devtools] = createSignal(\n    new TanStackRouterDevtoolsPanelCore(usedProps),\n  )\n\n  // Update devtools when props change\n  createEffect(() => {\n    devtools().setRouter(usedProps.router)\n  })\n\n  createEffect(() => {\n    devtools().setRouterState(usedProps.routerState)\n  })\n\n  createEffect(() => {\n    devtools().setOptions({\n      className: usedProps.className,\n      style: usedProps.style,\n      shadowDOMTarget: usedProps.shadowDOMTarget,\n    })\n  })\n\n  onMount(() => {\n    if (devToolRef) {\n      devtools().mount(devToolRef)\n\n      onCleanup(() => {\n        devtools().unmount()\n      })\n    }\n  })\n\n  return (\n    <>\n      <div ref={devToolRef} />\n    </>\n  )\n}\n"],"mappings":";;;;;;AAqCA,IAAaqB,+BAERC,UAA8B;CACjC,MAAME,eAAeF,MAAMJ,UAAUlB,UAAU;CAC/C,MAAMyB,oBAAoBxB,eAAe,EAAEiB,QAAQM,aAAa,CAAC;CAEjE,MAAME,YAAY;EAChB,GAAGJ;EACHJ,QAAQM;EACRG,aAAaF;CACf;CAEA,IAAIG;CACJ,MAAM,CAACE,YAAY1B,aACjB,IAAIF,gCAAgCwB,SAAS,CAC/C;CAGAvB,mBAAmB;EACjB2B,SAAS,EAAEC,UAAUL,UAAUR,MAAM;CACvC,CAAC;CAEDf,mBAAmB;EACjB2B,SAAS,EAAEE,eAAeN,UAAUC,WAAW;CACjD,CAAC;CAEDxB,mBAAmB;EACjB2B,SAAS,EAAEG,WAAW;GACpBpB,WAAWa,UAAUb;GACrBF,OAAOe,UAAUf;GACjBQ,iBAAiBO,UAAUP;EAC7B,CAAC;CACH,CAAC;CAEDb,cAAc;EACZ,IAAIsB,YAAY;GACdE,SAAS,EAAEI,MAAMN,UAAU;GAE3BvB,gBAAgB;IACdyB,SAAS,EAAEK,QAAQ;GACrB,CAAC;EACH;CACF,CAAC;CAED,cAAA;EAAA,IAAAC,OAAAC,OAAA;EAAA,IAAAC,QAEcV;EAAU,OAAAU,UAAA,aAAAC,IAAAD,OAAAF,IAAA,IAAVR,aAAUQ;EAAA,OAAAA;CAAA,GAAA;AAG1B"}

package.json

 {
   "name": "@tanstack/solid-router-devtools",
-  "version": "1.167.0",
+  "version": "1.167.1-pre.0",
   "description": "Modern and scalable routing for Solid applications",
@@ -56,3 +56,3 @@ "author": "Tanner Linsley",
   "dependencies": {
-    "@tanstack/router-devtools-core": "1.168.0"
+    "@tanstack/router-devtools-core": "1.168.1-pre.0"
   },
@@ -67,4 +67,4 @@ "devDependencies": {
     "solid-js": "^1.9.10",
-    "@tanstack/router-core": "^1.170.0",
-    "@tanstack/solid-router": "^1.170.0"
+    "@tanstack/router-core": "^1.171.16-pre.0",
+    "@tanstack/solid-router": "^1.170.19-pre.0"
   },
@@ -80,3 +80,2 @@ "peerDependenciesMeta": {
     "test:types": "pnpm run \"/^test:types:ts[0-9]{2}$/\"",
-    "test:types:ts55": "node ../../node_modules/typescript55/lib/tsc.js",
     "test:types:ts56": "node ../../node_modules/typescript56/lib/tsc.js",
@@ -86,3 +85,4 @@ "test:types:ts57": "node ../../node_modules/typescript57/lib/tsc.js",
     "test:types:ts59": "node ../../node_modules/typescript59/lib/tsc.js",
-    "test:types:ts60": "tsc",
+    "test:types:ts60": "tsc6",
+    "test:types:ts70": "tsc",
     "test:build": "publint --strict && attw --ignore-rules no-resolution --pack .",
@@ -89,0 +89,0 @@ "build": "vite build && tsc -p tsconfig.build.json"

New alerts

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Fixed alerts

Known malware

Supply chain risk

This package version is identified as malware. It has been flagged either by Socket's AI scanner and confirmed by our threat research team, or is listed as malicious in security databases and other sources.

Improved metrics

Total package byte prevSize

55483

0.33%

Number of critical supply chain risk alerts

0

-100%

Worsened metrics

Number of low quality alerts

2

100%

Dependency changes

• + Added

  @tanstack/router-devtools-core@1.168.1-pre.0
  (transitive)

• - Removed

  @tanstack/router-devtools-core@1.168.0
  (transitive)

• Updated

  @tanstack/router-devtools-core@1.168.1-pre.0