@tanstack/devtools 0.0.0

package/dist/cjs/context/devtools-store.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools-store.cjs","sources":["../../../src/context/devtools-store.ts"],"sourcesContent":["import type { TabName } from '../tabs'\nimport type { DevtoolsPlugin } from './devtools-context'\n\ntype ModifierKey = 'Alt' | 'Control' | 'Meta' | 'Shift'\ntype KeyboardKey = ModifierKey | (string & {})\n\ntype TriggerPosition =\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'middle-left'\n  | 'middle-right'\n\nexport type DevtoolsStore = {\n  settings: {\n    /**\n     * Whether the dev tools should be open by default\n     * @default false\n     */\n    defaultOpen: boolean\n    /**\n     * Whether the dev tools trigger should be hidden until the user hovers over it\n     * @default false\n     */\n    hideUntilHover: boolean\n    /**\n     * The position of the trigger button\n     * @default \"bottom-right\"\n     */\n    position: TriggerPosition\n\n    /**\n     * The location of the panel once it is open\n     * @default \"bottom\"\n     */\n    panelLocation: 'top' | 'bottom'\n    /**\n     * The hotkey to open the dev tools\n     * @default \"shift+a\"\n     */\n    openHotkey: Array<KeyboardKey>\n    /**\n     * Whether to require the URL flag to open the dev tools\n     * @default false\n     */\n    requireUrlFlag: boolean\n    /**\n     * The URL flag to open the dev tools, used in conjunction with requireUrlFlag (if set to true)\n     * @default \"tanstack-devtools\"\n     */\n    urlFlag: string\n  }\n  state: {\n    activeTab: TabName\n    height: number\n    activePlugin?: DevtoolsPlugin | undefined\n    persistOpen: boolean\n  }\n  plugins?: Array<DevtoolsPlugin>\n}\n\nexport const initialState: DevtoolsStore = {\n  settings: {\n    defaultOpen: false,\n    hideUntilHover: false,\n    position: 'bottom-right',\n    panelLocation: 'bottom',\n    openHotkey: ['Shift', 'A'],\n    requireUrlFlag: false,\n    urlFlag: 'tanstack-devtools',\n  },\n  state: {\n    activeTab: 'plugins',\n    height: 400,\n    activePlugin: undefined,\n    persistOpen: false,\n  },\n}\n"],"names":[],"mappings":";;AA8DO,MAAM,eAA8B;AAAA,EACzC,UAAU;AAAA,IACR,aAAa;AAAA,IACb,gBAAgB;AAAA,IAChB,UAAU;AAAA,IACV,eAAe;AAAA,IACf,YAAY,CAAC,SAAS,GAAG;AAAA,IACzB,gBAAgB;AAAA,IAChB,SAAS;AAAA,EACX;AAAA,EACA,OAAO;AAAA,IACL,WAAW;AAAA,IACX,QAAQ;AAAA,IACR,cAAc;AAAA,IACd,aAAa;AAAA,EAAA;AAEjB;;"}

package/dist/cjs/context/devtools-store.d.cts

@@ -0,0 +1,53 @@
+import { TabName } from '../tabs.cjs';
+import { DevtoolsPlugin } from './devtools-context.cjs';
+type ModifierKey = 'Alt' | 'Control' | 'Meta' | 'Shift';
+type KeyboardKey = ModifierKey | (string & {});
+type TriggerPosition = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right' | 'middle-left' | 'middle-right';
+export type DevtoolsStore = {
+    settings: {
+        /**
+         * Whether the dev tools should be open by default
+         * @default false
+         */
+        defaultOpen: boolean;
+        /**
+         * Whether the dev tools trigger should be hidden until the user hovers over it
+         * @default false
+         */
+        hideUntilHover: boolean;
+        /**
+         * The position of the trigger button
+         * @default "bottom-right"
+         */
+        position: TriggerPosition;
+        /**
+         * The location of the panel once it is open
+         * @default "bottom"
+         */
+        panelLocation: 'top' | 'bottom';
+        /**
+         * The hotkey to open the dev tools
+         * @default "shift+a"
+         */
+        openHotkey: Array<KeyboardKey>;
+        /**
+         * Whether to require the URL flag to open the dev tools
+         * @default false
+         */
+        requireUrlFlag: boolean;
+        /**
+         * The URL flag to open the dev tools, used in conjunction with requireUrlFlag (if set to true)
+         * @default "tanstack-devtools"
+         */
+        urlFlag: string;
+    };
+    state: {
+        activeTab: TabName;
+        height: number;
+        activePlugin?: DevtoolsPlugin | undefined;
+        persistOpen: boolean;
+    };
+    plugins?: Array<DevtoolsPlugin>;
+};
+export declare const initialState: DevtoolsStore;
+export {};

package/dist/cjs/context/use-devtools-context.cjs

@@ -0,0 +1,78 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const solidJs = require("solid-js");
+const devtoolsContext = require("./devtools-context.cjs");
+const useDevtoolsContext = () => {
+  const context = solidJs.useContext(devtoolsContext.DevtoolsContext);
+  if (context === void 0) {
+    throw new Error(
+      "useDevtoolsShellContext must be used within a ShellContextProvider"
+    );
+  }
+  return context;
+};
+const usePlugins = () => {
+  const { store, setStore } = useDevtoolsContext();
+  const plugins = solidJs.createMemo(() => store.plugins);
+  const activePlugin = solidJs.createMemo(() => store.state.activePlugin);
+  const setActivePlugin = (plugin) => {
+    setStore((prev) => ({
+      ...prev,
+      state: {
+        ...prev.state,
+        activePlugin: plugin
+      }
+    }));
+  };
+  return { plugins, setActivePlugin, activePlugin };
+};
+const useDevtoolsState = () => {
+  const { store, setStore } = useDevtoolsContext();
+  const state = solidJs.createMemo(() => store.state);
+  const setState = (newState) => {
+    setStore((prev) => ({
+      ...prev,
+      state: {
+        ...prev.state,
+        ...newState
+      }
+    }));
+  };
+  return { state, setState };
+};
+const useDevtoolsSettings = () => {
+  const { store, setStore } = useDevtoolsContext();
+  const settings = solidJs.createMemo(() => store.settings);
+  const setSettings = (newSettings) => {
+    setStore((prev) => ({
+      ...prev,
+      settings: {
+        ...prev.settings,
+        ...newSettings
+      }
+    }));
+  };
+  return { setSettings, settings };
+};
+const usePersistOpen = () => {
+  const { state, setState } = useDevtoolsState();
+  const persistOpen = solidJs.createMemo(() => state().persistOpen);
+  const setPersistOpen = (value) => {
+    setState({ persistOpen: value });
+  };
+  return { persistOpen, setPersistOpen };
+};
+const useHeight = () => {
+  const { state, setState } = useDevtoolsState();
+  const height = solidJs.createMemo(() => state().height);
+  const setHeight = (newHeight) => {
+    setState({ height: newHeight });
+  };
+  return { height, setHeight };
+};
+exports.useDevtoolsSettings = useDevtoolsSettings;
+exports.useDevtoolsState = useDevtoolsState;
+exports.useHeight = useHeight;
+exports.usePersistOpen = usePersistOpen;
+exports.usePlugins = usePlugins;
+//# sourceMappingURL=use-devtools-context.cjs.map

