@tanstack/devtools 0.0.0 → 0.1.0

package/README.md

@@ -0,0 +1,41 @@
+# @tanstack/devtools
+
+This package is still under active development and might have breaking changes in the future. Please use it with caution.
+
+## General Usage
+
+```tsx
+import { TanStackDevtoolsCore } from '@tanstack/devtools'
+
+const devtools = new TanStackDevtoolsCore({
+  options: {
+    // your options here
+  },
+  plugins: [
+    // your plugins here
+  ],
+})
+
+devtools.mount(document.getElementById('your-devtools-container')!)
+```
+
+## Creating plugins
+
+In order to create a plugin for TanStack Devtools, you can use the `plugins` arg of the `TanStackDevtoolsCore` class. Here's an example of how to create a simple plugin:
+
+```ts
+import { TanStackDevtoolsCore } from '@tanstack/devtools'
+
+const devtools = new TanStackDevtoolsCore({
+  options: {
+    // your options here
+  },
+  plugins: [
+    {
+      id: 'my-plugin',
+      name: 'My Plugin',
+      render: (el) => (el.innerHTML = '<div>My Plugin Content</div>'),
+    },
+  ],
+})
+```

package/dist/cjs/components/checkbox.cjs

@@ -0,0 +1,55 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+const useStyles = require("../styles/use-styles.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<div><label><input type=checkbox><div>`), _tmpl$2 = /* @__PURE__ */ web.template(`<span>`);
+function Checkbox(props) {
+  const styles = useStyles.useStyles();
+  const [isChecked, setIsChecked] = solidJs.createSignal(props.checked || false);
+  const handleChange = (e) => {
+    const checked = e.target.checked;
+    setIsChecked(checked);
+    props.onChange?.(checked);
+  };
+  return (() => {
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.nextSibling;
+    _el$3.$$input = handleChange;
+    web.insert(_el$4, (() => {
+      var _c$ = web.memo(() => !!props.label);
+      return () => _c$() && (() => {
+        var _el$5 = _tmpl$2();
+        web.insert(_el$5, () => props.label);
+        web.effect(() => web.className(_el$5, styles().checkboxLabel));
+        return _el$5;
+      })();
+    })(), null);
+    web.insert(_el$4, (() => {
+      var _c$2 = web.memo(() => !!props.description);
+      return () => _c$2() && (() => {
+        var _el$6 = _tmpl$2();
+        web.insert(_el$6, () => props.description);
+        web.effect(() => web.className(_el$6, styles().checkboxDescription));
+        return _el$6;
+      })();
+    })(), null);
+    web.effect((_p$) => {
+      var _v$ = styles().checkboxContainer, _v$2 = styles().checkboxWrapper, _v$3 = styles().checkbox, _v$4 = styles().checkboxLabelContainer;
+      _v$ !== _p$.e && web.className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && web.className(_el$2, _p$.t = _v$2);
+      _v$3 !== _p$.a && web.className(_el$3, _p$.a = _v$3);
+      _v$4 !== _p$.o && web.className(_el$4, _p$.o = _v$4);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0
+    });
+    web.effect(() => _el$3.checked = isChecked());
+    return _el$;
+  })();
+}
+web.delegateEvents(["input"]);
+exports.Checkbox = Checkbox;
+//# sourceMappingURL=checkbox.cjs.map

package/dist/cjs/components/checkbox.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.cjs","sources":["../../../src/components/checkbox.tsx"],"sourcesContent":["import { createSignal } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\ninterface CheckboxProps {\n  label?: string\n  checked?: boolean\n  onChange?: (checked: boolean) => void\n  description?: string\n}\n\nexport function Checkbox(props: CheckboxProps) {\n  const styles = useStyles()\n  const [isChecked, setIsChecked] = createSignal(props.checked || false)\n\n  const handleChange = (e: Event) => {\n    const checked = (e.target as HTMLInputElement).checked\n    setIsChecked(checked)\n    props.onChange?.(checked)\n  }\n\n  return (\n    <div class={styles().checkboxContainer}>\n      <label class={styles().checkboxWrapper}>\n        <input\n          type=\"checkbox\"\n          checked={isChecked()}\n          class={styles().checkbox}\n          onInput={handleChange}\n        />\n        <div class={styles().checkboxLabelContainer}>\n          {props.label && (\n            <span class={styles().checkboxLabel}>{props.label}</span>\n          )}\n          {props.description && (\n            <span class={styles().checkboxDescription}>\n              {props.description}\n            </span>\n          )}\n        </div>\n      </label>\n    </div>\n  )\n}\n"],"names":["Checkbox","props","styles","useStyles","isChecked","setIsChecked","createSignal","checked","handleChange","e","target","onChange","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","$$input","_$insert","_c$","_$memo","label","_el$5","_tmpl$2","_$effect","_$className","checkboxLabel","_c$2","description","_el$6","checkboxDescription","_p$","_v$","checkboxContainer","_v$2","checkboxWrapper","_v$3","checkbox","_v$4","checkboxLabelContainer","t","a","o","undefined","_$delegateEvents"],"mappings":";;;;;;AAUO,SAASA,SAASC,OAAsB;AAC7C,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM,CAACC,WAAWC,YAAY,IAAIC,QAAAA,aAAaL,MAAMM,WAAW,KAAK;AAErE,QAAMC,eAAeA,CAACC,MAAa;AACjC,UAAMF,UAAWE,EAAEC,OAA4BH;AAC/CF,iBAAaE,OAAO;AACpBN,UAAMU,WAAWJ,OAAO;AAAA,EAC1B;AAEA,UAAA,MAAA;AAAA,QAAAK,OAAAC,UAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAC,YAAAE,QAAAD,MAAAE;AAAAF,UAAAG,UAOiBX;AAAYY,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAI,MAAAC,IAAAA,KAAA,MAAA,CAAA,CAGpBrB,MAAMsB,KAAK;AAAA,aAAA,MAAXF,IAAAA,MAAA,MAAA;AAAA,YAAAG,QAAAC,QAAAA;AAAAL,YAAAA,OAAAI,OAAA,MACuCvB,MAAMsB,KAAK;AAAAG,YAAAA,OAAA,MAAAC,IAAAA,UAAAH,OAApCtB,OAAAA,EAAS0B,aAAa,CAAA;AAAA,eAAAJ;AAAAA,MAAA,GAAA;AAAA,IACpC,GAAA,GAAA,IAAA;AAAAJ,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAY,OAAAP,IAAAA,KAAA,MAAA,CAAA,CACArB,MAAM6B,WAAW;AAAA,aAAA,MAAjBD,KAAAA,MAAA,MAAA;AAAA,YAAAE,QAAAN,QAAAA;AAAAL,YAAAA,OAAAW,OAAA,MAEI9B,MAAM6B,WAAW;AAAAJ,YAAAA,OAAA,MAAAC,IAAAA,UAAAI,OADP7B,OAAAA,EAAS8B,mBAAmB,CAAA;AAAA,eAAAD;AAAAA,MAAA,GAAA;AAAA,IAG1C,GAAA,GAAA,IAAA;AAAAL,QAAAA,OAAAO,CAAAA,QAAA;AAAA,UAAAC,MAhBKhC,OAAAA,EAASiC,mBAAiBC,OACtBlC,OAAAA,EAASmC,iBAAeC,OAI3BpC,OAAAA,EAASqC,UAAQC,OAGdtC,SAASuC;AAAsBP,cAAAD,IAAAxB,KAAAkB,IAAAA,UAAAf,MAAAqB,IAAAxB,IAAAyB,GAAA;AAAAE,eAAAH,IAAAS,KAAAf,IAAAA,UAAAb,OAAAmB,IAAAS,IAAAN,IAAA;AAAAE,eAAAL,IAAAU,KAAAhB,IAAAA,UAAAX,OAAAiB,IAAAU,IAAAL,IAAA;AAAAE,eAAAP,IAAAW,KAAAjB,IAAAA,UAAAV,OAAAgB,IAAAW,IAAAJ,IAAA;AAAA,aAAAP;AAAAA,IAAA,GAAA;AAAA,MAAAxB,GAAAoC;AAAAA,MAAAH,GAAAG;AAAAA,MAAAF,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA;AAAAnB,QAAAA,aAAAV,MAAAT,UAJhCH,UAAAA,CAAW;AAAA,WAAAQ;AAAAA,EAAA,GAAA;AAiB9B;AAACkC,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}

package/dist/cjs/components/checkbox.d.cts

@@ -0,0 +1,8 @@
+interface CheckboxProps {
+    label?: string;
+    checked?: boolean;
+    onChange?: (checked: boolean) => void;
+    description?: string;
+}
+export declare function Checkbox(props: CheckboxProps): import("solid-js").JSX.Element;
+export {};

package/dist/cjs/components/content-panel.cjs

@@ -1,10 +1,14 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const web = require("solid-js/web");
+const useDevtoolsContext = require("../context/use-devtools-context.cjs");
 const useStyles = require("../styles/use-styles.cjs");
 var _tmpl$ = /* @__PURE__ */ web.template(`<div>`);
 const ContentPanel = (props) => {
   const styles = useStyles.useStyles();
+  const {
+    settings
+  } = useDevtoolsContext.useDevtoolsSettings();
   return (() => {
     var _el$ = _tmpl$();
     var _ref$ = props.ref;
@@ -14,7 +18,7 @@ const ContentPanel = (props) => {
       return () => _c$() ? (() => {
         var _el$2 = _tmpl$();
         web.addEventListener(_el$2, "mousedown", props.handleDragStart, true);
-        web.effect(() => web.className(_el$2, styles().dragHandle));
+        web.effect(() => web.className(_el$2, styles().dragHandle(settings().panelLocation)));
         return _el$2;
       })() : null;
     })(), null);

package/dist/cjs/components/content-panel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"content-panel.cjs","sources":["../../../src/components/content-panel.tsx"],"sourcesContent":["import { useStyles } from '../styles/use-styles'\nimport type { JSX } from 'solid-js/jsx-runtime'\n\nexport const ContentPanel = (props: {\n  ref: (el: HTMLDivElement | undefined) => void\n  children: JSX.Element\n  handleDragStart?: (e: any) => void\n}) => {\n  const styles = useStyles()\n  return (\n    <div ref={props.ref} class={styles().devtoolsPanel}>\n      {props.handleDragStart ? (\n        <div\n          class={styles().dragHandle}\n          onMouseDown={props.handleDragStart}\n        ></div>\n      ) : null}\n      {props.children}\n    </div>\n  )\n}\n"],"names":["ContentPanel","props","styles","useStyles","_el$","_tmpl$","_ref$","ref","_$use","_$insert","_c$","_$memo","handleDragStart","_el$2","_$addEventListener","_$effect","_$className","dragHandle","children","devtoolsPanel","_$delegateEvents"],"mappings":";;;;;AAGaA,MAAAA,eAAeA,CAACC,UAIvB;AACJ,QAAMC,SAASC,UAAAA,UAAU;AACzB,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAA;AAAA,QAAAC,QACYL,MAAMM;AAAG,WAAAD,UAAA,aAAAE,QAAAF,OAAAF,IAAA,IAATH,MAAMM,MAAGH;AAAAK,QAAAA,OAAAL,OAAA,MAAA;AAAA,UAAAM,MAAAC,IAChBV,KAAAA,MAAAA,CAAAA,CAAAA,MAAMW,eAAe;AAAA,aAAA,MAArBF,IAAA,KAAA,MAAA;AAAA,YAAAG,QAAAR,OAAA;AAAAS,YAAAA,iBAAAD,OAGgBZ,aAAAA,MAAMW,iBAAe,IAAA;AAAAG,YAAAA,OAAA,MAAAC,IAAAA,UAAAH,OAD3BX,OAAO,EAAEe,UAAU,CAAA;AAAAJ,eAAAA;AAAAA,aAG1B;AAAA,IAAI,GAAA,GAAA,IAAA;AAAAJ,QAAAA,OAAAL,MACPH,MAAAA,MAAMiB,UAAQ,IAAA;AAAAH,QAAAA,OAAA,MAAAC,IAAAA,UAAAZ,MAPWF,OAAO,EAAEiB,aAAa,CAAA;AAAAf,WAAAA;AAAAA,EAAAA,GAAA;AAUtD;AAACgB,IAAAA,eAAA,CAAA,WAAA,CAAA;;"}
+{"version":3,"file":"content-panel.cjs","sources":["../../../src/components/content-panel.tsx"],"sourcesContent":["import { useDevtoolsSettings } from '../context/use-devtools-context'\nimport { useStyles } from '../styles/use-styles'\nimport type { JSX } from 'solid-js/jsx-runtime'\n\nexport const ContentPanel = (props: {\n  ref: (el: HTMLDivElement | undefined) => void\n  children: JSX.Element\n  handleDragStart?: (e: any) => void\n}) => {\n  const styles = useStyles()\n  const { settings } = useDevtoolsSettings()\n  return (\n    <div ref={props.ref} class={styles().devtoolsPanel}>\n      {props.handleDragStart ? (\n        <div\n          class={styles().dragHandle(settings().panelLocation)}\n          onMouseDown={props.handleDragStart}\n        ></div>\n      ) : null}\n      {props.children}\n    </div>\n  )\n}\n"],"names":["ContentPanel","props","styles","useStyles","settings","useDevtoolsSettings","_el$","_tmpl$","_ref$","ref","_$use","_$insert","_c$","_$memo","handleDragStart","_el$2","_$addEventListener","_$effect","_$className","dragHandle","panelLocation","children","devtoolsPanel","_$delegateEvents"],"mappings":";;;;;;AAIO,MAAMA,eAAeA,CAACC,UAIvB;AACJ,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAaC,uCAAAA;AACrB,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA;AAAA,QAAAC,QACYP,MAAMQ;AAAG,WAAAD,UAAA,aAAAE,QAAAF,OAAAF,IAAA,IAATL,MAAMQ,MAAGH;AAAAK,QAAAA,OAAAL,OAAA,MAAA;AAAA,UAAAM,MAAAC,IAAAA,KAAA,MAAA,CAAA,CAChBZ,MAAMa,eAAe;AAAA,aAAA,MAArBF,IAAAA,KAAA,MAAA;AAAA,YAAAG,QAAAR,OAAAA;AAAAS,YAAAA,iBAAAD,OAAA,aAGgBd,MAAMa,iBAAe,IAAA;AAAAG,yBAAAC,cAAAH,OAD3Bb,OAAAA,EAASiB,WAAWf,SAAAA,EAAWgB,aAAa,CAAC,CAAA;AAAA,eAAAL;AAAAA,MAAA,OAGpD;AAAA,IAAI,GAAA,GAAA,IAAA;AAAAJ,QAAAA,OAAAL,MAAA,MACPL,MAAMoB,UAAQ,IAAA;AAAAJ,QAAAA,OAAA,MAAAC,IAAAA,UAAAZ,MAPWJ,OAAAA,EAASoB,aAAa,CAAA;AAAA,WAAAhB;AAAAA,EAAA,GAAA;AAUtD;AAACiB,IAAAA,eAAA,CAAA,WAAA,CAAA;;"}

package/dist/cjs/components/input.cjs

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+const useStyles = require("../styles/use-styles.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<div><div><input>`), _tmpl$2 = /* @__PURE__ */ web.template(`<label>`), _tmpl$3 = /* @__PURE__ */ web.template(`<p>`);
+function Input(props) {
+  const styles = useStyles.useStyles();
+  const [val, setVal] = solidJs.createSignal(props.value || "");
+  const handleChange = (e) => {
+    const value = e.target.value;
+    setVal((prev) => prev !== value ? value : prev);
+    props.onChange?.(value);
+  };
+  return (() => {
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild;
+    web.insert(_el$2, (() => {
+      var _c$ = web.memo(() => !!props.label);
+      return () => _c$() && (() => {
+        var _el$4 = _tmpl$2();
+        web.insert(_el$4, () => props.label);
+        web.effect(() => web.className(_el$4, styles().inputLabel));
+        return _el$4;
+      })();
+    })(), _el$3);
+    web.insert(_el$2, (() => {
+      var _c$2 = web.memo(() => !!props.description);
+      return () => _c$2() && (() => {
+        var _el$5 = _tmpl$3();
+        web.insert(_el$5, () => props.description);
+        web.effect(() => web.className(_el$5, styles().inputDescription));
+        return _el$5;
+      })();
+    })(), _el$3);
+    _el$3.$$input = handleChange;
+    web.effect((_p$) => {
+      var _v$ = styles().inputContainer, _v$2 = styles().inputWrapper, _v$3 = props.type || "text", _v$4 = styles().input, _v$5 = props.placeholder;
+      _v$ !== _p$.e && web.className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && web.className(_el$2, _p$.t = _v$2);
+      _v$3 !== _p$.a && web.setAttribute(_el$3, "type", _p$.a = _v$3);
+      _v$4 !== _p$.o && web.className(_el$3, _p$.o = _v$4);
+      _v$5 !== _p$.i && web.setAttribute(_el$3, "placeholder", _p$.i = _v$5);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0,
+      o: void 0,
+      i: void 0
+    });
+    web.effect(() => _el$3.value = val());
+    return _el$;
+  })();
+}
+web.delegateEvents(["input"]);
+exports.Input = Input;
+//# sourceMappingURL=input.cjs.map

package/dist/cjs/components/input.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.cjs","sources":["../../../src/components/input.tsx"],"sourcesContent":["import { createSignal } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\ninterface InputProps {\n  label?: string\n  type?: 'text' | 'number' | 'password' | 'email'\n  value?: string\n  placeholder?: string\n  onChange?: (value: string) => void\n  description?: string\n}\n\nexport function Input(props: InputProps) {\n  const styles = useStyles()\n  const [val, setVal] = createSignal(props.value || '')\n\n  const handleChange = (e: Event) => {\n    const value = (e.target as HTMLInputElement).value\n    setVal((prev) => (prev !== value ? value : prev))\n    props.onChange?.(value)\n  }\n\n  return (\n    <div class={styles().inputContainer}>\n      <div class={styles().inputWrapper}>\n        {props.label && (\n          <label class={styles().inputLabel}>{props.label}</label>\n        )}\n        {props.description && (\n          <p class={styles().inputDescription}>{props.description}</p>\n        )}\n        <input\n          type={props.type || 'text'}\n          class={styles().input}\n          value={val()}\n          placeholder={props.placeholder}\n          onInput={handleChange}\n        />\n      </div>\n    </div>\n  )\n}\n"],"names":["Input","props","styles","useStyles","val","setVal","createSignal","value","handleChange","e","target","prev","onChange","_el$","_tmpl$","_el$2","firstChild","_el$3","_$insert","_c$","_$memo","label","_el$4","_tmpl$2","_$effect","_$className","inputLabel","_c$2","description","_el$5","_tmpl$3","inputDescription","$$input","_p$","_v$","inputContainer","_v$2","inputWrapper","_v$3","type","_v$4","input","_v$5","placeholder","t","a","_$setAttribute","o","i","undefined","_$delegateEvents"],"mappings":";;;;;;AAYO,SAASA,MAAMC,OAAmB;AACvC,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM,CAACC,KAAKC,MAAM,IAAIC,QAAAA,aAAaL,MAAMM,SAAS,EAAE;AAEpD,QAAMC,eAAeA,CAACC,MAAa;AACjC,UAAMF,QAASE,EAAEC,OAA4BH;AAC7CF,WAAQM,CAAAA,SAAUA,SAASJ,QAAQA,QAAQI,IAAK;AAChDV,UAAMW,WAAWL,KAAK;AAAA,EACxB;AAEA,UAAA,MAAA;AAAA,QAAAM,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAC;AAAAE,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAI,MAAAC,IAAAA,KAAA,MAAA,CAAA,CAGOnB,MAAMoB,KAAK;AAAA,aAAA,MAAXF,IAAAA,MAAA,MAAA;AAAA,YAAAG,QAAAC,QAAAA;AAAAL,YAAAA,OAAAI,OAAA,MACqCrB,MAAMoB,KAAK;AAAAG,YAAAA,OAAA,MAAAC,IAAAA,UAAAH,OAAjCpB,OAAAA,EAASwB,UAAU,CAAA;AAAA,eAAAJ;AAAAA,MAAA,GAAA;AAAA,IAClC,GAAA,GAAAL,KAAA;AAAAC,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAY,OAAAP,IAAAA,KAAA,MAAA,CAAA,CACAnB,MAAM2B,WAAW;AAAA,aAAA,MAAjBD,KAAAA,MAAA,MAAA;AAAA,YAAAE,QAAAC,QAAAA;AAAAZ,YAAAA,OAAAW,OAAA,MACuC5B,MAAM2B,WAAW;AAAAJ,YAAAA,OAAA,MAAAC,IAAAA,UAAAI,OAA7C3B,OAAAA,EAAS6B,gBAAgB,CAAA;AAAA,eAAAF;AAAAA,MAAA,GAAA;AAAA,IACpC,GAAA,GAAAZ,KAAA;AAAAA,UAAAe,UAMUxB;AAAYgB,QAAAA,OAAAS,CAAAA,QAAA;AAAA,UAAAC,MAbfhC,SAASiC,gBAAcC,OACrBlC,SAASmC,cAAYC,OAQvBrC,MAAMsC,QAAQ,QAAMC,OACnBtC,SAASuC,OAAKC,OAERzC,MAAM0C;AAAWT,cAAAD,IAAAxB,KAAAgB,IAAAA,UAAAZ,MAAAoB,IAAAxB,IAAAyB,GAAA;AAAAE,eAAAH,IAAAW,KAAAnB,IAAAA,UAAAV,OAAAkB,IAAAW,IAAAR,IAAA;AAAAE,eAAAL,IAAAY,KAAAC,IAAAA,aAAA7B,OAAA,QAAAgB,IAAAY,IAAAP,IAAA;AAAAE,eAAAP,IAAAc,KAAAtB,IAAAA,UAAAR,OAAAgB,IAAAc,IAAAP,IAAA;AAAAE,eAAAT,IAAAe,KAAAF,IAAAA,aAAA7B,OAAA,eAAAgB,IAAAe,IAAAN,IAAA;AAAA,aAAAT;AAAAA,IAAA,GAAA;AAAA,MAAAxB,GAAAwC;AAAAA,MAAAL,GAAAK;AAAAA,MAAAJ,GAAAI;AAAAA,MAAAF,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA;AAAAzB,QAAAA,aAAAP,MAAAV,QADvBH,IAAAA,CAAK;AAAA,WAAAS;AAAAA,EAAA,GAAA;AAOtB;AAACqC,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}

package/dist/cjs/components/input.d.cts

@@ -0,0 +1,10 @@
+interface InputProps {
+    label?: string;
+    type?: 'text' | 'number' | 'password' | 'email';
+    value?: string;
+    placeholder?: string;
+    onChange?: (value: string) => void;
+    description?: string;
+}
+export declare function Input(props: InputProps): import("solid-js").JSX.Element;
+export {};

package/dist/cjs/components/logo.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"logo.cjs","sources":["../../../src/components/logo.tsx"],"sourcesContent":["import { createUniqueId } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\nexport function TanStackLogo() {\n  const id = createUniqueId()\n  const styles = useStyles()\n  return (\n    <svg\n      class={styles().logo}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      enable-background=\"new 0 0 634 633\"\n      viewBox=\"0 0 634 633\"\n    >\n      <g transform=\"translate(1)\">\n        <linearGradient\n          id={`a-${id}`}\n          x1=\"-641.486\"\n          x2=\"-641.486\"\n          y1=\"856.648\"\n          y2=\"855.931\"\n          gradientTransform=\"matrix(633 0 0 -633 406377 542258)\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop offset=\"0\" stop-color=\"#6bdaff\"></stop>\n          <stop offset=\"0.319\" stop-color=\"#f9ffb5\"></stop>\n          <stop offset=\"0.706\" stop-color=\"#ffa770\"></stop>\n          <stop offset=\"1\" stop-color=\"#ff7373\"></stop>\n        </linearGradient>\n        <circle\n          cx=\"316.5\"\n          cy=\"316.5\"\n          r=\"316.5\"\n          fill={`url(#a-${id})`}\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n        ></circle>\n        <defs>\n          <filter\n            id={`b-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"412\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`c-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"412\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#b-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"610.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00CFE2\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#c-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`d-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"412\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`e-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"412\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#d-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"610.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00CFE2\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#e-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`f-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"450\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`g-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"450\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#f-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"648.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00A8B8\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#g-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`h-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"450\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`i-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"450\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#h-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"648.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00A8B8\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#i-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`j-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"486\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`k-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"486\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#j-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"684.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#007782\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#k-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`l-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"486\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`m-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"486\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#l-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"684.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#007782\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#m-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`n-${id}`}\n            width=\"176.9\"\n            height=\"129.3\"\n            x=\"272.2\"\n            y=\"308\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`o-${id}`}\n          width=\"176.9\"\n          height=\"129.3\"\n          x=\"272.2\"\n          y=\"308\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#n-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#o-${id})`}>\n          <path\n            fill=\"none\"\n            stroke=\"#000\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"bevel\"\n            stroke-width=\"11\"\n            d=\"M436 403.2l-5 28.6m-140-90.3l-10.9 62m52.8-19.4l-4.3 27.1\"\n          ></path>\n          <linearGradient\n            id={`p-${id}`}\n            x1=\"-645.656\"\n            x2=\"-646.499\"\n            y1=\"854.878\"\n            y2=\"854.788\"\n            gradientTransform=\"matrix(-184.159 -32.4722 11.4608 -64.9973 -128419.844 34938.836)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#ee2700\"></stop>\n            <stop offset=\"1\" stop-color=\"#ff008e\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#p-${id})`}\n            fill-rule=\"evenodd\"\n            d=\"M344.1 363l97.7 17.2c5.8 2.1 8.2 6.2 7.1 12.1-1 5.9-4.7 9.2-11 9.9l-106-18.7-57.5-59.2c-3.2-4.8-2.9-9.1.8-12.8 3.7-3.7 8.3-4.4 13.7-2.1l55.2 53.6z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <path\n            fill=\"#D8D8D8\"\n            fill-rule=\"evenodd\"\n            stroke=\"#FFF\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"bevel\"\n            stroke-width=\"7\"\n            d=\"M428.3 384.5l.9-6.5m-33.9 1.5l.9-6.5m-34 .5l.9-6.1m-38.9-16.1l4.2-3.9m-25.2-16.1l4.2-3.9\"\n            clip-rule=\"evenodd\"\n          ></path>\n        </g>\n        <defs>\n          <filter\n            id={`q-${id}`}\n            width=\"280.6\"\n            height=\"317.4\"\n            x=\"73.2\"\n            y=\"113.9\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`r-${id}`}\n          width=\"280.6\"\n          height=\"317.4\"\n          x=\"73.2\"\n          y=\"113.9\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#q-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#r-${id})`}>\n          <linearGradient\n            id={`s-${id}`}\n            x1=\"-646.8\"\n            x2=\"-646.8\"\n            y1=\"854.844\"\n            y2=\"853.844\"\n            gradientTransform=\"matrix(-100.1751 48.8587 -97.9753 -200.879 19124.773 203538.61)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#a17500\"></stop>\n            <stop offset=\"1\" stop-color=\"#5d2100\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#s-${id})`}\n            fill-rule=\"evenodd\"\n            d=\"M192.3 203c8.1 37.3 14 73.6 17.8 109.1 3.8 35.4 2.8 75.2-2.9 119.2l61.2-16.7c-15.6-59-25.2-97.9-28.6-116.6-3.4-18.7-10.8-51.8-22.2-99.6l-25.3 4.6\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`t-${id}`}\n            x1=\"-635.467\"\n            x2=\"-635.467\"\n            y1=\"852.115\"\n            y2=\"851.115\"\n            gradientTransform=\"matrix(92.6873 4.8575 2.0257 -38.6535 57323.695 36176.047)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#t-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M195 183.9s-12.6-22.1-36.5-29.9c-15.9-5.2-34.4-1.5-55.5 11.1 15.9 14.3 29.5 22.6 40.7 24.9 16.8 3.6 51.3-6.1 51.3-6.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`u-${id}`}\n            x1=\"-636.573\"\n            x2=\"-636.573\"\n            y1=\"855.444\"\n            y2=\"854.444\"\n            gradientTransform=\"matrix(109.9945 5.7646 6.3597 -121.3507 64719.133 107659.336)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#u-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5s-47.5-8.5-83.2 15.7c-23.8 16.2-34.3 49.3-31.6 99.3 30.3-27.8 52.1-48.5 65.2-61.9 19.8-20 49.6-53.1 49.6-53.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`v-${id}`}\n            x1=\"-632.145\"\n            x2=\"-632.145\"\n            y1=\"854.174\"\n            y2=\"853.174\"\n            gradientTransform=\"matrix(62.9558 3.2994 3.5021 -66.8246 37035.367 59284.227)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#v-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M195 183.9c-.8-21.9 6-38 20.6-48.2 14.6-10.2 29.8-15.3 45.5-15.3-6.1 21.4-14.5 35.8-25.2 43.4-10.7 7.5-24.4 14.2-40.9 20.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`w-${id}`}\n            x1=\"-638.224\"\n            x2=\"-638.224\"\n            y1=\"853.801\"\n            y2=\"852.801\"\n            gradientTransform=\"matrix(152.4666 7.9904 3.0934 -59.0251 94939.86 55646.855)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#w-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c31.9-30 64.1-39.7 96.7-29 32.6 10.7 50.8 30.4 54.6 59.1-35.2-5.5-60.4-9.6-75.8-12.1-15.3-2.6-40.5-8.6-75.5-18z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`x-${id}`}\n            x1=\"-637.723\"\n            x2=\"-637.723\"\n            y1=\"855.103\"\n            y2=\"854.103\"\n            gradientTransform=\"matrix(136.467 7.1519 5.2165 -99.5377 82830.875 89859.578)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#x-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c35.8-7.6 65.6-.2 89.2 22 23.6 22.2 37.7 49 42.3 80.3-39.8-9.7-68.3-23.8-85.5-42.4-17.2-18.5-32.5-38.5-46-59.9z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`y-${id}`}\n            x1=\"-631.79\"\n            x2=\"-631.79\"\n            y1=\"855.872\"\n            y2=\"854.872\"\n            gradientTransform=\"matrix(60.8683 3.19 8.7771 -167.4773 31110.818 145537.61)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#y-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c-33.6 13.8-53.6 35.7-60.1 65.6-6.5 29.9-3.6 63.1 8.7 99.6 27.4-40.3 43.2-69.6 47.4-88 4.2-18.3 5.5-44.1 4-77.2z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <path\n            fill=\"none\"\n            stroke=\"#2F8A00\"\n            stroke-linecap=\"round\"\n            stroke-width=\"8\"\n            d=\"M196.5 182.3c-14.8 21.6-25.1 41.4-30.8 59.4-5.7 18-9.4 33-11.1 45.1\"\n          ></path>\n          <path\n            fill=\"none\"\n            stroke=\"#2F8A00\"\n            stroke-linecap=\"round\"\n            stroke-width=\"8\"\n            d=\"M194.8 185.7c-24.4 1.7-43.8 9-58.1 21.8-14.3 12.8-24.7 25.4-31.3 37.8m99.1-68.9c29.7-6.7 52-8.4 67-5 15 3.4 26.9 8.7 35.8 15.9m-110.8-5.9c20.3 9.9 38.2 20.5 53.9 31.9 15.7 11.4 27.4 22.1 35.1 32\"\n          ></path>\n        </g>\n        <defs>\n          <filter\n            id={`z-${id}`}\n            width=\"532\"\n            height=\"633\"\n            x=\"50.5\"\n            y=\"399\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`A-${id}`}\n          width=\"532\"\n          height=\"633\"\n          x=\"50.5\"\n          y=\"399\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#z-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <linearGradient\n          id={`B-${id}`}\n          x1=\"-641.104\"\n          x2=\"-641.278\"\n          y1=\"856.577\"\n          y2=\"856.183\"\n          gradientTransform=\"matrix(532 0 0 -633 341484.5 542657)\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop offset=\"0\" stop-color=\"#fff400\"></stop>\n          <stop offset=\"1\" stop-color=\"#3c8700\"></stop>\n        </linearGradient>\n        <ellipse\n          cx=\"316.5\"\n          cy=\"715.5\"\n          fill={`url(#B-${id})`}\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          mask={`url(#A-${id})`}\n          rx=\"266\"\n          ry=\"316.5\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`C-${id}`}\n            width=\"288\"\n            height=\"283\"\n            x=\"391\"\n            y=\"-24\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`D-${id}`}\n          width=\"288\"\n          height=\"283\"\n          x=\"391\"\n          y=\"-24\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#C-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#D-${id})`}>\n          <g transform=\"translate(397 -24)\">\n            <linearGradient\n              id={`E-${id}`}\n              x1=\"-1036.672\"\n              x2=\"-1036.672\"\n              y1=\"880.018\"\n              y2=\"879.018\"\n              gradientTransform=\"matrix(227 0 0 -227 235493 199764)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffdf00\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff9d00\"></stop>\n            </linearGradient>\n            <circle\n              cx=\"168.5\"\n              cy=\"113.5\"\n              r=\"113.5\"\n              fill={`url(#E-${id})`}\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n            <linearGradient\n              id={`F-${id}`}\n              x1=\"-1017.329\"\n              x2=\"-1018.602\"\n              y1=\"658.003\"\n              y2=\"657.998\"\n              gradientTransform=\"matrix(30 0 0 -1 30558 771)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#F-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M30 113H0\"\n            ></path>\n            <linearGradient\n              id={`G-${id}`}\n              x1=\"-1014.501\"\n              x2=\"-1015.774\"\n              y1=\"839.985\"\n              y2=\"839.935\"\n              gradientTransform=\"matrix(26.5 0 0 -5.5 26925 4696.5)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#G-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M33.5 79.5L7 74\"\n            ></path>\n            <linearGradient\n              id={`H-${id}`}\n              x1=\"-1016.59\"\n              x2=\"-1017.862\"\n              y1=\"852.671\"\n              y2=\"852.595\"\n              gradientTransform=\"matrix(29 0 0 -8 29523 6971)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#H-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M34 146l-29 8\"\n            ></path>\n            <linearGradient\n              id={`I-${id}`}\n              x1=\"-1011.984\"\n              x2=\"-1013.257\"\n              y1=\"863.523\"\n              y2=\"863.229\"\n              gradientTransform=\"matrix(24 0 0 -13 24339 11407)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#I-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M45 177l-24 13\"\n            ></path>\n            <linearGradient\n              id={`J-${id}`}\n              x1=\"-1006.673\"\n              x2=\"-1007.946\"\n              y1=\"869.279\"\n              y2=\"868.376\"\n              gradientTransform=\"matrix(20 0 0 -19 20205 16720)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#J-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M67 204l-20 19\"\n            ></path>\n            <linearGradient\n              id={`K-${id}`}\n              x1=\"-992.85\"\n              x2=\"-993.317\"\n              y1=\"871.258\"\n              y2=\"870.258\"\n              gradientTransform=\"matrix(13.8339 0 0 -22.8467 13825.796 20131.938)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#K-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M94.4 227l-13.8 22.8\"\n            ></path>\n            <linearGradient\n              id={`L-${id}`}\n              x1=\"-953.835\"\n              x2=\"-953.965\"\n              y1=\"871.9\"\n              y2=\"870.9\"\n              gradientTransform=\"matrix(7.5 0 0 -24.5 7278 21605)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#L-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M127.5 243.5L120 268\"\n            ></path>\n            <linearGradient\n              id={`M-${id}`}\n              x1=\"244.504\"\n              x2=\"244.496\"\n              y1=\"871.898\"\n              y2=\"870.898\"\n              gradientTransform=\"matrix(.5 0 0 -24.5 45.5 21614)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#M-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M167.5 252.5l.5 24.5\"\n            ></path>\n          </g>\n        </g>\n      </g>\n    </svg>\n  )\n}\n"],"names":["TanStackLogo","id","createUniqueId","styles","useStyles","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","_el$6","_el$7","_el$8","_el$9","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_el$19","_el$20","_el$21","_el$22","_el$23","_el$24","_el$25","_el$26","_el$27","_el$28","_el$29","_el$30","_el$31","_el$32","_el$33","_el$34","_el$35","_el$36","_el$37","_el$38","_el$39","_el$40","_el$41","_el$42","_el$43","_el$44","_el$45","_el$46","_el$47","_el$48","_el$49","_el$50","_el$51","_el$52","_el$53","_el$54","_el$55","_el$56","_el$57","_el$58","_el$59","_el$60","_el$61","_el$62","_el$63","_el$64","_el$65","_el$66","_el$67","_el$68","_el$69","_el$70","_el$71","_el$72","_el$73","_el$74","_el$75","_el$76","_el$77","_el$78","_el$79","_el$80","_el$81","_el$82","_el$83","_el$84","_el$85","_el$86","_el$87","_el$88","_el$89","_el$90","_el$91","_$setAttribute","_$effect","logo"],"mappings":"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"}
+{"version":3,"file":"logo.cjs","sources":["../../../src/components/logo.tsx"],"sourcesContent":["import { createUniqueId } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\nexport function TanStackLogo() {\n  const id = createUniqueId()\n  const styles = useStyles()\n  return (\n    <svg\n      class={styles().logo}\n      xmlns=\"http://www.w3.org/2000/svg\"\n      enable-background=\"new 0 0 634 633\"\n      viewBox=\"0 0 634 633\"\n    >\n      <g transform=\"translate(1)\">\n        <linearGradient\n          id={`a-${id}`}\n          x1=\"-641.486\"\n          x2=\"-641.486\"\n          y1=\"856.648\"\n          y2=\"855.931\"\n          gradientTransform=\"matrix(633 0 0 -633 406377 542258)\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop offset=\"0\" stop-color=\"#6bdaff\"></stop>\n          <stop offset=\"0.319\" stop-color=\"#f9ffb5\"></stop>\n          <stop offset=\"0.706\" stop-color=\"#ffa770\"></stop>\n          <stop offset=\"1\" stop-color=\"#ff7373\"></stop>\n        </linearGradient>\n        <circle\n          cx=\"316.5\"\n          cy=\"316.5\"\n          r=\"316.5\"\n          fill={`url(#a-${id})`}\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n        ></circle>\n        <defs>\n          <filter\n            id={`b-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"412\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`c-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"412\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#b-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"610.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00CFE2\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#c-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`d-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"412\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`e-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"412\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#d-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"610.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00CFE2\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#e-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`f-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"450\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`g-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"450\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#f-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"648.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00A8B8\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#g-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`h-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"450\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`i-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"450\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#h-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"648.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#00A8B8\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#i-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`j-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"-137.5\"\n            y=\"486\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`k-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"-137.5\"\n          y=\"486\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#j-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"89.5\"\n          cy=\"684.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#007782\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#k-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`l-${id}`}\n            width=\"454\"\n            height=\"396.9\"\n            x=\"316.5\"\n            y=\"486\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`m-${id}`}\n          width=\"454\"\n          height=\"396.9\"\n          x=\"316.5\"\n          y=\"486\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#l-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <ellipse\n          cx=\"543.5\"\n          cy=\"684.5\"\n          fill=\"#015064\"\n          fill-rule=\"evenodd\"\n          stroke=\"#007782\"\n          stroke-width=\"25\"\n          clip-rule=\"evenodd\"\n          mask={`url(#m-${id})`}\n          rx=\"214.5\"\n          ry=\"186\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`n-${id}`}\n            width=\"176.9\"\n            height=\"129.3\"\n            x=\"272.2\"\n            y=\"308\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`o-${id}`}\n          width=\"176.9\"\n          height=\"129.3\"\n          x=\"272.2\"\n          y=\"308\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#n-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#o-${id})`}>\n          <path\n            fill=\"none\"\n            stroke=\"#000\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"bevel\"\n            stroke-width=\"11\"\n            d=\"M436 403.2l-5 28.6m-140-90.3l-10.9 62m52.8-19.4l-4.3 27.1\"\n          ></path>\n          <linearGradient\n            id={`p-${id}`}\n            x1=\"-645.656\"\n            x2=\"-646.499\"\n            y1=\"854.878\"\n            y2=\"854.788\"\n            gradientTransform=\"matrix(-184.159 -32.4722 11.4608 -64.9973 -128419.844 34938.836)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#ee2700\"></stop>\n            <stop offset=\"1\" stop-color=\"#ff008e\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#p-${id})`}\n            fill-rule=\"evenodd\"\n            d=\"M344.1 363l97.7 17.2c5.8 2.1 8.2 6.2 7.1 12.1-1 5.9-4.7 9.2-11 9.9l-106-18.7-57.5-59.2c-3.2-4.8-2.9-9.1.8-12.8 3.7-3.7 8.3-4.4 13.7-2.1l55.2 53.6z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <path\n            fill=\"#D8D8D8\"\n            fill-rule=\"evenodd\"\n            stroke=\"#FFF\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"bevel\"\n            stroke-width=\"7\"\n            d=\"M428.3 384.5l.9-6.5m-33.9 1.5l.9-6.5m-34 .5l.9-6.1m-38.9-16.1l4.2-3.9m-25.2-16.1l4.2-3.9\"\n            clip-rule=\"evenodd\"\n          ></path>\n        </g>\n        <defs>\n          <filter\n            id={`q-${id}`}\n            width=\"280.6\"\n            height=\"317.4\"\n            x=\"73.2\"\n            y=\"113.9\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`r-${id}`}\n          width=\"280.6\"\n          height=\"317.4\"\n          x=\"73.2\"\n          y=\"113.9\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#q-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#r-${id})`}>\n          <linearGradient\n            id={`s-${id}`}\n            x1=\"-646.8\"\n            x2=\"-646.8\"\n            y1=\"854.844\"\n            y2=\"853.844\"\n            gradientTransform=\"matrix(-100.1751 48.8587 -97.9753 -200.879 19124.773 203538.61)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#a17500\"></stop>\n            <stop offset=\"1\" stop-color=\"#5d2100\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#s-${id})`}\n            fill-rule=\"evenodd\"\n            d=\"M192.3 203c8.1 37.3 14 73.6 17.8 109.1 3.8 35.4 2.8 75.2-2.9 119.2l61.2-16.7c-15.6-59-25.2-97.9-28.6-116.6-3.4-18.7-10.8-51.8-22.2-99.6l-25.3 4.6\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`t-${id}`}\n            x1=\"-635.467\"\n            x2=\"-635.467\"\n            y1=\"852.115\"\n            y2=\"851.115\"\n            gradientTransform=\"matrix(92.6873 4.8575 2.0257 -38.6535 57323.695 36176.047)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#t-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M195 183.9s-12.6-22.1-36.5-29.9c-15.9-5.2-34.4-1.5-55.5 11.1 15.9 14.3 29.5 22.6 40.7 24.9 16.8 3.6 51.3-6.1 51.3-6.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`u-${id}`}\n            x1=\"-636.573\"\n            x2=\"-636.573\"\n            y1=\"855.444\"\n            y2=\"854.444\"\n            gradientTransform=\"matrix(109.9945 5.7646 6.3597 -121.3507 64719.133 107659.336)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#u-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5s-47.5-8.5-83.2 15.7c-23.8 16.2-34.3 49.3-31.6 99.3 30.3-27.8 52.1-48.5 65.2-61.9 19.8-20 49.6-53.1 49.6-53.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`v-${id}`}\n            x1=\"-632.145\"\n            x2=\"-632.145\"\n            y1=\"854.174\"\n            y2=\"853.174\"\n            gradientTransform=\"matrix(62.9558 3.2994 3.5021 -66.8246 37035.367 59284.227)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#v-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M195 183.9c-.8-21.9 6-38 20.6-48.2 14.6-10.2 29.8-15.3 45.5-15.3-6.1 21.4-14.5 35.8-25.2 43.4-10.7 7.5-24.4 14.2-40.9 20.1z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`w-${id}`}\n            x1=\"-638.224\"\n            x2=\"-638.224\"\n            y1=\"853.801\"\n            y2=\"852.801\"\n            gradientTransform=\"matrix(152.4666 7.9904 3.0934 -59.0251 94939.86 55646.855)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#w-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c31.9-30 64.1-39.7 96.7-29 32.6 10.7 50.8 30.4 54.6 59.1-35.2-5.5-60.4-9.6-75.8-12.1-15.3-2.6-40.5-8.6-75.5-18z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`x-${id}`}\n            x1=\"-637.723\"\n            x2=\"-637.723\"\n            y1=\"855.103\"\n            y2=\"854.103\"\n            gradientTransform=\"matrix(136.467 7.1519 5.2165 -99.5377 82830.875 89859.578)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#x-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c35.8-7.6 65.6-.2 89.2 22 23.6 22.2 37.7 49 42.3 80.3-39.8-9.7-68.3-23.8-85.5-42.4-17.2-18.5-32.5-38.5-46-59.9z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <linearGradient\n            id={`y-${id}`}\n            x1=\"-631.79\"\n            x2=\"-631.79\"\n            y1=\"855.872\"\n            y2=\"854.872\"\n            gradientTransform=\"matrix(60.8683 3.19 8.7771 -167.4773 31110.818 145537.61)\"\n            gradientUnits=\"userSpaceOnUse\"\n          >\n            <stop offset=\"0\" stop-color=\"#2f8a00\"></stop>\n            <stop offset=\"1\" stop-color=\"#90ff57\"></stop>\n          </linearGradient>\n          <path\n            fill={`url(#y-${id})`}\n            fill-rule=\"evenodd\"\n            stroke=\"#2F8A00\"\n            stroke-width=\"13\"\n            d=\"M194.9 184.5c-33.6 13.8-53.6 35.7-60.1 65.6-6.5 29.9-3.6 63.1 8.7 99.6 27.4-40.3 43.2-69.6 47.4-88 4.2-18.3 5.5-44.1 4-77.2z\"\n            clip-rule=\"evenodd\"\n          ></path>\n          <path\n            fill=\"none\"\n            stroke=\"#2F8A00\"\n            stroke-linecap=\"round\"\n            stroke-width=\"8\"\n            d=\"M196.5 182.3c-14.8 21.6-25.1 41.4-30.8 59.4-5.7 18-9.4 33-11.1 45.1\"\n          ></path>\n          <path\n            fill=\"none\"\n            stroke=\"#2F8A00\"\n            stroke-linecap=\"round\"\n            stroke-width=\"8\"\n            d=\"M194.8 185.7c-24.4 1.7-43.8 9-58.1 21.8-14.3 12.8-24.7 25.4-31.3 37.8m99.1-68.9c29.7-6.7 52-8.4 67-5 15 3.4 26.9 8.7 35.8 15.9m-110.8-5.9c20.3 9.9 38.2 20.5 53.9 31.9 15.7 11.4 27.4 22.1 35.1 32\"\n          ></path>\n        </g>\n        <defs>\n          <filter\n            id={`z-${id}`}\n            width=\"532\"\n            height=\"633\"\n            x=\"50.5\"\n            y=\"399\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`A-${id}`}\n          width=\"532\"\n          height=\"633\"\n          x=\"50.5\"\n          y=\"399\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#z-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <linearGradient\n          id={`B-${id}`}\n          x1=\"-641.104\"\n          x2=\"-641.278\"\n          y1=\"856.577\"\n          y2=\"856.183\"\n          gradientTransform=\"matrix(532 0 0 -633 341484.5 542657)\"\n          gradientUnits=\"userSpaceOnUse\"\n        >\n          <stop offset=\"0\" stop-color=\"#fff400\"></stop>\n          <stop offset=\"1\" stop-color=\"#3c8700\"></stop>\n        </linearGradient>\n        <ellipse\n          cx=\"316.5\"\n          cy=\"715.5\"\n          fill={`url(#B-${id})`}\n          fill-rule=\"evenodd\"\n          clip-rule=\"evenodd\"\n          mask={`url(#A-${id})`}\n          rx=\"266\"\n          ry=\"316.5\"\n        ></ellipse>\n        <defs>\n          <filter\n            id={`C-${id}`}\n            width=\"288\"\n            height=\"283\"\n            x=\"391\"\n            y=\"-24\"\n            filterUnits=\"userSpaceOnUse\"\n          >\n            <feColorMatrix values=\"1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 1 0\"></feColorMatrix>\n          </filter>\n        </defs>\n        <mask\n          id={`D-${id}`}\n          width=\"288\"\n          height=\"283\"\n          x=\"391\"\n          y=\"-24\"\n          maskUnits=\"userSpaceOnUse\"\n        >\n          <g filter={`url(#C-${id})`}>\n            <circle\n              cx=\"316.5\"\n              cy=\"316.5\"\n              r=\"316.5\"\n              fill=\"#FFF\"\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n          </g>\n        </mask>\n        <g mask={`url(#D-${id})`}>\n          <g transform=\"translate(397 -24)\">\n            <linearGradient\n              id={`E-${id}`}\n              x1=\"-1036.672\"\n              x2=\"-1036.672\"\n              y1=\"880.018\"\n              y2=\"879.018\"\n              gradientTransform=\"matrix(227 0 0 -227 235493 199764)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffdf00\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff9d00\"></stop>\n            </linearGradient>\n            <circle\n              cx=\"168.5\"\n              cy=\"113.5\"\n              r=\"113.5\"\n              fill={`url(#E-${id})`}\n              fill-rule=\"evenodd\"\n              clip-rule=\"evenodd\"\n            ></circle>\n            <linearGradient\n              id={`F-${id}`}\n              x1=\"-1017.329\"\n              x2=\"-1018.602\"\n              y1=\"658.003\"\n              y2=\"657.998\"\n              gradientTransform=\"matrix(30 0 0 -1 30558 771)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#F-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M30 113H0\"\n            ></path>\n            <linearGradient\n              id={`G-${id}`}\n              x1=\"-1014.501\"\n              x2=\"-1015.774\"\n              y1=\"839.985\"\n              y2=\"839.935\"\n              gradientTransform=\"matrix(26.5 0 0 -5.5 26925 4696.5)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#G-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M33.5 79.5L7 74\"\n            ></path>\n            <linearGradient\n              id={`H-${id}`}\n              x1=\"-1016.59\"\n              x2=\"-1017.862\"\n              y1=\"852.671\"\n              y2=\"852.595\"\n              gradientTransform=\"matrix(29 0 0 -8 29523 6971)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#H-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M34 146l-29 8\"\n            ></path>\n            <linearGradient\n              id={`I-${id}`}\n              x1=\"-1011.984\"\n              x2=\"-1013.257\"\n              y1=\"863.523\"\n              y2=\"863.229\"\n              gradientTransform=\"matrix(24 0 0 -13 24339 11407)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#I-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M45 177l-24 13\"\n            ></path>\n            <linearGradient\n              id={`J-${id}`}\n              x1=\"-1006.673\"\n              x2=\"-1007.946\"\n              y1=\"869.279\"\n              y2=\"868.376\"\n              gradientTransform=\"matrix(20 0 0 -19 20205 16720)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#J-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M67 204l-20 19\"\n            ></path>\n            <linearGradient\n              id={`K-${id}`}\n              x1=\"-992.85\"\n              x2=\"-993.317\"\n              y1=\"871.258\"\n              y2=\"870.258\"\n              gradientTransform=\"matrix(13.8339 0 0 -22.8467 13825.796 20131.938)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#K-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M94.4 227l-13.8 22.8\"\n            ></path>\n            <linearGradient\n              id={`L-${id}`}\n              x1=\"-953.835\"\n              x2=\"-953.965\"\n              y1=\"871.9\"\n              y2=\"870.9\"\n              gradientTransform=\"matrix(7.5 0 0 -24.5 7278 21605)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#L-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M127.5 243.5L120 268\"\n            ></path>\n            <linearGradient\n              id={`M-${id}`}\n              x1=\"244.504\"\n              x2=\"244.496\"\n              y1=\"871.898\"\n              y2=\"870.898\"\n              gradientTransform=\"matrix(.5 0 0 -24.5 45.5 21614)\"\n              gradientUnits=\"userSpaceOnUse\"\n            >\n              <stop offset=\"0\" stop-color=\"#ffa400\"></stop>\n              <stop offset=\"1\" stop-color=\"#ff5e00\"></stop>\n            </linearGradient>\n            <path\n              fill=\"none\"\n              stroke={`url(#M-${id})`}\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"bevel\"\n              stroke-width=\"12\"\n              d=\"M167.5 252.5l.5 24.5\"\n            ></path>\n          </g>\n        </g>\n      </g>\n    </svg>\n  )\n}\n"],"names":["TanStackLogo","id","createUniqueId","styles","useStyles","_el$","_tmpl$","_el$2","firstChild","_el$3","_el$4","nextSibling","_el$5","_el$6","_el$7","_el$8","_el$9","_el$10","_el$11","_el$12","_el$13","_el$14","_el$15","_el$16","_el$17","_el$18","_el$19","_el$20","_el$21","_el$22","_el$23","_el$24","_el$25","_el$26","_el$27","_el$28","_el$29","_el$30","_el$31","_el$32","_el$33","_el$34","_el$35","_el$36","_el$37","_el$38","_el$39","_el$40","_el$41","_el$42","_el$43","_el$44","_el$45","_el$46","_el$47","_el$48","_el$49","_el$50","_el$51","_el$52","_el$53","_el$54","_el$55","_el$56","_el$57","_el$58","_el$59","_el$60","_el$61","_el$62","_el$63","_el$64","_el$65","_el$66","_el$67","_el$68","_el$69","_el$70","_el$71","_el$72","_el$73","_el$74","_el$75","_el$76","_el$77","_el$78","_el$79","_el$80","_el$81","_el$82","_el$83","_el$84","_el$85","_el$86","_el$87","_el$88","_el$89","_el$90","_el$91","_$setAttribute","_$effect","logo"],"mappings":";;;;;;AAGO,SAASA,eAAe;AAC7B,QAAMC,KAAKC,QAAAA,eAAAA;AACX,QAAMC,SAASC,UAAAA,UAAAA;AACf,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAC,YAAAE,QAAAD,MAAAE,aAAAC,QAAAF,MAAAC,aAAAE,QAAAD,MAAAJ,YAAAM,QAAAF,MAAAD,aAAAI,QAAAD,MAAAN,YAAAQ,QAAAF,MAAAH,aAAAM,SAAAD,MAAAL,aAAAO,SAAAD,OAAAT,YAAAW,SAAAF,OAAAN,aAAAS,SAAAD,OAAAX,YAAAa,SAAAF,OAAAR,aAAAW,SAAAD,OAAAV,aAAAY,SAAAD,OAAAd,YAAAgB,SAAAF,OAAAX,aAAAc,SAAAD,OAAAhB,YAAAkB,SAAAF,OAAAb,aAAAgB,SAAAD,OAAAf,aAAAiB,SAAAD,OAAAnB,YAAAqB,SAAAF,OAAAhB,aAAAmB,SAAAD,OAAArB,YAAAuB,SAAAF,OAAAlB,aAAAqB,SAAAD,OAAApB,aAAAsB,SAAAD,OAAAxB,YAAA0B,SAAAF,OAAArB,aAAAwB,SAAAD,OAAA1B,YAAA4B,SAAAF,OAAAvB,aAAA0B,SAAAD,OAAAzB,aAAA2B,SAAAD,OAAA7B,YAAA+B,SAAAF,OAAA1B,aAAA6B,SAAAD,OAAA/B,YAAAiC,SAAAF,OAAA5B,aAAA+B,SAAAD,OAAA9B,aAAAgC,SAAAD,OAAAlC,YAAAoC,SAAAF,OAAA/B,aAAAkC,SAAAD,OAAApC,YAAAsC,SAAAF,OAAAjC,aAAAoC,SAAAD,OAAAtC,YAAAwC,SAAAD,OAAApC,aAAAsC,SAAAD,OAAArC,aAAAuC,SAAAJ,OAAAnC,aAAAwC,SAAAD,OAAA1C,YAAA4C,SAAAF,OAAAvC,aAAA0C,SAAAD,OAAA5C,YAAA8C,SAAAF,OAAAzC,aAAA4C,SAAAD,OAAA9C,YAAAgD,SAAAD,OAAA5C,aAAA8C,SAAAD,OAAA7C,aAAA+C,SAAAD,OAAA9C,aAAAgD,SAAAD,OAAA/C,aAAAiD,SAAAD,OAAAhD,aAAAkD,SAAAD,OAAAjD,aAAAmD,SAAAD,OAAAlD,aAAAoD,SAAAD,OAAAnD,aAAAqD,SAAAD,OAAApD,aAAAsD,SAAAD,OAAArD,aAAAuD,SAAAD,OAAAtD,aAAAwD,SAAAD,OAAAvD,aAAAyD,SAAAD,OAAAxD,aAAA0D,SAAAf,OAAA3C,aAAA2D,SAAAD,OAAA7D,YAAA+D,SAAAF,OAAA1D,aAAA6D,SAAAD,OAAA/D,YAAAiE,SAAAF,OAAA5D,aAAA+D,SAAAD,OAAA9D,aAAAgE,SAAAD,OAAA/D,aAAAiE,SAAAD,OAAAnE,YAAAqE,SAAAF,OAAAhE,aAAAmE,SAAAD,OAAArE,YAAAuE,SAAAF,OAAAlE,aAAAqE,SAAAD,OAAAvE,YAAAyE,SAAAD,OAAAxE,YAAA0E,SAAAD,OAAAtE,aAAAwE,SAAAD,OAAAvE,aAAAyE,SAAAD,OAAAxE,aAAA0E,SAAAD,OAAAzE,aAAA2E,SAAAD,OAAA1E,aAAA4E,SAAAD,OAAA3E,aAAA6E,SAAAD,OAAA5E,aAAA8E,SAAAD,OAAA7E,aAAA+E,SAAAD,OAAA9E,aAAAgF,SAAAD,OAAA/E,aAAAiF,SAAAD,OAAAhF,aAAAkF,SAAAD,OAAAjF,aAAAmF,SAAAD,OAAAlF,aAAAoF,SAAAD,OAAAnF,aAAAqF,SAAAD,OAAApF,aAAAsF,SAAAD,OAAArF,aAAAuF,SAAAD,OAAAtF;AAAAwF,QAAAA,aAAA1F,OAAA,MASY,KAAKR,EAAE,EAAE;AAAAkG,QAAAA,aAAAzF,OAAA,QAiBP,UAAUT,EAAE,GAAG;AAAAkG,QAAAA,aAAAtF,OAAA,MAMf,KAAKZ,EAAE,EAAE;AAAAkG,QAAAA,aAAArF,OAAA,MAWX,KAAKb,EAAE,EAAE;AAAAkG,QAAAA,aAAApF,OAAA,UAOF,UAAUd,EAAE,GAAG;AAAAkG,QAAAA,aAAAnF,OAAA,QAmBpB,UAAUf,EAAE,GAAG;AAAAkG,QAAAA,aAAAjF,QAAA,MAMf,KAAKjB,EAAE,EAAE;AAAAkG,QAAAA,aAAAhF,QAAA,MAWX,KAAKlB,EAAE,EAAE;AAAAkG,QAAAA,aAAA/E,QAAA,UAOF,UAAUnB,EAAE,GAAG;AAAAkG,QAAAA,aAAA9E,QAAA,QAmBpB,UAAUpB,EAAE,GAAG;AAAAkG,QAAAA,aAAA5E,QAAA,MAMf,KAAKtB,EAAE,EAAE;AAAAkG,QAAAA,aAAA3E,QAAA,MAWX,KAAKvB,EAAE,EAAE;AAAAkG,QAAAA,aAAA1E,QAAA,UAOF,UAAUxB,EAAE,GAAG;AAAAkG,QAAAA,aAAAzE,QAAA,QAmBpB,UAAUzB,EAAE,GAAG;AAAAkG,QAAAA,aAAAvE,QAAA,MAMf,KAAK3B,EAAE,EAAE;AAAAkG,QAAAA,aAAAtE,QAAA,MAWX,KAAK5B,EAAE,EAAE;AAAAkG,QAAAA,aAAArE,QAAA,UAOF,UAAU7B,EAAE,GAAG;AAAAkG,QAAAA,aAAApE,QAAA,QAmBpB,UAAU9B,EAAE,GAAG;AAAAkG,QAAAA,aAAAlE,QAAA,MAMf,KAAKhC,EAAE,EAAE;AAAAkG,QAAAA,aAAAjE,QAAA,MAWX,KAAKjC,EAAE,EAAE;AAAAkG,QAAAA,aAAAhE,QAAA,UAOF,UAAUlC,EAAE,GAAG;AAAAkG,QAAAA,aAAA/D,QAAA,QAmBpB,UAAUnC,EAAE,GAAG;AAAAkG,QAAAA,aAAA7D,QAAA,MAMf,KAAKrC,EAAE,EAAE;AAAAkG,QAAAA,aAAA5D,QAAA,MAWX,KAAKtC,EAAE,EAAE;AAAAkG,QAAAA,aAAA3D,QAAA,UAOF,UAAUvC,EAAE,GAAG;AAAAkG,QAAAA,aAAA1D,QAAA,QAmBpB,UAAUxC,EAAE,GAAG;AAAAkG,QAAAA,aAAAxD,QAAA,MAMf,KAAK1C,EAAE,EAAE;AAAAkG,QAAAA,aAAAvD,QAAA,MAWX,KAAK3C,EAAE,EAAE;AAAAkG,QAAAA,aAAAtD,QAAA,UAOF,UAAU5C,EAAE,GAAG;AAAAkG,QAAAA,aAAArD,QAAA,QAWnB,UAAU7C,EAAE,GAAG;AAAAkG,QAAAA,aAAAnD,QAAA,MAUhB,KAAK/C,EAAE,EAAE;AAAAkG,QAAAA,aAAAlD,QAAA,QAYP,UAAUhD,EAAE,GAAG;AAAAkG,QAAAA,aAAAhD,QAAA,MAkBjB,KAAKlD,EAAE,EAAE;AAAAkG,QAAAA,aAAA/C,QAAA,MAWX,KAAKnD,EAAE,EAAE;AAAAkG,QAAAA,aAAA9C,QAAA,UAOF,UAAUpD,EAAE,GAAG;AAAAkG,QAAAA,aAAA7C,QAAA,QAWnB,UAAUrD,EAAE,GAAG;AAAAkG,QAAAA,aAAA5C,QAAA,MAEhB,KAAKtD,EAAE,EAAE;AAAAkG,QAAAA,aAAA3C,QAAA,QAYP,UAAUvD,EAAE,GAAG;AAAAkG,QAAAA,aAAA1C,QAAA,MAMjB,KAAKxD,EAAE,EAAE;AAAAkG,QAAAA,aAAAzC,QAAA,QAYP,UAAUzD,EAAE,GAAG;AAAAkG,QAAAA,aAAAxC,QAAA,MAQjB,KAAK1D,EAAE,EAAE;AAAAkG,QAAAA,aAAAvC,QAAA,QAYP,UAAU3D,EAAE,GAAG;AAAAkG,QAAAA,aAAAtC,QAAA,MAQjB,KAAK5D,EAAE,EAAE;AAAAkG,QAAAA,aAAArC,QAAA,QAYP,UAAU7D,EAAE,GAAG;AAAAkG,QAAAA,aAAApC,QAAA,MAQjB,KAAK9D,EAAE,EAAE;AAAAkG,QAAAA,aAAAnC,QAAA,QAYP,UAAU/D,EAAE,GAAG;AAAAkG,QAAAA,aAAAlC,QAAA,MAQjB,KAAKhE,EAAE,EAAE;AAAAkG,QAAAA,aAAAjC,QAAA,QAYP,UAAUjE,EAAE,GAAG;AAAAkG,QAAAA,aAAAhC,QAAA,MAQjB,KAAKlE,EAAE,EAAE;AAAAkG,QAAAA,aAAA/B,QAAA,QAYP,UAAUnE,EAAE,GAAG;AAAAkG,QAAAA,aAAA7B,QAAA,MAwBjB,KAAKrE,EAAE,EAAE;AAAAkG,QAAAA,aAAA5B,QAAA,MAWX,KAAKtE,EAAE,EAAE;AAAAkG,QAAAA,aAAA3B,QAAA,UAOF,UAAUvE,EAAE,GAAG;AAAAkG,QAAAA,aAAA1B,QAAA,MAYtB,KAAKxE,EAAE,EAAE;AAAAkG,QAAAA,aAAAzB,QAAA,QAcP,UAAUzE,EAAE,GAAG;AAAAkG,QAAAA,aAAAzB,QAAA,QAGf,UAAUzE,EAAE,GAAG;AAAAkG,QAAAA,aAAAvB,QAAA,MAMf,KAAK3E,EAAE,EAAE;AAAAkG,QAAAA,aAAAtB,QAAA,MAWX,KAAK5E,EAAE,EAAE;AAAAkG,QAAAA,aAAArB,QAAA,UAOF,UAAU7E,EAAE,GAAG;AAAAkG,QAAAA,aAAApB,QAAA,QAWnB,UAAU9E,EAAE,GAAG;AAAAkG,QAAAA,aAAAlB,QAAA,MAGd,KAAKhF,EAAE,EAAE;AAAAkG,QAAAA,aAAAjB,QAAA,QAeP,UAAUjF,EAAE,GAAG;AAAAkG,QAAAA,aAAAhB,QAAA,MAKjB,KAAKlF,EAAE,EAAE;AAAAkG,QAAAA,aAAAf,QAAA,UAaL,UAAUnF,EAAE,GAAG;AAAAkG,QAAAA,aAAAd,QAAA,MAOnB,KAAKpF,EAAE,EAAE;AAAAkG,QAAAA,aAAAb,QAAA,UAaL,UAAUrF,EAAE,GAAG;AAAAkG,QAAAA,aAAAZ,QAAA,MAOnB,KAAKtF,EAAE,EAAE;AAAAkG,QAAAA,aAAAX,QAAA,UAaL,UAAUvF,EAAE,GAAG;AAAAkG,QAAAA,aAAAV,QAAA,MAOnB,KAAKxF,EAAE,EAAE;AAAAkG,QAAAA,aAAAT,QAAA,UAaL,UAAUzF,EAAE,GAAG;AAAAkG,QAAAA,aAAAR,QAAA,MAOnB,KAAK1F,EAAE,EAAE;AAAAkG,QAAAA,aAAAP,QAAA,UAaL,UAAU3F,EAAE,GAAG;AAAAkG,QAAAA,aAAAN,QAAA,MAOnB,KAAK5F,EAAE,EAAE;AAAAkG,QAAAA,aAAAL,QAAA,UAaL,UAAU7F,EAAE,GAAG;AAAAkG,QAAAA,aAAAJ,QAAA,MAOnB,KAAK9F,EAAE,EAAE;AAAAkG,QAAAA,aAAAH,QAAA,UAaL,UAAU/F,EAAE,GAAG;AAAAkG,QAAAA,aAAAF,QAAA,MAOnB,KAAKhG,EAAE,EAAE;AAAAkG,QAAAA,aAAAD,QAAA,UAaL,UAAUjG,EAAE,GAAG;AAAAmG,QAAAA,OAAA,MAAAD,IAAAA,aAAA9F,eAhyBxBF,OAAAA,EAASkG,IAAI,CAAA;AAAA,WAAAhG;AAAAA,EAAA,GAAA;AA2yB1B;;"}

package/dist/cjs/components/main-panel.cjs

@@ -11,12 +11,15 @@ const MainPanel = (props) => {
   const {
     height
   } = useDevtoolsContext.useHeight();
+  const {
+    settings
+  } = useDevtoolsContext.useDevtoolsSettings();
   return (() => {
     var _el$ = _tmpl$();
     web.setAttribute(_el$, "id", storage.TANSTACK_DEVTOOLS);
     web.insert(_el$, () => props.children);
     web.effect((_p$) => {
-      var _v$ = height() + "px", _v$2 = clsx(styles().devtoolsPanelContainer, styles().devtoolsPanelContainerAnimation(props.isOpen(), height()), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing));
+      var _v$ = height() + "px", _v$2 = clsx(styles().devtoolsPanelContainer(settings().panelLocation), styles().devtoolsPanelContainerAnimation(props.isOpen(), height()), styles().devtoolsPanelContainerVisibility(props.isOpen()), styles().devtoolsPanelContainerResizing(props.isResizing));
       _v$ !== _p$.e && ((_p$.e = _v$) != null ? _el$.style.setProperty("height", _v$) : _el$.style.removeProperty("height"));
       _v$2 !== _p$.t && web.className(_el$, _p$.t = _v$2);
       return _p$;

package/dist/cjs/components/main-panel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"main-panel.cjs","sources":["../../../src/components/main-panel.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useHeight } from '../context/use-devtools-context'\nimport { useStyles } from '../styles/use-styles'\nimport { TANSTACK_DEVTOOLS } from '../utils/storage'\nimport type { JSX } from 'solid-js/jsx-runtime'\nimport type { Accessor } from 'solid-js'\n\nexport const MainPanel = (props: {\n  isOpen: Accessor<boolean>\n  children: JSX.Element\n  isResizing: Accessor<boolean>\n}) => {\n  const styles = useStyles()\n  const { height } = useHeight()\n  return (\n    <div\n      id={TANSTACK_DEVTOOLS}\n      style={{\n        height: height() + 'px',\n      }}\n      class={clsx(\n        styles().devtoolsPanelContainer,\n        styles().devtoolsPanelContainerAnimation(props.isOpen(), height()),\n        styles().devtoolsPanelContainerVisibility(props.isOpen()),\n        styles().devtoolsPanelContainerResizing(props.isResizing),\n      )}\n    >\n      {props.children}\n    </div>\n  )\n}\n"],"names":["MainPanel","props","styles","useStyles","height","useHeight","_el$","_tmpl$","TANSTACK_DEVTOOLS","children","_$effect","_p$","_v$","_v$2","clsx","devtoolsPanelContainer","devtoolsPanelContainerAnimation","isOpen","devtoolsPanelContainerVisibility","devtoolsPanelContainerResizing","isResizing","e","style","setProperty","removeProperty","t","_$className","undefined"],"mappings":";;;;;;;;AAOaA,MAAAA,YAAYA,CAACC,UAIpB;AACJ,QAAMC,SAASC,UAAAA,UAAU;AACnB,QAAA;AAAA,IAAEC;AAAAA,MAAWC,6BAAU;AAC7B,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAA;AAAAD,qBAAAA,MAAA,MAEQE,yBAAiB;AAAAF,QAAAA,OAAAA,MAWpBL,MAAAA,MAAMQ,QAAQ;AAAAC,QAAAA,OAAAC,CAAA,QAAA;AAAA,UAAAC,MATLR,WAAW,MAAIS,OAElBC,KACLZ,OAAO,EAAEa,wBACTb,SAASc,gCAAgCf,MAAMgB,UAAUb,OAAQ,CAAA,GACjEF,SAASgB,iCAAiCjB,MAAMgB,QAAQ,GACxDf,OAAO,EAAEiB,+BAA+BlB,MAAMmB,UAAU,CAC1D;AAACR,cAAAD,IAAAU,OAAAV,IAAAU,IAAAT,QAAA,OAAAN,KAAAgB,MAAAC,YAAAX,UAAAA,GAAA,IAAAN,KAAAgB,MAAAE,eAAA,QAAA;AAAAX,eAAAF,IAAAc,KAAAC,IAAAA,UAAApB,MAAAK,IAAAc,IAAAZ,IAAA;AAAAF,aAAAA;AAAAA,IAAAA,GAAA;AAAA,MAAAU,GAAAM;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA;AAAArB,WAAAA;AAAAA,EAAAA,GAAA;AAKP;;"}
+{"version":3,"file":"main-panel.cjs","sources":["../../../src/components/main-panel.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useDevtoolsSettings, useHeight } from '../context/use-devtools-context'\nimport { useStyles } from '../styles/use-styles'\nimport { TANSTACK_DEVTOOLS } from '../utils/storage'\nimport type { JSX } from 'solid-js/jsx-runtime'\nimport type { Accessor } from 'solid-js'\n\nexport const MainPanel = (props: {\n  isOpen: Accessor<boolean>\n  children: JSX.Element\n  isResizing: Accessor<boolean>\n}) => {\n  const styles = useStyles()\n  const { height } = useHeight()\n  const { settings } = useDevtoolsSettings()\n  return (\n    <div\n      id={TANSTACK_DEVTOOLS}\n      style={{\n        height: height() + 'px',\n      }}\n      class={clsx(\n        styles().devtoolsPanelContainer(settings().panelLocation),\n        styles().devtoolsPanelContainerAnimation(props.isOpen(), height()),\n        styles().devtoolsPanelContainerVisibility(props.isOpen()),\n        styles().devtoolsPanelContainerResizing(props.isResizing),\n      )}\n    >\n      {props.children}\n    </div>\n  )\n}\n"],"names":["MainPanel","props","styles","useStyles","height","useHeight","settings","useDevtoolsSettings","_el$","_tmpl$","_$setAttribute","TANSTACK_DEVTOOLS","_$insert","children","_$effect","_p$","_v$","_v$2","clsx","devtoolsPanelContainer","panelLocation","devtoolsPanelContainerAnimation","isOpen","devtoolsPanelContainerVisibility","devtoolsPanelContainerResizing","isResizing","e","style","setProperty","removeProperty","t","_$className","undefined"],"mappings":";;;;;;;;AAOO,MAAMA,YAAYA,CAACC,UAIpB;AACJ,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAWC,6BAAAA;AACnB,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAaC,uCAAAA;AACrB,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA;AAAAC,qBAAAF,MAAA,MAEQG,yBAAiB;AAAAC,QAAAA,OAAAJ,MAAA,MAWpBP,MAAMY,QAAQ;AAAAC,QAAAA,OAAAC,CAAAA,QAAA;AAAA,UAAAC,MATLZ,OAAAA,IAAW,MAAIa,OAElBC,KACLhB,SAASiB,uBAAuBb,WAAWc,aAAa,GACxDlB,OAAAA,EAASmB,gCAAgCpB,MAAMqB,OAAAA,GAAUlB,OAAAA,CAAQ,GACjEF,OAAAA,EAASqB,iCAAiCtB,MAAMqB,OAAAA,CAAQ,GACxDpB,OAAAA,EAASsB,+BAA+BvB,MAAMwB,UAAU,CAC1D;AAACT,cAAAD,IAAAW,OAAAX,IAAAW,IAAAV,QAAA,OAAAR,KAAAmB,MAAAC,YAAA,UAAAZ,GAAA,IAAAR,KAAAmB,MAAAE,eAAA,QAAA;AAAAZ,eAAAF,IAAAe,KAAAC,IAAAA,UAAAvB,MAAAO,IAAAe,IAAAb,IAAA;AAAA,aAAAF;AAAAA,IAAA,GAAA;AAAA,MAAAW,GAAAM;AAAAA,MAAAF,GAAAE;AAAAA,IAAAA,CAAA;AAAA,WAAAxB;AAAAA,EAAA,GAAA;AAKP;;"}

package/dist/cjs/components/select.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const web = require("solid-js/web");
+const solidJs = require("solid-js");
+const useStyles = require("../styles/use-styles.cjs");
+var _tmpl$ = /* @__PURE__ */ web.template(`<div><div><select>`), _tmpl$2 = /* @__PURE__ */ web.template(`<label>`), _tmpl$3 = /* @__PURE__ */ web.template(`<p>`), _tmpl$4 = /* @__PURE__ */ web.template(`<option>`);
+function Select(props) {
+  const styles = useStyles.useStyles();
+  const [selected, setSelected] = solidJs.createSignal(props.value || props.options[0]?.value);
+  const handleChange = (e) => {
+    const value = e.target.value;
+    setSelected((prev) => prev !== value ? value : prev);
+    props.onChange?.(value);
+  };
+  return (() => {
+    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild;
+    web.insert(_el$2, (() => {
+      var _c$ = web.memo(() => !!props.label);
+      return () => _c$() && (() => {
+        var _el$4 = _tmpl$2();
+        web.insert(_el$4, () => props.label);
+        web.effect(() => web.className(_el$4, styles().selectLabel));
+        return _el$4;
+      })();
+    })(), _el$3);
+    web.insert(_el$2, (() => {
+      var _c$2 = web.memo(() => !!props.description);
+      return () => _c$2() && (() => {
+        var _el$5 = _tmpl$3();
+        web.insert(_el$5, () => props.description);
+        web.effect(() => web.className(_el$5, styles().selectDescription));
+        return _el$5;
+      })();
+    })(), _el$3);
+    _el$3.$$input = handleChange;
+    web.insert(_el$3, () => props.options.map((opt) => (() => {
+      var _el$6 = _tmpl$4();
+      web.insert(_el$6, () => opt.label);
+      web.effect(() => _el$6.value = opt.value);
+      return _el$6;
+    })()));
+    web.effect((_p$) => {
+      var _v$ = styles().selectContainer, _v$2 = styles().selectWrapper, _v$3 = styles().select;
+      _v$ !== _p$.e && web.className(_el$, _p$.e = _v$);
+      _v$2 !== _p$.t && web.className(_el$2, _p$.t = _v$2);
+      _v$3 !== _p$.a && web.className(_el$3, _p$.a = _v$3);
+      return _p$;
+    }, {
+      e: void 0,
+      t: void 0,
+      a: void 0
+    });
+    web.effect(() => _el$3.value = selected());
+    return _el$;
+  })();
+}
+web.delegateEvents(["input"]);
+exports.Select = Select;
+//# sourceMappingURL=select.cjs.map

package/dist/cjs/components/select.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.cjs","sources":["../../../src/components/select.tsx"],"sourcesContent":["import { createSignal } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\n\ninterface SelectOption<T extends string | number> {\n  value: T\n  label: string\n}\n\ninterface SelectProps<T extends string | number> {\n  label?: string\n  options: Array<SelectOption<T>>\n  value?: T\n  onChange?: (value: T) => void\n  description?: string\n}\n\nexport function Select<T extends string | number>(props: SelectProps<T>) {\n  const styles = useStyles()\n  const [selected, setSelected] = createSignal(\n    props.value || props.options[0]?.value,\n  )\n\n  const handleChange = (e: Event) => {\n    const value = (e.target as HTMLSelectElement).value as T\n    setSelected((prev) => (prev !== value ? value : prev))\n    props.onChange?.(value)\n  }\n\n  return (\n    <div class={styles().selectContainer}>\n      <div class={styles().selectWrapper}>\n        {props.label && (\n          <label class={styles().selectLabel}>{props.label}</label>\n        )}\n        {props.description && (\n          <p class={styles().selectDescription}>{props.description}</p>\n        )}\n        <select\n          class={styles().select}\n          value={selected()}\n          onInput={handleChange}\n        >\n          {props.options.map((opt) => (\n            <option value={opt.value}>{opt.label}</option>\n          ))}\n        </select>\n      </div>\n    </div>\n  )\n}\n"],"names":["Select","props","styles","useStyles","selected","setSelected","createSignal","value","options","handleChange","e","target","prev","onChange","_el$","_tmpl$","_el$2","firstChild","_el$3","_$insert","_c$","_$memo","label","_el$4","_tmpl$2","_$effect","_$className","selectLabel","_c$2","description","_el$5","_tmpl$3","selectDescription","$$input","map","opt","_el$6","_tmpl$4","_p$","_v$","selectContainer","_v$2","selectWrapper","_v$3","select","t","a","undefined","_$delegateEvents"],"mappings":";;;;;;AAgBO,SAASA,OAAkCC,OAAuB;AACvE,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM,CAACC,UAAUC,WAAW,IAAIC,qBAC9BL,MAAMM,SAASN,MAAMO,QAAQ,CAAC,GAAGD,KACnC;AAEA,QAAME,eAAeA,CAACC,MAAa;AACjC,UAAMH,QAASG,EAAEC,OAA6BJ;AAC9CF,gBAAaO,CAAAA,SAAUA,SAASL,QAAQA,QAAQK,IAAK;AACrDX,UAAMY,WAAWN,KAAK;AAAA,EACxB;AAEA,UAAA,MAAA;AAAA,QAAAO,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG,YAAAC,QAAAF,MAAAC;AAAAE,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAI,MAAAC,IAAAA,KAAA,MAAA,CAAA,CAGOpB,MAAMqB,KAAK;AAAA,aAAA,MAAXF,IAAAA,MAAA,MAAA;AAAA,YAAAG,QAAAC,QAAAA;AAAAL,YAAAA,OAAAI,OAAA,MACsCtB,MAAMqB,KAAK;AAAAG,YAAAA,OAAA,MAAAC,IAAAA,UAAAH,OAAlCrB,OAAAA,EAASyB,WAAW,CAAA;AAAA,eAAAJ;AAAAA,MAAA,GAAA;AAAA,IACnC,GAAA,GAAAL,KAAA;AAAAC,QAAAA,OAAAH,QAAA,MAAA;AAAA,UAAAY,OAAAP,IAAAA,KAAA,MAAA,CAAA,CACApB,MAAM4B,WAAW;AAAA,aAAA,MAAjBD,KAAAA,MAAA,MAAA;AAAA,YAAAE,QAAAC,QAAAA;AAAAZ,YAAAA,OAAAW,OAAA,MACwC7B,MAAM4B,WAAW;AAAAJ,YAAAA,OAAA,MAAAC,IAAAA,UAAAI,OAA9C5B,OAAAA,EAAS8B,iBAAiB,CAAA;AAAA,eAAAF;AAAAA,MAAA,GAAA;AAAA,IACrC,GAAA,GAAAZ,KAAA;AAAAA,UAAAe,UAIUxB;AAAYU,QAAAA,OAAAD,OAAA,MAEpBjB,MAAMO,QAAQ0B,IAAKC,UAAG,MAAA;AAAA,UAAAC,QAAAC,QAAAA;AAAAlB,UAAAA,OAAAiB,OAAA,MACMD,IAAIb,KAAK;AAAAG,UAAAA,aAAAW,MAAA7B,QAArB4B,IAAI5B,KAAK;AAAA,aAAA6B;AAAAA,IAAA,GAAA,CACzB,CAAC;AAAAX,QAAAA,OAAAa,CAAAA,QAAA;AAAA,UAAAC,MAfIrC,SAASsC,iBAAeC,OACtBvC,SAASwC,eAAaC,OAQvBzC,OAAAA,EAAS0C;AAAML,cAAAD,IAAA5B,KAAAgB,IAAAA,UAAAZ,MAAAwB,IAAA5B,IAAA6B,GAAA;AAAAE,eAAAH,IAAAO,KAAAnB,IAAAA,UAAAV,OAAAsB,IAAAO,IAAAJ,IAAA;AAAAE,eAAAL,IAAAQ,KAAApB,IAAAA,UAAAR,OAAAoB,IAAAQ,IAAAH,IAAA;AAAA,aAAAL;AAAAA,IAAA,GAAA;AAAA,MAAA5B,GAAAqC;AAAAA,MAAAF,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA;AAAAtB,QAAAA,aAAAP,MAAAX,QACfH,SAAAA,CAAU;AAAA,WAAAU;AAAAA,EAAA,GAAA;AAU3B;AAACkC,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}

package/dist/cjs/components/select.d.cts

@@ -0,0 +1,13 @@
+interface SelectOption<T extends string | number> {
+    value: T;
+    label: string;
+}
+interface SelectProps<T extends string | number> {
+    label?: string;
+    options: Array<SelectOption<T>>;
+    value?: T;
+    onChange?: (value: T) => void;
+    description?: string;
+}
+export declare function Select<T extends string | number>(props: SelectProps<T>): import("solid-js").JSX.Element;
+export {};

package/dist/cjs/components/tab-content.cjs

@@ -7,15 +7,13 @@ const index = require("../tabs/index.cjs");
 const useStyles = require("../styles/use-styles.cjs");
 var _tmpl$ = /* @__PURE__ */ web.template(`<div>`);
 const TabContent = () => {
-  var _a;
   const {
     state
   } = useDevtoolsContext.useDevtoolsState();
   const styles = useStyles.useStyles();
-  const [component, setComponent] = solidJs.createSignal(((_a = index.tabs.find((t) => t.id === state().activeTab)) == null ? void 0 : _a.component()) || null);
+  const [component, setComponent] = solidJs.createSignal(index.tabs.find((t) => t.id === state().activeTab)?.component() || null);
   solidJs.createEffect(() => {
-    var _a2;
-    setComponent(((_a2 = index.tabs.find((t) => t.id === state().activeTab)) == null ? void 0 : _a2.component()) || null);
+    setComponent(index.tabs.find((t) => t.id === state().activeTab)?.component() || null);
   });
   return (() => {
     var _el$ = _tmpl$();

package/dist/cjs/components/tab-content.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tab-content.cjs","sources":["../../../src/components/tab-content.tsx"],"sourcesContent":["import { createEffect, createSignal } from 'solid-js'\nimport { useDevtoolsState } from '../context/use-devtools-context'\nimport { tabs } from '../tabs'\nimport { useStyles } from '../styles/use-styles'\nimport type { JSX } from 'solid-js'\n\nexport const TabContent = () => {\n  const { state } = useDevtoolsState()\n  const styles = useStyles()\n  const [component, setComponent] = createSignal<JSX.Element | null>(\n    tabs.find((t) => t.id === state().activeTab)?.component() || null,\n  )\n  createEffect(() => {\n    setComponent(\n      tabs.find((t) => t.id === state().activeTab)?.component() || null,\n    )\n  })\n\n  return <div class={styles().tabContent}>{component()}</div>\n}\n"],"names":["TabContent","state","useDevtoolsState","styles","useStyles","component","setComponent","createSignal","tabs","find","t","id","activeTab","createEffect","_el$","_tmpl$","_$insert","_$effect","_$className","tabContent"],"mappings":";;;;;;;;AAMO,MAAMA,aAAaA,MAAM;;AACxB,QAAA;AAAA,IAAEC;AAAAA,MAAUC,oCAAiB;AACnC,QAAMC,SAASC,UAAAA,UAAU;AACzB,QAAM,CAACC,WAAWC,YAAY,IAAIC,QAAAA,eAChCC,WAAAA,KAAKC,KAAMC,CAAAA,MAAMA,EAAEC,OAAOV,MAAQW,EAAAA,SAAS,MAA3CJ,mBAA8CH,gBAAe,IAC/D;AACAQ,UAAAA,aAAa,MAAM;;AAEfL,mBAAAA,MAAAA,MAAAA,KAAKC,KAAMC,CAAAA,MAAMA,EAAEC,OAAOV,MAAM,EAAEW,SAAS,MAA3CJ,gBAAAA,IAA8CH,gBAAe,IAC/D;AAAA,EAAA,CACD;AAED,UAAA,MAAA;AAAA,QAAAS,OAAAC,OAAA;AAAAC,QAAAA,OAAAF,MAAyCT,SAAS;AAAAY,QAAAA,OAAA,MAAAC,IAAAA,UAAAJ,MAA/BX,OAAO,EAAEgB,UAAU,CAAA;AAAAL,WAAAA;AAAAA,EAAAA,GAAA;AACxC;;"}
+{"version":3,"file":"tab-content.cjs","sources":["../../../src/components/tab-content.tsx"],"sourcesContent":["import { createEffect, createSignal } from 'solid-js'\nimport { useDevtoolsState } from '../context/use-devtools-context'\nimport { tabs } from '../tabs'\nimport { useStyles } from '../styles/use-styles'\nimport type { JSX } from 'solid-js'\n\nexport const TabContent = () => {\n  const { state } = useDevtoolsState()\n  const styles = useStyles()\n  const [component, setComponent] = createSignal<JSX.Element | null>(\n    tabs.find((t) => t.id === state().activeTab)?.component() || null,\n  )\n  createEffect(() => {\n    setComponent(\n      tabs.find((t) => t.id === state().activeTab)?.component() || null,\n    )\n  })\n\n  return <div class={styles().tabContent}>{component()}</div>\n}\n"],"names":["TabContent","state","useDevtoolsState","styles","useStyles","component","setComponent","createSignal","tabs","find","t","id","activeTab","createEffect","_el$","_tmpl$","_$insert","_$effect","_$className","tabContent"],"mappings":";;;;;;;;AAMO,MAAMA,aAAaA,MAAM;AAC9B,QAAM;AAAA,IAAEC;AAAAA,EAAAA,IAAUC,oCAAAA;AAClB,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM,CAACC,WAAWC,YAAY,IAAIC,QAAAA,aAChCC,MAAAA,KAAKC,KAAMC,CAAAA,MAAMA,EAAEC,OAAOV,QAAQW,SAAS,GAAGP,UAAAA,KAAe,IAC/D;AACAQ,UAAAA,aAAa,MAAM;AACjBP,iBACEE,MAAAA,KAAKC,KAAMC,CAAAA,MAAMA,EAAEC,OAAOV,MAAAA,EAAQW,SAAS,GAAGP,UAAAA,KAAe,IAC/D;AAAA,EACF,CAAC;AAED,UAAA,MAAA;AAAA,QAAAS,OAAAC,OAAAA;AAAAC,QAAAA,OAAAF,MAAyCT,SAAS;AAAAY,QAAAA,OAAA,MAAAC,IAAAA,UAAAJ,MAA/BX,OAAAA,EAASgB,UAAU,CAAA;AAAA,WAAAL;AAAAA,EAAA,GAAA;AACxC;;"}

package/dist/cjs/components/tabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.cjs","sources":["../../../src/components/tabs.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { For } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\nimport { useDevtoolsState } from '../context/use-devtools-context'\nimport { tabs } from '../tabs'\n\ninterface TabsProps {\n  toggleOpen: () => void\n}\n\nexport const Tabs = (props: TabsProps) => {\n  const styles = useStyles()\n  const { state, setState } = useDevtoolsState()\n\n  return (\n    <div class={styles().tabContainer}>\n      <For each={tabs}>\n        {(tab) => (\n          <button\n            type=\"button\"\n            onClick={() => setState({ activeTab: tab.id })}\n            class={clsx(styles().tab, { active: state().activeTab === tab.id })}\n          >\n            {tab.icon}\n          </button>\n        )}\n      </For>\n      <button\n        type=\"button\"\n        class={clsx(styles().tab, 'close')}\n        onClick={() => props.toggleOpen()}\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        >\n          <path d=\"M18 6 6 18\" />\n          <path d=\"m6 6 12 12\" />\n        </svg>\n      </button>\n    </div>\n  )\n}\n"],"names":["Tabs","props","styles","useStyles","state","setState","useDevtoolsState","_el$","_tmpl$","_el$2","firstChild","_$createComponent","For","each","tabs","children","tab","_el$3","_tmpl$2","$$click","activeTab","id","icon","_$effect","_$className","clsx","active","toggleOpen","_p$","_v$","tabContainer","_v$2","e","t","undefined","_$delegateEvents"],"mappings":";;;;;;;;;AAUaA,MAAAA,OAAOA,CAACC,UAAqB;AACxC,QAAMC,SAASC,UAAAA,UAAU;AACnB,QAAA;AAAA,IAAEC;AAAAA,IAAOC;AAAAA,MAAaC,oCAAiB;AAE7C,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG;AAAAH,eAAAA,MAAAI,oBAEKC,aAAG;AAAA,MAACC,MAAMC,MAAAA;AAAAA,MAAIC,UACXC,UAAG,MAAA;AAAA,YAAAC,QAAAC,QAAA;AAAAC,cAAAA,UAGQ,MAAMd,SAAS;AAAA,UAAEe,WAAWJ,IAAIK;AAAAA,QAAAA,CAAI;AAACJ,YAAAA,OAAAA,OAG7CD,MAAAA,IAAIM,IAAI;AAAAC,YAAAA,OAAAC,MAAAA,IAAAA,UAAAP,OAFFQ,KAAKvB,SAASc,KAAK;AAAA,UAAEU,QAAQtB,MAAAA,EAAQgB,cAAcJ,IAAIK;AAAAA,QAAI,CAAA,CAAC,CAAA;AAAAJ,eAAAA;AAAAA,MAAA,GAAA;AAAA,IAItE,CAAA,GAAAR,KAAA;AAAAU,UAAAA,UAKQ,MAAMlB,MAAM0B,WAAW;AAACJ,QAAAA,OAAAK,CAAA,QAAA;AAAAC,UAAAA,MAfzB3B,OAAS4B,EAAAA,cAAYC,OActBN,KAAKvB,OAAAA,EAASc,KAAK,OAAO;AAACa,cAAAD,IAAAI,KAAAR,IAAAA,UAAAjB,MAAAqB,IAAAI,IAAAH,GAAA;AAAAE,eAAAH,IAAAK,KAAAT,IAAAA,UAAAf,OAAAmB,IAAAK,IAAAF,IAAA;AAAAH,aAAAA;AAAAA,IAAAA,GAAA;AAAA,MAAAI,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA;AAAA3B,WAAAA;AAAAA,EAAAA,GAAA;AAoB1C;AAAC4B,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}
+{"version":3,"file":"tabs.cjs","sources":["../../../src/components/tabs.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { For } from 'solid-js'\nimport { useStyles } from '../styles/use-styles'\nimport { useDevtoolsState } from '../context/use-devtools-context'\nimport { tabs } from '../tabs'\n\ninterface TabsProps {\n  toggleOpen: () => void\n}\n\nexport const Tabs = (props: TabsProps) => {\n  const styles = useStyles()\n  const { state, setState } = useDevtoolsState()\n\n  return (\n    <div class={styles().tabContainer}>\n      <For each={tabs}>\n        {(tab) => (\n          <button\n            type=\"button\"\n            onClick={() => setState({ activeTab: tab.id })}\n            class={clsx(styles().tab, { active: state().activeTab === tab.id })}\n          >\n            {tab.icon}\n          </button>\n        )}\n      </For>\n      <button\n        type=\"button\"\n        class={clsx(styles().tab, 'close')}\n        onClick={() => props.toggleOpen()}\n      >\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"24\"\n          height=\"24\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n        >\n          <path d=\"M18 6 6 18\" />\n          <path d=\"m6 6 12 12\" />\n        </svg>\n      </button>\n    </div>\n  )\n}\n"],"names":["Tabs","props","styles","useStyles","state","setState","useDevtoolsState","_el$","_tmpl$","_el$2","firstChild","_$insert","_$createComponent","For","each","tabs","children","tab","_el$3","_tmpl$2","$$click","activeTab","id","icon","_$effect","_$className","clsx","active","toggleOpen","_p$","_v$","tabContainer","_v$2","e","t","undefined","_$delegateEvents"],"mappings":";;;;;;;;;AAUO,MAAMA,OAAOA,CAACC,UAAqB;AACxC,QAAMC,SAASC,UAAAA,UAAAA;AACf,QAAM;AAAA,IAAEC;AAAAA,IAAOC;AAAAA,EAAAA,IAAaC,oCAAAA;AAE5B,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA,GAAAC,QAAAF,KAAAG;AAAAC,eAAAJ,MAAAK,IAAAA,gBAEKC,aAAG;AAAA,MAACC,MAAMC,MAAAA;AAAAA,MAAIC,UACXC,UAAG,MAAA;AAAA,YAAAC,QAAAC,QAAAA;AAAAD,cAAAE,UAGQ,MAAMf,SAAS;AAAA,UAAEgB,WAAWJ,IAAIK;AAAAA,QAAAA,CAAI;AAACX,YAAAA,OAAAO,OAAA,MAG7CD,IAAIM,IAAI;AAAAC,YAAAA,OAAA,MAAAC,IAAAA,UAAAP,OAFFQ,KAAKxB,OAAAA,EAASe,KAAK;AAAA,UAAEU,QAAQvB,MAAAA,EAAQiB,cAAcJ,IAAIK;AAAAA,QAAAA,CAAI,CAAC,CAAA;AAAA,eAAAJ;AAAAA,MAAA,GAAA;AAAA,IAAA,CAItE,GAAAT,KAAA;AAAAA,UAAAW,UAKQ,MAAMnB,MAAM2B,WAAAA;AAAYJ,QAAAA,OAAAK,CAAAA,QAAA;AAAA,UAAAC,MAfzB5B,SAAS6B,cAAYC,OActBN,KAAKxB,OAAAA,EAASe,KAAK,OAAO;AAACa,cAAAD,IAAAI,KAAAR,IAAAA,UAAAlB,MAAAsB,IAAAI,IAAAH,GAAA;AAAAE,eAAAH,IAAAK,KAAAT,IAAAA,UAAAhB,OAAAoB,IAAAK,IAAAF,IAAA;AAAA,aAAAH;AAAAA,IAAA,GAAA;AAAA,MAAAI,GAAAE;AAAAA,MAAAD,GAAAC;AAAAA,IAAAA,CAAA;AAAA,WAAA5B;AAAAA,EAAA,GAAA;AAoB1C;AAAC6B,IAAAA,eAAA,CAAA,OAAA,CAAA;;"}