npm - @tanstack/devtools-ui - Versions diffs - 0.3.4 → 0.4.0 - Mend

@tanstack/devtools-ui 0.3.4 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/esm/components/tree.d.ts +5 -2
package/dist/esm/components/tree.js +266 -181
package/dist/esm/components/tree.js.map +1 -1
package/dist/esm/styles/use-styles.js +5 -2
package/dist/esm/styles/use-styles.js.map +1 -1
package/dist/esm/utils/deep-keys.d.ts +5 -0
package/package.json +3 -3
package/src/components/tree.tsx +223 -97
package/src/styles/use-styles.ts +6 -2
package/src/utils/deep-keys.ts +18 -0

package/dist/esm/components/tree.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tree.js","sources":["../../../src/components/tree.tsx"],"sourcesContent":["import { For, Match, Show, Switch, createSignal } from 'solid-js'\nimport clsx from 'clsx'\nimport { css, useStyles } from '../styles/use-styles'\nimport { CopiedCopier, Copier, ErrorCopier } from './icons'\n\nexport function JsonTree(props: { value: any; copyable?: boolean }) {\n return <JsonValue isRoot value={props.value} copyable={props.copyable} />\n}\ntype CopyState = 'NoCopy' \| 'SuccessCopy' \| 'ErrorCopy'\n\nconst CopyButton = (props: { value: unknown }) => {\n const styles = useStyles()\n const [copyState, setCopyState] = createSignal<CopyState>('NoCopy')\n\n return (\n <button\n class={styles().tree.actionButton}\n title=\"Copy object to clipboard\"\n aria-label={`${\n copyState() === 'NoCopy'\n ? 'Copy object to clipboard'\n : copyState() === 'SuccessCopy'\n ? 'Object copied to clipboard'\n : 'Error copying object to clipboard'\n }`}\n onClick={\n copyState() === 'NoCopy'\n ? () => {\n navigator.clipboard\n .writeText(JSON.stringify(props.value, null, 2))\n .then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n >\n <Switch>\n <Match when={copyState() === 'NoCopy'}>\n <Copier />\n </Match>\n <Match when={copyState() === 'SuccessCopy'}>\n <CopiedCopier theme={'dark'} />\n </Match>\n <Match when={copyState() === 'ErrorCopy'}>\n <ErrorCopier />\n </Match>\n </Switch>\n </button>\n )\n}\n\nconst Expander = (props: { expanded: boolean }) => {\n const styles = useStyles()\n return (\n <span\n class={clsx(\n styles().tree.expander,\n css`\n transform: rotate(${props.expanded ? 90 : 0}deg);\n `,\n props.expanded &&\n css`\n & svg {\n top: -1px;\n }\n `,\n )}\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M6 12L10 8L6 4\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n )\n}\n\nfunction JsonValue(props: {\n value: any\n keyName?: string\n isRoot?: boolean\n isLastKey?: boolean\n copyable?: boolean\n}) {\n const { value, keyName, isRoot = false, isLastKey, copyable } = props\n const styles = useStyles()\n\n return (\n <span class={styles().tree.valueContainer(isRoot)}>\n {keyName && typeof value !== 'object' && !Array.isArray(value) && (\n <span class={styles().tree.valueKey}>"{keyName}": </span>\n )}\n {(() => {\n if (typeof value === 'string') {\n return (\n <span class={styles().tree.valueString}>"{value}"</span>\n )\n }\n if (typeof value === 'number') {\n return <span class={styles().tree.valueNumber}>{value}</span>\n }\n if (typeof value === 'boolean') {\n return <span class={styles().tree.valueBoolean}>{String(value)}</span>\n }\n if (value === null) {\n return <span class={styles().tree.valueNull}>null</span>\n }\n if (value === undefined) {\n return <span class={styles().tree.valueNull}>undefined</span>\n }\n if (typeof value === 'function') {\n return (\n <span class={styles().tree.valueFunction}>{String(value)}</span>\n )\n }\n if (Array.isArray(value)) {\n return (\n <ArrayValue copyable={copyable} keyName={keyName} value={value} />\n )\n }\n if (typeof value === 'object') {\n return (\n <ObjectValue copyable={copyable} keyName={keyName} value={value} />\n )\n }\n return <span />\n })()}\n {copyable && (\n <div class={clsx(styles().tree.actions, 'actions')}>\n <CopyButton value={value} />\n </div>\n )}\n {isLastKey \|\| isRoot ? '' : <span>,</span>}\n </span>\n )\n}\n\nconst ArrayValue = ({\n value,\n keyName,\n copyable,\n}: {\n value: Array<any>\n copyable?: boolean\n keyName?: string\n}) => {\n const styles = useStyles()\n const [expanded, setExpanded] = createSignal(true)\n return (\n <span class={styles().tree.expanderContainer}>\n <Expander expanded={expanded()} />\n {keyName && (\n <span\n onclick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n "{keyName}":{' '}\n <span class={styles().tree.info}>{value.length} items</span>\n </span>\n )}\n <span class={styles().tree.valueBraces}>[</span>\n <Show when={expanded()}>\n <span class={styles().tree.expandedLine(Boolean(keyName))}>\n <For each={value}>\n {(item, i) => {\n const isLastKey = i() === value.length - 1\n return (\n <JsonValue\n copyable={copyable}\n value={item}\n isLastKey={isLastKey}\n />\n )\n }}\n </For>\n </span>\n </Show>\n <Show when={!expanded()}>\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n {`...`}\n </span>\n </Show>\n <span class={styles().tree.valueBraces}>]</span>\n </span>\n )\n}\n\nconst ObjectValue = ({\n value,\n keyName,\n copyable,\n}: {\n value: Record<string, any>\n keyName?: string\n copyable?: boolean\n}) => {\n const styles = useStyles()\n const [expanded, setExpanded] = createSignal(true)\n const keys = Object.keys(value)\n const lastKeyName = keys[keys.length - 1]\n\n return (\n <span class={styles().tree.expanderContainer}>\n {keyName && <Expander expanded={expanded()} />}\n {keyName && (\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n "{keyName}":{' '}\n <span class={styles().tree.info}>{keys.length} items</span>\n </span>\n )}\n <span class={styles().tree.valueBraces}>{'{'}</span>\n <Show when={expanded()}>\n <span class={styles().tree.expandedLine(Boolean(keyName))}>\n <For each={keys}>\n {(k) => (\n <>\n <JsonValue\n value={value[k]}\n keyName={k}\n isLastKey={lastKeyName === k}\n copyable={copyable}\n />\n </>\n )}\n </For>\n </span>\n </Show>\n <Show when={!expanded()}>\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n {`...`}\n </span>\n </Show>\n <span class={styles().tree.valueBraces}>{'}'}</span>\n </span>\n )\n}\n"],"names":["JsonTree","props","_$createComponent","JsonValue","isRoot","value","copyable","CopyButton","styles","useStyles","copyState","setCopyState","createSignal","_el$","_tmpl$","_$addEventListener","navigator","clipboard","writeText","JSON","stringify","then","setTimeout","err","console","error","undefined","_$insert","Switch","children","Match","when","Copier","CopiedCopier","theme","ErrorCopier","_$effect","_p$","_v$","tree","actionButton","_v$2","e","_$className","t","_$setAttribute","Expander","_el$2","_tmpl$2","clsx","expander","css","expanded","keyName","isLastKey","_el$3","_tmpl$3","_c$","_$memo","Array","isArray","_el$4","_tmpl$4","_el$5","firstChild","_el$7","nextSibling","valueKey","_el$8","_tmpl$5","_el$9","_el$1","valueString","_el$10","valueNumber","_el$11","String","valueBoolean","_el$12","_tmpl$6","valueNull","_el$13","_tmpl$7","_el$14","valueFunction","ArrayValue","ObjectValue","_el$16","_tmpl$8","actions","_tmpl$9","valueContainer","setExpanded","_el$18","_tmpl$1","_el$19","_el$22","_el$23","_tmpl$10","_el$24","_el$29","_el$25","_el$27","_el$28","$$click","stopPropagation","stopImmediatePropagation","length","_v$6","collapsible","_v$7","info","Show","_el$20","For","each","item","i","expandedLine","Boolean","_el$21","_tmpl$0","_v$3","expanderContainer","_v$4","valueBraces","_v$5","a","keys","Object","lastKeyName","_el$30","_tmpl$11","_el$31","_el$34","_el$35","_el$36","_el$41","_el$37","_el$39","_el$40","_v$1","_v$10","_el$32","k","_el$33","_v$8","_v$9","_v$0","_$delegateEvents"],"mappings":";;;;;;AAKO,SAASA,SAASC,OAA2C;AAClE,SAAAC,gBAAQC,WAAS;AAAA,IAACC,QAAM;AAAA,IAAA,IAACC,QAAK;AAAA,aAAEJ,MAAMI;AAAAA,IAAK;AAAA,IAAA,IAAEC,WAAQ;AAAA,aAAEL,MAAMK;AAAAA,IAAQ;AAAA,EAAA,CAAA;AACvE;AAGA,MAAMC,aAAaA,CAACN,UAA8B;AAChD,QAAMO,SAASC,UAAAA;AACf,QAAM,CAACC,WAAWC,YAAY,IAAIC,aAAwB,QAAQ;AAElE,UAAA,MAAA;AAAA,QAAAC,OAAAC,OAAAA;AAAAC,qBAAAF,MAAA,SAYMH,UAAAA,MAAgB,WACZ,MAAM;AACJM,gBAAUC,UACPC,UAAUC,KAAKC,UAAUnB,MAAMI,OAAO,MAAM,CAAC,CAAC,EAC9CgB,KACC,MAAM;AACJV,qBAAa,aAAa;AAC1BW,mBAAW,MAAM;AACfX,uBAAa,QAAQ;AAAA,QACvB,GAAG,IAAI;AAAA,MACT,GACCY,CAAAA,QAAQ;AACPC,gBAAQC,MAAM,oBAAoBF,GAAG;AACrCZ,qBAAa,WAAW;AACxBW,mBAAW,MAAM;AACfX,uBAAa,QAAQ;AAAA,QACvB,GAAG,IAAI;AAAA,MACT,CACF;AAAA,IACJ,IACAe,QAAS,IAAA;AAAAC,WAAAd,MAAAX,gBAGd0B,QAAM;AAAA,MAAA,IAAAC,WAAA;AAAA,eAAA,CAAA3B,gBACJ4B,OAAK;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAErB,gBAAgB;AAAA,UAAQ;AAAA,UAAA,IAAAmB,WAAA;AAAA,mBAAA3B,gBAClC8B,QAAM,EAAA;AAAA,UAAA;AAAA,QAAA,CAAA,GAAA9B,gBAER4B,OAAK;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAErB,gBAAgB;AAAA,UAAa;AAAA,UAAA,IAAAmB,WAAA;AAAA,mBAAA3B,gBACvC+B,cAAY;AAAA,cAACC,OAAO;AAAA,YAAA,CAAM;AAAA,UAAA;AAAA,QAAA,CAAA,GAAAhC,gBAE5B4B,OAAK;AAAA,UAAA,IAACC,OAAI;AAAA,mBAAErB,gBAAgB;AAAA,UAAW;AAAA,UAAA,IAAAmB,WAAA;AAAA,mBAAA3B,gBACrCiC,aAAW,EAAA;AAAA,UAAA;AAAA,QAAA,CAAA,CAAA;AAAA,MAAA;AAAA,IAAA,CAAA,CAAA;AAAAC,WAAAC,CAAAA,QAAA;AAAA,UAAAC,MAzCT9B,OAAAA,EAAS+B,KAAKC,cAAYC,OAErB,GACV/B,UAAAA,MAAgB,WACZ,6BACAA,UAAAA,MAAgB,gBACd,+BACA,mCAAmC;AACzC4B,cAAAD,IAAAK,KAAAC,UAAA9B,MAAAwB,IAAAK,IAAAJ,GAAA;AAAAG,eAAAJ,IAAAO,KAAAC,aAAAhC,MAAA,cAAAwB,IAAAO,IAAAH,IAAA;AAAA,aAAAJ;AAAAA,IAAA,GAAA;AAAA,MAAAK,GAAAhB;AAAAA,MAAAkB,GAAAlB;AAAAA,IAAAA,CAAA;AAAA,WAAAb;AAAAA,EAAA,GAAA;AAsCR;AAEA,MAAMiC,WAAWA,CAAC7C,UAAiC;AACjD,QAAMO,SAASC,UAAAA;AACf,UAAA,MAAA;AAAA,QAAAsC,QAAAC,QAAAA;AAAAZ,WAAA,MAAAO,UAAAI,OAEWE,KACLzC,SAAS+B,KAAKW,UACdC;AAAAA,8BACsBlD,MAAMmD,WAAW,KAAK,CAAC;AAAA,WAE7CnD,MAAMmD,YACJD;AAAAA;AAAAA;AAAAA;AAAAA,WAKJ,CAAC,CAAA;AAAA,WAAAJ;AAAAA,EAAA,GAAA;AAkBP;AAEA,SAAS5C,UAAUF,OAMhB;AACD,QAAM;AAAA,IAAEI;AAAAA,IAAOgD;AAAAA,IAASjD,SAAS;AAAA,IAAOkD;AAAAA,IAAWhD;AAAAA,EAAAA,IAAaL;AAChE,QAAMO,SAASC,UAAAA;AAEf,UAAA,MAAA;AAAA,QAAA8C,QAAAC,QAAAA;AAAA7B,WAAA4B,QAAA,MAAA;AAAA,UAAAE,MAAAC,KAAA,MAAA,CAAA,EAEKL,WAAW,OAAOhD,UAAU,YAAY,CAACsD,MAAMC,QAAQvD,KAAK,EAAC;AAAA,aAAA,MAA7DoD,IAAAA,MAAA,MAAA;AAAA,YAAAI,QAAAC,WAAAC,QAAAF,MAAAG,YAAAC,QAAAF,MAAAG;AAAAD,cAAAC;AAAAvC,eAAAkC,OAC6CR,SAAOY,KAAA;AAAA7B,eAAA,MAAAO,UAAAkB,OAAtCrD,SAAS+B,KAAK4B,QAAQ,CAAA;AAAA,eAAAN;AAAAA,MAAA,GAAA;AAAA,IACpC,GAAA,GAAA,IAAA;AAAAlC,WAAA4B,OACC,MAAM;AACN,UAAI,OAAOlD,UAAU,UAAU;AAC7B,gBAAA,MAAA;AAAA,cAAA+D,QAAAC,WAAAC,QAAAF,MAAAJ,YAAAO,QAAAD,MAAAJ;AAAAK,gBAAAL;AAAAvC,iBAAAyC,OACiD/D,OAAKkE,KAAA;AAAAnC,iBAAA,MAAAO,UAAAyB,OAAvC5D,SAAS+B,KAAKiC,WAAW,CAAA;AAAA,iBAAAJ;AAAAA,QAAA,GAAA;AAAA,MAE1C;AACA,UAAI,OAAO/D,UAAU,UAAU;AAC7B,gBAAA,MAAA;AAAA,cAAAoE,SAAAjB,QAAAA;AAAA7B,iBAAA8C,QAAgDpE,KAAK;AAAA+B,iBAAA,MAAAO,UAAA8B,QAAjCjE,SAAS+B,KAAKmC,WAAW,CAAA;AAAA,iBAAAD;AAAAA,QAAA,GAAA;AAAA,MAC/C;AACA,UAAI,OAAOpE,UAAU,WAAW;AAC9B,gBAAA,MAAA;AAAA,cAAAsE,SAAAnB,QAAAA;AAAA7B,iBAAAgD,QAAA,MAAiDC,OAAOvE,KAAK,CAAC;AAAA+B,iBAAA,MAAAO,UAAAgC,QAA1CnE,SAAS+B,KAAKsC,YAAY,CAAA;AAAA,iBAAAF;AAAAA,QAAA,GAAA;AAAA,MAChD;AACA,UAAItE,UAAU,MAAM;AAClB,gBAAA,MAAA;AAAA,cAAAyE,SAAAC,QAAAA;AAAA3C,iBAAA,MAAAO,UAAAmC,QAAoBtE,SAAS+B,KAAKyC,SAAS,CAAA;AAAA,iBAAAF;AAAAA,QAAA,GAAA;AAAA,MAC7C;AACA,UAAIzE,UAAUqB,QAAW;AACvB,gBAAA,MAAA;AAAA,cAAAuD,SAAAC,QAAAA;AAAA9C,iBAAA,MAAAO,UAAAsC,QAAoBzE,SAAS+B,KAAKyC,SAAS,CAAA;AAAA,iBAAAC;AAAAA,QAAA,GAAA;AAAA,MAC7C;AACA,UAAI,OAAO5E,UAAU,YAAY;AAC/B,gBAAA,MAAA;AAAA,cAAA8E,SAAA3B,QAAAA;AAAA7B,iBAAAwD,QAAA,MAC6CP,OAAOvE,KAAK,CAAC;AAAA+B,iBAAA,MAAAO,UAAAwC,QAA3C3E,SAAS+B,KAAK6C,aAAa,CAAA;AAAA,iBAAAD;AAAAA,QAAA,GAAA;AAAA,MAE5C;AACA,UAAIxB,MAAMC,QAAQvD,KAAK,GAAG;AACxB,eAAAH,gBACGmF,YAAU;AAAA,UAAC/E;AAAAA,UAAoB+C;AAAAA,UAAkBhD;AAAAA,QAAAA,CAAY;AAAA,MAElE;AACA,UAAI,OAAOA,UAAU,UAAU;AAC7B,eAAAH,gBACGoF,aAAW;AAAA,UAAChF;AAAAA,UAAoB+C;AAAAA,UAAkBhD;AAAAA,QAAAA,CAAY;AAAA,MAEnE;AACA,aAAAmD,QAAAA;AAAAA,IACF,GAAC,IAAA;AAAA7B,WAAA4B,OACAjD,aAAQ,MAAA;AAAA,UAAAiF,SAAAC,QAAAA;AAAA7D,aAAA4D,QAAArF,gBAEJK,YAAU;AAAA,QAACF;AAAAA,MAAAA,CAAY,CAAA;AAAA+B,mBAAAO,UAAA4C,QADdtC,KAAKzC,OAAAA,EAAS+B,KAAKkD,SAAS,SAAS,CAAC,CAAA;AAAA,aAAAF;AAAAA,IAAA,GAAA,GAGnD,IAAA;AAAA5D,WAAA4B,OACAD,aAAalD,SAAS,KAAEsF,QAAAA,GAAiB,IAAA;AAAAtD,WAAA,MAAAO,UAAAY,OA5C/B/C,OAAAA,EAAS+B,KAAKoD,eAAevF,MAAM,CAAC,CAAA;AAAA,WAAAmD;AAAAA,EAAA,GAAA;AA+CrD;AAEA,MAAM8B,aAAaA,CAAC;AAAA,EAClBhF;AAAAA,EACAgD;AAAAA,EACA/C;AAKF,MAAM;AACJ,QAAME,SAASC,UAAAA;AACf,QAAM,CAAC2C,UAAUwC,WAAW,IAAIhF,aAAa,IAAI;AACjD,UAAA,MAAA;AAAA,QAAAiF,SAAAC,QAAAA,GAAAC,SAAAF,OAAA7B,YAAAgC,SAAAD,OAAA7B;AAAAvC,WAAAkE,QAAA3F,gBAEK4C,UAAQ;AAAA,MAAA,IAACM,WAAQ;AAAA,eAAEA,SAAAA;AAAAA,MAAU;AAAA,IAAA,CAAA,GAAA2C,MAAA;AAAApE,WAAAkE,QAC7BxC,YAAO,MAAA;AAAA,UAAA4C,SAAAC,YAAAC,SAAAF,OAAAjC,YAAAoC,SAAAD,OAAAjC,aAAAmC,SAAAD,OAAAlC,aAAAoC,SAAAD,OAAAnC,aAAAqC,SAAAD,OAAAtC;AAAAiC,aAAAO,UAEM9D,CAAAA,MAAM;AACdA,UAAE+D,gBAAAA;AACF/D,UAAEgE,yBAAAA;AACFd,oBAAY,CAACxC,UAAU;AAAA,MACzB;AAACzB,aAAAsE,QAGM5C,SAAO+C,MAAA;AAAAzE,aAAA2E,QAAA,MACoBjG,MAAMsG,QAAMJ,MAAA;AAAAnE,aAAAC,CAAAA,QAAA;AAAA,YAAAuE,OAHvC3D,KAAKzC,OAAAA,EAAS+B,KAAK4B,UAAU3D,OAAAA,EAAS+B,KAAKsE,WAAW,GAACC,OAGjDtG,OAAAA,EAAS+B,KAAKwE;AAAIH,iBAAAvE,IAAAK,KAAAC,UAAAsD,QAAA5D,IAAAK,IAAAkE,IAAA;AAAAE,iBAAAzE,IAAAO,KAAAD,UAAA2D,QAAAjE,IAAAO,IAAAkE,IAAA;AAAA,eAAAzE;AAAAA,MAAA,GAAA;AAAA,QAAAK,GAAAhB;AAAAA,QAAAkB,GAAAlB;AAAAA,MAAAA,CAAA;AAAA,aAAAuE;AAAAA,IAAA,GAAA,GAElCF,MAAA;AAAApE,WAAAkE,QAAA3F,gBAEA8G,MAAI;AAAA,MAAA,IAACjF,OAAI;AAAA,eAAEqB,SAAAA;AAAAA,MAAU;AAAA,MAAA,IAAAvB,WAAA;AAAA,YAAAoF,SAAAzD,QAAAA;AAAA7B,eAAAsF,QAAA/G,gBAEjBgH,KAAG;AAAA,UAACC,MAAM9G;AAAAA,UAAKwB,UACbA,CAACuF,MAAMC,MAAM;AACZ,kBAAM/D,YAAY+D,EAAAA,MAAQhH,MAAMsG,SAAS;AACzC,mBAAAzG,gBACGC,WAAS;AAAA,cACRG;AAAAA,cACAD,OAAO+G;AAAAA,cACP9D;AAAAA,YAAAA,CAAoB;AAAA,UAG1B;AAAA,QAAA,CAAC,CAAA;AAAAlB,qBAAAO,UAAAsE,QAXQzG,OAAAA,EAAS+B,KAAK+E,aAAaC,QAAQlE,OAAO,CAAC,CAAC,CAAA;AAAA,eAAA4D;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAjB,MAAA;AAAArE,WAAAkE,QAAA3F,gBAe1D8G,MAAI;AAAA,MAAA,IAACjF,OAAI;AAAA,eAAE,CAACqB,SAAAA;AAAAA,MAAU;AAAA,MAAA,IAAAvB,WAAA;AAAA,YAAA2F,SAAAC,QAAAA;AAAAD,eAAAhB,UAET9D,CAAAA,MAAM;AACdA,YAAE+D,gBAAAA;AACF/D,YAAEgE,yBAAAA;AACFd,sBAAY,CAACxC,UAAU;AAAA,QACzB;AAAChB,eAAA,MAAAO,UAAA6E,QACMvE,KAAKzC,OAAAA,EAAS+B,KAAK4B,UAAU3D,OAAAA,EAAS+B,KAAKsE,WAAW,CAAC,CAAA;AAAA,eAAAW;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAxB,MAAA;AAAA5D,WAAAC,CAAAA,QAAA;AAAA,UAAAqF,OAvCvDlH,OAAAA,EAAS+B,KAAKoF,mBAAiBC,OAe7BpH,SAAS+B,KAAKsF,aAAWC,OA6BzBtH,OAAAA,EAAS+B,KAAKsF;AAAWH,eAAArF,IAAAK,KAAAC,UAAAkD,QAAAxD,IAAAK,IAAAgF,IAAA;AAAAE,eAAAvF,IAAAO,KAAAD,UAAAoD,QAAA1D,IAAAO,IAAAgF,IAAA;AAAAE,eAAAzF,IAAA0F,KAAApF,UAAAqD,QAAA3D,IAAA0F,IAAAD,IAAA;AAAA,aAAAzF;AAAAA,IAAA,GAAA;AAAA,MAAAK,GAAAhB;AAAAA,MAAAkB,GAAAlB;AAAAA,MAAAqG,GAAArG;AAAAA,IAAAA,CAAA;AAAA,WAAAmE;AAAAA,EAAA,GAAA;AAG5C;AAEA,MAAMP,cAAcA,CAAC;AAAA,EACnBjF;AAAAA,EACAgD;AAAAA,EACA/C;AAKF,MAAM;AACJ,QAAME,SAASC,UAAAA;AACf,QAAM,CAAC2C,UAAUwC,WAAW,IAAIhF,aAAa,IAAI;AACjD,QAAMoH,OAAOC,OAAOD,KAAK3H,KAAK;AAC9B,QAAM6H,cAAcF,KAAKA,KAAKrB,SAAS,CAAC;AAExC,UAAA,MAAA;AAAA,QAAAwB,SAAAC,SAAAA,GAAAC,SAAAF,OAAAnE,YAAAsE,SAAAD,OAAAnE;AAAAvC,WAAAwG,QAEK9E,WAAOnD,gBAAK4C,UAAQ;AAAA,MAAA,IAACM,WAAQ;AAAA,eAAEA,SAAAA;AAAAA,MAAU;AAAA,IAAA,CAAA,GAAIiF,MAAA;AAAA1G,WAAAwG,QAC7C9E,YAAO,MAAA;AAAA,UAAAkF,SAAArC,YAAAsC,SAAAD,OAAAvE,YAAAyE,SAAAD,OAAAtE,aAAAwE,SAAAD,OAAAvE,aAAAyE,SAAAD,OAAAxE,aAAA0E,SAAAD,OAAA3E;AAAAuE,aAAA/B,UAEM9D,CAAAA,MAAM;AACdA,UAAE+D,gBAAAA;AACF/D,UAAEgE,yBAAAA;AACFd,oBAAY,CAACxC,UAAU;AAAA,MACzB;AAACzB,aAAA4G,QAGMlF,SAAOoF,MAAA;AAAA9G,aAAAgH,QAAA,MACoBX,KAAKrB,QAAMiC,MAAA;AAAAxG,aAAAC,CAAAA,QAAA;AAAA,YAAAwG,OAHtC5F,KAAKzC,OAAAA,EAAS+B,KAAK4B,UAAU3D,OAAAA,EAAS+B,KAAKsE,WAAW,GAACiC,QAGjDtI,OAAAA,EAAS+B,KAAKwE;AAAI8B,iBAAAxG,IAAAK,KAAAC,UAAA4F,QAAAlG,IAAAK,IAAAmG,IAAA;AAAAC,kBAAAzG,IAAAO,KAAAD,UAAAgG,QAAAtG,IAAAO,IAAAkG,KAAA;AAAA,eAAAzG;AAAAA,MAAA,GAAA;AAAA,QAAAK,GAAAhB;AAAAA,QAAAkB,GAAAlB;AAAAA,MAAAA,CAAA;AAAA,aAAA6G;AAAAA,IAAA,GAAA,GAElCF,MAAA;AAAA1G,WAAAwG,QAAAjI,gBAEA8G,MAAI;AAAA,MAAA,IAACjF,OAAI;AAAA,eAAEqB,SAAAA;AAAAA,MAAU;AAAA,MAAA,IAAAvB,WAAA;AAAA,YAAAkH,SAAAvF,QAAAA;AAAA7B,eAAAoH,QAAA7I,gBAEjBgH,KAAG;AAAA,UAACC,MAAMa;AAAAA,UAAInG,UACXmH,CAAAA,MAAC9I,gBAEEC,WAAS;AAAA,YAAA,IACRE,QAAK;AAAA,qBAAEA,MAAM2I,CAAC;AAAA,YAAC;AAAA,YACf3F,SAAS2F;AAAAA,YACT1F,WAAW4E,gBAAgBc;AAAAA,YAC3B1I;AAAAA,UAAAA,CAAkB;AAAA,QAAA,CAGvB,CAAA;AAAA8B,qBAAAO,UAAAoG,QAXQvI,OAAAA,EAAS+B,KAAK+E,aAAaC,QAAQlE,OAAO,CAAC,CAAC,CAAA;AAAA,eAAA0F;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAT,MAAA;AAAA3G,WAAAwG,QAAAjI,gBAe1D8G,MAAI;AAAA,MAAA,IAACjF,OAAI;AAAA,eAAE,CAACqB,SAAAA;AAAAA,MAAU;AAAA,MAAA,IAAAvB,WAAA;AAAA,YAAAoH,SAAAxB,QAAAA;AAAAwB,eAAAzC,UAET9D,CAAAA,MAAM;AACdA,YAAE+D,gBAAAA;AACF/D,YAAEgE,yBAAAA;AACFd,sBAAY,CAACxC,UAAU;AAAA,QACzB;AAAChB,eAAA,MAAAO,UAAAsG,QACMhG,KAAKzC,OAAAA,EAAS+B,KAAK4B,UAAU3D,OAAAA,EAAS+B,KAAKsE,WAAW,CAAC,CAAA;AAAA,eAAAoC;AAAAA,MAAA;AAAA,IAAA,CAAA,GAAAX,MAAA;AAAAlG,WAAAC,CAAAA,QAAA;AAAA,UAAA6G,OAvCvD1I,OAAAA,EAAS+B,KAAKoF,mBAAiBwB,OAe7B3I,SAAS+B,KAAKsF,aAAWuB,OA6BzB5I,OAAAA,EAAS+B,KAAKsF;AAAWqB,eAAA7G,IAAAK,KAAAC,UAAAwF,QAAA9F,IAAAK,IAAAwG,IAAA;AAAAC,eAAA9G,IAAAO,KAAAD,UAAA0F,QAAAhG,IAAAO,IAAAuG,IAAA;AAAAC,eAAA/G,IAAA0F,KAAApF,UAAA2F,QAAAjG,IAAA0F,IAAAqB,IAAA;AAAA,aAAA/G;AAAAA,IAAA,GAAA;AAAA,MAAAK,GAAAhB;AAAAA,MAAAkB,GAAAlB;AAAAA,MAAAqG,GAAArG;AAAAA,IAAAA,CAAA;AAAA,WAAAyG;AAAAA,EAAA,GAAA;AAG5C;AAACkB,eAAA,CAAA,OAAA,CAAA;"}
1	+ {"version":3,"file":"tree.js","sources":["../../../src/components/tree.tsx"],"sourcesContent":["import { For, Match, Show, Switch, createSignal } from 'solid-js'\nimport clsx from 'clsx'\nimport { css, useStyles } from '../styles/use-styles'\nimport { CopiedCopier, Copier, ErrorCopier } from './icons'\nimport type { CollapsiblePaths } from '../utils/deep-keys'\n\nexport function JsonTree<TData, TName extends CollapsiblePaths<TData>>(props: {\n value: TData\n copyable?: boolean\n defaultExpansionDepth?: number\n collapsePaths?: Array<TName>\n}) {\n return (\n <JsonValue\n isRoot\n value={props.value}\n copyable={props.copyable}\n depth={0}\n defaultExpansionDepth={props.defaultExpansionDepth ?? 1}\n path=\"\"\n collapsePaths={props.collapsePaths}\n />\n )\n}\n\nfunction JsonValue(props: {\n value: any\n keyName?: string\n isRoot?: boolean\n isLastKey?: boolean\n copyable?: boolean\n\n defaultExpansionDepth: number\n depth: number\n\n collapsePaths?: Array<string>\n path: string\n}) {\n const {\n value,\n keyName,\n isRoot = false,\n isLastKey,\n copyable,\n defaultExpansionDepth,\n depth,\n collapsePaths,\n path,\n } = props\n const styles = useStyles()\n\n return (\n <span class={styles().tree.valueContainer(isRoot)}>\n {keyName && typeof value !== 'object' && !Array.isArray(value) && (\n <span class={styles().tree.valueKey}>"{keyName}": </span>\n )}\n {(() => {\n if (typeof value === 'string') {\n return (\n <span class={styles().tree.valueString}>"{value}"</span>\n )\n }\n if (typeof value === 'number') {\n return <span class={styles().tree.valueNumber}>{value}</span>\n }\n if (typeof value === 'boolean') {\n return <span class={styles().tree.valueBoolean}>{String(value)}</span>\n }\n if (value === null) {\n return <span class={styles().tree.valueNull}>null</span>\n }\n if (value === undefined) {\n return <span class={styles().tree.valueNull}>undefined</span>\n }\n if (typeof value === 'function') {\n return (\n <span class={styles().tree.valueFunction}>{String(value)}</span>\n )\n }\n if (Array.isArray(value)) {\n return (\n <ArrayValue\n defaultExpansionDepth={defaultExpansionDepth}\n depth={depth}\n copyable={copyable}\n keyName={keyName}\n value={value}\n collapsePaths={collapsePaths}\n path={path}\n />\n )\n }\n if (typeof value === 'object') {\n return (\n <ObjectValue\n defaultExpansionDepth={defaultExpansionDepth}\n depth={depth}\n copyable={copyable}\n keyName={keyName}\n value={value}\n collapsePaths={collapsePaths}\n path={path}\n />\n )\n }\n return <span />\n })()}\n {copyable && (\n <div class={clsx(styles().tree.actions, 'actions')}>\n <CopyButton value={value} />\n </div>\n )}\n {isLastKey \|\| isRoot ? '' : <span>,</span>}\n </span>\n )\n}\n\nconst ArrayValue = ({\n value,\n keyName,\n copyable,\n defaultExpansionDepth,\n depth,\n collapsePaths,\n path,\n}: {\n value: Array<any>\n copyable?: boolean\n keyName?: string\n defaultExpansionDepth: number\n depth: number\n collapsePaths?: Array<string>\n path: string\n}) => {\n const styles = useStyles()\n\n const [expanded, setExpanded] = createSignal(\n depth <= defaultExpansionDepth && !collapsePaths?.includes(path),\n )\n\n if (value.length === 0) {\n return (\n <span class={styles().tree.expanderContainer}>\n {keyName && (\n <span class={clsx(styles().tree.valueKey, styles().tree.collapsible)}>\n "{keyName}":{' '}\n </span>\n )}\n\n <span class={styles().tree.valueBraces}>[]</span>\n </span>\n )\n }\n return (\n <span class={styles().tree.expanderContainer}>\n <Expander\n onClick={() => setExpanded(!expanded())}\n expanded={expanded()}\n />\n\n {keyName && (\n <span\n onclick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n "{keyName}":{' '}\n <span class={styles().tree.info}>{value.length} items</span>\n </span>\n )}\n\n <span class={styles().tree.valueBraces}>[</span>\n\n <Show when={expanded()}>\n <span class={styles().tree.expandedLine(Boolean(keyName))}>\n <For each={value}>\n {(item, i) => {\n const isLastKey = i() === value.length - 1\n return (\n <JsonValue\n copyable={copyable}\n value={item}\n isLastKey={isLastKey}\n defaultExpansionDepth={defaultExpansionDepth}\n depth={depth + 1}\n collapsePaths={collapsePaths}\n path={path ? `${path}[${i()}]` : `[${i()}]`}\n />\n )\n }}\n </For>\n </span>\n </Show>\n\n <Show when={!expanded()}>\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n {`...`}\n </span>\n </Show>\n <span class={styles().tree.valueBraces}>]</span>\n </span>\n )\n}\n\nconst ObjectValue = ({\n value,\n keyName,\n copyable,\n defaultExpansionDepth,\n depth,\n collapsePaths,\n path,\n}: {\n value: Record<string, any>\n keyName?: string\n copyable?: boolean\n defaultExpansionDepth: number\n depth: number\n collapsePaths?: Array<string>\n path: string\n}) => {\n const styles = useStyles()\n\n const [expanded, setExpanded] = createSignal(\n depth <= defaultExpansionDepth && !collapsePaths?.includes(path),\n )\n\n const keys = Object.keys(value)\n const lastKeyName = keys[keys.length - 1]\n\n if (keys.length === 0) {\n return (\n <span class={styles().tree.expanderContainer}>\n {keyName && (\n <span class={clsx(styles().tree.valueKey, styles().tree.collapsible)}>\n "{keyName}":{' '}\n </span>\n )}\n\n <span class={styles().tree.valueBraces}>{'{}'}</span>\n </span>\n )\n }\n\n return (\n <span class={styles().tree.expanderContainer}>\n {keyName && (\n <Expander\n onClick={() => setExpanded(!expanded())}\n expanded={expanded()}\n />\n )}\n\n {keyName && (\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n "{keyName}":{' '}\n <span class={styles().tree.info}>{keys.length} items</span>\n </span>\n )}\n\n <span class={styles().tree.valueBraces}>{'{'}</span>\n\n <Show when={expanded()}>\n <span class={styles().tree.expandedLine(Boolean(keyName))}>\n <For each={keys}>\n {(k) => (\n <>\n <JsonValue\n value={value[k]}\n keyName={k}\n isLastKey={lastKeyName === k}\n copyable={copyable}\n defaultExpansionDepth={defaultExpansionDepth}\n depth={depth + 1}\n collapsePaths={collapsePaths}\n path={`${path}${path ? '.' : ''}${k}`}\n />\n </>\n )}\n </For>\n </span>\n </Show>\n\n <Show when={!expanded()}>\n <span\n onClick={(e) => {\n e.stopPropagation()\n e.stopImmediatePropagation()\n setExpanded(!expanded())\n }}\n class={clsx(styles().tree.valueKey, styles().tree.collapsible)}\n >\n {`...`}\n </span>\n </Show>\n\n <span class={styles().tree.valueBraces}>{'}'}</span>\n </span>\n )\n}\n\ntype CopyState = 'NoCopy' \| 'SuccessCopy' \| 'ErrorCopy'\n\nconst CopyButton = (props: { value: unknown }) => {\n const styles = useStyles()\n const [copyState, setCopyState] = createSignal<CopyState>('NoCopy')\n\n return (\n <button\n class={styles().tree.actionButton}\n title=\"Copy object to clipboard\"\n aria-label={`${\n copyState() === 'NoCopy'\n ? 'Copy object to clipboard'\n : copyState() === 'SuccessCopy'\n ? 'Object copied to clipboard'\n : 'Error copying object to clipboard'\n }`}\n onClick={\n copyState() === 'NoCopy'\n ? () => {\n navigator.clipboard\n .writeText(JSON.stringify(props.value, null, 2))\n .then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n >\n <Switch>\n <Match when={copyState() === 'NoCopy'}>\n <Copier />\n </Match>\n <Match when={copyState() === 'SuccessCopy'}>\n <CopiedCopier theme={'dark'} />\n </Match>\n <Match when={copyState() === 'ErrorCopy'}>\n <ErrorCopier />\n </Match>\n </Switch>\n </button>\n )\n}\n\nconst Expander = (props: { expanded: boolean; onClick: () => void }) => {\n const styles = useStyles()\n return (\n <span\n onClick={props.onClick}\n class={clsx(\n styles().tree.expander,\n css`\n transform: rotate(${props.expanded ? 90 : 0}deg);\n `,\n props.expanded &&\n css`\n & svg {\n top: -1px;\n }\n `,\n )}\n >\n <svg\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M6 12L10 8L6 4\"\n stroke-width=\"2\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </span>\n )\n}\n"],"names":["JsonTree","props","_$createComponent","JsonValue","isRoot","value","copyable","depth","defaultExpansionDepth","path","collapsePaths","keyName","isLastKey","styles","useStyles","_el$","_tmpl$","_$insert","_c$","_$memo","Array","isArray","_el$2","_tmpl$2","_el$3","firstChild","_el$5","nextSibling","_$effect","_$className","tree","valueKey","_el$6","_tmpl$3","_el$7","_el$9","valueString","_el$0","valueNumber","_el$1","String","valueBoolean","_el$10","_tmpl$4","valueNull","undefined","_el$11","_tmpl$5","_el$12","valueFunction","ArrayValue","ObjectValue","_el$14","_tmpl$6","CopyButton","clsx","actions","_tmpl$7","valueContainer","expanded","setExpanded","createSignal","includes","length","_el$16","_tmpl$8","_el$17","_el$18","_el$19","_el$21","collapsible","_p$","_v$","expanderContainer","_v$2","valueBraces","e","t","_el$22","_tmpl$0","_el$23","_el$26","Expander","onClick","_el$27","_tmpl$1","_el$28","_el$33","_el$29","_el$31","_el$32","$$click","stopPropagation","stopImmediatePropagation","_v$6","_v$7","info","Show","when","children","_el$24","For","each","item","i","expandedLine","Boolean","_el$25","_tmpl$9","_v$3","_v$4","_v$5","a","keys","Object","lastKeyName","_el$34","_tmpl$10","_el$35","_el$36","_el$37","_el$39","_v$8","_v$9","_el$40","_tmpl$11","_el$41","_el$44","_el$45","_el$46","_el$51","_el$47","_el$49","_el$50","_v$11","_v$12","_el$42","k","_el$43","_v$0","_v$1","_v$10","copyState","setCopyState","_el$52","_tmpl$12","_$addEventListener","navigator","clipboard","writeText","JSON","stringify","then","setTimeout","err","console","error","Switch","Match","Copier","CopiedCopier","theme","ErrorCopier","_v$13","actionButton","_v$14","_$setAttribute","_el$53","_tmpl$13","expander","css","_$delegateEvents"],"mappings":"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"}