package/dist/cjs/context/use-devtools-context.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-devtools-context.cjs","sources":["../../../src/context/use-devtools-context.ts"],"sourcesContent":["import { createMemo, useContext } from 'solid-js'\nimport { DevtoolsContext } from './devtools-context.jsx'\nimport type { DevtoolsPlugin } from './devtools-context.jsx'\n/* import type { DevtoolsPlugin } from './devtools-context' */\nimport type { DevtoolsStore } from './devtools-store.js'\n\n/**\n * Returns an object containing the current state and setState function of the ShellContext.\n * Throws an error if used outside of a ShellContextProvider.\n */\nconst useDevtoolsContext = () => {\n  const context = useContext(DevtoolsContext)\n  if (context === undefined) {\n    throw new Error(\n      'useDevtoolsShellContext must be used within a ShellContextProvider',\n    )\n  }\n  return context\n}\n\nexport const usePlugins = () => {\n  const { store, setStore } = useDevtoolsContext()\n\n  const plugins = createMemo(() => store.plugins)\n  const activePlugin = createMemo(() => store.state.activePlugin)\n\n  const setActivePlugin = (plugin: DevtoolsPlugin) => {\n    setStore((prev) => ({\n      ...prev,\n      state: {\n        ...prev.state,\n        activePlugin: plugin,\n      },\n    }))\n  }\n\n  return { plugins, setActivePlugin, activePlugin }\n}\n\nexport const useDevtoolsState = () => {\n  const { store, setStore } = useDevtoolsContext()\n  const state = createMemo(() => store.state)\n  const setState = (newState: Partial<DevtoolsStore['state']>) => {\n    setStore((prev) => ({\n      ...prev,\n      state: {\n        ...prev.state,\n        ...newState,\n      },\n    }))\n  }\n  return { state, setState }\n}\n\nexport const useDevtoolsSettings = () => {\n  const { store, setStore } = useDevtoolsContext()\n\n  const settings = createMemo(() => store.settings)\n\n  const setSettings = (newSettings: Partial<DevtoolsStore['settings']>) => {\n    setStore((prev) => ({\n      ...prev,\n      settings: {\n        ...prev.settings,\n        ...newSettings,\n      },\n    }))\n  }\n\n  return { setSettings, settings }\n}\n\nexport const usePersistOpen = () => {\n  const { state, setState } = useDevtoolsState()\n\n  const persistOpen = createMemo(() => state().persistOpen)\n\n  const setPersistOpen = (value: boolean) => {\n    setState({ persistOpen: value })\n  }\n\n  return { persistOpen, setPersistOpen }\n}\n\nexport const useHeight = () => {\n  const { state, setState } = useDevtoolsState()\n\n  const height = createMemo(() => state().height)\n\n  const setHeight = (newHeight: number) => {\n    setState({ height: newHeight })\n  }\n\n  return { height, setHeight }\n}\n"],"names":["useContext","DevtoolsContext","createMemo"],"mappings":";;;;AAUA,MAAM,qBAAqB,MAAM;AACzB,QAAA,UAAUA,mBAAWC,+BAAe;AAC1C,MAAI,YAAY,QAAW;AACzB,UAAM,IAAI;AAAA,MACR;AAAA,IACF;AAAA,EAAA;AAEK,SAAA;AACT;AAEO,MAAM,aAAa,MAAM;AAC9B,QAAM,EAAE,OAAO,SAAS,IAAI,mBAAmB;AAE/C,QAAM,UAAUC,QAAAA,WAAW,MAAM,MAAM,OAAO;AAC9C,QAAM,eAAeA,QAAA,WAAW,MAAM,MAAM,MAAM,YAAY;AAExD,QAAA,kBAAkB,CAAC,WAA2B;AAClD,aAAS,CAAC,UAAU;AAAA,MAClB,GAAG;AAAA,MACH,OAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,cAAc;AAAA,MAAA;AAAA,IAChB,EACA;AAAA,EACJ;AAEO,SAAA,EAAE,SAAS,iBAAiB,aAAa;AAClD;AAEO,MAAM,mBAAmB,MAAM;AACpC,QAAM,EAAE,OAAO,SAAS,IAAI,mBAAmB;AAC/C,QAAM,QAAQA,QAAAA,WAAW,MAAM,MAAM,KAAK;AACpC,QAAA,WAAW,CAAC,aAA8C;AAC9D,aAAS,CAAC,UAAU;AAAA,MAClB,GAAG;AAAA,MACH,OAAO;AAAA,QACL,GAAG,KAAK;AAAA,QACR,GAAG;AAAA,MAAA;AAAA,IACL,EACA;AAAA,EACJ;AACO,SAAA,EAAE,OAAO,SAAS;AAC3B;AAEO,MAAM,sBAAsB,MAAM;AACvC,QAAM,EAAE,OAAO,SAAS,IAAI,mBAAmB;AAE/C,QAAM,WAAWA,QAAAA,WAAW,MAAM,MAAM,QAAQ;AAE1C,QAAA,cAAc,CAAC,gBAAoD;AACvE,aAAS,CAAC,UAAU;AAAA,MAClB,GAAG;AAAA,MACH,UAAU;AAAA,QACR,GAAG,KAAK;AAAA,QACR,GAAG;AAAA,MAAA;AAAA,IACL,EACA;AAAA,EACJ;AAEO,SAAA,EAAE,aAAa,SAAS;AACjC;AAEO,MAAM,iBAAiB,MAAM;AAClC,QAAM,EAAE,OAAO,SAAS,IAAI,iBAAiB;AAE7C,QAAM,cAAcA,QAAA,WAAW,MAAM,MAAA,EAAQ,WAAW;AAElD,QAAA,iBAAiB,CAAC,UAAmB;AAChC,aAAA,EAAE,aAAa,OAAO;AAAA,EACjC;AAEO,SAAA,EAAE,aAAa,eAAe;AACvC;AAEO,MAAM,YAAY,MAAM;AAC7B,QAAM,EAAE,OAAO,SAAS,IAAI,iBAAiB;AAE7C,QAAM,SAASA,QAAA,WAAW,MAAM,MAAA,EAAQ,MAAM;AAExC,QAAA,YAAY,CAAC,cAAsB;AAC9B,aAAA,EAAE,QAAQ,WAAW;AAAA,EAChC;AAEO,SAAA,EAAE,QAAQ,UAAU;AAC7B;;;;;;"}

