@tanstack/router-devtools 1.20.1 → 1.20.3-alpha.1

package/README.md

@@ -1,3 +1,5 @@
+<img src="https://static.scarf.sh/a.png?x-pxid=d988eb79-b0fc-4a2b-8514-6a1ab932d188" />
+
 # TanStack React Router Devtools
 
-See https://tanstack.com/router/tools/devtools
+See https://tanstack.com/router/latest/docs/framework/react/devtools

package/dist/cjs/index.cjs

@@ -1,6 +1,15 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const devtools = require("./devtools.cjs");
-exports.TanStackRouterDevtools = devtools.TanStackRouterDevtools;
-exports.TanStackRouterDevtoolsPanel = devtools.TanStackRouterDevtoolsPanel;
+const reactRouterDevtools = require("@tanstack/react-router-devtools");
+console.warn(
+  "[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release."
+);
+Object.defineProperty(exports, "TanStackRouterDevtools", {
+  enumerable: true,
+  get: () => reactRouterDevtools.TanStackRouterDevtoolsInProd
+});
+Object.defineProperty(exports, "TanStackRouterDevtoolsPanel", {
+  enumerable: true,
+  get: () => reactRouterDevtools.TanStackRouterDevtoolsPanelInProd
+});
 //# sourceMappingURL=index.cjs.map

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}
+{"version":3,"file":"index.cjs","sources":["../../src/index.tsx"],"sourcesContent":["console.warn(\n  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',\n)\n\nexport { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'\nexport { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'\n"],"names":[],"mappings":";;;AAAA,QAAQ;AAAA,EACN;AACF;;;;;;;;;"}

package/dist/cjs/index.d.cts

@@ -1 +1,2 @@
-export * from './devtools.cjs';
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools';
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';

package/dist/esm/index.d.ts

@@ -1 +1,2 @@
-export * from './devtools.js';
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools';
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools';

package/dist/esm/index.js

@@ -1,6 +1,9 @@
-import { TanStackRouterDevtools, TanStackRouterDevtoolsPanel } from "./devtools.js";
+import { TanStackRouterDevtoolsInProd, TanStackRouterDevtoolsPanelInProd } from "@tanstack/react-router-devtools";
+console.warn(
+  "[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release."
+);
 export {
-  TanStackRouterDevtools,
-  TanStackRouterDevtoolsPanel
+  TanStackRouterDevtoolsInProd as TanStackRouterDevtools,
+  TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel
 };
 //# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"index.js","sources":["../../src/index.tsx"],"sourcesContent":["console.warn(\n  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',\n)\n\nexport { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'\nexport { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'\n"],"names":[],"mappings":";AAAA,QAAQ;AAAA,EACN;AACF;"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tanstack/router-devtools",
-  "version": "1.20.1",
-  "description": "",
+  "version": "1.20.3-alpha.1",
+  "description": "Modern and scalable routing for React applications",
   "author": "Tanner Linsley",
   "license": "MIT",
   "repository": {
@@ -9,15 +9,24 @@
     "url": "https://github.com/TanStack/router.git",
     "directory": "packages/router-devtools"
   },
-  "homepage": "https://tanstack.com/router/",
+  "homepage": "https://tanstack.com/router",
   "funding": {
     "type": "github",
     "url": "https://github.com/sponsors/tannerlinsley"
   },
+  "keywords": [
+    "react",
+    "location",
+    "router",
+    "routing",
+    "async",
+    "async router",
+    "typescript"
+  ],
   "type": "module",