package/dist/esm/styles/use-styles.js CHANGED Viewed

@@ -51,6 +51,7 @@ const stylesFactory = (theme = "dark") => {
   const { colors, font, size, alpha, border } = tokens;
   const { fontFamily } = font;
   const t = (light, dark) => theme === "light" ? light : dark;
+  const wrapperSize = 320;
   return {
     logo: css`
       cursor: pointer;
@@ -69,7 +70,7 @@ const stylesFactory = (theme = "dark") => {
     `,
     selectWrapper: css`
       width: 100%;
-      max-width: 300px;
+      max-width: ${wrapperSize}px;
       display: flex;
       flex-direction: column;
       gap: 0.375rem;
@@ -120,7 +121,7 @@ const stylesFactory = (theme = "dark") => {
     `,
     inputWrapper: css`
       width: 100%;
-      max-width: 300px;
+      max-width: ${wrapperSize}px;
       display: flex;
       flex-direction: column;
       gap: 0.375rem;
@@ -143,6 +144,7 @@ const stylesFactory = (theme = "dark") => {
     `,
     input: css`
       appearance: none;
+      box-sizing: border-box;
       width: 100%;
       padding: 0.75rem;
       border-radius: 0.5rem;
@@ -383,6 +385,7 @@ const stylesFactory = (theme = "dark") => {
       `,
       expander: css`
         position: absolute;
+        cursor: pointer;
         left: -16px;
         top: 3px;
         & path {

package/dist/esm/styles/use-styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"use-styles.js","sources":["../../../src/styles/use-styles.ts"],"sourcesContent":["import * as goober from 'goober'\nimport { createEffect, createSignal } from 'solid-js'\nimport { useTheme } from '../components/theme'\nimport { tokens } from './tokens'\nimport type { ButtonVariant } from '../components/button'\nimport type { Theme } from '../components/theme'\n\nconst buttonVariantColors: Record<\n ButtonVariant,\n { bg: string; hover: string; active: string; text: string; border: string }\n> = {\n primary: {\n bg: tokens.colors.purple[500],\n hover: tokens.colors.purple[600],\n active: tokens.colors.purple[700],\n text: '#fff',\n border: tokens.colors.purple[500],\n },\n secondary: {\n bg: tokens.colors.gray[800],\n hover: tokens.colors.gray[700],\n active: tokens.colors.gray[600],\n text: tokens.colors.gray[100],\n border: tokens.colors.gray[700],\n },\n info: {\n bg: tokens.colors.blue[500],\n hover: tokens.colors.blue[600],\n active: tokens.colors.blue[700],\n text: '#fff',\n border: tokens.colors.blue[500],\n },\n warning: {\n bg: tokens.colors.yellow[500],\n hover: tokens.colors.yellow[600],\n active: tokens.colors.yellow[700],\n text: '#fff',\n border: tokens.colors.yellow[500],\n },\n danger: {\n bg: tokens.colors.red[500],\n hover: tokens.colors.red[600],\n active: tokens.colors.red[700],\n text: '#fff',\n border: tokens.colors.red[500],\n },\n success: {\n bg: tokens.colors.green[500],\n hover: tokens.colors.green[600],\n active: tokens.colors.green[700],\n text: '#fff',\n border: tokens.colors.green[500],\n },\n}\nexport const css = goober.css\nconst stylesFactory = (theme: Theme = 'dark') => {\n const { colors, font, size, alpha, border } = tokens\n const { fontFamily } = font\n\n const t = (light: string, dark: string) => (theme === 'light' ? light : dark)\n\n return {\n logo: css`\n cursor: pointer;\n display: flex;\n flex-direction: column;\n background-color: transparent;\n border: none;\n width: ${size[12]};\n height: ${size[12]};\n font-family: ${fontFamily.sans};\n gap: ${tokens.size[0.5]};\n padding: 0px;\n &:hover {\n opacity: 0.7;\n }\n `,\n\n selectWrapper: css`\n width: 100%;\n max-width: 300px;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n `,\n selectContainer: css`\n width: 100%;\n `,\n selectLabel: css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${t(colors.gray[900], colors.gray[100])};\n text-align: left;\n `,\n selectDescription: css`\n font-size: 0.8rem;\n color: ${t(colors.gray[500], colors.gray[400])};\n margin: 0;\n line-height: 1.3;\n text-align: left;\n `,\n select: css`\n appearance: none;\n width: 100%;\n padding: 0.75rem 3rem 0.75rem 0.75rem;\n border-radius: 0.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n color: ${t(colors.gray[900], colors.gray[100])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n font-size: 0.875rem;\n transition: all 0.2s ease;\n cursor: pointer;\n\n /* Custom arrow */\n background-image: url(\"data:image/svg+xml;utf8,<svg fill='%236b7280' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>\");\n background-repeat: no-repeat;\n background-position: right 0.75rem center;\n background-size: 1.25rem;\n\n &:hover {\n border-color: ${t(colors.gray[400], colors.gray[600])};\n }\n\n &:focus {\n outline: none;\n border-color: ${colors.purple[400]};\n box-shadow: 0 0 0 3px ${colors.purple[400]}${alpha[20]};\n }\n `,\n inputWrapper: css`\n width: 100%;\n max-width: 300px;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n `,\n inputContainer: css`\n width: 100%;\n `,\n inputLabel: css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${t(colors.gray[900], colors.gray[100])};\n text-align: left;\n `,\n inputDescription: css`\n font-size: 0.8rem;\n color: ${t(colors.gray[500], colors.gray[400])};\n margin: 0;\n line-height: 1.3;\n text-align: left;\n `,\n input: css`\n appearance: none;\n width: 100%;\n padding: 0.75rem;\n border-radius: 0.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n color: ${t(colors.gray[900], colors.gray[100])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n font-size: 0.875rem;\n font-family: ${fontFamily.mono};\n transition: all 0.2s ease;\n\n &::placeholder {\n color: ${t(colors.gray[400], colors.gray[500])};\n }\n\n &:hover {\n border-color: ${t(colors.gray[400], colors.gray[600])};\n }\n\n &:focus {\n outline: none;\n border-color: ${t(colors.purple[500], colors.purple[400])};\n box-shadow: 0 0 0 3px\n ${t(colors.purple[100] + alpha[20], colors.purple[400] + alpha[20])};\n }\n `,\n checkboxWrapper: css`\n display: flex;\n align-items: flex-start;\n gap: 0.75rem;\n cursor: pointer;\n user-select: none;\n padding: 0.5rem;\n border-radius: 0.5rem;\n transition: background-color 0.2s ease;\n\n &:hover {\n background-color: ${t(colors.gray[100], colors.darkGray[800])};\n }\n `,\n checkboxContainer: css`\n width: 100%;\n `,\n checkboxLabelContainer: css`\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n flex: 1;\n `,\n checkbox: css`\n appearance: none;\n width: 1.25rem;\n height: 1.25rem;\n border: 2px solid ${t(colors.gray[300], colors.gray[700])};\n border-radius: 0.375rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n display: grid;\n place-items: center;\n transition: all 0.2s ease;\n flex-shrink: 0;\n margin-top: 0.125rem;\n\n &:hover {\n border-color: ${t(colors.purple[500], colors.purple[400])};\n }\n\n &:checked {\n background-color: ${t(colors.purple[500], colors.purple[700])};\n border-color: ${t(colors.purple[500], colors.purple[700])};\n }\n\n &:checked::after {\n content: '';\n width: 0.4rem;\n height: 0.6rem;\n border: solid ${t('#fff', colors.gray[100])};\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n margin-top: -3px;\n }\n `,\n checkboxLabel: css`\n color: ${t(colors.gray[900], colors.gray[100])};\n font-size: 0.875rem;\n font-weight: 500;\n line-height: 1.4;\n text-align: left;\n `,\n checkboxDescription: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: 0.8rem;\n line-height: 1.3;\n text-align: left;\n `,\n button: {\n base: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: ${tokens.font.fontFamily.sans};\n font-size: 0.8rem;\n font-weight: 500;\n border-radius: 0.2rem;\n padding: 0.2rem 0.6rem;\n cursor: pointer;\n transition:\n background 0.2s,\n color 0.2s,\n border 0.2s,\n box-shadow 0.2s;\n outline: none;\n border-width: 1px;\n border-style: solid;\n `,\n variant(variant: ButtonVariant, outline?: boolean, ghost?: boolean) {\n const v = buttonVariantColors[variant]\n if (ghost) {\n return css`\n background: transparent;\n color: ${t(v.bg, v.bg)};\n border-color: transparent;\n &:hover {\n background: ${t(colors.purple[100], colors.darkGray[700])};\n }\n &:active {\n background: ${t(colors.purple[200], colors.darkGray[800])};\n }\n `\n }\n if (outline) {\n return css`\n background: transparent;\n color: ${t(v.bg, v.bg)};\n border-color: ${t(v.bg, v.bg)};\n &:hover {\n background: ${t(colors.purple[100], colors.darkGray[700])};\n border-color: ${t(v.hover, v.hover)};\n }\n &:active {\n background: ${t(colors.purple[200], colors.darkGray[800])};\n border-color: ${t(v.active, v.active)};\n }\n `\n }\n // Default solid button\n return css`\n background: ${t(v.bg, v.bg)};\n color: ${t(v.text, v.text)};\n border-color: ${t(v.border, v.border)};\n &:hover {\n background: ${t(v.hover, v.hover)};\n border-color: ${t(v.hover, v.hover)};\n }\n &:active {\n background: ${t(v.active, v.active)};\n border-color: ${t(v.active, v.active)};\n }\n `\n },\n },\n tag: {\n dot: (color: keyof typeof tokens.colors) => css`\n width: ${tokens.size[1.5]};\n height: ${tokens.size[1.5]};\n border-radius: ${tokens.border.radius.full};\n background-color: ${t(\n tokens.colors[color][500],\n tokens.colors[color][500],\n )};\n `,\n base: css`\n display: flex;\n gap: ${tokens.size[1.5]};\n box-sizing: border-box;\n height: ${tokens.size[6.5]};\n background: ${t(colors.gray[50], colors.darkGray[500])};\n color: ${t(colors.gray[700], colors.gray[300])};\n border-radius: ${tokens.border.radius.sm};\n font-size: ${font.size.sm};\n padding: ${tokens.size[1]};\n padding-left: ${tokens.size[1.5]};\n align-items: center;\n font-weight: ${font.weight.medium};\n border: ${t('1px solid ' + colors.gray[300], '1px solid transparent')};\n user-select: none;\n position: relative;\n &:focus-visible {\n outline-offset: 2px;\n outline: 2px solid ${t(colors.blue[700], colors.blue[800])};\n }\n `,\n label: css`\n font-size: ${font.size.xs};\n `,\n count: css`\n font-size: ${font.size.xs};\n padding: 0 5px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${t(colors.gray[500], colors.gray[400])};\n background-color: ${t(colors.gray[200], colors.darkGray[300])};\n border-radius: 2px;\n font-variant-numeric: tabular-nums;\n height: ${tokens.size[4.5]};\n `,\n },\n tree: {\n info: css`\n color: ${t(colors.gray[500], colors.gray[500])};\n font-size: ${font.size.xs};\n margin-right: ${size[1]};\n `,\n actionButton: css`\n background-color: transparent;\n color: ${t(colors.gray[500], colors.gray[500])};\n border: none;\n display: inline-flex;\n padding: 0px;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n width: ${size[3]};\n height: ${size[3]};\n position: relative;\n z-index: 1;\n\n &:hover svg {\n color: ${t(colors.gray[600], colors.gray[400])};\n }\n\n &:focus-visible {\n border-radius: ${border.radius.xs};\n outline: 2px solid ${t(colors.blue[700], colors.blue[800])};\n outline-offset: 2px;\n }\n `,\n expanderContainer: css`\n position: relative;\n `,\n expander: css`\n position: absolute;\n left: -16px;\n top: 3px;\n & path {\n stroke: ${t(colors.blue[400], colors.blue[300])};\n }\n & svg {\n width: ${size[3]};\n height: ${size[3]};\n }\n\n display: inline-flex;\n align-items: center;\n transition: all 0.1s ease;\n `,\n expandedLine: (hasBorder: boolean) => css`\n display: block;\n padding-left: 0.75rem;\n margin-left: -0.7rem;\n ${hasBorder\n ? `border-left: 1px solid ${t(colors.blue[400], colors.blue[300])};`\n : ''}\n `,\n collapsible: css`\n cursor: pointer;\n transition: all 0.2s ease;\n &:hover {\n background-color: ${t(colors.gray[100], colors.darkGray[700])};\n border-radius: ${tokens.border.radius.sm};\n padding: 0 ${tokens.size[1]};\n }\n `,\n actions: css`\n display: inline-flex;\n margin-left: ${size[2]};\n gap: ${size[2]};\n align-items: center;\n & svg {\n height: 12px;\n width: 12px;\n }\n `,\n valueCollapsed: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n `,\n valueFunction: css`\n color: ${t(colors.cyan[500], colors.cyan[400])};\n `,\n valueString: css`\n color: ${t(colors.green[500], colors.green[400])};\n `,\n valueNumber: css`\n color: ${t(colors.yellow[500], colors.yellow[400])};\n `,\n valueBoolean: css`\n color: ${t(colors.pink[500], colors.pink[400])};\n `,\n valueNull: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-style: italic;\n `,\n valueKey: css`\n color: ${t(colors.blue[400], colors.blue[300])};\n `,\n valueBraces: css`\n color: ${colors.gray[500]};\n `,\n valueContainer: (isRoot: boolean) => css`\n display: block;\n margin-left: ${isRoot ? '0' : '1rem'};\n\n &:not(:hover) .actions {\n display: none;\n }\n\n &:hover .actions {\n display: inline-flex;\n }\n `,\n },\n header: {\n row: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${tokens.size[2]} ${tokens.size[2.5]};\n gap: ${tokens.size[2.5]};\n border-bottom: ${t(colors.gray[300], colors.darkGray[500])} 1px solid;\n align-items: center;\n `,\n logoAndToggleContainer: css`\n display: flex;\n gap: ${tokens.size[3]};\n align-items: center;\n & > button {\n padding: 0;\n background: transparent;\n border: none;\n display: flex;\n gap: ${size[0.5]};\n flex-direction: column;\n }\n `,\n logo: css`\n cursor: pointer;\n display: flex;\n flex-direction: column;\n background-color: transparent;\n border: none;\n gap: ${tokens.size[0.5]};\n padding: 0px;\n &:hover {\n opacity: 0.7;\n }\n &:focus-visible {\n outline-offset: 4px;\n border-radius: ${border.radius.xs};\n outline: 2px solid ${colors.blue[800]};\n }\n `,\n tanstackLogo: css`\n font-size: ${font.size.md};\n font-weight: ${font.weight.bold};\n line-height: ${font.lineHeight.xs};\n white-space: nowrap;\n color: ${t(colors.gray[700], colors.gray[300])};\n `,\n flavorLogo: (flavorLight: string, flavorDark: string) => css`\n font-weight: ${font.weight.semibold};\n font-size: ${font.size.xs};\n background: linear-gradient(to right, ${t(flavorLight, flavorDark)});\n background-clip: text;\n -webkit-background-clip: text;\n line-height: 1;\n -webkit-text-fill-color: transparent;\n white-space: nowrap;\n `,\n },\n section: {\n main: css`\n margin-bottom: 2rem;\n padding: 1.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n border-radius: 0.75rem;\n box-shadow: ${t(\n '0 1px 3px rgba(0,0,0,0.06)',\n '0 1px 3px rgba(0,0,0,0.18)',\n )};\n `,\n title: css`\n font-size: 1.125rem;\n font-weight: 600;\n color: ${t(colors.gray[900], colors.gray[100])};\n margin: 0 0 1rem 0;\n padding-bottom: 0.5rem;\n border-bottom: 1px solid ${t(colors.gray[300], colors.gray[700])};\n display: flex;\n align-items: center;\n gap: 0.5rem;\n text-align: left;\n `,\n icon: css`\n height: 20px;\n width: 20px;\n & > svg {\n height: 100%;\n width: 100%;\n }\n color: ${t(colors.purple[500], colors.purple[400])};\n `,\n description: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: 0.875rem;\n margin: 0 0 1.5rem 0;\n line-height: 1.5;\n text-align: left;\n `,\n },\n mainPanel: {\n panel: (withPadding: boolean) => css`\n padding: ${withPadding ? tokens.size[4] : 0};\n background: ${t(colors.gray[50], colors.darkGray[700])};\n overflow-y: auto;\n height: 100%;\n `,\n },\n }\n}\n\nexport function useStyles() {\n const { theme } = useTheme()\n const [styles, setStyles] = createSignal(stylesFactory(theme()))\n createEffect(() => {\n setStyles(stylesFactory(theme()))\n })\n return styles\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"use-styles.js","sources":["../../../src/styles/use-styles.ts"],"sourcesContent":["import * as goober from 'goober'\nimport { createEffect, createSignal } from 'solid-js'\nimport { useTheme } from '../components/theme'\nimport { tokens } from './tokens'\nimport type { ButtonVariant } from '../components/button'\nimport type { Theme } from '../components/theme'\n\nconst buttonVariantColors: Record<\n ButtonVariant,\n { bg: string; hover: string; active: string; text: string; border: string }\n> = {\n primary: {\n bg: tokens.colors.purple[500],\n hover: tokens.colors.purple[600],\n active: tokens.colors.purple[700],\n text: '#fff',\n border: tokens.colors.purple[500],\n },\n secondary: {\n bg: tokens.colors.gray[800],\n hover: tokens.colors.gray[700],\n active: tokens.colors.gray[600],\n text: tokens.colors.gray[100],\n border: tokens.colors.gray[700],\n },\n info: {\n bg: tokens.colors.blue[500],\n hover: tokens.colors.blue[600],\n active: tokens.colors.blue[700],\n text: '#fff',\n border: tokens.colors.blue[500],\n },\n warning: {\n bg: tokens.colors.yellow[500],\n hover: tokens.colors.yellow[600],\n active: tokens.colors.yellow[700],\n text: '#fff',\n border: tokens.colors.yellow[500],\n },\n danger: {\n bg: tokens.colors.red[500],\n hover: tokens.colors.red[600],\n active: tokens.colors.red[700],\n text: '#fff',\n border: tokens.colors.red[500],\n },\n success: {\n bg: tokens.colors.green[500],\n hover: tokens.colors.green[600],\n active: tokens.colors.green[700],\n text: '#fff',\n border: tokens.colors.green[500],\n },\n}\nexport const css = goober.css\nconst stylesFactory = (theme: Theme = 'dark') => {\n const { colors, font, size, alpha, border } = tokens\n const { fontFamily } = font\n\n const t = (light: string, dark: string) => (theme === 'light' ? light : dark)\n\n const wrapperSize = 320\n\n return {\n logo: css`\n cursor: pointer;\n display: flex;\n flex-direction: column;\n background-color: transparent;\n border: none;\n width: ${size[12]};\n height: ${size[12]};\n font-family: ${fontFamily.sans};\n gap: ${tokens.size[0.5]};\n padding: 0px;\n &:hover {\n opacity: 0.7;\n }\n `,\n\n selectWrapper: css`\n width: 100%;\n max-width: ${wrapperSize}px;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n `,\n selectContainer: css`\n width: 100%;\n `,\n selectLabel: css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${t(colors.gray[900], colors.gray[100])};\n text-align: left;\n `,\n selectDescription: css`\n font-size: 0.8rem;\n color: ${t(colors.gray[500], colors.gray[400])};\n margin: 0;\n line-height: 1.3;\n text-align: left;\n `,\n select: css`\n appearance: none;\n width: 100%;\n padding: 0.75rem 3rem 0.75rem 0.75rem;\n border-radius: 0.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n color: ${t(colors.gray[900], colors.gray[100])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n font-size: 0.875rem;\n transition: all 0.2s ease;\n cursor: pointer;\n\n /* Custom arrow */\n background-image: url(\"data:image/svg+xml;utf8,<svg fill='%236b7280' height='20' viewBox='0 0 24 24' width='20' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>\");\n background-repeat: no-repeat;\n background-position: right 0.75rem center;\n background-size: 1.25rem;\n\n &:hover {\n border-color: ${t(colors.gray[400], colors.gray[600])};\n }\n\n &:focus {\n outline: none;\n border-color: ${colors.purple[400]};\n box-shadow: 0 0 0 3px ${colors.purple[400]}${alpha[20]};\n }\n `,\n inputWrapper: css`\n width: 100%;\n max-width: ${wrapperSize}px;\n display: flex;\n flex-direction: column;\n gap: 0.375rem;\n `,\n inputContainer: css`\n width: 100%;\n `,\n inputLabel: css`\n font-size: 0.875rem;\n font-weight: 500;\n color: ${t(colors.gray[900], colors.gray[100])};\n text-align: left;\n `,\n inputDescription: css`\n font-size: 0.8rem;\n color: ${t(colors.gray[500], colors.gray[400])};\n margin: 0;\n line-height: 1.3;\n text-align: left;\n `,\n input: css`\n appearance: none;\n box-sizing: border-box;\n width: 100%;\n padding: 0.75rem;\n border-radius: 0.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n color: ${t(colors.gray[900], colors.gray[100])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n font-size: 0.875rem;\n font-family: ${fontFamily.mono};\n transition: all 0.2s ease;\n\n &::placeholder {\n color: ${t(colors.gray[400], colors.gray[500])};\n }\n\n &:hover {\n border-color: ${t(colors.gray[400], colors.gray[600])};\n }\n\n &:focus {\n outline: none;\n border-color: ${t(colors.purple[500], colors.purple[400])};\n box-shadow: 0 0 0 3px\n ${t(colors.purple[100] + alpha[20], colors.purple[400] + alpha[20])};\n }\n `,\n checkboxWrapper: css`\n display: flex;\n align-items: flex-start;\n gap: 0.75rem;\n cursor: pointer;\n user-select: none;\n padding: 0.5rem;\n border-radius: 0.5rem;\n transition: background-color 0.2s ease;\n\n &:hover {\n background-color: ${t(colors.gray[100], colors.darkGray[800])};\n }\n `,\n checkboxContainer: css`\n width: 100%;\n `,\n checkboxLabelContainer: css`\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n flex: 1;\n `,\n checkbox: css`\n appearance: none;\n width: 1.25rem;\n height: 1.25rem;\n border: 2px solid ${t(colors.gray[300], colors.gray[700])};\n border-radius: 0.375rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n display: grid;\n place-items: center;\n transition: all 0.2s ease;\n flex-shrink: 0;\n margin-top: 0.125rem;\n\n &:hover {\n border-color: ${t(colors.purple[500], colors.purple[400])};\n }\n\n &:checked {\n background-color: ${t(colors.purple[500], colors.purple[700])};\n border-color: ${t(colors.purple[500], colors.purple[700])};\n }\n\n &:checked::after {\n content: '';\n width: 0.4rem;\n height: 0.6rem;\n border: solid ${t('#fff', colors.gray[100])};\n border-width: 0 2px 2px 0;\n transform: rotate(45deg);\n margin-top: -3px;\n }\n `,\n checkboxLabel: css`\n color: ${t(colors.gray[900], colors.gray[100])};\n font-size: 0.875rem;\n font-weight: 500;\n line-height: 1.4;\n text-align: left;\n `,\n checkboxDescription: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: 0.8rem;\n line-height: 1.3;\n text-align: left;\n `,\n button: {\n base: css`\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-family: ${tokens.font.fontFamily.sans};\n font-size: 0.8rem;\n font-weight: 500;\n border-radius: 0.2rem;\n padding: 0.2rem 0.6rem;\n cursor: pointer;\n transition:\n background 0.2s,\n color 0.2s,\n border 0.2s,\n box-shadow 0.2s;\n outline: none;\n border-width: 1px;\n border-style: solid;\n `,\n variant(variant: ButtonVariant, outline?: boolean, ghost?: boolean) {\n const v = buttonVariantColors[variant]\n if (ghost) {\n return css`\n background: transparent;\n color: ${t(v.bg, v.bg)};\n border-color: transparent;\n &:hover {\n background: ${t(colors.purple[100], colors.darkGray[700])};\n }\n &:active {\n background: ${t(colors.purple[200], colors.darkGray[800])};\n }\n `\n }\n if (outline) {\n return css`\n background: transparent;\n color: ${t(v.bg, v.bg)};\n border-color: ${t(v.bg, v.bg)};\n &:hover {\n background: ${t(colors.purple[100], colors.darkGray[700])};\n border-color: ${t(v.hover, v.hover)};\n }\n &:active {\n background: ${t(colors.purple[200], colors.darkGray[800])};\n border-color: ${t(v.active, v.active)};\n }\n `\n }\n // Default solid button\n return css`\n background: ${t(v.bg, v.bg)};\n color: ${t(v.text, v.text)};\n border-color: ${t(v.border, v.border)};\n &:hover {\n background: ${t(v.hover, v.hover)};\n border-color: ${t(v.hover, v.hover)};\n }\n &:active {\n background: ${t(v.active, v.active)};\n border-color: ${t(v.active, v.active)};\n }\n `\n },\n },\n tag: {\n dot: (color: keyof typeof tokens.colors) => css`\n width: ${tokens.size[1.5]};\n height: ${tokens.size[1.5]};\n border-radius: ${tokens.border.radius.full};\n background-color: ${t(\n tokens.colors[color][500],\n tokens.colors[color][500],\n )};\n `,\n base: css`\n display: flex;\n gap: ${tokens.size[1.5]};\n box-sizing: border-box;\n height: ${tokens.size[6.5]};\n background: ${t(colors.gray[50], colors.darkGray[500])};\n color: ${t(colors.gray[700], colors.gray[300])};\n border-radius: ${tokens.border.radius.sm};\n font-size: ${font.size.sm};\n padding: ${tokens.size[1]};\n padding-left: ${tokens.size[1.5]};\n align-items: center;\n font-weight: ${font.weight.medium};\n border: ${t('1px solid ' + colors.gray[300], '1px solid transparent')};\n user-select: none;\n position: relative;\n &:focus-visible {\n outline-offset: 2px;\n outline: 2px solid ${t(colors.blue[700], colors.blue[800])};\n }\n `,\n label: css`\n font-size: ${font.size.xs};\n `,\n count: css`\n font-size: ${font.size.xs};\n padding: 0 5px;\n display: flex;\n align-items: center;\n justify-content: center;\n color: ${t(colors.gray[500], colors.gray[400])};\n background-color: ${t(colors.gray[200], colors.darkGray[300])};\n border-radius: 2px;\n font-variant-numeric: tabular-nums;\n height: ${tokens.size[4.5]};\n `,\n },\n tree: {\n info: css`\n color: ${t(colors.gray[500], colors.gray[500])};\n font-size: ${font.size.xs};\n margin-right: ${size[1]};\n `,\n actionButton: css`\n background-color: transparent;\n color: ${t(colors.gray[500], colors.gray[500])};\n border: none;\n display: inline-flex;\n padding: 0px;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n width: ${size[3]};\n height: ${size[3]};\n position: relative;\n z-index: 1;\n\n &:hover svg {\n color: ${t(colors.gray[600], colors.gray[400])};\n }\n\n &:focus-visible {\n border-radius: ${border.radius.xs};\n outline: 2px solid ${t(colors.blue[700], colors.blue[800])};\n outline-offset: 2px;\n }\n `,\n expanderContainer: css`\n position: relative;\n `,\n expander: css`\n position: absolute;\n cursor: pointer;\n left: -16px;\n top: 3px;\n & path {\n stroke: ${t(colors.blue[400], colors.blue[300])};\n }\n & svg {\n width: ${size[3]};\n height: ${size[3]};\n }\n\n display: inline-flex;\n align-items: center;\n transition: all 0.1s ease;\n `,\n expandedLine: (hasBorder: boolean) => css`\n display: block;\n padding-left: 0.75rem;\n margin-left: -0.7rem;\n ${hasBorder\n ? `border-left: 1px solid ${t(colors.blue[400], colors.blue[300])};`\n : ''}\n `,\n collapsible: css`\n cursor: pointer;\n transition: all 0.2s ease;\n &:hover {\n background-color: ${t(colors.gray[100], colors.darkGray[700])};\n border-radius: ${tokens.border.radius.sm};\n padding: 0 ${tokens.size[1]};\n }\n `,\n actions: css`\n display: inline-flex;\n margin-left: ${size[2]};\n gap: ${size[2]};\n align-items: center;\n & svg {\n height: 12px;\n width: 12px;\n }\n `,\n valueCollapsed: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n `,\n valueFunction: css`\n color: ${t(colors.cyan[500], colors.cyan[400])};\n `,\n valueString: css`\n color: ${t(colors.green[500], colors.green[400])};\n `,\n valueNumber: css`\n color: ${t(colors.yellow[500], colors.yellow[400])};\n `,\n valueBoolean: css`\n color: ${t(colors.pink[500], colors.pink[400])};\n `,\n valueNull: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-style: italic;\n `,\n valueKey: css`\n color: ${t(colors.blue[400], colors.blue[300])};\n `,\n valueBraces: css`\n color: ${colors.gray[500]};\n `,\n valueContainer: (isRoot: boolean) => css`\n display: block;\n margin-left: ${isRoot ? '0' : '1rem'};\n\n &:not(:hover) .actions {\n display: none;\n }\n\n &:hover .actions {\n display: inline-flex;\n }\n `,\n },\n header: {\n row: css`\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: ${tokens.size[2]} ${tokens.size[2.5]};\n gap: ${tokens.size[2.5]};\n border-bottom: ${t(colors.gray[300], colors.darkGray[500])} 1px solid;\n align-items: center;\n `,\n logoAndToggleContainer: css`\n display: flex;\n gap: ${tokens.size[3]};\n align-items: center;\n & > button {\n padding: 0;\n background: transparent;\n border: none;\n display: flex;\n gap: ${size[0.5]};\n flex-direction: column;\n }\n `,\n logo: css`\n cursor: pointer;\n display: flex;\n flex-direction: column;\n background-color: transparent;\n border: none;\n gap: ${tokens.size[0.5]};\n padding: 0px;\n &:hover {\n opacity: 0.7;\n }\n &:focus-visible {\n outline-offset: 4px;\n border-radius: ${border.radius.xs};\n outline: 2px solid ${colors.blue[800]};\n }\n `,\n tanstackLogo: css`\n font-size: ${font.size.md};\n font-weight: ${font.weight.bold};\n line-height: ${font.lineHeight.xs};\n white-space: nowrap;\n color: ${t(colors.gray[700], colors.gray[300])};\n `,\n flavorLogo: (flavorLight: string, flavorDark: string) => css`\n font-weight: ${font.weight.semibold};\n font-size: ${font.size.xs};\n background: linear-gradient(to right, ${t(flavorLight, flavorDark)});\n background-clip: text;\n -webkit-background-clip: text;\n line-height: 1;\n -webkit-text-fill-color: transparent;\n white-space: nowrap;\n `,\n },\n section: {\n main: css`\n margin-bottom: 2rem;\n padding: 1.5rem;\n background-color: ${t(colors.gray[50], colors.darkGray[800])};\n border: 1px solid ${t(colors.gray[300], colors.gray[700])};\n border-radius: 0.75rem;\n box-shadow: ${t(\n '0 1px 3px rgba(0,0,0,0.06)',\n '0 1px 3px rgba(0,0,0,0.18)',\n )};\n `,\n title: css`\n font-size: 1.125rem;\n font-weight: 600;\n color: ${t(colors.gray[900], colors.gray[100])};\n margin: 0 0 1rem 0;\n padding-bottom: 0.5rem;\n border-bottom: 1px solid ${t(colors.gray[300], colors.gray[700])};\n display: flex;\n align-items: center;\n gap: 0.5rem;\n text-align: left;\n `,\n icon: css`\n height: 20px;\n width: 20px;\n & > svg {\n height: 100%;\n width: 100%;\n }\n color: ${t(colors.purple[500], colors.purple[400])};\n `,\n description: css`\n color: ${t(colors.gray[500], colors.gray[400])};\n font-size: 0.875rem;\n margin: 0 0 1.5rem 0;\n line-height: 1.5;\n text-align: left;\n `,\n },\n mainPanel: {\n panel: (withPadding: boolean) => css`\n padding: ${withPadding ? tokens.size[4] : 0};\n background: ${t(colors.gray[50], colors.darkGray[700])};\n overflow-y: auto;\n height: 100%;\n `,\n },\n }\n}\n\nexport function useStyles() {\n const { theme } = useTheme()\n const [styles, setStyles] = createSignal(stylesFactory(theme()))\n createEffect(() => {\n setStyles(stylesFactory(theme()))\n })\n return styles\n}\n"],"names":[],"mappings":"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"}

package/dist/esm/utils/deep-keys.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+type CollapsibleKeys<T, TPrefix extends string = ''> = T extends ReadonlyArray<infer U> ? (TPrefix extends '' ? '' : TPrefix) | CollapsibleKeys<U, `${TPrefix}[${number}]`> : T extends object ? (TPrefix extends '' ? '' : TPrefix) | {
+    [K in Extract<keyof T, string>]: CollapsibleKeys<T[K], TPrefix extends '' ? `${K}` : `${TPrefix}.${K}`>;
+}[Extract<keyof T, string>] : never;
+export type CollapsiblePaths<T> = CollapsibleKeys<T> extends string ? CollapsibleKeys<T> : never;
+export {};

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@tanstack/devtools-ui",
-  "version": "0.3.4",
+  "version": "0.4.0",
   "description": "TanStack Devtools UI is a set of UI components for building devtool panels for your application.",
   "author": "Tanner Linsley",
   "license": "MIT",
@@ -46,13 +46,13 @@
   "dependencies": {
     "clsx": "^2.1.1",
     "goober": "^2.1.16",
-    "solid-js": "^1.9.7"
+    "solid-js": "^1.9.9"
   },
   "peerDependencies": {
     "solid-js": ">=1.9.7"
   },
   "devDependencies": {
-    "vite-plugin-solid": "^2.11.6"
+    "vite-plugin-solid": "^2.11.8"
   },
   "scripts": {
     "clean": "premove ./build ./dist",