package/dist/cjs/context/use-devtools-context.d.cts

@@ -0,0 +1,36 @@
+import { DevtoolsPlugin } from './devtools-context.jsx';
+import { DevtoolsStore } from './devtools-store.js';
+export declare const usePlugins: () => {
+    plugins: import('solid-js').Accessor<DevtoolsPlugin[] | undefined>;
+    setActivePlugin: (plugin: DevtoolsPlugin) => void;
+    activePlugin: import('solid-js').Accessor<DevtoolsPlugin | undefined>;
+};
+export declare const useDevtoolsState: () => {
+    state: import('solid-js').Accessor<{
+        activeTab: import('../tabs/index.jsx').TabName;
+        height: number;
+        activePlugin?: DevtoolsPlugin | undefined;
+        persistOpen: boolean;
+    }>;
+    setState: (newState: Partial<DevtoolsStore["state"]>) => void;
+};
+export declare const useDevtoolsSettings: () => {
+    setSettings: (newSettings: Partial<DevtoolsStore["settings"]>) => void;
+    settings: import('solid-js').Accessor<{
+        defaultOpen: boolean;
+        hideUntilHover: boolean;
+        position: "top-left" | "top-right" | "bottom-left" | "bottom-right" | "middle-left" | "middle-right";
+        panelLocation: "top" | "bottom";
+        openHotkey: Array<(string & {}) | ("Alt" | "Control" | "Meta" | "Shift")>;
+        requireUrlFlag: boolean;
+        urlFlag: string;
+    }>;
+};
+export declare const usePersistOpen: () => {
+    persistOpen: import('solid-js').Accessor<boolean>;
+    setPersistOpen: (value: boolean) => void;
+};
+export declare const useHeight: () => {
+    height: import('solid-js').Accessor<number>;
+    setHeight: (newHeight: number) => void;
+};

package/dist/cjs/core.cjs

@@ -0,0 +1,81 @@
+"use strict";
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var _options, _plugins, _isMounted, _dispose, _Component;
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+const devtoolsContext = require("./context/devtools-context.cjs");
+const devtoolsStore = require("./context/devtools-store.cjs");
+const _interopNamespaceDefaultOnly = (e) => Object.freeze(Object.defineProperty({ __proto__: null, default: e }, Symbol.toStringTag, { value: "Module" }));
+class TanStackDevtoolsCore {
+  constructor(config) {
+    __privateAdd(this, _options, {
+      ...devtoolsStore.initialState.settings
+    });
+    __privateAdd(this, _plugins, []);
+    __privateAdd(this, _isMounted, false);
+    __privateAdd(this, _dispose);
+    __privateAdd(this, _Component);
+    __privateSet(this, _plugins, config.plugins || []);
+    __privateSet(this, _options, {
+      ...__privateGet(this, _options),
+      ...config.options
+    });
+  }
+  mount(el) {
+    if (__privateGet(this, _isMounted)) {
+      throw new Error("Devtools is already mounted");
+    }
+    const mountTo = el;
+    const dispose = web.render(() => {
+      const _self$ = this;
+      __privateSet(this, _Component, solidJs.lazy(() => Promise.resolve().then(() => /* @__PURE__ */ _interopNamespaceDefaultOnly(require("./devtools.cjs")))));
+      const Devtools = __privateGet(this, _Component);
+      return web.createComponent(devtoolsContext.DevtoolsProvider, {
+        get plugins() {
+          return __privateGet(_self$, _plugins);
+        },
+        get config() {
+          return __privateGet(_self$, _options);
+        },
+        get children() {
+          return web.createComponent(web.Portal, {
+            mount: mountTo,
+            get children() {
+              return web.createComponent(Devtools, {});
+            }
+          });
+        }
+      });
+    }, mountTo);
+    __privateSet(this, _isMounted, true);
+    __privateSet(this, _dispose, dispose);
+  }
+  unmount() {
+    var _a;
+    if (!__privateGet(this, _isMounted)) {
+      throw new Error("Devtools is not mounted");
+    }
+    (_a = __privateGet(this, _dispose)) == null ? void 0 : _a.call(this);
+    __privateSet(this, _isMounted, false);
+  }
+  setOptions(options) {
+    __privateSet(this, _options, {
+      ...__privateGet(this, _options),
+      ...options
+    });
+  }
+}
+_options = new WeakMap();
+_plugins = new WeakMap();
+_isMounted = new WeakMap();
+_dispose = new WeakMap();
+_Component = new WeakMap();
+exports.TanStackRouterDevtoolsCore = TanStackDevtoolsCore;
+//# sourceMappingURL=core.cjs.map

