@tanstack/react-query-devtools 5.0.0-alpha.26 → 5.0.0-alpha.27

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 (159) hide show
  1. package/build/lib/__tests__/devtools.test.d.ts +0 -1
  2. package/build/lib/__tests__/devtools.test.d.ts.map +1 -1
  3. package/build/lib/devtools.d.ts +8 -30
  4. package/build/lib/devtools.d.ts.map +1 -1
  5. package/build/lib/devtools.esm.js +47 -226
  6. package/build/lib/devtools.esm.js.map +1 -1
  7. package/build/lib/devtools.js +45 -244
  8. package/build/lib/devtools.js.map +1 -1
  9. package/build/lib/devtools.mjs +47 -225
  10. package/build/lib/devtools.mjs.map +1 -1
  11. package/build/lib/index.d.ts +0 -1
  12. package/build/lib/index.d.ts.map +1 -1
  13. package/build/lib/index.esm.js +8 -5
  14. package/build/lib/index.esm.js.map +1 -1
  15. package/build/lib/index.js +7 -5
  16. package/build/lib/index.js.map +1 -1
  17. package/build/lib/index.mjs +8 -5
  18. package/build/lib/index.mjs.map +1 -1
  19. package/build/lib/index.prod.d.ts +0 -1
  20. package/build/lib/index.prod.esm.js +7901 -1501
  21. package/build/lib/index.prod.esm.js.map +1 -1
  22. package/build/lib/index.prod.js +7909 -1528
  23. package/build/lib/index.prod.js.map +1 -1
  24. package/build/lib/index.prod.mjs +7922 -1489
  25. package/build/lib/index.prod.mjs.map +1 -1
  26. package/build/umd/index.development.js +7146 -2375
  27. package/build/umd/index.development.js.map +1 -1
  28. package/build/umd/index.production.js +1 -1
  29. package/build/umd/index.production.js.map +1 -1
  30. package/package.json +2 -3
  31. package/src/__tests__/devtools.test.tsx +1 -1135
  32. package/src/devtools.tsx +52 -306
  33. package/src/index.ts +6 -6
  34. package/build/lib/CachePanel/ActiveQuery.d.ts +0 -19
  35. package/build/lib/CachePanel/ActiveQuery.d.ts.map +0 -1
  36. package/build/lib/CachePanel/ActiveQuery.esm.js +0 -277
  37. package/build/lib/CachePanel/ActiveQuery.esm.js.map +0 -1
  38. package/build/lib/CachePanel/ActiveQuery.js +0 -281
  39. package/build/lib/CachePanel/ActiveQuery.js.map +0 -1
  40. package/build/lib/CachePanel/ActiveQuery.mjs +0 -261
  41. package/build/lib/CachePanel/ActiveQuery.mjs.map +0 -1
  42. package/build/lib/CachePanel/CachePanel.d.ts +0 -58
  43. package/build/lib/CachePanel/CachePanel.d.ts.map +0 -1
  44. package/build/lib/CachePanel/CachePanel.esm.js +0 -310
  45. package/build/lib/CachePanel/CachePanel.esm.js.map +0 -1
  46. package/build/lib/CachePanel/CachePanel.js +0 -315
  47. package/build/lib/CachePanel/CachePanel.js.map +0 -1
  48. package/build/lib/CachePanel/CachePanel.mjs +0 -310
  49. package/build/lib/CachePanel/CachePanel.mjs.map +0 -1
  50. package/build/lib/CachePanel/Header/QueryStatusCount.d.ts +0 -8
  51. package/build/lib/CachePanel/Header/QueryStatusCount.d.ts.map +0 -1
  52. package/build/lib/CachePanel/Header/QueryStatusCount.esm.js +0 -49
  53. package/build/lib/CachePanel/Header/QueryStatusCount.esm.js.map +0 -1
  54. package/build/lib/CachePanel/Header/QueryStatusCount.js +0 -53
  55. package/build/lib/CachePanel/Header/QueryStatusCount.js.map +0 -1
  56. package/build/lib/CachePanel/Header/QueryStatusCount.mjs +0 -49
  57. package/build/lib/CachePanel/Header/QueryStatusCount.mjs.map +0 -1
  58. package/build/lib/CachePanel/QueryRow.d.ts +0 -14
  59. package/build/lib/CachePanel/QueryRow.d.ts.map +0 -1
  60. package/build/lib/CachePanel/QueryRow.esm.js +0 -98
  61. package/build/lib/CachePanel/QueryRow.esm.js.map +0 -1
  62. package/build/lib/CachePanel/QueryRow.js +0 -102
  63. package/build/lib/CachePanel/QueryRow.js.map +0 -1
  64. package/build/lib/CachePanel/QueryRow.mjs +0 -82
  65. package/build/lib/CachePanel/QueryRow.mjs.map +0 -1
  66. package/build/lib/Explorer.d.ts +0 -51
  67. package/build/lib/Explorer.d.ts.map +0 -1
  68. package/build/lib/Explorer.esm.js +0 -254
  69. package/build/lib/Explorer.esm.js.map +0 -1
  70. package/build/lib/Explorer.js +0 -288
  71. package/build/lib/Explorer.js.map +0 -1
  72. package/build/lib/Explorer.mjs +0 -254
  73. package/build/lib/Explorer.mjs.map +0 -1
  74. package/build/lib/Logo.d.ts +0 -2
  75. package/build/lib/Logo.esm.js +0 -32
  76. package/build/lib/Logo.esm.js.map +0 -1
  77. package/build/lib/Logo.js +0 -55
  78. package/build/lib/Logo.js.map +0 -1
  79. package/build/lib/Logo.mjs +0 -32
  80. package/build/lib/Logo.mjs.map +0 -1
  81. package/build/lib/__tests__/Explorer.test.d.ts +0 -2
  82. package/build/lib/__tests__/Explorer.test.d.ts.map +0 -1
  83. package/build/lib/_virtual/_rollupPluginBabelHelpers.esm.js +0 -17
  84. package/build/lib/_virtual/_rollupPluginBabelHelpers.esm.js.map +0 -1
  85. package/build/lib/_virtual/_rollupPluginBabelHelpers.js +0 -19
  86. package/build/lib/_virtual/_rollupPluginBabelHelpers.js.map +0 -1
  87. package/build/lib/_virtual/_rollupPluginBabelHelpers.mjs +0 -17
  88. package/build/lib/_virtual/_rollupPluginBabelHelpers.mjs.map +0 -1
  89. package/build/lib/noop.d.ts +0 -3
  90. package/build/lib/screenreader.d.ts +0 -4
  91. package/build/lib/screenreader.esm.js +0 -17
  92. package/build/lib/screenreader.esm.js.map +0 -1
  93. package/build/lib/screenreader.js +0 -40
  94. package/build/lib/screenreader.js.map +0 -1
  95. package/build/lib/screenreader.mjs +0 -17
  96. package/build/lib/screenreader.mjs.map +0 -1
  97. package/build/lib/styledComponents.d.ts +0 -9
  98. package/build/lib/styledComponents.d.ts.map +0 -1
  99. package/build/lib/styledComponents.esm.js +0 -103
  100. package/build/lib/styledComponents.esm.js.map +0 -1
  101. package/build/lib/styledComponents.js +0 -112
  102. package/build/lib/styledComponents.js.map +0 -1
  103. package/build/lib/styledComponents.mjs +0 -103
  104. package/build/lib/styledComponents.mjs.map +0 -1
  105. package/build/lib/theme.d.ts +0 -37
  106. package/build/lib/theme.esm.js +0 -33
  107. package/build/lib/theme.esm.js.map +0 -1
  108. package/build/lib/theme.js +0 -56
  109. package/build/lib/theme.js.map +0 -1
  110. package/build/lib/theme.mjs +0 -33
  111. package/build/lib/theme.mjs.map +0 -1
  112. package/build/lib/types.d.ts +0 -12
  113. package/build/lib/types.d.ts.map +0 -1
  114. package/build/lib/useLocalStorage.d.ts +0 -2
  115. package/build/lib/useLocalStorage.esm.js +0 -40
  116. package/build/lib/useLocalStorage.esm.js.map +0 -1
  117. package/build/lib/useLocalStorage.js +0 -63
  118. package/build/lib/useLocalStorage.js.map +0 -1
  119. package/build/lib/useLocalStorage.mjs +0 -40
  120. package/build/lib/useLocalStorage.mjs.map +0 -1
  121. package/build/lib/useMediaQuery.d.ts +0 -2
  122. package/build/lib/useMediaQuery.esm.js +0 -36
  123. package/build/lib/useMediaQuery.esm.js.map +0 -1
  124. package/build/lib/useMediaQuery.js +0 -59
  125. package/build/lib/useMediaQuery.js.map +0 -1
  126. package/build/lib/useMediaQuery.mjs +0 -36
  127. package/build/lib/useMediaQuery.mjs.map +0 -1
  128. package/build/lib/useSubscribeToQueryCache.d.ts +0 -4
  129. package/build/lib/useSubscribeToQueryCache.d.ts.map +0 -1
  130. package/build/lib/useSubscribeToQueryCache.esm.js +0 -15
  131. package/build/lib/useSubscribeToQueryCache.esm.js.map +0 -1
  132. package/build/lib/useSubscribeToQueryCache.js +0 -19
  133. package/build/lib/useSubscribeToQueryCache.js.map +0 -1
  134. package/build/lib/useSubscribeToQueryCache.mjs +0 -15
  135. package/build/lib/useSubscribeToQueryCache.mjs.map +0 -1
  136. package/build/lib/utils.d.ts +0 -80
  137. package/build/lib/utils.d.ts.map +0 -1
  138. package/build/lib/utils.esm.js +0 -184
  139. package/build/lib/utils.esm.js.map +0 -1
  140. package/build/lib/utils.js +0 -218
  141. package/build/lib/utils.js.map +0 -1
  142. package/build/lib/utils.mjs +0 -184
  143. package/build/lib/utils.mjs.map +0 -1
  144. package/src/CachePanel/ActiveQuery.tsx +0 -388
  145. package/src/CachePanel/CachePanel.tsx +0 -439
  146. package/src/CachePanel/Header/QueryStatusCount.tsx +0 -93
  147. package/src/CachePanel/QueryRow.tsx +0 -125
  148. package/src/Explorer.tsx +0 -385
  149. package/src/Logo.tsx +0 -32
  150. package/src/__tests__/Explorer.test.tsx +0 -150
  151. package/src/noop.ts +0 -7
  152. package/src/screenreader.tsx +0 -16
  153. package/src/styledComponents.ts +0 -126
  154. package/src/theme.tsx +0 -33
  155. package/src/types.ts +0 -12
  156. package/src/useLocalStorage.ts +0 -52
  157. package/src/useMediaQuery.ts +0 -34
  158. package/src/useSubscribeToQueryCache.ts +0 -26
  159. package/src/utils.ts +0 -319
