@tanstack/router-devtools 1.16.6 → 1.17.1
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.
- package/dist/cjs/Explorer.cjs +152 -92
- package/dist/cjs/Explorer.cjs.map +1 -1
- package/dist/cjs/Explorer.d.cts +0 -7
- package/dist/cjs/devtools.cjs +924 -905
- package/dist/cjs/devtools.cjs.map +1 -1
- package/dist/cjs/logo.cjs +1012 -0
- package/dist/cjs/logo.cjs.map +1 -0
- package/dist/cjs/logo.d.cts +2 -0
- package/dist/cjs/tokens.cjs +302 -0
- package/dist/cjs/tokens.cjs.map +1 -0
- package/dist/cjs/tokens.d.cts +298 -0
- package/dist/cjs/utils.cjs +5 -33
- package/dist/cjs/utils.cjs.map +1 -1
- package/dist/cjs/utils.d.cts +2 -2
- package/dist/esm/Explorer.d.ts +0 -7
- package/dist/esm/Explorer.js +153 -93
- package/dist/esm/Explorer.js.map +1 -1
- package/dist/esm/devtools.js +924 -905
- package/dist/esm/devtools.js.map +1 -1
- package/dist/esm/logo.d.ts +2 -0
- package/dist/esm/logo.js +1012 -0
- package/dist/esm/logo.js.map +1 -0
- package/dist/esm/tokens.d.ts +298 -0
- package/dist/esm/tokens.js +302 -0
- package/dist/esm/tokens.js.map +1 -0
- package/dist/esm/utils.d.ts +2 -2
- package/dist/esm/utils.js +5 -33
- package/dist/esm/utils.js.map +1 -1
- package/package.json +5 -2
- package/src/Explorer.tsx +155 -93
- package/src/devtools.tsx +974 -860
- package/src/logo.tsx +817 -0
- package/src/tokens.ts +305 -0
- package/src/utils.ts +12 -11
- package/dist/cjs/styledComponents.cjs +0 -93
- package/dist/cjs/styledComponents.cjs.map +0 -1
- package/dist/cjs/styledComponents.d.cts +0 -7
- package/dist/cjs/theme.cjs +0 -28
- package/dist/cjs/theme.cjs.map +0 -1
- package/dist/cjs/useMediaQuery.cjs +0 -27
- package/dist/cjs/useMediaQuery.cjs.map +0 -1
- package/dist/esm/styledComponents.d.ts +0 -7
- package/dist/esm/styledComponents.js +0 -93
- package/dist/esm/styledComponents.js.map +0 -1
- package/dist/esm/theme.js +0 -28
- package/dist/esm/theme.js.map +0 -1
- package/dist/esm/useMediaQuery.js +0 -28
- package/dist/esm/useMediaQuery.js.map +0 -1
- package/src/styledComponents.ts +0 -106
package/dist/cjs/Explorer.cjs
CHANGED
|
@@ -2,7 +2,10 @@
|
|
|
2
2
|
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
|
|
3
3
|
const jsxRuntime = require("react/jsx-runtime");
|
|
4
4
|
const React = require("react");
|
|
5
|
+
const clsx = require("clsx");
|
|
6
|
+
const tokens = require("./tokens.cjs");
|
|
5
7
|
const utils = require("./utils.cjs");
|
|
8
|
+
const goober = require("goober");
|
|
6
9
|
function _interopNamespaceDefault(e) {
|
|
7
10
|
const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
|
|
8
11
|
if (e) {
|
|
@@ -20,53 +23,27 @@ function _interopNamespaceDefault(e) {
|
|
|
20
23
|
return Object.freeze(n);
|
|
21
24
|
}
|
|
22
25
|
const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
|
|
23
|
-
const
|
|
24
|
-
|
|
25
|
-
fontSize: ".7rem",
|
|
26
|
-
lineHeight: "1.7",
|
|
27
|
-
outline: "none",
|
|
28
|
-
wordBreak: "break-word"
|
|
29
|
-
});
|
|
30
|
-
const Label = utils.styled("span", {
|
|
31
|
-
color: "white"
|
|
32
|
-
});
|
|
33
|
-
const LabelButton = utils.styled("button", {
|
|
34
|
-
cursor: "pointer",
|
|
35
|
-
color: "white"
|
|
36
|
-
});
|
|
37
|
-
const ExpandButton = utils.styled("button", {
|
|
38
|
-
cursor: "pointer",
|
|
39
|
-
color: "inherit",
|
|
40
|
-
font: "inherit",
|
|
41
|
-
outline: "inherit",
|
|
42
|
-
background: "transparent",
|
|
43
|
-
border: "none",
|
|
44
|
-
padding: 0
|
|
45
|
-
});
|
|
46
|
-
const Value = utils.styled("span", (_props, theme) => ({
|
|
47
|
-
color: theme.danger
|
|
48
|
-
}));
|
|
49
|
-
const SubEntries = utils.styled("div", {
|
|
50
|
-
marginLeft: ".1em",
|
|
51
|
-
paddingLeft: "1em",
|
|
52
|
-
borderLeft: "2px solid rgba(0,0,0,.15)"
|
|
53
|
-
});
|
|
54
|
-
const Info = utils.styled("span", {
|
|
55
|
-
color: "grey",
|
|
56
|
-
fontSize: ".7em"
|
|
57
|
-
});
|
|
58
|
-
const Expander = ({ expanded, style = {} }) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
59
|
-
"span",
|
|
26
|
+
const Expander = ({ expanded, style = {} }) => /* @__PURE__ */ jsxRuntime.jsx("span", { className: getStyles().expander, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
27
|
+
"svg",
|
|
60
28
|
{
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
children:
|
|
29
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
30
|
+
width: "12",
|
|
31
|
+
height: "12",
|
|
32
|
+
fill: "none",
|
|
33
|
+
viewBox: "0 0 24 24",
|
|
34
|
+
className: clsx.clsx(getStyles().expanderIcon(expanded)),
|
|
35
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
36
|
+
"path",
|
|
37
|
+
{
|
|
38
|
+
stroke: "currentColor",
|
|
39
|
+
strokeLinecap: "round",
|
|
40
|
+
strokeLinejoin: "round",
|
|
41
|
+
strokeWidth: "2",
|
|
42
|
+
d: "M9 18l6-6-6-6"
|
|
43
|
+
}
|
|
44
|
+
)
|
|
68
45
|
}
|
|
69
|
-
);
|
|
46
|
+
) });
|
|
70
47
|
function chunkArray(array, size) {
|
|
71
48
|
if (size < 1)
|
|
72
49
|
return [];
|
|
@@ -95,39 +72,48 @@ const DefaultRenderer = ({
|
|
|
95
72
|
const refreshValueSnapshot = () => {
|
|
96
73
|
setValueSnapshot(value());
|
|
97
74
|
};
|
|
98
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
99
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
] }),
|
|
111
|
-
expanded ? subEntryPages.length === 1 ? /* @__PURE__ */ jsxRuntime.jsx(SubEntries, { children: subEntries.map((entry, index) => handleEntry(entry)) }) : /* @__PURE__ */ jsxRuntime.jsx(SubEntries, { children: subEntryPages.map((entries, index) => /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs(Entry, { children: [
|
|
112
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
113
|
-
LabelButton,
|
|
114
|
-
{
|
|
115
|
-
onClick: () => setExpandedPages(
|
|
116
|
-
(old) => old.includes(index) ? old.filter((d) => d !== index) : [...old, index]
|
|
117
|
-
),
|
|
118
|
-
children: [
|
|
119
|
-
/* @__PURE__ */ jsxRuntime.jsx(Expander, { expanded }),
|
|
120
|
-
" [",
|
|
121
|
-
index * pageSize,
|
|
122
|
-
" ...",
|
|
75
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().entry, children: subEntryPages.length ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
76
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
77
|
+
"button",
|
|
78
|
+
{
|
|
79
|
+
className: getStyles().expandButton,
|
|
80
|
+
onClick: () => toggleExpanded(),
|
|
81
|
+
children: [
|
|
82
|
+
/* @__PURE__ */ jsxRuntime.jsx(Expander, { expanded }),
|
|
83
|
+
label,
|
|
84
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: getStyles().info, children: [
|
|
85
|
+
String(type).toLowerCase() === "iterable" ? "(Iterable) " : "",
|
|
86
|
+
subEntries.length,
|
|
123
87
|
" ",
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
88
|
+
subEntries.length > 1 ? `items` : `item`
|
|
89
|
+
] })
|
|
90
|
+
]
|
|
91
|
+
}
|
|
92
|
+
),
|
|
93
|
+
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) => {
|
|
94
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: getStyles().entry, children: [
|
|
95
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
96
|
+
"button",
|
|
97
|
+
{
|
|
98
|
+
className: clsx.clsx(getStyles().labelButton, "labelButton"),
|
|
99
|
+
onClick: () => setExpandedPages(
|
|
100
|
+
(old) => old.includes(index) ? old.filter((d) => d !== index) : [...old, index]
|
|
101
|
+
),
|
|
102
|
+
children: [
|
|
103
|
+
/* @__PURE__ */ jsxRuntime.jsx(Expander, { expanded: expandedPages.includes(index) }),
|
|
104
|
+
" ",
|
|
105
|
+
"[",
|
|
106
|
+
index * pageSize,
|
|
107
|
+
" ...",
|
|
108
|
+
" ",
|
|
109
|
+
index * pageSize + pageSize - 1,
|
|
110
|
+
"]"
|
|
111
|
+
]
|
|
112
|
+
}
|
|
113
|
+
),
|
|
114
|
+
expandedPages.includes(index) ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: getStyles().subEntries, children: entries.map((entry) => handleEntry(entry)) }) : null
|
|
115
|
+
] }) }, index);
|
|
116
|
+
}) }) : null
|
|
131
117
|
] }) : type === "function" ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
132
118
|
Explorer,
|
|
133
119
|
{
|
|
@@ -136,13 +122,9 @@ const DefaultRenderer = ({
|
|
|
136
122
|
"button",
|
|
137
123
|
{
|
|
138
124
|
onClick: refreshValueSnapshot,
|
|
139
|
-
|
|
140
|
-
appearance: "none",
|
|
141
|
-
border: "0",
|
|
142
|
-
background: "transparent"
|
|
143
|
-
},
|
|
125
|
+
className: getStyles().refreshValueBtn,
|
|
144
126
|
children: [
|
|
145
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
127
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { children: label }),
|
|
146
128
|
" 🔄",
|
|
147
129
|
" "
|
|
148
130
|
]
|
|
@@ -152,12 +134,12 @@ const DefaultRenderer = ({
|
|
|
152
134
|
defaultExpanded: {}
|
|
153
135
|
}
|
|
154
136
|
) }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
155
|
-
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
137
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
|
|
156
138
|
label,
|
|
157
139
|
":"
|
|
158
140
|
] }),
|
|
159
141
|
" ",
|
|
160
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
142
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: getStyles().value, children: utils.displayValue(value) })
|
|
161
143
|
] }) });
|
|
162
144
|
};
|
|
163
145
|
function isIterable(x) {
|
|
@@ -232,15 +214,93 @@ function Explorer({
|
|
|
232
214
|
...rest
|
|
233
215
|
});
|
|
234
216
|
}
|
|
217
|
+
const stylesFactory = () => {
|
|
218
|
+
const { colors, font, size, alpha, shadow, border } = tokens.tokens;
|
|
219
|
+
const { fontFamily, lineHeight, size: fontSize } = font;
|
|
220
|
+
return {
|
|
221
|
+
entry: goober.css`
|
|
222
|
+
font-family: ${fontFamily.mono};
|
|
223
|
+
font-size: ${fontSize.xs};
|
|
224
|
+
line-height: ${lineHeight.sm};
|
|
225
|
+
outline: none;
|
|
226
|
+
word-break: break-word;
|
|
227
|
+
`,
|
|
228
|
+
labelButton: goober.css`
|
|
229
|
+
cursor: pointer;
|
|
230
|
+
color: inherit;
|
|
231
|
+
font: inherit;
|
|
232
|
+
outline: inherit;
|
|
233
|
+
background: transparent;
|
|
234
|
+
border: none;
|
|
235
|
+
padding: 0;
|
|
236
|
+
`,
|
|
237
|
+
expander: goober.css`
|
|
238
|
+
display: inline-flex;
|
|
239
|
+
align-items: center;
|
|
240
|
+
justify-content: center;
|
|
241
|
+
width: ${size[3]};
|
|
242
|
+
height: ${size[3]};
|
|
243
|
+
padding-left: 3px;
|
|
244
|
+
box-sizing: content-box;
|
|
245
|
+
`,
|
|
246
|
+
expanderIcon: (expanded) => {
|
|
247
|
+
if (expanded) {
|
|
248
|
+
return goober.css`
|
|
249
|
+
transform: rotate(90deg);
|
|
250
|
+
transition: transform 0.1s ease;
|
|
251
|
+
`;
|
|
252
|
+
}
|
|
253
|
+
return goober.css`
|
|
254
|
+
transform: rotate(0deg);
|
|
255
|
+
transition: transform 0.1s ease;
|
|
256
|
+
`;
|
|
257
|
+
},
|
|
258
|
+
expandButton: goober.css`
|
|
259
|
+
display: flex;
|
|
260
|
+
gap: ${size[1]};
|
|
261
|
+
align-items: center;
|
|
262
|
+
cursor: pointer;
|
|
263
|
+
color: inherit;
|
|
264
|
+
font: inherit;
|
|
265
|
+
outline: inherit;
|
|
266
|
+
background: transparent;
|
|
267
|
+
border: none;
|
|
268
|
+
padding: 0;
|
|
269
|
+
`,
|
|
270
|
+
value: goober.css`
|
|
271
|
+
color: ${colors.purple[400]};
|
|
272
|
+
`,
|
|
273
|
+
subEntries: goober.css`
|
|
274
|
+
margin-left: ${size[2]};
|
|
275
|
+
padding-left: ${size[2]};
|
|
276
|
+
border-left: 2px solid ${colors.darkGray[400]};
|
|
277
|
+
`,
|
|
278
|
+
info: goober.css`
|
|
279
|
+
color: ${colors.gray[500]};
|
|
280
|
+
font-size: ${fontSize["2xs"]};
|
|
281
|
+
padding-left: ${size[1]};
|
|
282
|
+
`,
|
|
283
|
+
refreshValueBtn: goober.css`
|
|
284
|
+
appearance: none;
|
|
285
|
+
border: 0;
|
|
286
|
+
cursor: pointer;
|
|
287
|
+
background: transparent;
|
|
288
|
+
color: inherit;
|
|
289
|
+
padding: 0;
|
|
290
|
+
font-family: ${fontFamily.mono};
|
|
291
|
+
font-size: ${fontSize.xs};
|
|
292
|
+
`
|
|
293
|
+
};
|
|
294
|
+
};
|
|
295
|
+
let _styles = null;
|
|
296
|
+
function getStyles() {
|
|
297
|
+
if (_styles)
|
|
298
|
+
return _styles;
|
|
299
|
+
_styles = stylesFactory();
|
|
300
|
+
return _styles;
|
|
301
|
+
}
|
|
235
302
|
exports.DefaultRenderer = DefaultRenderer;
|
|
236
|
-
exports.Entry = Entry;
|
|
237
|
-
exports.ExpandButton = ExpandButton;
|
|
238
303
|
exports.Expander = Expander;
|
|
239
|
-
exports.Info = Info;
|
|
240
|
-
exports.Label = Label;
|
|
241
|
-
exports.LabelButton = LabelButton;
|
|
242
|
-
exports.SubEntries = SubEntries;
|
|
243
|
-
exports.Value = Value;
|
|
244
304
|
exports.chunkArray = chunkArray;
|
|
245
305
|
exports.default = Explorer;
|
|
246
306
|
//# sourceMappingURL=Explorer.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Explorer.cjs","sources":["../../src/Explorer.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { displayValue, styled } from './utils'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '.7rem',\n lineHeight: '1.7',\n outline: 'none',\n wordBreak: 'break-word',\n})\n\nexport const Label = styled('span', {\n color: 'white',\n})\n\nexport const LabelButton = styled('button', {\n cursor: 'pointer',\n color: 'white',\n})\n\nexport const ExpandButton = styled('button', {\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n})\n\nexport const Value = styled('span', (_props, theme) => ({\n color: theme.danger,\n}))\n\nexport const SubEntries = styled('div', {\n marginLeft: '.1em',\n paddingLeft: '1em',\n borderLeft: '2px solid rgba(0,0,0,.15)',\n})\n\nexport const Info = styled('span', {\n color: 'grey',\n fontSize: '.7em',\n})\n\ntype ExpanderProps = {\n expanded: boolean\n style?: React.CSSProperties\n}\n\nexport const Expander = ({ expanded, style = {} }: ExpanderProps) => (\n <span\n style={{\n display: 'inline-block',\n transition: 'all .1s ease',\n transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,\n ...style,\n }}\n >\n ▶\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) => JSX.Element\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 <Entry>\n {subEntryPages.length ? (\n <>\n <ExpandButton onClick={() => toggleExpanded()}>\n <Expander expanded={expanded} /> {label}{' '}\n <Info>\n {String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : ''}\n {subEntries.length} {subEntries.length > 1 ? `items` : `item`}\n </Info>\n </ExpandButton>\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>\n {subEntries.map((entry, index) => handleEntry(entry))}\n </SubEntries>\n ) : (\n <SubEntries>\n {subEntryPages.map((entries, index) => (\n <div key={index}>\n <Entry>\n <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={expanded} /> [{index * pageSize} ...{' '}\n {index * pageSize + pageSize - 1}]\n </LabelButton>\n {expandedPages.includes(index) ? (\n <SubEntries>\n {entries.map((entry) => handleEntry(entry))}\n </SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : type === 'function' ? (\n <>\n <Explorer\n renderer={renderer}\n label={\n <button\n onClick={refreshValueSnapshot}\n style={{\n appearance: 'none',\n border: '0',\n background: 'transparent',\n }}\n >\n <Label>{label}</Label> 🔄{' '}\n </button>\n }\n value={valueSnapshot}\n defaultExpanded={{}}\n />\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype HandleEntryFn = (entry: Entry) => JSX.Element\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"],"names":["styled","jsx","React","jsxs","Fragment","displayValue"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAIa,MAAA,QAAQA,aAAO,OAAO;AAAA,EACjC,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,SAAS;AAAA,EACT,WAAW;AACb,CAAC;AAEY,MAAA,QAAQA,aAAO,QAAQ;AAAA,EAClC,OAAO;AACT,CAAC;AAEY,MAAA,cAAcA,aAAO,UAAU;AAAA,EAC1C,QAAQ;AAAA,EACR,OAAO;AACT,CAAC;AAEY,MAAA,eAAeA,aAAO,UAAU;AAAA,EAC3C,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,MAAM;AAAA,EACN,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,SAAS;AACX,CAAC;AAEM,MAAM,QAAQA,MAAAA,OAAO,QAAQ,CAAC,QAAQ,WAAW;AAAA,EACtD,OAAO,MAAM;AACf,EAAE;AAEW,MAAA,aAAaA,aAAO,OAAO;AAAA,EACtC,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AACd,CAAC;AAEY,MAAA,OAAOA,aAAO,QAAQ;AAAA,EACjC,OAAO;AAAA,EACP,UAAU;AACZ,CAAC;AAOM,MAAM,WAAW,CAAC,EAAE,UAAU,QAAQ,CAAA,EAC3C,MAAAC,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAO;AAAA,MACL,SAAS;AAAA,MACT,YAAY;AAAA,MACZ,WAAW,UAAU,WAAW,KAAK,CAAC,QAAQ,MAAM,aAAa,EAAE;AAAA,MACnE,GAAG;AAAA,IACL;AAAA,IACD,UAAA;AAAA,EAAA;AAED;AA8Bc,SAAA,WAAc,OAAY,MAAqB;AAC7D,MAAI,OAAO;AAAG,WAAO;AACrB,MAAI,IAAI;AACR,QAAM,SAAgB,CAAA;AACf,SAAA,IAAI,MAAM,QAAQ;AACvB,WAAO,KAAK,MAAM,MAAM,GAAG,IAAI,IAAI,CAAC;AACpC,QAAI,IAAI;AAAA,EACV;AACO,SAAA;AACT;AAIO,MAAM,kBAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,CAAC;AAAA,EACd,gBAAgB,CAAC;AAAA,EACjB;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,eAAe,gBAAgB,IAAIC,iBAAM,SAAmB,CAAA,CAAE;AACrE,QAAM,CAAC,eAAe,gBAAgB,IAAIA,iBAAM,SAAS,MAAS;AAElE,QAAM,uBAAuB,MAAM;AACjC,qBAAkB,OAAqB;AAAA,EAAA;AAGzC,SACGD,2BAAA,IAAA,OAAA,EACE,UAAc,cAAA,SAEXE,2BAAA,KAAAC,qBAAA,EAAA,UAAA;AAAA,IAAAD,2BAAA,KAAC,cAAa,EAAA,SAAS,MAAM,eAAA,GAC3B,UAAA;AAAA,MAAAF,+BAAC,YAAS,UAAoB;AAAA,MAAE;AAAA,MAAE;AAAA,MAAO;AAAA,sCACxC,MACE,EAAA,UAAA;AAAA,QAAA,OAAO,IAAI,EAAE,YAAY,MAAM,aAAa,gBAAgB;AAAA,QAC5D,WAAW;AAAA,QAAO;AAAA,QAAE,WAAW,SAAS,IAAI,UAAU;AAAA,MAAA,GACzD;AAAA,IAAA,GACF;AAAA,IACC,WACC,cAAc,WAAW,IACvBA,2BAAA,IAAC,YACE,EAAA,UAAA,WAAW,IAAI,CAAC,OAAO,UAAU,YAAY,KAAK,CAAC,EACtD,CAAA,IAECA,2BAAA,IAAA,YAAA,EACE,UAAc,cAAA,IAAI,CAAC,SAAS,UAC3BA,2BAAA,IAAC,OACC,EAAA,UAAAE,2BAAAA,KAAC,OACC,EAAA,UAAA;AAAA,MAAAA,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAAS,MACP;AAAA,YAAiB,CAAC,QAChB,IAAI,SAAS,KAAK,IACd,IAAI,OAAO,CAAC,MAAM,MAAM,KAAK,IAC7B,CAAC,GAAG,KAAK,KAAK;AAAA,UACpB;AAAA,UAGF,UAAA;AAAA,YAAAF,+BAAC,YAAS,UAAoB;AAAA,YAAE;AAAA,YAAG,QAAQ;AAAA,YAAS;AAAA,YAAK;AAAA,YACxD,QAAQ,WAAW,WAAW;AAAA,YAAE;AAAA,UAAA;AAAA,QAAA;AAAA,MACnC;AAAA,MACC,cAAc,SAAS,KAAK,mCAC1B,YACE,EAAA,UAAA,QAAQ,IAAI,CAAC,UAAU,YAAY,KAAK,CAAC,EAC5C,CAAA,IACE;AAAA,IAAA,EAAA,CACN,EAnBQ,GAAA,KAoBV,CACD,EAAA,CACH,IAEA;AAAA,EAAA,EACN,CAAA,IACE,SAAS,aAETA,2BAAA,IAAAG,WAAA,UAAA,EAAA,UAAAH,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,OACEE,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,OAAO;AAAA,YACL,YAAY;AAAA,YACZ,QAAQ;AAAA,YACR,YAAY;AAAA,UACd;AAAA,UAEA,UAAA;AAAA,YAAAF,2BAAAA,IAAC,SAAO,UAAM,MAAA,CAAA;AAAA,YAAQ;AAAA,YAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAC5B;AAAA,MAEF,OAAO;AAAA,MACP,iBAAiB,CAAC;AAAA,IAAA;AAAA,EACpB,EAAA,CACF,IAGEE,2BAAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,IAAAD,gCAAC,OAAO,EAAA,UAAA;AAAA,MAAA;AAAA,MAAM;AAAA,IAAA,GAAC;AAAA,IAAQ;AAAA,IAAEF,2BAAA,IAAA,OAAA,EAAO,UAAaI,MAAAA,aAAA,KAAK,EAAE,CAAA;AAAA,EAAA,EACtD,CAAA,EAEJ,CAAA;AAEJ;AAeA,SAAS,WAAW,GAAgC;AAClD,SAAO,OAAO,YAAY;AAC5B;AAEA,SAAwB,SAAS;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,GAAG;AACL,GAAkB;AACV,QAAA,CAAC,UAAU,WAAW,IAAIH,iBAAM,SAAS,QAAQ,eAAe,CAAC;AACjE,QAAA,iBAAiBA,iBAAM,YAAY,MAAM,YAAY,CAAC,QAAQ,CAAC,GAAG,GAAG,CAAA,CAAE;AAE7E,MAAI,OAAe,OAAO;AAC1B,MAAI,aAAyB,CAAA;AAEvB,QAAA,eAAe,CAAC,QAAqD;AACzE,UAAM,qBACJ,oBAAoB,OAChB,EAAE,CAAC,IAAI,KAAK,GAAG,SACf,mDAAkB,IAAI;AACrB,WAAA;AAAA,MACL,GAAG;AAAA,MACH,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAGE,MAAA,MAAM,QAAQ,KAAK,GAAG;AACjB,WAAA;AACP,iBAAa,MAAM;AAAA,MAAI,CAAC,GAAG,MACzB,aAAa;AAAA,QACX,OAAO,EAAE,SAAS;AAAA,QAClB,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAGH,WAAA,UAAU,QACV,OAAO,UAAU,YACjB,WAAW,KAAK,KAChB,OAAO,MAAM,OAAO,QAAQ,MAAM,YAClC;AACO,WAAA;AACP,iBAAa,MAAM;AAAA,MAAK;AAAA,MAAO,CAAC,KAAK,MACnC,aAAa;AAAA,QACX,OAAO,EAAE,SAAS;AAAA,QAClB,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAEM,WAAA,OAAO,UAAU,YAAY,UAAU,MAAM;AAC/C,WAAA;AACM,iBAAA,OAAO,QAAQ,KAAK,EAAE;AAAA,MAAI,CAAC,CAAC,KAAK,GAAG,MAC/C,aAAa;AAAA,QACX,OAAO;AAAA,QACP,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAEL;AAEa,eAAA,mBAAmB,iBAAiB,UAAU,IAAI;AAEzD,QAAA,gBAAgB,WAAW,YAAY,QAAQ;AAErD,SAAO,SAAS;AAAA,IACd,aAAa,CAAC,UACZD,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MALC,MAAM;AAAA,IAMb;AAAA,IAEF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,CACJ;AACH;;;;;;;;;;;;"}
|
|
1
|
+
{"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) => JSX.Element\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) => JSX.Element\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":";;;;;;;;;;;;;;;;;;;;;;;;;AAWO,MAAM,WAAW,CAAC,EAAE,UAAU,QAAQ,CAAG,EAAA,MAC7CA,2BAAAA,IAAA,QAAA,EAAK,WAAW,YAAY,UAC3B,UAAAA,2BAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,OAAM;AAAA,IACN,OAAM;AAAA,IACN,QAAO;AAAA,IACP,MAAK;AAAA,IACL,SAAQ;AAAA,IACR,WAAWC,KAAAA,KAAG,UAAY,EAAA,aAAa,QAAQ,CAAC;AAAA,IAEhD,UAAAD,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,QAAO;AAAA,QACP,eAAc;AAAA,QACd,gBAAe;AAAA,QACf,aAAY;AAAA,QACZ,GAAE;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AACH,GACF;AA8Bc,SAAA,WAAc,OAAY,MAAqB;AAC7D,MAAI,OAAO;AAAG,WAAO;AACrB,MAAI,IAAI;AACR,QAAM,SAAgB,CAAA;AACf,SAAA,IAAI,MAAM,QAAQ;AACvB,WAAO,KAAK,MAAM,MAAM,GAAG,IAAI,IAAI,CAAC;AACpC,QAAI,IAAI;AAAA,EACV;AACO,SAAA;AACT;AAIO,MAAM,kBAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,CAAC;AAAA,EACd,gBAAgB,CAAC;AAAA,EACjB;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,CAAC,eAAe,gBAAgB,IAAIE,iBAAM,SAAmB,CAAA,CAAE;AACrE,QAAM,CAAC,eAAe,gBAAgB,IAAIA,iBAAM,SAAS,MAAS;AAElE,QAAM,uBAAuB,MAAM;AACjC,qBAAkB,OAAqB;AAAA,EAAA;AAIvC,SAAAF,2BAAA,IAAC,SAAI,WAAW,UAAA,EAAY,OACzB,UAAA,cAAc,SAEXG,2BAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,IAAAD,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,YAAY;AAAA,QACvB,SAAS,MAAM,eAAe;AAAA,QAE9B,UAAA;AAAA,UAAAH,+BAAC,YAAS,UAAoB;AAAA,UAC7B;AAAA,UACAG,2BAAA,KAAA,QAAA,EAAK,WAAW,YAAY,MAC1B,UAAA;AAAA,YAAA,OAAO,IAAI,EAAE,YAAY,MAAM,aAAa,gBAAgB;AAAA,YAC5D,WAAW;AAAA,YAAO;AAAA,YAAE,WAAW,SAAS,IAAI,UAAU;AAAA,UAAA,GACzD;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IACC,WACC,cAAc,WAAW,IACtBH,2BAAA,IAAA,OAAA,EAAI,WAAW,UAAY,EAAA,YACzB,UAAW,WAAA,IAAI,CAAC,OAAO,UAAU,YAAY,KAAK,CAAC,EACtD,CAAA,IAEAA,2BAAAA,IAAC,OAAI,EAAA,WAAW,UAAU,EAAE,YACzB,UAAA,cAAc,IAAI,CAAC,SAAS,UAAU;AACrC,4CACG,OACC,EAAA,UAAAG,2BAAA,KAAC,SAAI,WAAW,YAAY,OAC1B,UAAA;AAAA,QAAAA,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAWF,KAAAA,KAAG,YAAY,aAAa,aAAa;AAAA,YACpD,SAAS,MACP;AAAA,cAAiB,CAAC,QAChB,IAAI,SAAS,KAAK,IACd,IAAI,OAAO,CAAC,MAAM,MAAM,KAAK,IAC7B,CAAC,GAAG,KAAK,KAAK;AAAA,YACpB;AAAA,YAGF,UAAA;AAAA,cAAAD,2BAAA,IAAC,UAAS,EAAA,UAAU,cAAc,SAAS,KAAK,GAAG;AAAA,cAAG;AAAA,cAAI;AAAA,cACxD,QAAQ;AAAA,cAAS;AAAA,cAAK;AAAA,cACvB,QAAQ,WAAW,WAAW;AAAA,cAAE;AAAA,YAAA;AAAA,UAAA;AAAA,QACnC;AAAA,QACC,cAAc,SAAS,KAAK,IAC1BA,2BAAAA,IAAA,OAAA,EAAI,WAAW,YAAY,YACzB,UAAA,QAAQ,IAAI,CAAC,UAAU,YAAY,KAAK,CAAC,EAC5C,CAAA,IACE;AAAA,MAAA,GACN,KArBQ,KAsBV;AAAA,IAAA,CAEH,GACH,IAEA;AAAA,EAAA,EACN,CAAA,IACE,SAAS,aAETA,2BAAA,IAAAI,WAAA,UAAA,EAAA,UAAAJ,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC;AAAA,MACA,OACEG,2BAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,SAAS;AAAA,UACT,WAAW,YAAY;AAAA,UAEvB,UAAA;AAAA,YAAAH,2BAAAA,IAAC,UAAM,UAAM,MAAA,CAAA;AAAA,YAAO;AAAA,YAAI;AAAA,UAAA;AAAA,QAAA;AAAA,MAC1B;AAAA,MAEF,OAAO;AAAA,MACP,iBAAiB,CAAC;AAAA,IAAA;AAAA,EACpB,EAAA,CACF,IAGEG,2BAAAA,KAAAC,WAAA,UAAA,EAAA,UAAA;AAAA,IAAAD,gCAAC,QAAM,EAAA,UAAA;AAAA,MAAA;AAAA,MAAM;AAAA,IAAA,GAAC;AAAA,IAAQ;AAAA,IACtBH,+BAAC,UAAK,WAAW,UAAA,EAAY,OAAQ,UAAAK,MAAAA,aAAa,KAAK,GAAE;AAAA,EAAA,EAC3D,CAAA,EAEJ,CAAA;AAEJ;AAeA,SAAS,WAAW,GAAgC;AAClD,SAAO,OAAO,YAAY;AAC5B;AAEA,SAAwB,SAAS;AAAA,EAC/B;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX,WAAW;AAAA,EACX;AAAA,EACA,GAAG;AACL,GAAkB;AACV,QAAA,CAAC,UAAU,WAAW,IAAIH,iBAAM,SAAS,QAAQ,eAAe,CAAC;AACjE,QAAA,iBAAiBA,iBAAM,YAAY,MAAM,YAAY,CAAC,QAAQ,CAAC,GAAG,GAAG,CAAA,CAAE;AAE7E,MAAI,OAAe,OAAO;AAC1B,MAAI,aAAyB,CAAA;AAEvB,QAAA,eAAe,CAAC,QAAqD;AACzE,UAAM,qBACJ,oBAAoB,OAChB,EAAE,CAAC,IAAI,KAAK,GAAG,SACf,mDAAkB,IAAI;AACrB,WAAA;AAAA,MACL,GAAG;AAAA,MACH,iBAAiB;AAAA,IAAA;AAAA,EACnB;AAGE,MAAA,MAAM,QAAQ,KAAK,GAAG;AACjB,WAAA;AACP,iBAAa,MAAM;AAAA,MAAI,CAAC,GAAG,MACzB,aAAa;AAAA,QACX,OAAO,EAAE,SAAS;AAAA,QAClB,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAGH,WAAA,UAAU,QACV,OAAO,UAAU,YACjB,WAAW,KAAK,KAChB,OAAO,MAAM,OAAO,QAAQ,MAAM,YAClC;AACO,WAAA;AACP,iBAAa,MAAM;AAAA,MAAK;AAAA,MAAO,CAAC,KAAK,MACnC,aAAa;AAAA,QACX,OAAO,EAAE,SAAS;AAAA,QAClB,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAEM,WAAA,OAAO,UAAU,YAAY,UAAU,MAAM;AAC/C,WAAA;AACM,iBAAA,OAAO,QAAQ,KAAK,EAAE;AAAA,MAAI,CAAC,CAAC,KAAK,GAAG,MAC/C,aAAa;AAAA,QACX,OAAO;AAAA,QACP,OAAO;AAAA,MAAA,CACR;AAAA,IAAA;AAAA,EAEL;AAEa,eAAA,mBAAmB,iBAAiB,UAAU,IAAI;AAEzD,QAAA,gBAAgB,WAAW,YAAY,QAAQ;AAErD,SAAO,SAAS;AAAA,IACd,aAAa,CAAC,UACZF,2BAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC;AAAA,QACA;AAAA,QACA;AAAA,QACC,GAAG;AAAA,QACH,GAAG;AAAA,MAAA;AAAA,MALC,MAAM;AAAA,IAMb;AAAA,IAEF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EAAA,CACJ;AACH;AAEA,MAAM,gBAAgB,MAAM;AAC1B,QAAM,EAAE,QAAQ,MAAM,MAAM,OAAO,QAAQ,OAAW,IAAAM;AACtD,QAAM,EAAE,YAAY,YAAY,MAAM,aAAa;AAE5C,SAAA;AAAA,IACL,OAAOC,OAAAA;AAAAA,qBACU,WAAW,IAAI;AAAA,mBACjB,SAAS,EAAE;AAAA,qBACT,WAAW,EAAE;AAAA;AAAA;AAAA;AAAA,IAI9B,aAAaA,OAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,IASb,UAAUA,OAAAA;AAAAA;AAAAA;AAAAA;AAAAA,eAIC,KAAK,CAAC,CAAC;AAAA,gBACN,KAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA,IAInB,cAAc,CAAC,aAAsB;AACnC,UAAI,UAAU;AACL,eAAAA;;;;MAIT;AACO,aAAAA;;;;IAIT;AAAA,IACA,cAAcA,OAAAA;AAAAA;AAAAA,aAEL,KAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAUhB,OAAOA,OAAAA;AAAAA,eACI,OAAO,OAAO,GAAG,CAAC;AAAA;AAAA,IAE7B,YAAYA,OAAAA;AAAAA,qBACK,KAAK,CAAC,CAAC;AAAA,sBACN,KAAK,CAAC,CAAC;AAAA,+BACE,OAAO,SAAS,GAAG,CAAC;AAAA;AAAA,IAE/C,MAAMA,OAAAA;AAAAA,eACK,OAAO,KAAK,GAAG,CAAC;AAAA,mBACZ,SAAS,KAAK,CAAC;AAAA,sBACZ,KAAK,CAAC,CAAC;AAAA;AAAA,IAEzB,iBAAiBA,OAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,qBAOA,WAAW,IAAI;AAAA,mBACjB,SAAS,EAAE;AAAA;AAAA,EAAA;AAG9B;AAEA,IAAI,UAAmD;AAEvD,SAAS,YAAY;AACf,MAAA;AAAgB,WAAA;AACpB,YAAU,cAAc;AAEjB,SAAA;AACT;;;;;"}
|
package/dist/cjs/Explorer.d.cts
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
export declare const Entry: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
3
|
-
export declare const Label: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
|
4
|
-
export declare const LabelButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
5
|
-
export declare const ExpandButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
|
|
6
|
-
export declare const Value: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
|
7
|
-
export declare const SubEntries: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
|
|
8
|
-
export declare const Info: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
|
9
2
|
type ExpanderProps = {
|
|
10
3
|
expanded: boolean;
|
|
11
4
|
style?: React.CSSProperties;
|