package/dist/cjs/core.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"core.cjs","sources":["../../src/core.tsx"],"sourcesContent":["import { lazy } from 'solid-js'\nimport { Portal, render } from 'solid-js/web'\nimport { DevtoolsProvider } from './context/devtools-context'\nimport { initialState } from './context/devtools-store'\nimport type {\n  DevtoolsPlugin,\n  DevtoolsSettings,\n} from './context/devtools-context'\n\nexport interface DevtoolsOptions {\n  options?: Partial<DevtoolsSettings>\n  plugins?: Array<DevtoolsPlugin>\n}\n\nclass TanStackDevtoolsCore {\n  #options: DevtoolsSettings = {\n    ...initialState.settings,\n  }\n  #plugins: Array<DevtoolsPlugin> = []\n  #isMounted = false\n  #dispose?: () => void\n  #Component: any\n\n  constructor(config: DevtoolsOptions) {\n    this.#plugins = config.plugins || []\n    this.#options = {\n      ...this.#options,\n      ...config.options,\n    }\n  }\n\n  mount<T extends HTMLElement>(el: T) {\n    if (this.#isMounted) {\n      throw new Error('Devtools is already mounted')\n    }\n    const mountTo = el\n    const dispose = render(() => {\n      this.#Component = lazy(() => import('./devtools'))\n\n      const Devtools = this.#Component\n\n      return (\n        <DevtoolsProvider plugins={this.#plugins} config={this.#options}>\n          <Portal mount={mountTo}>\n            <Devtools />\n          </Portal>\n        </DevtoolsProvider>\n      )\n    }, mountTo)\n\n    this.#isMounted = true\n    this.#dispose = dispose\n  }\n\n  unmount() {\n    if (!this.#isMounted) {\n      throw new Error('Devtools is not mounted')\n    }\n    this.#dispose?.()\n    this.#isMounted = false\n  }\n\n  setOptions(options: Partial<DevtoolsOptions>) {\n    this.#options = {\n      ...this.#options,\n      ...options,\n    }\n  }\n}\n\nexport { TanStackDevtoolsCore as TanStackRouterDevtoolsCore }\n"],"names":["TanStackDevtoolsCore","constructor","config","initialState","settings","plugins","options","mount","el","Error","mountTo","dispose","render","_self$","lazy","Devtools","_$createComponent","DevtoolsProvider","children","Portal","unmount","setOptions"],"mappings":";;;;;;;;;;;;;;;AAcA,MAAMA,qBAAqB;AAAA,EASzBC,YAAYC,QAAyB;AARrC,iCAA6B;AAAA,MAC3B,GAAGC,2BAAaC;AAAAA,IAClB;AACA,iCAAkC,CAAE;AACpC,mCAAa;AACb;AACA;AAGO,uBAAA,UAAWF,OAAOG,WAAW,CAAE;AACpC,uBAAK,UAAW;AAAA,MACd,GAAG,mBAAK;AAAA,MACR,GAAGH,OAAOI;AAAAA,IACZ;AAAA,EAAA;AAAA,EAGFC,MAA6BC,IAAO;AAClC,QAAI,mBAAK,aAAY;AACb,YAAA,IAAIC,MAAM,6BAA6B;AAAA,IAAA;AAE/C,UAAMC,UAAUF;AACVG,UAAAA,UAAUC,IAAAA,OAAO,MAAM;AAAA,YAAAC,SAAA;AAC3B,yBAAK,YAAaC,QAAAA,KAAK,MAAM,QAAA,QAAA,EAAA,KAAA,MAAA,6CAAA,QAAO,gBAAY,CAAA,CAAA,CAAC;AAEjD,YAAMC,WAAW,mBAAK;AAEtB,aAAAC,IAAAA,gBACGC,gBAAAA,kBAAgB;AAAA,QAAA,IAACZ,UAAO;AAAA,iBAAEQ,qBAAK;AAAA,QAAQ;AAAA,QAAA,IAAEX,SAAM;AAAA,iBAAEW,qBAAK;AAAA,QAAQ;AAAA,QAAA,IAAAK,WAAA;AAAA,iBAAAF,IAAAA,gBAC5DG,IAAAA,QAAM;AAAA,YAACZ,OAAOG;AAAAA,YAAO,IAAAQ,WAAA;AAAAF,qBAAAA,IAAAA,gBACnBD,UAAQ,EAAA;AAAA,YAAA;AAAA,UAAA,CAAA;AAAA,QAAA;AAAA,MAAA,CAAA;AAAA,OAIdL,OAAO;AAEV,uBAAK,YAAa;AAClB,uBAAK,UAAWC;AAAAA,EAAAA;AAAAA,EAGlBS,UAAU;;AACJ,QAAA,CAAC,mBAAK,aAAY;AACd,YAAA,IAAIX,MAAM,yBAAyB;AAAA,IAAA;AAE3C,6BAAK,cAAL;AACA,uBAAK,YAAa;AAAA,EAAA;AAAA,EAGpBY,WAAWf,SAAmC;AAC5C,uBAAK,UAAW;AAAA,MACd,GAAG,mBAAK;AAAA,MACR,GAAGA;AAAAA,IACL;AAAA,EAAA;AAEJ;AArDE;AAGA;AACA;AACA;AACA;;"}

package/dist/cjs/core.d.cts

@@ -0,0 +1,13 @@
+import { DevtoolsPlugin, DevtoolsSettings } from './context/devtools-context.cjs';
+export interface DevtoolsOptions {
+    options?: Partial<DevtoolsSettings>;
+    plugins?: Array<DevtoolsPlugin>;
+}
+declare class TanStackDevtoolsCore {
+    #private;
+    constructor(config: DevtoolsOptions);
+    mount<T extends HTMLElement>(el: T): void;
+    unmount(): void;
+    setOptions(options: Partial<DevtoolsOptions>): void;
+}
+export { TanStackDevtoolsCore as TanStackRouterDevtoolsCore };

package/dist/cjs/devtools.cjs