package/src/Explorer.tsx DELETED
@@ -1,385 +0,0 @@
1
- 'use client'
2
- import * as React from 'react'
3
-
4
- import { displayValue, styled } from './utils'
5
- import superjson from 'superjson'
6
-
7
- export const Entry = styled('div', {
8
- fontFamily: 'Menlo, monospace',
9
- fontSize: '1em',
10
- lineHeight: '1.7',
11
- outline: 'none',
12
- wordBreak: 'break-word',
13
- })
14
-
15
- export const Label = styled('span', {
16
- color: 'white',
17
- })
18
-
19
- export const LabelButton = styled('button', {
20
- cursor: 'pointer',
21
- color: 'white',
22
- })
23
-
24
- export const ExpandButton = styled('button', {
25
- cursor: 'pointer',
26
- color: 'inherit',
27
- font: 'inherit',
28
- outline: 'inherit',
29
- background: 'transparent',
30
- border: 'none',
31
- padding: 0,
32
- })
33
-
34
- type CopyState = 'NoCopy' | 'SuccessCopy' | 'ErrorCopy'
35
-
36
- export const CopyButton = ({ value }: { value: unknown }) => {
37
- const [copyState, setCopyState] = React.useState<CopyState>('NoCopy')
38
-
39
- return (
40
- <button
41
- onClick={
42
- copyState === 'NoCopy'
43
- ? () => {
44
- navigator.clipboard.writeText(superjson.stringify(value)).then(
45
- () => {
46
- setCopyState('SuccessCopy')
47
- setTimeout(() => {
48
- setCopyState('NoCopy')
49
- }, 1500)
50
- },
51
- (err) => {
52
- console.error('Failed to copy: ', err)
53
- setCopyState('ErrorCopy')
54
- setTimeout(() => {
55
- setCopyState('NoCopy')
56
- }, 1500)
57
- },
58
- )
59
- }
60
- : undefined
61
- }
62
- style={{
63
- cursor: 'pointer',
64
- color: 'inherit',
65
- font: 'inherit',
66
- outline: 'inherit',
67
- background: 'transparent',
68
- border: 'none',
69
- padding: 0,
70
- }}
71
- >
72
- {copyState === 'NoCopy' ? (
73
- <Copier />
74
- ) : copyState === 'SuccessCopy' ? (
75
- <CopiedCopier />
76
- ) : (
77
- <ErrorCopier />
78
- )}
79
- </button>
80
- )
81
- }
82
-
83
- export const Value = styled('span', (_props, theme) => ({
84
- color: theme.danger,
85
- }))
86
-
87
- export const SubEntries = styled('div', {
88
- marginLeft: '.1em',
89
- paddingLeft: '1em',
90
- borderLeft: '2px solid rgba(0,0,0,.15)',
91
- })
92
-
93
- export const Info = styled('span', {
94
- color: 'grey',
95
- fontSize: '.7em',
96
- })
97
-
98
- type ExpanderProps = {
99
- expanded: boolean
100
- style?: React.CSSProperties
101
- }
102
-
103
- export const Expander = ({ expanded, style = {} }: ExpanderProps) => (
104
- <span
105
- style={{
106
- display: 'inline-block',
107
- transition: 'all .1s ease',
108
- transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,
109
- ...style,
110
- }}
111
- >
112
-
113
- </span>
114
- )
115
-
116
- const Copier = () => (
117
- <span
118
- aria-label="Copy object to clipboard"
119
- title="Copy object to clipboard"
120
- style={{
121
- paddingLeft: '1em',
122
- }}
123
- >
124
- <svg height="12" viewBox="0 0 16 12" width="10">
125
- <path
126
- fill="currentColor"
127
- d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 010 1.5h-1.5a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 00.25-.25v-1.5a.75.75 0 011.5 0v1.5A1.75 1.75 0 019.25 16h-7.5A1.75 1.75 0 010 14.25v-7.5z"
128
- ></path>
129
- <path
130
- fill="currentColor"
131
- d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0114.25 11h-7.5A1.75 1.75 0 015 9.25v-7.5zm1.75-.25a.25.25 0 00-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 00.25-.25v-7.5a.25.25 0 00-.25-.25h-7.5z"
132
- ></path>
133
- </svg>
134
- </span>
135
- )
136
-
137
- const ErrorCopier = () => (
138
- <span
139
- aria-label="Failed copying to clipboard"
140
- title="Failed copying to clipboard"
141
- style={{
142
- paddingLeft: '1em',
143
- display: 'flex',
144
- alignItems: 'center',
145
- }}
146
- >
147
- <svg height="12" viewBox="0 0 16 12" width="10" display="block">
148
- <path
149
- fill="red"
150
- d="M3.72 3.72a.75.75 0 011.06 0L8 6.94l3.22-3.22a.75.75 0 111.06 1.06L9.06 8l3.22 3.22a.75.75 0 11-1.06 1.06L8 9.06l-3.22 3.22a.75.75 0 01-1.06-1.06L6.94 8 3.72 4.78a.75.75 0 010-1.06z"
151
- ></path>
152
- </svg>
153
- <span
154
- style={{
155
- color: 'red',
156
- fontSize: '12px',
157
- paddingLeft: '4px',
158
- position: 'relative',
159
- top: '2px',
160
- }}
161
- >
162
- See console
163
- </span>
164
- </span>
165
- )
166
-
167
- const CopiedCopier = () => (
168
- <span
169
- aria-label="Object copied to clipboard"
170
- title="Object copied to clipboard"
171
- style={{
172
- paddingLeft: '1em',
173
- display: 'inline-block',
174
- verticalAlign: 'middle',
175
- }}
176
- >
177
- <svg height="16" viewBox="0 0 16 16" width="16" display="block">
178
- <path
179
- fill="green"
180
- d="M13.78 4.22a.75.75 0 010 1.06l-7.25 7.25a.75.75 0 01-1.06 0L2.22 9.28a.75.75 0 011.06-1.06L6 10.94l6.72-6.72a.75.75 0 011.06 0z"
181
- ></path>
182
- </svg>
183
- </span>
184
- )
185
-
186
- type EntryType = {
187
- label: string
188
- }
189
-
190
- type RendererProps = {
191
- handleEntry: (entry: EntryType) => JSX.Element
192
- label?: string
193
- value: unknown
194
- subEntries: EntryType[]
195
- subEntryPages: EntryType[][]
196
- type: string
197
- expanded: boolean
198
- copyable: boolean
199
- toggleExpanded: () => void
200
- pageSize: number
201
- }
202
-
203
- /**
204
- * Chunk elements in the array by size
205
- *
206
- * when the array cannot be chunked evenly by size, the last chunk will be
207
- * filled with the remaining elements
208
- *
209
- * @example
210
- * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]
211
- */
212
- export function chunkArray<T>(array: T[], size: number): T[][] {
213
- if (size < 1) return []
214
- let i = 0
215
- const result: T[][] = []
216
- while (i < array.length) {
217
- result.push(array.slice(i, i + size))
218
- i = i + size
219
- }
220
- return result
221
- }
222
-
223
- type Renderer = (props: RendererProps) => JSX.Element
224
-
225
- export const DefaultRenderer: Renderer = ({
226
- handleEntry,
227
- label,
228
- value,
229
- subEntries = [],
230
- subEntryPages = [],
231
- type,
232
- expanded = false,
233
- copyable = false,
234
- toggleExpanded,
235
- pageSize,
236
- }) => {
237
- const [expandedPages, setExpandedPages] = React.useState<number[]>([])
238
-
239
- return (
240
- <Entry key={label}>
241
- {subEntryPages.length ? (
242
- <>
243
- <ExpandButton onClick={() => toggleExpanded()}>
244
- <Expander expanded={expanded} /> {label}{' '}
245
- <Info>
246
- {String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : ''}
247
- {subEntries.length} {subEntries.length > 1 ? `items` : `item`}
248
- </Info>
249
- </ExpandButton>
250
- {copyable ? <CopyButton value={value} /> : null}
251
- {expanded ? (
252
- subEntryPages.length === 1 ? (
253
- <SubEntries>{subEntries.map(handleEntry)}</SubEntries>
254
- ) : (
255
- <SubEntries>
256
- {subEntryPages.map((entries, index) => (
257
- <div key={index}>
258
- <Entry>
259
- <LabelButton
260
- onClick={() =>
261
- setExpandedPages((old) =>
262
- old.includes(index)
263
- ? old.filter((d) => d !== index)
264
- : [...old, index],
265
- )
266
- }
267
- >
268
- <Expander expanded={expanded} /> [{index * pageSize} ...{' '}
269
- {index * pageSize + pageSize - 1}]
270
- </LabelButton>
271
- {expandedPages.includes(index) ? (
272
- <SubEntries>{entries.map(handleEntry)}</SubEntries>
273
- ) : null}
274
- </Entry>
275
- </div>
276
- ))}
277
- </SubEntries>
278
- )
279
- ) : null}
280
- </>
281
- ) : (
282
- <>
283
- <Label>{label}:</Label> <Value>{displayValue(value)}</Value>
284
- </>
285
- )}
286
- </Entry>
287
- )
288
- }
289
-
290
- type ExplorerProps = Partial<RendererProps> & {
291
- renderer?: Renderer
292
- defaultExpanded?: true | Record<string, boolean>
293
- copyable?: boolean
294
- }
295
-
296
- type Property = {
297
- defaultExpanded?: boolean | Record<string, boolean>
298
- label: string
299
- value: unknown
300
- }
301
-
302
- function isIterable(x: any): x is Iterable<unknown> {
303
- return Symbol.iterator in x
304
- }
305
-
306
- export default function Explorer({
307
- value,
308
- defaultExpanded,
309
- renderer = DefaultRenderer,
310
- pageSize = 100,
311
- copyable = false,
312
- ...rest
313
- }: ExplorerProps) {
314
- const [expanded, setExpanded] = React.useState(Boolean(defaultExpanded))
315
- const toggleExpanded = React.useCallback(() => setExpanded((old) => !old), [])
316
-
317
- let type: string = typeof value
318
- let subEntries: Property[] = []
319
-
320
- const makeProperty = (sub: { label: string; value: unknown }): Property => {
321
- const subDefaultExpanded =
322
- defaultExpanded === true
323
- ? { [sub.label]: true }
324
- : defaultExpanded?.[sub.label]
325
- return {
326
- ...sub,
327
- defaultExpanded: subDefaultExpanded,
328
- }
329
- }
330
-
331
- if (Array.isArray(value)) {
332
- type = 'array'
333
- subEntries = value.map((d, i) =>
334
- makeProperty({
335
- label: i.toString(),
336
- value: d,
337
- }),
338
- )
339
- } else if (
340
- value !== null &&
341
- typeof value === 'object' &&
342
- isIterable(value) &&
343
- typeof value[Symbol.iterator] === 'function'
344
- ) {
345
- type = 'Iterable'
346
- subEntries = Array.from(value, (val, i) =>
347
- makeProperty({
348
- label: i.toString(),
349
- value: val,
350
- }),
351
- )
352
- } else if (typeof value === 'object' && value !== null) {
353
- type = 'object'
354
- subEntries = Object.entries(value).map(([key, val]) =>
355
- makeProperty({
356
- label: key,
357
- value: val,
358
- }),
359
- )
360
- }
361
-
362
- const subEntryPages = chunkArray(subEntries, pageSize)
363
-
364
- return renderer({
365
- handleEntry: (entry) => (
366
- <Explorer
367
- key={entry.label}
368
- value={value}
369
- renderer={renderer}
370
- copyable={copyable}
371
- {...rest}
372
- {...entry}
373
- />
374
- ),
375
- type,
376
- subEntries,
377
- subEntryPages,
378
- value,
379
- expanded,
380
- copyable,
381
- toggleExpanded,
382
- pageSize,
383
- ...rest,
384
- })
385
- }
package/src/Logo.tsx DELETED
@@ -1,32 +0,0 @@
1
- import * as React from 'react'
2
-
3
- export default function Logo(props: any) {
4
- return (
5
- <svg
6
- width="40px"
7
- height="40px"
8
- viewBox="0 0 190 190"
9
- version="1.1"
10
- {...props}
11
- >
12
- <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd">
13
- <g transform="translate(-33.000000, 0.000000)">
14
- <path
15
- d="M72.7239712,61.3436237 C69.631224,46.362877 68.9675112,34.8727722 70.9666331,26.5293551 C72.1555965,21.5671678 74.3293088,17.5190846 77.6346064,14.5984631 C81.1241394,11.5150478 85.5360327,10.0020122 90.493257,10.0020122 C98.6712013,10.0020122 107.26826,13.7273214 116.455725,20.8044264 C120.20312,23.6910458 124.092437,27.170411 128.131651,31.2444746 C128.45314,30.8310265 128.816542,30.4410453 129.22143,30.0806152 C140.64098,19.9149716 150.255245,13.5989272 158.478408,11.1636507 C163.367899,9.715636 167.958526,9.57768202 172.138936,10.983031 C176.551631,12.4664684 180.06766,15.5329489 182.548314,19.8281091 C186.642288,26.9166735 187.721918,36.2310983 186.195595,47.7320243 C185.573451,52.4199112 184.50985,57.5263831 183.007094,63.0593153 C183.574045,63.1277086 184.142416,63.2532808 184.705041,63.4395297 C199.193932,68.2358678 209.453582,73.3937462 215.665021,79.2882839 C219.360669,82.7953831 221.773972,86.6998434 222.646365,91.0218204 C223.567176,95.5836746 222.669313,100.159332 220.191548,104.451297 C216.105211,111.529614 208.591643,117.11221 197.887587,121.534031 C193.589552,123.309539 188.726579,124.917559 183.293259,126.363748 C183.541176,126.92292 183.733521,127.516759 183.862138,128.139758 C186.954886,143.120505 187.618598,154.61061 185.619477,162.954027 C184.430513,167.916214 182.256801,171.964297 178.951503,174.884919 C175.46197,177.968334 171.050077,179.48137 166.092853,179.48137 C157.914908,179.48137 149.31785,175.756061 140.130385,168.678956 C136.343104,165.761613 132.410866,162.238839 128.325434,158.108619 C127.905075,158.765474 127.388968,159.376011 126.77857,159.919385 C115.35902,170.085028 105.744755,176.401073 97.5215915,178.836349 C92.6321009,180.284364 88.0414736,180.422318 83.8610636,179.016969 C79.4483686,177.533532 75.9323404,174.467051 73.4516862,170.171891 C69.3577116,163.083327 68.2780823,153.768902 69.8044053,142.267976 C70.449038,137.410634 71.56762,132.103898 73.1575891,126.339009 C72.5361041,126.276104 71.9120754,126.144816 71.2949591,125.940529 C56.8060684,121.144191 46.5464184,115.986312 40.3349789,110.091775 C36.6393312,106.584675 34.2260275,102.680215 33.3536352,98.3582381 C32.4328237,93.7963839 33.3306866,89.2207269 35.8084524,84.9287618 C39.8947886,77.8504443 47.4083565,72.2678481 58.1124133,67.8460273 C62.5385143,66.0176154 67.5637208,64.366822 73.1939394,62.8874674 C72.9933393,62.3969171 72.8349374,61.8811235 72.7239712,61.3436237 Z"
16
- fill="#002C4B"
17
- fillRule="nonzero"
18
- transform="translate(128.000000, 95.000000) scale(-1, 1) translate(-128.000000, -95.000000) "
19
- ></path>
20
- <path
21
- d="M113.396882,64 L142.608177,64 C144.399254,64 146.053521,64.958025 146.944933,66.5115174 L161.577138,92.0115174 C162.461464,93.5526583 162.461464,95.4473417 161.577138,96.9884826 L146.944933,122.488483 C146.053521,124.041975 144.399254,125 142.608177,125 L113.396882,125 C111.605806,125 109.951539,124.041975 109.060126,122.488483 L94.4279211,96.9884826 C93.543596,95.4473417 93.543596,93.5526583 94.4279211,92.0115174 L109.060126,66.5115174 C109.951539,64.958025 111.605806,64 113.396882,64 Z M138.987827,70.2765273 C140.779849,70.2765273 142.434839,71.2355558 143.325899,72.7903404 L154.343038,92.0138131 C155.225607,93.5537825 155.225607,95.4462175 154.343038,96.9861869 L143.325899,116.20966 C142.434839,117.764444 140.779849,118.723473 138.987827,118.723473 L117.017233,118.723473 C115.225211,118.723473 113.570221,117.764444 112.67916,116.20966 L101.662022,96.9861869 C100.779452,95.4462175 100.779452,93.5537825 101.662022,92.0138131 L112.67916,72.7903404 C113.570221,71.2355558 115.225211,70.2765273 117.017233,70.2765273 L138.987827,70.2765273 Z M135.080648,77.1414791 L120.924411,77.1414791 C119.134228,77.1414791 117.480644,78.0985567 116.5889,79.6508285 L116.5889,79.6508285 L109.489217,92.0093494 C108.603232,93.5515958 108.603232,95.4484042 109.489217,96.9906506 L109.489217,96.9906506 L116.5889,109.349172 C117.480644,110.901443 119.134228,111.858521 120.924411,111.858521 L120.924411,111.858521 L135.080648,111.858521 C136.870831,111.858521 138.524416,110.901443 139.41616,109.349172 L139.41616,109.349172 L146.515843,96.9906506 C147.401828,95.4484042 147.401828,93.5515958 146.515843,92.0093494 L146.515843,92.0093494 L139.41616,79.6508285 C138.524416,78.0985567 136.870831,77.1414791 135.080648,77.1414791 L135.080648,77.1414791 Z M131.319186,83.7122186 C133.108028,83.7122186 134.760587,84.6678753 135.652827,86.2183156 L138.983552,92.0060969 C139.87203,93.5500005 139.87203,95.4499995 138.983552,96.9939031 L135.652827,102.781684 C134.760587,104.332125 133.108028,105.287781 131.319186,105.287781 L124.685874,105.287781 C122.897032,105.287781 121.244473,104.332125 120.352233,102.781684 L117.021508,96.9939031 C116.13303,95.4499995 116.13303,93.5500005 117.021508,92.0060969 L120.352233,86.2183156 C121.244473,84.6678753 122.897032,83.7122186 124.685874,83.7122186 L131.319186,83.7122186 Z M128.003794,90.1848875 C126.459294,90.1848875 125.034382,91.0072828 124.263005,92.3424437 C123.491732,93.6774232 123.491732,95.3225768 124.263005,96.6575563 C125.034382,97.9927172 126.459294,98.8151125 128.001266,98.8151125 L128.001266,98.8151125 C129.545766,98.8151125 130.970678,97.9927172 131.742055,96.6575563 C132.513327,95.3225768 132.513327,93.6774232 131.742055,92.3424437 C130.970678,91.0072828 129.545766,90.1848875 128.003794,90.1848875 L128.003794,90.1848875 Z M93,94.5009646 L100.767764,94.5009646"
22
- fill="#FFD94C"
23
- ></path>
24
- <path
25
- d="M87.8601729,108.357758 C89.1715224,107.608286 90.8360246,108.074601 91.5779424,109.399303 L91.5779424,109.399303 L92.0525843,110.24352 C95.8563392,116.982993 99.8190116,123.380176 103.940602,129.435068 C108.807881,136.585427 114.28184,143.82411 120.362479,151.151115 C121.316878,152.30114 121.184944,154.011176 120.065686,154.997937 L120.065686,154.997937 L119.454208,155.534625 C99.3465389,173.103314 86.2778188,176.612552 80.2480482,166.062341 C74.3500652,155.742717 76.4844915,136.982888 86.6513274,109.782853 C86.876818,109.179582 87.3045861,108.675291 87.8601729,108.357758 Z M173.534177,129.041504 C174.986131,128.785177 176.375496,129.742138 176.65963,131.194242 L176.65963,131.194242 L176.812815,131.986376 C181.782365,157.995459 178.283348,171 166.315764,171 C154.609745,171 139.708724,159.909007 121.612702,137.727022 C121.211349,137.235047 120.994572,136.617371 121,135.981509 C121.013158,134.480686 122.235785,133.274651 123.730918,133.287756 L123.730918,133.287756 L124.684654,133.294531 C132.305698,133.335994 139.714387,133.071591 146.910723,132.501323 C155.409039,131.82788 164.283523,130.674607 173.534177,129.041504 Z M180.408726,73.8119663 C180.932139,72.4026903 182.508386,71.6634537 183.954581,72.149012 L183.954581,72.149012 L184.742552,72.4154854 C210.583763,81.217922 220.402356,90.8916805 214.198332,101.436761 C208.129904,111.751366 190.484347,119.260339 161.26166,123.963678 C160.613529,124.067994 159.948643,123.945969 159.382735,123.618843 C158.047025,122.846729 157.602046,121.158214 158.388848,119.847438 L158.388848,119.847438 L158.889328,119.0105 C162.877183,112.31633 166.481358,105.654262 169.701854,99.0242957 C173.50501,91.1948179 177.073967,82.7907081 180.408726,73.8119663 Z M94.7383398,66.0363218 C95.3864708,65.9320063 96.0513565,66.0540315 96.6172646,66.3811573 C97.9529754,67.153271 98.3979538,68.8417862 97.6111517,70.1525615 L97.6111517,70.1525615 L97.1106718,70.9895001 C93.1228168,77.6836699 89.5186416,84.3457379 86.2981462,90.9757043 C82.49499,98.8051821 78.9260328,107.209292 75.5912744,116.188034 C75.0678608,117.59731 73.4916142,118.336546 72.045419,117.850988 L72.045419,117.850988 L71.2574475,117.584515 C45.4162372,108.782078 35.597644,99.1083195 41.8016679,88.5632391 C47.8700957,78.2486335 65.515653,70.7396611 94.7383398,66.0363218 Z M136.545792,34.4653746 C156.653461,16.8966864 169.722181,13.3874478 175.751952,23.9376587 C181.649935,34.2572826 179.515508,53.0171122 169.348673,80.2171474 C169.123182,80.8204179 168.695414,81.324709 168.139827,81.6422422 C166.828478,82.3917144 165.163975,81.9253986 164.422058,80.6006966 L164.422058,80.6006966 L163.947416,79.7564798 C160.143661,73.0170065 156.180988,66.6198239 152.059398,60.564932 C147.192119,53.4145727 141.71816,46.1758903 135.637521,38.8488847 C134.683122,37.6988602 134.815056,35.9888243 135.934314,35.0020629 L135.934314,35.0020629 Z M90.6842361,18 C102.390255,18 117.291276,29.0909926 135.387298,51.2729777 C135.788651,51.7649527 136.005428,52.3826288 136,53.0184911 C135.986842,54.5193144 134.764215,55.7253489 133.269082,55.7122445 L133.269082,55.7122445 L132.315346,55.7054689 C124.694302,55.6640063 117.285613,55.9284091 110.089277,56.4986773 C101.590961,57.17212 92.7164767,58.325393 83.4658235,59.9584962 C82.0138691,60.2148231 80.6245044,59.2578618 80.3403697,57.805758 L80.3403697,57.805758 L80.1871846,57.0136235 C75.2176347,31.0045412 78.7166519,18 90.6842361,18 Z"
26
- fill="#FF4154"
27
- ></path>
28
- </g>
29
- </g>
30
- </svg>
31
- )
32
- }
@@ -1,150 +0,0 @@
1
- import { fireEvent, render, screen, act } from '@testing-library/react'
2
- import * as React from 'react'
3
-
4
- import { chunkArray, CopyButton, DefaultRenderer } from '../Explorer'
5
- import { displayValue } from '../utils'
6
- import { vi } from 'vitest'
7
-
8
- describe('Explorer', () => {
9
- describe('chunkArray', () => {
10
- it('when the size is less than one return an empty array', () => {
11
- expect(chunkArray([1, 2, 3], 0)).toStrictEqual([])
12
- })
13
-
14
- it('when the array is empty return an empty array', () => {
15
- expect(chunkArray([], 2)).toStrictEqual([])
16
- })
17
-
18
- it('when the array is evenly chunked return full chunks ', () => {
19
- expect(chunkArray([1, 2, 3, 4], 2)).toStrictEqual([
20
- [1, 2],
21
- [3, 4],
22
- ])
23
- })
24
-
25
- it('when the array is not evenly chunkable by size the last item is the remaining elements ', () => {
26
- const chunks = chunkArray([1, 2, 3, 4, 5], 2)
27
- const lastChunk = chunks[chunks.length - 1]
28
- expect(lastChunk).toStrictEqual([5])
29
- })
30
- })
31
-
32
- describe('DefaultRenderer', () => {
33
- it('when the entry label is clicked, toggle expanded', async () => {
34
- const toggleExpanded = vi.fn()
35
-
36
- render(
37
- <DefaultRenderer
38
- label="the top level label"
39
- toggleExpanded={toggleExpanded}
40
- pageSize={10}
41
- expanded={false}
42
- copyable={false}
43
- subEntryPages={[[{ label: 'A lovely label' }]]}
44
- handleEntry={() => <></>}
45
- value={undefined}
46
- subEntries={[]}
47
- type="string"
48
- />,
49
- )
50
-
51
- const expandButton = screen.getByRole('button', {
52
- name: /▶ the top level label 0 item/i,
53
- })
54
-
55
- fireEvent.click(expandButton)
56
-
57
- expect(toggleExpanded).toHaveBeenCalledTimes(1)
58
- })
59
-
60
- it('when the copy button is clicked, update the clipboard value', async () => {
61
- // Mock clipboard
62
- let clipBoardContent = null
63
- const value = 'someValue'
64
- Object.defineProperty(navigator, 'clipboard', {
65
- value: {
66
- writeText: async () => {
67
- return new Promise(() => (clipBoardContent = value))
68
- },
69
- },
70
- configurable: true,
71
- })
72
-
73
- act(() => {
74
- render(<CopyButton value={value} />)
75
- })
76
-
77
- // After rendering the clipboard content should be null
78
- expect(clipBoardContent).toBe(null)
79
-
80
- const copyButton = screen.getByRole('button')
81
-
82
- await screen.findByLabelText('Copy object to clipboard')
83
-
84
- // After clicking the content should be added to the clipboard
85
- await act(async () => {
86
- fireEvent.click(copyButton)
87
- })
88
-
89
- expect(clipBoardContent).toBe(value)
90
- screen.findByLabelText('Object copied to clipboard')
91
- })
92
-
93
- it('when the copy button is clicked but there is an error, show error state', async () => {
94
- const consoleMock = vi.spyOn(console, 'error')
95
- consoleMock.mockImplementation(() => undefined)
96
-
97
- // Mock clipboard with error state
98
- Object.defineProperty(navigator, 'clipboard', {
99
- value: {
100
- writeText: async () => {
101
- return new Promise(() => {
102
- throw Error
103
- })
104
- },
105
- },
106
- configurable: true,
107
- })
108
-
109
- act(() => {
110
- render(<CopyButton value={'someValue'} />)
111
- })
112
-
113
- const copyButton = screen.getByRole('button')
114
-
115
- await screen.findByLabelText('Copy object to clipboard')
116
-
117
- // After clicking the content should NOT be added to the clipboard
118
- await act(async () => {
119
- fireEvent.click(copyButton)
120
- })
121
-
122
- // Check that it has failed
123
- await screen.findByLabelText('Failed copying to clipboard')
124
- expect(consoleMock).toHaveBeenCalled()
125
- consoleMock.mockRestore()
126
- })
127
- })
128
-
129
- describe('displayValue', () => {
130
- it('when the value is a boolean', () => {
131
- expect(displayValue(true)).toBe('true')
132
- })
133
-
134
- it('when the value is a BigInt', () => {
135
- expect(displayValue(BigInt(1))).toBe('"1"')
136
- })
137
-
138
- it('when the value is an Error', () => {
139
- expect(displayValue(new Error('err'))).toBe(
140
- '{"name":"Error","message":"err"}',
141
- )
142
- })
143
-
144
- it('when the value is an object', () => {
145
- expect(displayValue({ error: new Error('err'), bigint: 1n })).toBe(
146
- '{"error":{"name":"Error","message":"err"},"bigint":"1"}',
147
- )
148
- })
149
- })
150
- })
package/src/noop.ts DELETED
@@ -1,7 +0,0 @@
1
- export function ReactQueryDevtools() {
2
- return null
3
- }
4
-
5
- export function ReactQueryDevtoolsPanel() {
6
- return null
7
- }
@@ -1,16 +0,0 @@
1
- import * as React from 'react'
2
-
3
- export default function ScreenReader({ text }: { text: string }) {
4
- return (
5
- <span
6
- style={{
7
- position: 'absolute',
8
- width: '0.1px',
9
- height: '0.1px',
10
- overflow: 'hidden',
11
- }}
12
- >
13
- {text}
14
- </span>
15
- )
16
- }