-  "types": "dist/esm/index.d.ts",
-  "main": "dist/cjs/index.cjs",
-  "module": "dist/esm/index.js",
+  "types": "./dist/esm/index.d.ts",
+  "main": "./dist/cjs/index.cjs",
+  "module": "./dist/esm/index.js",
   "exports": {
     ".": {
       "import": {
@@ -32,42 +41,33 @@
     "./package.json": "./package.json"
   },
   "sideEffects": false,
-  "keywords": [
-    "react",
-    "location",
-    "router",
-    "routing",
-    "async",
-    "async router",
-    "typescript"
-  ],
-  "engines": {
-    "node": ">=12"
-  },
   "files": [
     "dist",
     "src"
   ],
+  "engines": {
+    "node": ">=12"
+  },
   "dependencies": {
-    "clsx": "^2.1.0",
-    "date-fns": "^2.29.1",
-    "goober": "^2.1.14",
-    "@tanstack/react-router": "1.20.1"
+    "clsx": "^2.1.1",
+    "goober": "^2.1.16",
+    "@tanstack/react-router-devtools": "^1.20.3-alpha.1"
   },
   "devDependencies": {
-    "@vitejs/plugin-react": "^4.2.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "vite": "^5.0.12"
+    "@vitejs/plugin-react": "^4.3.4",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "peerDependencies": {
-    "react": ">=16",
-    "react-dom": ">=16"
+    "csstype": "^3.0.10",
+    "react": ">=18.0.0 || >=19.0.0",
+    "react-dom": ">=18.0.0 || >=19.0.0",
+    "@tanstack/react-router": "^1.20.3-alpha.1"
+  },
+  "peerDependenciesMeta": {
+    "csstype": {
+      "optional": true
+    }
   },
-  "scripts": {
-    "clean": "rimraf ./dist && rimraf ./coverage",
-    "test:types": "tsc",
-    "test:build": "publint --strict",
-    "build": "vite build"
-  }
+  "scripts": {}
 }

package/src/index.tsx

@@ -1 +1,6 @@
-export * from './devtools'
+console.warn(
+  '[@tanstack/router-devtools] This package has moved to @tanstack/react-router-devtools. Please switch to the new package at your earliest convenience, as this package will be dropped in the next major version release.',
+)
+
+export { TanStackRouterDevtoolsInProd as TanStackRouterDevtools } from '@tanstack/react-router-devtools'
+export { TanStackRouterDevtoolsPanelInProd as TanStackRouterDevtoolsPanel } from '@tanstack/react-router-devtools'

package/dist/cjs/Explorer.cjs

@@ -1,306 +0,0 @@
-"use strict";
-Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const jsxRuntime = require("react/jsx-runtime");
-const React = require("react");
-const clsx = require("clsx");
-const tokens = require("./tokens.cjs");
-const utils = require("./utils.cjs");
-const goober = require("goober");
-function _interopNamespaceDefault(e) {
-  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
-  if (e) {
-    for (const k in e) {
-      if (k !== "default") {
-        const d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: () => e[k]
-        });
-      }
-    }
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
-const Expander = ({ expanded, style = {} }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: getStyles().expander, children: /* @__PURE__ */ jsxRuntime.jsx(
-  "svg",
-  {
-    xmlns: "http://www.w3.org/2000/svg",
-    width: "12",
-    height: "12",
-    fill: "none",
-    viewBox: "0 0 24 24",
-    className: clsx.clsx(getStyles().expanderIcon(expanded)),
-    children: /* @__PURE__ */ jsxRuntime.jsx(
-      "path",
-      {
-        stroke: "currentColor",
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: "2",
-        d: "M9 18l6-6-6-6"
-      }
-    )
-  }
-) });
-function chunkArray(array, size) {
-  if (size < 1)
-    return [];
-  let i = 0;
-  const result = [];
-  while (i < array.length) {
-    result.push(array.slice(i, i + size));
-    i = i + size;
-  }
-  return result;
-}
-const DefaultRenderer = ({
-  handleEntry,
-  label,
-  value,
-  subEntries = [],
-  subEntryPages = [],
-  type,
-  expanded = false,
-  toggleExpanded,
-  pageSize,
-  renderer
-}) => {
-  const [expandedPages, setExpandedPages] = React__namespace.useState([]);
-  const [valueSnapshot, setValueSnapshot] = React__namespace.useState(void 0);
-  const refreshValueSnapshot = () => {
-    setValueSnapshot(value());
-  };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().entry, children: subEntryPages.length ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      "button",
-      {
-        className: getStyles().expandButton,
-        onClick: () => toggleExpanded(),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Expander, { expanded }),
-          label,
-          /* @__PURE__ */ jsxRuntime.jsxs("span", { className: getStyles().info, children: [
-            String(type).toLowerCase() === "iterable" ? "(Iterable) " : "",
-            subEntries.length,
-            " ",
-            subEntries.length > 1 ? `items` : `item`
-          ] })
-        ]
-      }
-    ),
-    expanded ? subEntryPages.length === 1 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().subEntries, children: subEntries.map((entry, index) => handleEntry(entry)) }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().subEntries, children: subEntryPages.map((entries, index) => {
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: getStyles().entry, children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
-          {
-            className: clsx.clsx(getStyles().labelButton, "labelButton"),
-            onClick: () => setExpandedPages(
-              (old) => old.includes(index) ? old.filter((d) => d !== index) : [...old, index]
-            ),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(Expander, { expanded: expandedPages.includes(index) }),
-              " ",
-              "[",
-              index * pageSize,
-              " ...",
-              " ",
-              index * pageSize + pageSize - 1,
-              "]"
-            ]
-          }
-        ),
-        expandedPages.includes(index) ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().subEntries, children: entries.map((entry) => handleEntry(entry)) }) : null
-      ] }) }, index);
-    }) }) : null
-  ] }) : type === "function" ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
-    Explorer,
-    {
-      renderer,
-      label: /* @__PURE__ */ jsxRuntime.jsxs(
-        "button",
-        {
-          onClick: refreshValueSnapshot,
-          className: getStyles().refreshValueBtn,
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
-            " 🔄",
-            " "
-          ]
-        }
-      ),
-      value: valueSnapshot,
-      defaultExpanded: {}
-    }
-  ) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-      label,
-      ":"
-    ] }),
-    " ",
-    /* @__PURE__ */ jsxRuntime.jsx("span", { className: getStyles().value, children: utils.displayValue(value) })
-  ] }) });
-};
-function isIterable(x) {
-  return Symbol.iterator in x;
-}
-function Explorer({
-  value,
-  defaultExpanded,
-  renderer = DefaultRenderer,
-  pageSize = 100,
-  filterSubEntries,
-  ...rest
-}) {
-  const [expanded, setExpanded] = React__namespace.useState(Boolean(defaultExpanded));
-  const toggleExpanded = React__namespace.useCallback(() => setExpanded((old) => !old), []);
-  let type = typeof value;
-  let subEntries = [];
-  const makeProperty = (sub) => {
-    const subDefaultExpanded = defaultExpanded === true ? { [sub.label]: true } : defaultExpanded == null ? void 0 : defaultExpanded[sub.label];
-    return {
-      ...sub,
-      defaultExpanded: subDefaultExpanded
-    };
-  };
-  if (Array.isArray(value)) {
-    type = "array";
-    subEntries = value.map(
-      (d, i) => makeProperty({
-        label: i.toString(),
-        value: d
-      })
-    );
-  } else if (value !== null && typeof value === "object" && isIterable(value) && typeof value[Symbol.iterator] === "function") {
-    type = "Iterable";
-    subEntries = Array.from(
-      value,
-      (val, i) => makeProperty({
-        label: i.toString(),
-        value: val
-      })
-    );
-  } else if (typeof value === "object" && value !== null) {
-    type = "object";
-    subEntries = Object.entries(value).map(
-      ([key, val]) => makeProperty({
-        label: key,
-        value: val
-      })
-    );
-  }
-  subEntries = filterSubEntries ? filterSubEntries(subEntries) : subEntries;
-  const subEntryPages = chunkArray(subEntries, pageSize);
-  return renderer({
-    handleEntry: (entry) => /* @__PURE__ */ jsxRuntime.jsx(
-      Explorer,
-      {
-        value,
-        renderer,
-        filterSubEntries,
-        ...rest,
-        ...entry
-      },
-      entry.label
-    ),
-    type,
-    subEntries,
-    subEntryPages,
-    value,
-    expanded,
-    toggleExpanded,
-    pageSize,
-    ...rest
-  });
-}
-const stylesFactory = () => {
-  const { colors, font, size, alpha, shadow, border } = tokens.tokens;
-  const { fontFamily, lineHeight, size: fontSize } = font;
-  return {
-    entry: goober.css`
-      font-family: ${fontFamily.mono};
-      font-size: ${fontSize.xs};
-      line-height: ${lineHeight.sm};
-      outline: none;
-      word-break: break-word;
-    `,
-    labelButton: goober.css`
-      cursor: pointer;
-      color: inherit;
-      font: inherit;
-      outline: inherit;
-      background: transparent;
-      border: none;
-      padding: 0;
-    `,
-    expander: goober.css`
-      display: inline-flex;
-      align-items: center;
-      justify-content: center;
-      width: ${size[3]};
-      height: ${size[3]};
-      padding-left: 3px;
-      box-sizing: content-box;
-    `,
-    expanderIcon: (expanded) => {
-      if (expanded) {
-        return goober.css`
-          transform: rotate(90deg);
-          transition: transform 0.1s ease;
-        `;
-      }
-      return goober.css`
-        transform: rotate(0deg);
-        transition: transform 0.1s ease;
-      `;
-    },
-    expandButton: goober.css`
-      display: flex;
-      gap: ${size[1]};
-      align-items: center;
-      cursor: pointer;
-      color: inherit;
-      font: inherit;
-      outline: inherit;
-      background: transparent;
-      border: none;
-      padding: 0;
-    `,
-    value: goober.css`
-      color: ${colors.purple[400]};
-    `,
-    subEntries: goober.css`
-      margin-left: ${size[2]};
-      padding-left: ${size[2]};
-      border-left: 2px solid ${colors.darkGray[400]};
-    `,
-    info: goober.css`
-      color: ${colors.gray[500]};
-      font-size: ${fontSize["2xs"]};
-      padding-left: ${size[1]};
-    `,
-    refreshValueBtn: goober.css`
-      appearance: none;
-      border: 0;
-      cursor: pointer;
-      background: transparent;
-      color: inherit;
-      padding: 0;
-      font-family: ${fontFamily.mono};
-      font-size: ${fontSize.xs};
-    `
-  };
-};
-let _styles = null;
-function getStyles() {
-  if (_styles)
-    return _styles;
-  _styles = stylesFactory();
-  return _styles;
-}
-exports.DefaultRenderer = DefaultRenderer;
-exports.Expander = Expander;
-exports.chunkArray = chunkArray;
-exports.default = Explorer;
-//# sourceMappingURL=Explorer.cjs.map