@@ -0,0 +1,146 @@
+"use strict";
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+const keyboard = require("@solid-primitives/keyboard");
+const useDevtoolsContext = require("./context/use-devtools-context.cjs");
+const useDisableTabbing = require("./hooks/use-disable-tabbing.cjs");
+const storage = require("./utils/storage.cjs");
+const trigger = require("./components/trigger.cjs");
+const mainPanel = require("./components/main-panel.cjs");
+const contentPanel = require("./components/content-panel.cjs");
+const tabs = require("./components/tabs.cjs");
+const tabContent = require("./components/tab-content.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<div>`);
+function DevTools() {
+  const {
+    settings
+  } = useDevtoolsContext.useDevtoolsSettings();
+  const {
+    setHeight
+  } = useDevtoolsContext.useHeight();
+  const {
+    persistOpen,
+    setPersistOpen
+  } = useDevtoolsContext.usePersistOpen();
+  const [rootEl, setRootEl] = solidJs.createSignal();
+  const [isOpen, setIsOpen] = solidJs.createSignal(settings().defaultOpen || persistOpen());
+  let panelRef = void 0;
+  const [isResizing, setIsResizing] = solidJs.createSignal(false);
+  const toggleOpen = () => {
+    const open = isOpen();
+    setIsOpen(!open);
+    setPersistOpen(!open);
+  };
+  const handleDragStart = (panelElement, startEvent) => {
+    if (startEvent.button !== 0) return;
+    setIsResizing(true);
+    const dragInfo = {
+      originalHeight: (panelElement == null ? void 0 : panelElement.getBoundingClientRect().height) ?? 0,
+      pageY: startEvent.pageY
+    };
+    const run = (moveEvent) => {
+      const delta = dragInfo.pageY - moveEvent.pageY;
+      const newHeight = dragInfo.originalHeight + delta;
+      setHeight(newHeight);
+      if (newHeight < 70) {
+        setIsOpen(false);
+      } else {
+        setIsOpen(true);
+      }
+    };
+    const unsub = () => {
+      setIsResizing(false);
+      document.removeEventListener("mousemove", run);
+      document.removeEventListener("mouseUp", unsub);
+    };
+    document.addEventListener("mousemove", run);
+    document.addEventListener("mouseup", unsub);
+  };
+  solidJs.createEffect(() => {
+    var _a, _b, _c;
+    if (isOpen()) {
+      const previousValue = (_b = (_a = rootEl()) == null ? void 0 : _a.parentElement) == null ? void 0 : _b.style.paddingBottom;
+      const run = () => {
+        var _a2;
+        const containerHeight = panelRef.getBoundingClientRect().height;
+        if ((_a2 = rootEl()) == null ? void 0 : _a2.parentElement) {
+          setRootEl((prev) => {
+            if (prev == null ? void 0 : prev.parentElement) {
+              prev.parentElement.style.paddingBottom = `${containerHeight}px`;
+            }
+            return prev;
+          });
+        }
+      };
+      run();
+      if (typeof window !== "undefined") {
+        window.addEventListener("resize", run);
+        return () => {
+          var _a2;
+          window.removeEventListener("resize", run);
+          if (((_a2 = rootEl()) == null ? void 0 : _a2.parentElement) && typeof previousValue === "string") {
+            setRootEl((prev) => {
+              prev.parentElement.style.paddingBottom = previousValue;
+              return prev;
+            });
+          }
+        };
+      }
+    } else {
+      if ((_c = rootEl()) == null ? void 0 : _c.parentElement) {
+        setRootEl((prev) => {
+          if (prev == null ? void 0 : prev.parentElement) {
+            prev.parentElement.removeAttribute("style");
+          }
+          return prev;
+        });
+      }
+    }
+    return;
+  });
+  solidJs.createEffect(() => {
+    window.addEventListener("keydown", (e) => {
+      if (e.key === "Escape" && isOpen()) {
+        toggleOpen();
+      }
+    });
+  });
+  useDisableTabbing.useDisableTabbing(isOpen);
+  solidJs.createEffect(() => {
+    if (rootEl()) {
+      const el = rootEl();
+      const fontSize = getComputedStyle(el).fontSize;
+      el == null ? void 0 : el.style.setProperty("--tsrd-font-size", fontSize);
+    }
+  });
+  keyboard.createShortcut(settings().openHotkey, () => {
+    toggleOpen();
+  });
+  return (() => {
+    var _el$ = _tmpl$();
+    web.use(setRootEl, _el$);
+    web.setAttribute(_el$, "data-testid", storage.TANSTACK_DEVTOOLS);
+    web.insert(_el$, web.createComponent(trigger.Trigger, {
+      isOpen,
+      setIsOpen: toggleOpen
+    }), null);
+    web.insert(_el$, web.createComponent(mainPanel.MainPanel, {
+      isResizing,
+      isOpen,
+      get children() {
+        return web.createComponent(contentPanel.ContentPanel, {
+          ref: (ref) => panelRef = ref,
+          handleDragStart: (e) => handleDragStart(panelRef, e),
+          get children() {
+            return [web.createComponent(tabs.Tabs, {
+              toggleOpen
+            }), web.createComponent(tabContent.TabContent, {})];
+          }
+        });
+      }
+    }), null);
+    return _el$;
+  })();
+}
+module.exports = DevTools;
+//# sourceMappingURL=devtools.cjs.map

package/dist/cjs/devtools.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"devtools.cjs","sources":["../../src/devtools.tsx"],"sourcesContent":["import { createEffect, createSignal } from 'solid-js'\nimport { createShortcut } from '@solid-primitives/keyboard'\nimport {\n  useDevtoolsSettings,\n  useHeight,\n  usePersistOpen,\n} from './context/use-devtools-context'\nimport { useDisableTabbing } from './hooks/use-disable-tabbing'\nimport { TANSTACK_DEVTOOLS } from './utils/storage'\nimport { Trigger } from './components/trigger'\nimport { MainPanel } from './components/main-panel'\nimport { ContentPanel } from './components/content-panel'\nimport { Tabs } from './components/tabs'\nimport { TabContent } from './components/tab-content'\n\nexport default function DevTools() {\n  const { settings } = useDevtoolsSettings()\n  const { setHeight } = useHeight()\n  const { persistOpen, setPersistOpen } = usePersistOpen()\n  const [rootEl, setRootEl] = createSignal<HTMLDivElement>()\n  const [isOpen, setIsOpen] = createSignal(\n    settings().defaultOpen || persistOpen(),\n  )\n  let panelRef: HTMLDivElement | undefined = undefined\n  const [isResizing, setIsResizing] = createSignal(false)\n  const toggleOpen = () => {\n    const open = isOpen()\n    setIsOpen(!open)\n    setPersistOpen(!open)\n  }\n\n  // Used to resize the panel\n  const handleDragStart = (\n    panelElement: HTMLDivElement | undefined,\n    startEvent: 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      setHeight(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  // Handle resizing and padding adjustments\n  createEffect(() => {\n    if (isOpen()) {\n      const previousValue = rootEl()?.parentElement?.style.paddingBottom\n\n      const run = () => {\n        const containerHeight = panelRef!.getBoundingClientRect().height\n        if (rootEl()?.parentElement) {\n          setRootEl((prev) => {\n            if (prev?.parentElement) {\n              prev.parentElement.style.paddingBottom = `${containerHeight}px`\n            }\n            return prev\n          })\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            setRootEl((prev) => {\n              prev!.parentElement!.style.paddingBottom = previousValue\n              return prev\n            })\n          }\n        }\n      }\n    } else {\n      // Reset padding when devtools are closed\n      if (rootEl()?.parentElement) {\n        setRootEl((prev) => {\n          if (prev?.parentElement) {\n            prev.parentElement.removeAttribute('style')\n          }\n          return prev\n        })\n      }\n    }\n    return\n  })\n  createEffect(() => {\n    window.addEventListener('keydown', (e) => {\n      if (e.key === 'Escape' && isOpen()) {\n        toggleOpen()\n      }\n    })\n  })\n  useDisableTabbing(isOpen)\n  createEffect(() => {\n    if (rootEl()) {\n      const el = rootEl()\n      const fontSize = getComputedStyle(el!).fontSize\n      el?.style.setProperty('--tsrd-font-size', fontSize)\n    }\n  })\n  createShortcut(settings().openHotkey, () => {\n    toggleOpen()\n  })\n  return (\n    <div ref={setRootEl} data-testid={TANSTACK_DEVTOOLS}>\n      <Trigger isOpen={isOpen} setIsOpen={toggleOpen} />\n      <MainPanel isResizing={isResizing} isOpen={isOpen}>\n        <ContentPanel\n          ref={(ref) => (panelRef = ref)}\n          handleDragStart={(e) => handleDragStart(panelRef, e)}\n        >\n          <Tabs toggleOpen={toggleOpen} />\n          <TabContent />\n        </ContentPanel>\n      </MainPanel>\n    </div>\n  )\n}\n"],"names":["DevTools","settings","useDevtoolsSettings","setHeight","useHeight","persistOpen","setPersistOpen","usePersistOpen","rootEl","setRootEl","createSignal","isOpen","setIsOpen","defaultOpen","panelRef","undefined","isResizing","setIsResizing","toggleOpen","open","handleDragStart","panelElement","startEvent","button","dragInfo","originalHeight","getBoundingClientRect","height","pageY","run","moveEvent","delta","newHeight","unsub","removeEventListener","addEventListener","createEffect","previousValue","parentElement","style","paddingBottom","containerHeight","prev","window","removeAttribute","e","key","useDisableTabbing","el","fontSize","getComputedStyle","setProperty","openHotkey","_el$","_tmpl$","_$use","TANSTACK_DEVTOOLS","_$createComponent","Trigger","MainPanel","children","ContentPanel","ref","Tabs","TabContent"],"mappings":"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"}