package/dist/cjs/Explorer.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"Explorer.cjs","sources":["../../src/Explorer.tsx"],"sourcesContent":["import * as React from 'react'\nimport { clsx as cx } from 'clsx'\nimport { tokens } from './tokens'\nimport { displayValue, styled } from './utils'\nimport { css } from 'goober'\n\ntype ExpanderProps = {\n  expanded: boolean\n  style?: React.CSSProperties\n}\n\nexport const Expander = ({ expanded, style = {} }: ExpanderProps) => (\n  <span className={getStyles().expander}>\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"12\"\n      height=\"12\"\n      fill=\"none\"\n      viewBox=\"0 0 24 24\"\n      className={cx(getStyles().expanderIcon(expanded))}\n    >\n      <path\n        stroke=\"currentColor\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n        strokeWidth=\"2\"\n        d=\"M9 18l6-6-6-6\"\n      ></path>\n    </svg>\n  </span>\n)\n\ntype Entry = {\n  label: string\n}\n\ntype RendererProps = {\n  handleEntry: HandleEntryFn\n  label?: React.ReactNode\n  value: unknown\n  subEntries: Entry[]\n  subEntryPages: Entry[][]\n  type: string\n  expanded: boolean\n  toggleExpanded: () => void\n  pageSize: number\n  renderer?: Renderer\n  filterSubEntries?: (subEntries: Property[]) => Property[]\n}\n\n/**\n * Chunk elements in the array by size\n *\n * when the array cannot be chunked evenly by size, the last chunk will be\n * filled with the remaining elements\n *\n * @example\n * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]\n */\nexport function chunkArray<T>(array: T[], size: number): T[][] {\n  if (size < 1) return []\n  let i = 0\n  const result: T[][] = []\n  while (i < array.length) {\n    result.push(array.slice(i, i + size))\n    i = i + size\n  }\n  return result\n}\n\ntype Renderer = (props: RendererProps) => React.ReactNode\n\nexport const DefaultRenderer: Renderer = ({\n  handleEntry,\n  label,\n  value,\n  subEntries = [],\n  subEntryPages = [],\n  type,\n  expanded = false,\n  toggleExpanded,\n  pageSize,\n  renderer,\n}) => {\n  const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n  const [valueSnapshot, setValueSnapshot] = React.useState(undefined)\n\n  const refreshValueSnapshot = () => {\n    setValueSnapshot((value as () => any)())\n  }\n\n  return (\n    <div className={getStyles().entry}>\n      {subEntryPages.length ? (\n        <>\n          <button\n            className={getStyles().expandButton}\n            onClick={() => toggleExpanded()}\n          >\n            <Expander expanded={expanded} />\n            {label}\n            <span className={getStyles().info}>\n              {String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : ''}\n              {subEntries.length} {subEntries.length > 1 ? `items` : `item`}\n            </span>\n          </button>\n          {expanded ? (\n            subEntryPages.length === 1 ? (\n              <div className={getStyles().subEntries}>\n                {subEntries.map((entry, index) => handleEntry(entry))}\n              </div>\n            ) : (\n              <div className={getStyles().subEntries}>\n                {subEntryPages.map((entries, index) => {\n                  return (\n                    <div key={index}>\n                      <div className={getStyles().entry}>\n                        <button\n                          className={cx(getStyles().labelButton, 'labelButton')}\n                          onClick={() =>\n                            setExpandedPages((old) =>\n                              old.includes(index)\n                                ? old.filter((d) => d !== index)\n                                : [...old, index],\n                            )\n                          }\n                        >\n                          <Expander expanded={expandedPages.includes(index)} />{' '}\n                          [{index * pageSize} ...{' '}\n                          {index * pageSize + pageSize - 1}]\n                        </button>\n                        {expandedPages.includes(index) ? (\n                          <div className={getStyles().subEntries}>\n                            {entries.map((entry) => handleEntry(entry))}\n                          </div>\n                        ) : null}\n                      </div>\n                    </div>\n                  )\n                })}\n              </div>\n            )\n          ) : null}\n        </>\n      ) : type === 'function' ? (\n        <>\n          <Explorer\n            renderer={renderer}\n            label={\n              <button\n                onClick={refreshValueSnapshot}\n                className={getStyles().refreshValueBtn}\n              >\n                <span>{label}</span> 🔄{' '}\n              </button>\n            }\n            value={valueSnapshot}\n            defaultExpanded={{}}\n          />\n        </>\n      ) : (\n        <>\n          <span>{label}:</span>{' '}\n          <span className={getStyles().value}>{displayValue(value)}</span>\n        </>\n      )}\n    </div>\n  )\n}\n\ntype HandleEntryFn = (entry: Entry) => React.ReactNode\n\ntype ExplorerProps = Partial<RendererProps> & {\n  renderer?: Renderer\n  defaultExpanded?: true | Record<string, boolean>\n}\n\ntype Property = {\n  defaultExpanded?: boolean | Record<string, boolean>\n  label: string\n  value: unknown\n}\n\nfunction isIterable(x: any): x is Iterable<unknown> {\n  return Symbol.iterator in x\n}\n\nexport default function Explorer({\n  value,\n  defaultExpanded,\n  renderer = DefaultRenderer,\n  pageSize = 100,\n  filterSubEntries,\n  ...rest\n}: ExplorerProps) {\n  const [expanded, setExpanded] = React.useState(Boolean(defaultExpanded))\n  const toggleExpanded = React.useCallback(() => setExpanded((old) => !old), [])\n\n  let type: string = typeof value\n  let subEntries: Property[] = []\n\n  const makeProperty = (sub: { label: string; value: unknown }): Property => {\n    const subDefaultExpanded =\n      defaultExpanded === true\n        ? { [sub.label]: true }\n        : defaultExpanded?.[sub.label]\n    return {\n      ...sub,\n      defaultExpanded: subDefaultExpanded,\n    }\n  }\n\n  if (Array.isArray(value)) {\n    type = 'array'\n    subEntries = value.map((d, i) =>\n      makeProperty({\n        label: i.toString(),\n        value: d,\n      }),\n    )\n  } else if (\n    value !== null &&\n    typeof value === 'object' &&\n    isIterable(value) &&\n    typeof value[Symbol.iterator] === 'function'\n  ) {\n    type = 'Iterable'\n    subEntries = Array.from(value, (val, i) =>\n      makeProperty({\n        label: i.toString(),\n        value: val,\n      }),\n    )\n  } else if (typeof value === 'object' && value !== null) {\n    type = 'object'\n    subEntries = Object.entries(value).map(([key, val]) =>\n      makeProperty({\n        label: key,\n        value: val,\n      }),\n    )\n  }\n\n  subEntries = filterSubEntries ? filterSubEntries(subEntries) : subEntries\n\n  const subEntryPages = chunkArray(subEntries, pageSize)\n\n  return renderer({\n    handleEntry: (entry) => (\n      <Explorer\n        key={entry.label}\n        value={value}\n        renderer={renderer}\n        filterSubEntries={filterSubEntries}\n        {...rest}\n        {...entry}\n      />\n    ),\n    type,\n    subEntries,\n    subEntryPages,\n    value,\n    expanded,\n    toggleExpanded,\n    pageSize,\n    ...rest,\n  })\n}\n\nconst stylesFactory = () => {\n  const { colors, font, size, alpha, shadow, border } = tokens\n  const { fontFamily, lineHeight, size: fontSize } = font\n\n  return {\n    entry: css`\n      font-family: ${fontFamily.mono};\n      font-size: ${fontSize.xs};\n      line-height: ${lineHeight.sm};\n      outline: none;\n      word-break: break-word;\n    `,\n    labelButton: css`\n      cursor: pointer;\n      color: inherit;\n      font: inherit;\n      outline: inherit;\n      background: transparent;\n      border: none;\n      padding: 0;\n    `,\n    expander: css`\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: ${size[3]};\n      height: ${size[3]};\n      padding-left: 3px;\n      box-sizing: content-box;\n    `,\n    expanderIcon: (expanded: boolean) => {\n      if (expanded) {\n        return css`\n          transform: rotate(90deg);\n          transition: transform 0.1s ease;\n        `\n      }\n      return css`\n        transform: rotate(0deg);\n        transition: transform 0.1s ease;\n      `\n    },\n    expandButton: css`\n      display: flex;\n      gap: ${size[1]};\n      align-items: center;\n      cursor: pointer;\n      color: inherit;\n      font: inherit;\n      outline: inherit;\n      background: transparent;\n      border: none;\n      padding: 0;\n    `,\n    value: css`\n      color: ${colors.purple[400]};\n    `,\n    subEntries: css`\n      margin-left: ${size[2]};\n      padding-left: ${size[2]};\n      border-left: 2px solid ${colors.darkGray[400]};\n    `,\n    info: css`\n      color: ${colors.gray[500]};\n      font-size: ${fontSize['2xs']};\n      padding-left: ${size[1]};\n    `,\n    refreshValueBtn: css`\n      appearance: none;\n      border: 0;\n      cursor: pointer;\n      background: transparent;\n      color: inherit;\n      padding: 0;\n      font-family: ${fontFamily.mono};\n      font-size: ${fontSize.xs};\n    `,\n  }\n}\n\nlet _styles: ReturnType<typeof stylesFactory> | null = null\n\nfunction getStyles() {\n  if (_styles) return _styles\n  _styles = stylesFactory()\n\n  return _styles\n}\n"],"names":["jsx","cx","React","jsxs","Fragment","displayValue","tokens","css"],"mappings":"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"}

package/dist/cjs/Explorer.d.cts

@@ -1,46 +0,0 @@
-import * as React from 'react';
-type ExpanderProps = {
-    expanded: boolean;
-    style?: React.CSSProperties;
-};
-export declare const Expander: ({ expanded, style }: ExpanderProps) => React.JSX.Element;
-type Entry = {
-    label: string;
-};
-type RendererProps = {
-    handleEntry: HandleEntryFn;
-    label?: React.ReactNode;
-    value: unknown;
-    subEntries: Entry[];
-    subEntryPages: Entry[][];
-    type: string;
-    expanded: boolean;
-    toggleExpanded: () => void;
-    pageSize: number;
-    renderer?: Renderer;
-    filterSubEntries?: (subEntries: Property[]) => Property[];
-};
-/**
- * Chunk elements in the array by size
- *
- * when the array cannot be chunked evenly by size, the last chunk will be
- * filled with the remaining elements
- *
- * @example
- * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]
- */
-export declare function chunkArray<T>(array: T[], size: number): T[][];
-type Renderer = (props: RendererProps) => React.ReactNode;
-export declare const DefaultRenderer: Renderer;
-type HandleEntryFn = (entry: Entry) => React.ReactNode;
-type ExplorerProps = Partial<RendererProps> & {
-    renderer?: Renderer;
-    defaultExpanded?: true | Record<string, boolean>;
-};
-type Property = {
-    defaultExpanded?: boolean | Record<string, boolean>;
-    label: string;
-    value: unknown;
-};
-export default function Explorer({ value, defaultExpanded, renderer, pageSize, filterSubEntries, ...rest }: ExplorerProps): React.ReactNode;
-export {};