package/dist/cjs/devtools.d.cts

@@ -0,0 +1 @@
+export default function DevTools(): import("solid-js").JSX.Element;

package/dist/cjs/hooks/use-disable-tabbing.cjs

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const solidJs = require("solid-js");
+const storage = require("../utils/storage.cjs");
+const recursivelyChangeTabIndex = (node, remove = true) => {
+  if (remove) {
+    node.setAttribute("tabIndex", "-1");
+  } else {
+    node.removeAttribute("tabIndex");
+  }
+  for (const child of node.children) {
+    recursivelyChangeTabIndex(child, remove);
+  }
+};
+const useDisableTabbing = (isOpen) => {
+  solidJs.createEffect(() => {
+    const el = document.getElementById(storage.TANSTACK_DEVTOOLS);
+    if (!el) return;
+    recursivelyChangeTabIndex(el, !isOpen());
+  });
+};
+exports.useDisableTabbing = useDisableTabbing;
+//# sourceMappingURL=use-disable-tabbing.cjs.map

package/dist/cjs/hooks/use-disable-tabbing.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-disable-tabbing.cjs","sources":["../../../src/hooks/use-disable-tabbing.ts"],"sourcesContent":["import { createEffect } from 'solid-js'\nimport { TANSTACK_DEVTOOLS } from '../utils/storage'\n\nconst recursivelyChangeTabIndex = (\n  node: Element | HTMLElement,\n  remove = true,\n) => {\n  if (remove) {\n    node.setAttribute('tabIndex', '-1')\n  } else {\n    node.removeAttribute('tabIndex')\n  }\n  for (const child of node.children) {\n    recursivelyChangeTabIndex(child, remove)\n  }\n}\n/**\n * @param isOpen A function that returns whether the devtools are open or not.\n * This is used to disable tabbing over the main devtools container while\n * the devtools are closed.\n */\nexport const useDisableTabbing = (isOpen: () => boolean) => {\n  createEffect(() => {\n    const el = document.getElementById(TANSTACK_DEVTOOLS)\n    if (!el) return\n    recursivelyChangeTabIndex(el, !isOpen())\n  })\n}\n"],"names":["createEffect","TANSTACK_DEVTOOLS"],"mappings":";;;;AAGA,MAAM,4BAA4B,CAChC,MACA,SAAS,SACN;AACH,MAAI,QAAQ;AACL,SAAA,aAAa,YAAY,IAAI;AAAA,EAAA,OAC7B;AACL,SAAK,gBAAgB,UAAU;AAAA,EAAA;AAEtB,aAAA,SAAS,KAAK,UAAU;AACjC,8BAA0B,OAAO,MAAM;AAAA,EAAA;AAE3C;AAMa,MAAA,oBAAoB,CAAC,WAA0B;AAC1DA,UAAAA,aAAa,MAAM;AACX,UAAA,KAAK,SAAS,eAAeC,yBAAiB;AACpD,QAAI,CAAC,GAAI;AACiB,8BAAA,IAAI,CAAC,QAAQ;AAAA,EAAA,CACxC;AACH;;"}

package/dist/cjs/hooks/use-disable-tabbing.d.cts

@@ -0,0 +1,6 @@
+/**
+ * @param isOpen A function that returns whether the devtools are open or not.
+ * This is used to disable tabbing over the main devtools container while
+ * the devtools are closed.
+ */
+export declare const useDisableTabbing: (isOpen: () => boolean) => void;

package/dist/cjs/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const core = require("./core.cjs");
+exports.TanStackRouterDevtoolsCore = core.TanStackRouterDevtoolsCore;
+//# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/cjs/index.d.cts

@@ -0,0 +1,3 @@
+export { TanStackRouterDevtoolsCore } from './core.cjs';
+export type { DevtoolsOptions } from './core.cjs';
+export type { DevtoolsPlugin } from './context/devtools-context.cjs';

package/dist/cjs/styles/tokens.cjs

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const tokens = {
+  colors: {
+    darkGray: {
+      700: "#191c24",
+      800: "#111318"
+    },
+    gray: {
+      100: "#f2f4f7",
+      300: "#d0d5dd",
+      700: "#344054"
+    },
+    blue: {
+      800: "#1849A9"
+    },
+    red: {
+      500: "#ef4444"
+    },
+    purple: {
+      400: "#9B8AFB",
+      500: "#7A5AF8"
+    }
+  },
+  alpha: {
+    90: "e5"
+  },
+  font: {
+    size: {
+      xs: "calc(var(--tsrd-font-size) * 0.75)",
+      sm: "calc(var(--tsrd-font-size) * 0.875)"
+    },
+    fontFamily: {
+      sans: "ui-sans-serif, Inter, system-ui, sans-serif, sans-serif"
+    }
+  },
+  border: {
+    radius: {
+      full: "9999px"
+    }
+  },
+  size: {
+    0.5: "calc(var(--tsrd-font-size) * 0.125)",
+    2: "calc(var(--tsrd-font-size) * 0.5)",
+    10: "calc(var(--tsrd-font-size) * 2.5)",
+    12: "calc(var(--tsrd-font-size) * 3)",
+    48: "calc(var(--tsrd-font-size) * 12)"
+  }
+};
+exports.tokens = tokens;
+//# sourceMappingURL=tokens.cjs.map

package/dist/cjs/styles/tokens.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.cjs","sources":["../../../src/styles/tokens.ts"],"sourcesContent":["export const tokens = {\n  colors: {\n    inherit: 'inherit',\n    current: 'currentColor',\n    transparent: 'transparent',\n    black: '#000000',\n    white: '#ffffff',\n    neutral: {\n      50: '#f9fafb',\n      100: '#f2f4f7',\n      200: '#eaecf0',\n      300: '#d0d5dd',\n      400: '#98a2b3',\n      500: '#667085',\n      600: '#475467',\n      700: '#344054',\n      800: '#1d2939',\n      900: '#101828',\n    },\n    darkGray: {\n      50: '#525c7a',\n      100: '#49536e',\n      200: '#414962',\n      300: '#394056',\n      400: '#313749',\n      500: '#292e3d',\n      600: '#212530',\n      700: '#191c24',\n      800: '#111318',\n      900: '#0b0d10',\n    },\n    gray: {\n      50: '#f9fafb',\n      100: '#f2f4f7',\n      200: '#eaecf0',\n      300: '#d0d5dd',\n      400: '#98a2b3',\n      500: '#667085',\n      600: '#475467',\n      700: '#344054',\n      800: '#1d2939',\n      900: '#101828',\n    },\n    blue: {\n      25: '#F5FAFF',\n      50: '#EFF8FF',\n      100: '#D1E9FF',\n      200: '#B2DDFF',\n      300: '#84CAFF',\n      400: '#53B1FD',\n      500: '#2E90FA',\n      600: '#1570EF',\n      700: '#175CD3',\n      800: '#1849A9',\n      900: '#194185',\n    },\n    green: {\n      25: '#F6FEF9',\n      50: '#ECFDF3',\n      100: '#D1FADF',\n      200: '#A6F4C5',\n      300: '#6CE9A6',\n      400: '#32D583',\n      500: '#12B76A',\n      600: '#039855',\n      700: '#027A48',\n      800: '#05603A',\n      900: '#054F31',\n    },\n    red: {\n      50: '#fef2f2',\n      100: '#fee2e2',\n      200: '#fecaca',\n      300: '#fca5a5',\n      400: '#f87171',\n      500: '#ef4444',\n      600: '#dc2626',\n      700: '#b91c1c',\n      800: '#991b1b',\n      900: '#7f1d1d',\n      950: '#450a0a',\n    },\n    yellow: {\n      25: '#FFFCF5',\n      50: '#FFFAEB',\n      100: '#FEF0C7',\n      200: '#FEDF89',\n      300: '#FEC84B',\n      400: '#FDB022',\n      500: '#F79009',\n      600: '#DC6803',\n      700: '#B54708',\n      800: '#93370D',\n      900: '#7A2E0E',\n    },\n    purple: {\n      25: '#FAFAFF',\n      50: '#F4F3FF',\n      100: '#EBE9FE',\n      200: '#D9D6FE',\n      300: '#BDB4FE',\n      400: '#9B8AFB',\n      500: '#7A5AF8',\n      600: '#6938EF',\n      700: '#5925DC',\n      800: '#4A1FB8',\n      900: '#3E1C96',\n    },\n    teal: {\n      25: '#F6FEFC',\n      50: '#F0FDF9',\n      100: '#CCFBEF',\n      200: '#99F6E0',\n      300: '#5FE9D0',\n      400: '#2ED3B7',\n      500: '#15B79E',\n      600: '#0E9384',\n      700: '#107569',\n      800: '#125D56',\n      900: '#134E48',\n    },\n    pink: {\n      25: '#fdf2f8',\n      50: '#fce7f3',\n      100: '#fbcfe8',\n      200: '#f9a8d4',\n      300: '#f472b6',\n      400: '#ec4899',\n      500: '#db2777',\n      600: '#be185d',\n      700: '#9d174d',\n      800: '#831843',\n      900: '#500724',\n    },\n    cyan: {\n      25: '#ecfeff',\n      50: '#cffafe',\n      100: '#a5f3fc',\n      200: '#67e8f9',\n      300: '#22d3ee',\n      400: '#06b6d4',\n      500: '#0891b2',\n      600: '#0e7490',\n      700: '#155e75',\n      800: '#164e63',\n      900: '#083344',\n    },\n  },\n  alpha: {\n    100: 'ff',\n    90: 'e5',\n    80: 'cc',\n    70: 'b3',\n    60: '99',\n    50: '80',\n    40: '66',\n    30: '4d',\n    20: '33',\n    10: '1a',\n    0: '00',\n  },\n  font: {\n    size: {\n      '2xs': 'calc(var(--tsrd-font-size) * 0.625)',\n      xs: 'calc(var(--tsrd-font-size) * 0.75)',\n      sm: 'calc(var(--tsrd-font-size) * 0.875)',\n      md: 'var(--tsrd-font-size)',\n      lg: 'calc(var(--tsrd-font-size) * 1.125)',\n      xl: 'calc(var(--tsrd-font-size) * 1.25)',\n      '2xl': 'calc(var(--tsrd-font-size) * 1.5)',\n      '3xl': 'calc(var(--tsrd-font-size) * 1.875)',\n      '4xl': 'calc(var(--tsrd-font-size) * 2.25)',\n      '5xl': 'calc(var(--tsrd-font-size) * 3)',\n      '6xl': 'calc(var(--tsrd-font-size) * 3.75)',\n      '7xl': 'calc(var(--tsrd-font-size) * 4.5)',\n      '8xl': 'calc(var(--tsrd-font-size) * 6)',\n      '9xl': 'calc(var(--tsrd-font-size) * 8)',\n    },\n    lineHeight: {\n      '3xs': 'calc(var(--tsrd-font-size) * 0.75)',\n      '2xs': 'calc(var(--tsrd-font-size) * 0.875)',\n      xs: 'calc(var(--tsrd-font-size) * 1)',\n      sm: 'calc(var(--tsrd-font-size) * 1.25)',\n      md: 'calc(var(--tsrd-font-size) * 1.5)',\n      lg: 'calc(var(--tsrd-font-size) * 1.75)',\n      xl: 'calc(var(--tsrd-font-size) * 2)',\n      '2xl': 'calc(var(--tsrd-font-size) * 2.25)',\n      '3xl': 'calc(var(--tsrd-font-size) * 2.5)',\n      '4xl': 'calc(var(--tsrd-font-size) * 2.75)',\n      '5xl': 'calc(var(--tsrd-font-size) * 3)',\n      '6xl': 'calc(var(--tsrd-font-size) * 3.25)',\n      '7xl': 'calc(var(--tsrd-font-size) * 3.5)',\n      '8xl': 'calc(var(--tsrd-font-size) * 3.75)',\n      '9xl': 'calc(var(--tsrd-font-size) * 4)',\n    },\n    weight: {\n      thin: '100',\n      extralight: '200',\n      light: '300',\n      normal: '400',\n      medium: '500',\n      semibold: '600',\n      bold: '700',\n      extrabold: '800',\n      black: '900',\n    },\n    fontFamily: {\n      sans: 'ui-sans-serif, Inter, system-ui, sans-serif, sans-serif',\n      mono: `ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace`,\n    },\n  },\n  breakpoints: {\n    xs: '320px',\n    sm: '640px',\n    md: '768px',\n    lg: '1024px',\n    xl: '1280px',\n    '2xl': '1536px',\n  },\n  border: {\n    radius: {\n      none: '0px',\n      xs: 'calc(var(--tsrd-font-size) * 0.125)',\n      sm: 'calc(var(--tsrd-font-size) * 0.25)',\n      md: 'calc(var(--tsrd-font-size) * 0.375)',\n      lg: 'calc(var(--tsrd-font-size) * 0.5)',\n      xl: 'calc(var(--tsrd-font-size) * 0.75)',\n      '2xl': 'calc(var(--tsrd-font-size) * 1)',\n      '3xl': 'calc(var(--tsrd-font-size) * 1.5)',\n      full: '9999px',\n    },\n  },\n  size: {\n    0: '0px',\n    0.25: 'calc(var(--tsrd-font-size) * 0.0625)',\n    0.5: 'calc(var(--tsrd-font-size) * 0.125)',\n    1: 'calc(var(--tsrd-font-size) * 0.25)',\n    1.5: 'calc(var(--tsrd-font-size) * 0.375)',\n    2: 'calc(var(--tsrd-font-size) * 0.5)',\n    2.5: 'calc(var(--tsrd-font-size) * 0.625)',\n    3: 'calc(var(--tsrd-font-size) * 0.75)',\n    3.5: 'calc(var(--tsrd-font-size) * 0.875)',\n    4: 'calc(var(--tsrd-font-size) * 1)',\n    4.5: 'calc(var(--tsrd-font-size) * 1.125)',\n    5: 'calc(var(--tsrd-font-size) * 1.25)',\n    5.5: 'calc(var(--tsrd-font-size) * 1.375)',\n    6: 'calc(var(--tsrd-font-size) * 1.5)',\n    6.5: 'calc(var(--tsrd-font-size) * 1.625)',\n    7: 'calc(var(--tsrd-font-size) * 1.75)',\n    8: 'calc(var(--tsrd-font-size) * 2)',\n    9: 'calc(var(--tsrd-font-size) * 2.25)',\n    10: 'calc(var(--tsrd-font-size) * 2.5)',\n    11: 'calc(var(--tsrd-font-size) * 2.75)',\n    12: 'calc(var(--tsrd-font-size) * 3)',\n    14: 'calc(var(--tsrd-font-size) * 3.5)',\n    16: 'calc(var(--tsrd-font-size) * 4)',\n    20: 'calc(var(--tsrd-font-size) * 5)',\n    24: 'calc(var(--tsrd-font-size) * 6)',\n    28: 'calc(var(--tsrd-font-size) * 7)',\n    32: 'calc(var(--tsrd-font-size) * 8)',\n    36: 'calc(var(--tsrd-font-size) * 9)',\n    40: 'calc(var(--tsrd-font-size) * 10)',\n    44: 'calc(var(--tsrd-font-size) * 11)',\n    48: 'calc(var(--tsrd-font-size) * 12)',\n    52: 'calc(var(--tsrd-font-size) * 13)',\n    56: 'calc(var(--tsrd-font-size) * 14)',\n    60: 'calc(var(--tsrd-font-size) * 15)',\n    64: 'calc(var(--tsrd-font-size) * 16)',\n    72: 'calc(var(--tsrd-font-size) * 18)',\n    80: 'calc(var(--tsrd-font-size) * 20)',\n    96: 'calc(var(--tsrd-font-size) * 24)',\n  },\n  shadow: {\n    xs: (_: string = 'rgb(0 0 0 / 0.1)') =>\n      `0 1px 2px 0 rgb(0 0 0 / 0.05)` as const,\n    sm: (color: string = 'rgb(0 0 0 / 0.1)') =>\n      `0 1px 3px 0 ${color}, 0 1px 2px -1px ${color}` as const,\n    md: (color: string = 'rgb(0 0 0 / 0.1)') =>\n      `0 4px 6px -1px ${color}, 0 2px 4px -2px ${color}` as const,\n    lg: (color: string = 'rgb(0 0 0 / 0.1)') =>\n      `0 10px 15px -3px ${color}, 0 4px 6px -4px ${color}` as const,\n    xl: (color: string = 'rgb(0 0 0 / 0.1)') =>\n      `0 20px 25px -5px ${color}, 0 8px 10px -6px ${color}` as const,\n    '2xl': (color: string = 'rgb(0 0 0 / 0.25)') =>\n      `0 25px 50px -12px ${color}` as const,\n    inner: (color: string = 'rgb(0 0 0 / 0.05)') =>\n      `inset 0 2px 4px 0 ${color}` as const,\n    none: () => `none` as const,\n  },\n  zIndices: {\n    hide: -1,\n    auto: 'auto',\n    base: 0,\n    docked: 10,\n    dropdown: 1000,\n    sticky: 1100,\n    banner: 1200,\n    overlay: 1300,\n    modal: 1400,\n    popover: 1500,\n    skipLink: 1600,\n    toast: 1700,\n    tooltip: 1800,\n  },\n} as const\n"],"names":[],"mappings":";;AAAO,MAAM,SAAS;AAAA,EACpB,QAAQ;AAAA,IAkBN,UAAU;AAAA,MAQR,KAAK;AAAA,MACL,KAAK;AAAA,IAEP;AAAA,IACA,MAAM;AAAA,MAEJ,KAAK;AAAA,MAEL,KAAK;AAAA,MAIL,KAAK;AAAA,IAGP;AAAA,IACA,MAAM;AAAA,MAUJ,KAAK;AAAA,IAEP;AAAA,IAcA,KAAK;AAAA,MAMH,KAAK;AAAA,IAMP;AAAA,IAcA,QAAQ;AAAA,MAMN,KAAK;AAAA,MACL,KAAK;AAAA,IAKP;AAAA,EAwCF;AAAA,EACA,OAAO;AAAA,IAEL,IAAI;AAAA,EAUN;AAAA,EACA,MAAM;AAAA,IACJ,MAAM;AAAA,MAEJ,IAAI;AAAA,MACJ,IAAI;AAAA,IAYN;AAAA,IA6BA,YAAY;AAAA,MACV,MAAM;AAAA,IAER;AAAA,EACF;AAAA,EASA,QAAQ;AAAA,IACN,QAAQ;AAAA,MASN,MAAM;AAAA,IAAA;AAAA,EAEV;AAAA,EACA,MAAM;AAAA,IAGJ,KAAK;AAAA,IAGL,GAAG;AAAA,IAaH,IAAI;AAAA,IAEJ,IAAI;AAAA,IAUJ,IAAI;AAAA,EAQN;AAiCF;;"}