@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
@@ -1,98 +0,0 @@
1
- import React__default from 'react';
2
- import { Code } from '../styledComponents.esm.js';
3
- import useSubscribeToQueryCache from '../useSubscribeToQueryCache.esm.js';
4
- import { getQueryStatusColor } from '../utils.esm.js';
5
- import { defaultTheme } from '../theme.esm.js';
6
-
7
- /**
8
- * Row for a query in the query list
9
- */
10
- const QueryRow = /*#__PURE__*/React__default.memo(({
11
- queryKey,
12
- setActiveQueryHash,
13
- activeQueryHash,
14
- queryCache
15
- }) => {
16
- var _useSubscribeToQueryC, _useSubscribeToQueryC2, _useSubscribeToQueryC3, _useSubscribeToQueryC4;
17
- const queryHash = (_useSubscribeToQueryC = useSubscribeToQueryCache(queryCache, () => {
18
- var _queryCache$find;
19
- return (_queryCache$find = queryCache.find({
20
- queryKey
21
- })) == null ? void 0 : _queryCache$find.queryHash;
22
- })) != null ? _useSubscribeToQueryC : '';
23
- const queryState = useSubscribeToQueryCache(queryCache, () => {
24
- var _queryCache$find2;
25
- return (_queryCache$find2 = queryCache.find({
26
- queryKey
27
- })) == null ? void 0 : _queryCache$find2.state;
28
- });
29
- const isStale = (_useSubscribeToQueryC2 = useSubscribeToQueryCache(queryCache, () => {
30
- var _queryCache$find3;
31
- return (_queryCache$find3 = queryCache.find({
32
- queryKey
33
- })) == null ? void 0 : _queryCache$find3.isStale();
34
- })) != null ? _useSubscribeToQueryC2 : false;
35
- const isDisabled = (_useSubscribeToQueryC3 = useSubscribeToQueryCache(queryCache, () => {
36
- var _queryCache$find4;
37
- return (_queryCache$find4 = queryCache.find({
38
- queryKey
39
- })) == null ? void 0 : _queryCache$find4.isDisabled();
40
- })) != null ? _useSubscribeToQueryC3 : false;
41
- const observerCount = (_useSubscribeToQueryC4 = useSubscribeToQueryCache(queryCache, () => {
42
- var _queryCache$find5;
43
- return (_queryCache$find5 = queryCache.find({
44
- queryKey
45
- })) == null ? void 0 : _queryCache$find5.getObserversCount();
46
- })) != null ? _useSubscribeToQueryC4 : 0;
47
- if (!queryState) {
48
- return null;
49
- }
50
- return /*#__PURE__*/React__default.createElement("div", {
51
- role: "button",
52
- "aria-label": `Open query details for ${queryHash}`,
53
- onClick: () => setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash),
54
- style: {
55
- display: 'flex',
56
- borderBottom: `solid 1px ${defaultTheme.grayAlt}`,
57
- cursor: 'pointer',
58
- background: queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined
59
- }
60
- }, /*#__PURE__*/React__default.createElement("div", {
61
- style: {
62
- flex: '0 0 auto',
63
- width: '2em',
64
- height: '2em',
65
- background: getQueryStatusColor({
66
- queryState,
67
- isStale,
68
- observerCount,
69
- theme: defaultTheme
70
- }),
71
- display: 'flex',
72
- alignItems: 'center',
73
- justifyContent: 'center',
74
- fontWeight: 'bold',
75
- textShadow: isStale ? '0' : '0 0 10px black',
76
- color: isStale ? 'black' : 'white'
77
- }
78
- }, observerCount), isDisabled ? /*#__PURE__*/React__default.createElement("div", {
79
- style: {
80
- flex: '0 0 auto',
81
- height: '2em',
82
- background: defaultTheme.gray,
83
- display: 'flex',
84
- alignItems: 'center',
85
- fontWeight: 'bold',
86
- padding: '0 0.5em'
87
- }
88
- }, "disabled") : null, /*#__PURE__*/React__default.createElement(Code, {
89
- style: {
90
- padding: '.5em'
91
- }
92
- }, `${queryHash}`));
93
- });
94
- QueryRow.displayName = 'QueryRow';
95
- var QueryRow$1 = QueryRow;
96
-
97
- export { QueryRow$1 as default };
98
- //# sourceMappingURL=QueryRow.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"QueryRow.esm.js","sources":["../../../src/CachePanel/QueryRow.tsx"],"sourcesContent":["import React from 'react'\nimport type {\n QueryCache,\n QueryKey as QueryKeyType,\n} from '@tanstack/react-query'\n\nimport { Code } from '../styledComponents'\n\nimport useSubscribeToQueryCache from '../useSubscribeToQueryCache'\nimport { getQueryStatusColor } from '../utils'\nimport { defaultTheme as theme } from '../theme'\n\ninterface QueryRowProps {\n queryKey: QueryKeyType\n setActiveQueryHash: (hash: string) => void\n activeQueryHash?: string\n queryCache: QueryCache\n}\n\n/**\n * Row for a query in the query list\n */\nconst QueryRow = React.memo(\n ({\n queryKey,\n setActiveQueryHash,\n activeQueryHash,\n queryCache,\n }: QueryRowProps) => {\n const queryHash =\n useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.queryHash,\n ) ?? ''\n\n const queryState = useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.state,\n )\n\n const isStale =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isStale(),\n ) ?? false\n\n const isDisabled =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isDisabled(),\n ) ?? false\n\n const observerCount =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.getObserversCount(),\n ) ?? 0\n\n if (!queryState) {\n return null\n }\n\n return (\n <div\n role=\"button\"\n aria-label={`Open query details for ${queryHash}`}\n onClick={() =>\n setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash)\n }\n style={{\n display: 'flex',\n borderBottom: `solid 1px ${theme.grayAlt}`,\n cursor: 'pointer',\n background:\n queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined,\n }}\n >\n <div\n style={{\n flex: '0 0 auto',\n width: '2em',\n height: '2em',\n background: getQueryStatusColor({\n queryState,\n isStale,\n observerCount,\n theme,\n }),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 'bold',\n textShadow: isStale ? '0' : '0 0 10px black',\n color: isStale ? 'black' : 'white',\n }}\n >\n {observerCount}\n </div>\n {isDisabled ? (\n <div\n style={{\n flex: '0 0 auto',\n height: '2em',\n background: theme.gray,\n display: 'flex',\n alignItems: 'center',\n fontWeight: 'bold',\n padding: '0 0.5em',\n }}\n >\n disabled\n </div>\n ) : null}\n <Code\n style={{\n padding: '.5em',\n }}\n >\n {`${queryHash}`}\n </Code>\n </div>\n )\n },\n)\n\nQueryRow.displayName = 'QueryRow'\n\nexport default QueryRow\n"],"names":["QueryRow","React","memo","queryKey","setActiveQueryHash","activeQueryHash","queryCache","queryHash","useSubscribeToQueryCache","find","queryState","state","isStale","isDisabled","observerCount","getObserversCount","display","borderBottom","theme","grayAlt","cursor","background","undefined","flex","width","height","getQueryStatusColor","alignItems","justifyContent","fontWeight","textShadow","color","gray","padding","displayName"],"mappings":";;;;;;AAmBA;AACA;AACA;AACA,MAAMA,QAAQ,gBAAGC,cAAK,CAACC,IAAI,CACzB,CAAC;EACCC,QAAQ;EACRC,kBAAkB;EAClBC,eAAe;AACfC,EAAAA,UAAAA;AACa,CAAC,KAAK;AAAA,EAAA,IAAA,qBAAA,EAAA,sBAAA,EAAA,sBAAA,EAAA,sBAAA,CAAA;AACnB,EAAA,MAAMC,SAAS,GAAA,CAAA,qBAAA,GACbC,wBAAwB,CACtBF,UAAU,EACV,MAAA;AAAA,IAAA,IAAA,gBAAA,CAAA;IAAA,OAAMA,CAAAA,gBAAAA,GAAAA,UAAU,CAACG,IAAI,CAAC;AAAEN,MAAAA,QAAAA;KAAU,CAAC,KAA7B,IAAA,GAAA,KAAA,CAAA,GAAA,gBAAA,CAA+BI,SAAS,CAAA;AAAA,GAAA,CAC/C,oCAAI,EAAE,CAAA;AAET,EAAA,MAAMG,UAAU,GAAGF,wBAAwB,CACzCF,UAAU,EACV,MAAA;AAAA,IAAA,IAAA,iBAAA,CAAA;IAAA,OAAMA,CAAAA,iBAAAA,GAAAA,UAAU,CAACG,IAAI,CAAC;AAAEN,MAAAA,QAAAA;KAAU,CAAC,KAA7B,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,CAA+BQ,KAAK,CAAA;GAC3C,CAAA,CAAA;AAED,EAAA,MAAMC,OAAO,GAAA,CAAA,sBAAA,GACXJ,wBAAwB,CAACF,UAAU,EAAE,MAAA;AAAA,IAAA,IAAA,iBAAA,CAAA;IAAA,OACnCA,CAAAA,iBAAAA,GAAAA,UAAU,CAACG,IAAI,CAAC;AAAEN,MAAAA,QAAAA;AAAS,KAAC,CAAC,KAAA,IAAA,GAAA,KAAA,CAAA,GAA7B,iBAA+BS,CAAAA,OAAO,EAAE,CAAA;AAAA,GAAA,CACzC,qCAAI,KAAK,CAAA;AAEZ,EAAA,MAAMC,UAAU,GAAA,CAAA,sBAAA,GACdL,wBAAwB,CAACF,UAAU,EAAE,MAAA;AAAA,IAAA,IAAA,iBAAA,CAAA;IAAA,OACnCA,CAAAA,iBAAAA,GAAAA,UAAU,CAACG,IAAI,CAAC;AAAEN,MAAAA,QAAAA;AAAS,KAAC,CAAC,KAAA,IAAA,GAAA,KAAA,CAAA,GAA7B,iBAA+BU,CAAAA,UAAU,EAAE,CAAA;AAAA,GAAA,CAC5C,qCAAI,KAAK,CAAA;AAEZ,EAAA,MAAMC,aAAa,GAAA,CAAA,sBAAA,GACjBN,wBAAwB,CAACF,UAAU,EAAE,MAAA;AAAA,IAAA,IAAA,iBAAA,CAAA;IAAA,OACnCA,CAAAA,iBAAAA,GAAAA,UAAU,CAACG,IAAI,CAAC;AAAEN,MAAAA,QAAAA;AAAS,KAAC,CAAC,KAAA,IAAA,GAAA,KAAA,CAAA,GAA7B,iBAA+BY,CAAAA,iBAAiB,EAAE,CAAA;AAAA,GAAA,CACnD,qCAAI,CAAC,CAAA;EAER,IAAI,CAACL,UAAU,EAAE;AACf,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;EAEA,oBACET,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,IAAI,EAAC,QAAQ;IACb,YAAa,EAAA,CAAA,uBAAA,EAAyBM,SAAU,CAAE,CAAA;IAClD,OAAO,EAAE,MACPH,kBAAkB,CAACC,eAAe,KAAKE,SAAS,GAAG,EAAE,GAAGA,SAAS,CAClE;AACD,IAAA,KAAK,EAAE;AACLS,MAAAA,OAAO,EAAE,MAAM;AACfC,MAAAA,YAAY,EAAG,CAAA,UAAA,EAAYC,YAAK,CAACC,OAAQ,CAAC,CAAA;AAC1CC,MAAAA,MAAM,EAAE,SAAS;AACjBC,MAAAA,UAAU,EACRd,SAAS,KAAKF,eAAe,GAAG,sBAAsB,GAAGiB,SAAAA;AAC7D,KAAA;GAEA,eAAArB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,KAAK,EAAE;AACLsB,MAAAA,IAAI,EAAE,UAAU;AAChBC,MAAAA,KAAK,EAAE,KAAK;AACZC,MAAAA,MAAM,EAAE,KAAK;MACbJ,UAAU,EAAEK,mBAAmB,CAAC;QAC9BhB,UAAU;QACVE,OAAO;QACPE,aAAa;AACbI,eAAAA,YAAAA;AACF,OAAC,CAAC;AACFF,MAAAA,OAAO,EAAE,MAAM;AACfW,MAAAA,UAAU,EAAE,QAAQ;AACpBC,MAAAA,cAAc,EAAE,QAAQ;AACxBC,MAAAA,UAAU,EAAE,MAAM;AAClBC,MAAAA,UAAU,EAAElB,OAAO,GAAG,GAAG,GAAG,gBAAgB;AAC5CmB,MAAAA,KAAK,EAAEnB,OAAO,GAAG,OAAO,GAAG,OAAA;AAC7B,KAAA;AAAE,GAAA,EAEDE,aAAa,CACV,EACLD,UAAU,gBACTZ,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,KAAK,EAAE;AACLsB,MAAAA,IAAI,EAAE,UAAU;AAChBE,MAAAA,MAAM,EAAE,KAAK;MACbJ,UAAU,EAAEH,YAAK,CAACc,IAAI;AACtBhB,MAAAA,OAAO,EAAE,MAAM;AACfW,MAAAA,UAAU,EAAE,QAAQ;AACpBE,MAAAA,UAAU,EAAE,MAAM;AAClBI,MAAAA,OAAO,EAAE,SAAA;AACX,KAAA;AAAE,GAAA,EACH,UAED,CAAM,GACJ,IAAI,eACRhC,6BAAC,IAAI,EAAA;AACH,IAAA,KAAK,EAAE;AACLgC,MAAAA,OAAO,EAAE,MAAA;AACX,KAAA;AAAE,GAAA,EAEA,CAAE1B,EAAAA,SAAU,CAAC,CAAA,CACV,CACH,CAAA;AAEV,CAAC,CACF,CAAA;AAEDP,QAAQ,CAACkC,WAAW,GAAG,UAAU,CAAA;AAEjC,iBAAelC,QAAQ;;;;"}
@@ -1,102 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var styledComponents = require('../styledComponents.js');
7
- var useSubscribeToQueryCache = require('../useSubscribeToQueryCache.js');
8
- var utils = require('../utils.js');
9
- var theme = require('../theme.js');
10
-
11
- /**
12
- * Row for a query in the query list
13
- */
14
- const QueryRow = /*#__PURE__*/React.memo(({
15
- queryKey,
16
- setActiveQueryHash,
17
- activeQueryHash,
18
- queryCache
19
- }) => {
20
- var _useSubscribeToQueryC, _useSubscribeToQueryC2, _useSubscribeToQueryC3, _useSubscribeToQueryC4;
21
- const queryHash = (_useSubscribeToQueryC = useSubscribeToQueryCache.default(queryCache, () => {
22
- var _queryCache$find;
23
- return (_queryCache$find = queryCache.find({
24
- queryKey
25
- })) == null ? void 0 : _queryCache$find.queryHash;
26
- })) != null ? _useSubscribeToQueryC : '';
27
- const queryState = useSubscribeToQueryCache.default(queryCache, () => {
28
- var _queryCache$find2;
29
- return (_queryCache$find2 = queryCache.find({
30
- queryKey
31
- })) == null ? void 0 : _queryCache$find2.state;
32
- });
33
- const isStale = (_useSubscribeToQueryC2 = useSubscribeToQueryCache.default(queryCache, () => {
34
- var _queryCache$find3;
35
- return (_queryCache$find3 = queryCache.find({
36
- queryKey
37
- })) == null ? void 0 : _queryCache$find3.isStale();
38
- })) != null ? _useSubscribeToQueryC2 : false;
39
- const isDisabled = (_useSubscribeToQueryC3 = useSubscribeToQueryCache.default(queryCache, () => {
40
- var _queryCache$find4;
41
- return (_queryCache$find4 = queryCache.find({
42
- queryKey
43
- })) == null ? void 0 : _queryCache$find4.isDisabled();
44
- })) != null ? _useSubscribeToQueryC3 : false;
45
- const observerCount = (_useSubscribeToQueryC4 = useSubscribeToQueryCache.default(queryCache, () => {
46
- var _queryCache$find5;
47
- return (_queryCache$find5 = queryCache.find({
48
- queryKey
49
- })) == null ? void 0 : _queryCache$find5.getObserversCount();
50
- })) != null ? _useSubscribeToQueryC4 : 0;
51
- if (!queryState) {
52
- return null;
53
- }
54
- return /*#__PURE__*/React.createElement("div", {
55
- role: "button",
56
- "aria-label": `Open query details for ${queryHash}`,
57
- onClick: () => setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash),
58
- style: {
59
- display: 'flex',
60
- borderBottom: `solid 1px ${theme.defaultTheme.grayAlt}`,
61
- cursor: 'pointer',
62
- background: queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined
63
- }
64
- }, /*#__PURE__*/React.createElement("div", {
65
- style: {
66
- flex: '0 0 auto',
67
- width: '2em',
68
- height: '2em',
69
- background: utils.getQueryStatusColor({
70
- queryState,
71
- isStale,
72
- observerCount,
73
- theme: theme.defaultTheme
74
- }),
75
- display: 'flex',
76
- alignItems: 'center',
77
- justifyContent: 'center',
78
- fontWeight: 'bold',
79
- textShadow: isStale ? '0' : '0 0 10px black',
80
- color: isStale ? 'black' : 'white'
81
- }
82
- }, observerCount), isDisabled ? /*#__PURE__*/React.createElement("div", {
83
- style: {
84
- flex: '0 0 auto',
85
- height: '2em',
86
- background: theme.defaultTheme.gray,
87
- display: 'flex',
88
- alignItems: 'center',
89
- fontWeight: 'bold',
90
- padding: '0 0.5em'
91
- }
92
- }, "disabled") : null, /*#__PURE__*/React.createElement(styledComponents.Code, {
93
- style: {
94
- padding: '.5em'
95
- }
96
- }, `${queryHash}`));
97
- });
98
- QueryRow.displayName = 'QueryRow';
99
- var QueryRow$1 = QueryRow;
100
-
101
- exports.default = QueryRow$1;
102
- //# sourceMappingURL=QueryRow.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"QueryRow.js","sources":["../../../src/CachePanel/QueryRow.tsx"],"sourcesContent":["import React from 'react'\nimport type {\n QueryCache,\n QueryKey as QueryKeyType,\n} from '@tanstack/react-query'\n\nimport { Code } from '../styledComponents'\n\nimport useSubscribeToQueryCache from '../useSubscribeToQueryCache'\nimport { getQueryStatusColor } from '../utils'\nimport { defaultTheme as theme } from '../theme'\n\ninterface QueryRowProps {\n queryKey: QueryKeyType\n setActiveQueryHash: (hash: string) => void\n activeQueryHash?: string\n queryCache: QueryCache\n}\n\n/**\n * Row for a query in the query list\n */\nconst QueryRow = React.memo(\n ({\n queryKey,\n setActiveQueryHash,\n activeQueryHash,\n queryCache,\n }: QueryRowProps) => {\n const queryHash =\n useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.queryHash,\n ) ?? ''\n\n const queryState = useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.state,\n )\n\n const isStale =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isStale(),\n ) ?? false\n\n const isDisabled =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isDisabled(),\n ) ?? false\n\n const observerCount =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.getObserversCount(),\n ) ?? 0\n\n if (!queryState) {\n return null\n }\n\n return (\n <div\n role=\"button\"\n aria-label={`Open query details for ${queryHash}`}\n onClick={() =>\n setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash)\n }\n style={{\n display: 'flex',\n borderBottom: `solid 1px ${theme.grayAlt}`,\n cursor: 'pointer',\n background:\n queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined,\n }}\n >\n <div\n style={{\n flex: '0 0 auto',\n width: '2em',\n height: '2em',\n background: getQueryStatusColor({\n queryState,\n isStale,\n observerCount,\n theme,\n }),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 'bold',\n textShadow: isStale ? '0' : '0 0 10px black',\n color: isStale ? 'black' : 'white',\n }}\n >\n {observerCount}\n </div>\n {isDisabled ? (\n <div\n style={{\n flex: '0 0 auto',\n height: '2em',\n background: theme.gray,\n display: 'flex',\n alignItems: 'center',\n fontWeight: 'bold',\n padding: '0 0.5em',\n }}\n >\n disabled\n </div>\n ) : null}\n <Code\n style={{\n padding: '.5em',\n }}\n >\n {`${queryHash}`}\n </Code>\n </div>\n )\n },\n)\n\nQueryRow.displayName = 'QueryRow'\n\nexport default QueryRow\n"],"names":["QueryRow","React","memo","queryKey","setActiveQueryHash","activeQueryHash","queryCache","queryHash","useSubscribeToQueryCache","find","queryState","state","isStale","isDisabled","observerCount","getObserversCount","display","borderBottom","theme","grayAlt","cursor","background","undefined","flex","width","height","getQueryStatusColor","alignItems","justifyContent","fontWeight","textShadow","color","gray","padding","Code","displayName"],"mappings":"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"}
@@ -1,82 +0,0 @@
1
- import React__default from 'react';
2
- import { Code } from '../styledComponents.mjs';
3
- import useSubscribeToQueryCache from '../useSubscribeToQueryCache.mjs';
4
- import { getQueryStatusColor } from '../utils.mjs';
5
- import { defaultTheme } from '../theme.mjs';
6
-
7
- /**
8
- * Row for a query in the query list
9
- */
10
- const QueryRow = /*#__PURE__*/React__default.memo(({
11
- queryKey,
12
- setActiveQueryHash,
13
- activeQueryHash,
14
- queryCache
15
- }) => {
16
- const queryHash = useSubscribeToQueryCache(queryCache, () => queryCache.find({
17
- queryKey
18
- })?.queryHash) ?? '';
19
- const queryState = useSubscribeToQueryCache(queryCache, () => queryCache.find({
20
- queryKey
21
- })?.state);
22
- const isStale = useSubscribeToQueryCache(queryCache, () => queryCache.find({
23
- queryKey
24
- })?.isStale()) ?? false;
25
- const isDisabled = useSubscribeToQueryCache(queryCache, () => queryCache.find({
26
- queryKey
27
- })?.isDisabled()) ?? false;
28
- const observerCount = useSubscribeToQueryCache(queryCache, () => queryCache.find({
29
- queryKey
30
- })?.getObserversCount()) ?? 0;
31
- if (!queryState) {
32
- return null;
33
- }
34
- return /*#__PURE__*/React__default.createElement("div", {
35
- role: "button",
36
- "aria-label": `Open query details for ${queryHash}`,
37
- onClick: () => setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash),
38
- style: {
39
- display: 'flex',
40
- borderBottom: `solid 1px ${defaultTheme.grayAlt}`,
41
- cursor: 'pointer',
42
- background: queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined
43
- }
44
- }, /*#__PURE__*/React__default.createElement("div", {
45
- style: {
46
- flex: '0 0 auto',
47
- width: '2em',
48
- height: '2em',
49
- background: getQueryStatusColor({
50
- queryState,
51
- isStale,
52
- observerCount,
53
- theme: defaultTheme
54
- }),
55
- display: 'flex',
56
- alignItems: 'center',
57
- justifyContent: 'center',
58
- fontWeight: 'bold',
59
- textShadow: isStale ? '0' : '0 0 10px black',
60
- color: isStale ? 'black' : 'white'
61
- }
62
- }, observerCount), isDisabled ? /*#__PURE__*/React__default.createElement("div", {
63
- style: {
64
- flex: '0 0 auto',
65
- height: '2em',
66
- background: defaultTheme.gray,
67
- display: 'flex',
68
- alignItems: 'center',
69
- fontWeight: 'bold',
70
- padding: '0 0.5em'
71
- }
72
- }, "disabled") : null, /*#__PURE__*/React__default.createElement(Code, {
73
- style: {
74
- padding: '.5em'
75
- }
76
- }, `${queryHash}`));
77
- });
78
- QueryRow.displayName = 'QueryRow';
79
- var QueryRow$1 = QueryRow;
80
-
81
- export { QueryRow$1 as default };
82
- //# sourceMappingURL=QueryRow.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"QueryRow.mjs","sources":["../../../src/CachePanel/QueryRow.tsx"],"sourcesContent":["import React from 'react'\nimport type {\n QueryCache,\n QueryKey as QueryKeyType,\n} from '@tanstack/react-query'\n\nimport { Code } from '../styledComponents'\n\nimport useSubscribeToQueryCache from '../useSubscribeToQueryCache'\nimport { getQueryStatusColor } from '../utils'\nimport { defaultTheme as theme } from '../theme'\n\ninterface QueryRowProps {\n queryKey: QueryKeyType\n setActiveQueryHash: (hash: string) => void\n activeQueryHash?: string\n queryCache: QueryCache\n}\n\n/**\n * Row for a query in the query list\n */\nconst QueryRow = React.memo(\n ({\n queryKey,\n setActiveQueryHash,\n activeQueryHash,\n queryCache,\n }: QueryRowProps) => {\n const queryHash =\n useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.queryHash,\n ) ?? ''\n\n const queryState = useSubscribeToQueryCache(\n queryCache,\n () => queryCache.find({ queryKey })?.state,\n )\n\n const isStale =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isStale(),\n ) ?? false\n\n const isDisabled =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.isDisabled(),\n ) ?? false\n\n const observerCount =\n useSubscribeToQueryCache(queryCache, () =>\n queryCache.find({ queryKey })?.getObserversCount(),\n ) ?? 0\n\n if (!queryState) {\n return null\n }\n\n return (\n <div\n role=\"button\"\n aria-label={`Open query details for ${queryHash}`}\n onClick={() =>\n setActiveQueryHash(activeQueryHash === queryHash ? '' : queryHash)\n }\n style={{\n display: 'flex',\n borderBottom: `solid 1px ${theme.grayAlt}`,\n cursor: 'pointer',\n background:\n queryHash === activeQueryHash ? 'rgba(255,255,255,.1)' : undefined,\n }}\n >\n <div\n style={{\n flex: '0 0 auto',\n width: '2em',\n height: '2em',\n background: getQueryStatusColor({\n queryState,\n isStale,\n observerCount,\n theme,\n }),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n fontWeight: 'bold',\n textShadow: isStale ? '0' : '0 0 10px black',\n color: isStale ? 'black' : 'white',\n }}\n >\n {observerCount}\n </div>\n {isDisabled ? (\n <div\n style={{\n flex: '0 0 auto',\n height: '2em',\n background: theme.gray,\n display: 'flex',\n alignItems: 'center',\n fontWeight: 'bold',\n padding: '0 0.5em',\n }}\n >\n disabled\n </div>\n ) : null}\n <Code\n style={{\n padding: '.5em',\n }}\n >\n {`${queryHash}`}\n </Code>\n </div>\n )\n },\n)\n\nQueryRow.displayName = 'QueryRow'\n\nexport default QueryRow\n"],"names":["QueryRow","React","memo","queryKey","setActiveQueryHash","activeQueryHash","queryCache","queryHash","useSubscribeToQueryCache","find","queryState","state","isStale","isDisabled","observerCount","getObserversCount","display","borderBottom","theme","grayAlt","cursor","background","undefined","flex","width","height","getQueryStatusColor","alignItems","justifyContent","fontWeight","textShadow","color","gray","padding","displayName"],"mappings":";;;;;;AAmBA;AACA;AACA;AACA,MAAMA,QAAQ,gBAAGC,cAAK,CAACC,IAAI,CACzB,CAAC;EACCC,QAAQ;EACRC,kBAAkB;EAClBC,eAAe;AACfC,EAAAA,UAAAA;AACa,CAAC,KAAK;EACnB,MAAMC,SAAS,GACbC,wBAAwB,CACtBF,UAAU,EACV,MAAMA,UAAU,CAACG,IAAI,CAAC;AAAEN,IAAAA,QAAAA;AAAS,GAAC,CAAC,EAAEI,SAAS,CAC/C,IAAI,EAAE,CAAA;EAET,MAAMG,UAAU,GAAGF,wBAAwB,CACzCF,UAAU,EACV,MAAMA,UAAU,CAACG,IAAI,CAAC;AAAEN,IAAAA,QAAAA;GAAU,CAAC,EAAEQ,KAAK,CAC3C,CAAA;EAED,MAAMC,OAAO,GACXJ,wBAAwB,CAACF,UAAU,EAAE,MACnCA,UAAU,CAACG,IAAI,CAAC;AAAEN,IAAAA,QAAAA;AAAS,GAAC,CAAC,EAAES,OAAO,EAAE,CACzC,IAAI,KAAK,CAAA;EAEZ,MAAMC,UAAU,GACdL,wBAAwB,CAACF,UAAU,EAAE,MACnCA,UAAU,CAACG,IAAI,CAAC;AAAEN,IAAAA,QAAAA;AAAS,GAAC,CAAC,EAAEU,UAAU,EAAE,CAC5C,IAAI,KAAK,CAAA;EAEZ,MAAMC,aAAa,GACjBN,wBAAwB,CAACF,UAAU,EAAE,MACnCA,UAAU,CAACG,IAAI,CAAC;AAAEN,IAAAA,QAAAA;AAAS,GAAC,CAAC,EAAEY,iBAAiB,EAAE,CACnD,IAAI,CAAC,CAAA;EAER,IAAI,CAACL,UAAU,EAAE;AACf,IAAA,OAAO,IAAI,CAAA;AACb,GAAA;EAEA,oBACET,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,IAAI,EAAC,QAAQ;IACb,YAAa,EAAA,CAAA,uBAAA,EAAyBM,SAAU,CAAE,CAAA;IAClD,OAAO,EAAE,MACPH,kBAAkB,CAACC,eAAe,KAAKE,SAAS,GAAG,EAAE,GAAGA,SAAS,CAClE;AACD,IAAA,KAAK,EAAE;AACLS,MAAAA,OAAO,EAAE,MAAM;AACfC,MAAAA,YAAY,EAAG,CAAA,UAAA,EAAYC,YAAK,CAACC,OAAQ,CAAC,CAAA;AAC1CC,MAAAA,MAAM,EAAE,SAAS;AACjBC,MAAAA,UAAU,EACRd,SAAS,KAAKF,eAAe,GAAG,sBAAsB,GAAGiB,SAAAA;AAC7D,KAAA;GAEA,eAAArB,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,KAAK,EAAE;AACLsB,MAAAA,IAAI,EAAE,UAAU;AAChBC,MAAAA,KAAK,EAAE,KAAK;AACZC,MAAAA,MAAM,EAAE,KAAK;MACbJ,UAAU,EAAEK,mBAAmB,CAAC;QAC9BhB,UAAU;QACVE,OAAO;QACPE,aAAa;AACbI,eAAAA,YAAAA;AACF,OAAC,CAAC;AACFF,MAAAA,OAAO,EAAE,MAAM;AACfW,MAAAA,UAAU,EAAE,QAAQ;AACpBC,MAAAA,cAAc,EAAE,QAAQ;AACxBC,MAAAA,UAAU,EAAE,MAAM;AAClBC,MAAAA,UAAU,EAAElB,OAAO,GAAG,GAAG,GAAG,gBAAgB;AAC5CmB,MAAAA,KAAK,EAAEnB,OAAO,GAAG,OAAO,GAAG,OAAA;AAC7B,KAAA;AAAE,GAAA,EAEDE,aAAa,CACV,EACLD,UAAU,gBACTZ,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA;AACE,IAAA,KAAK,EAAE;AACLsB,MAAAA,IAAI,EAAE,UAAU;AAChBE,MAAAA,MAAM,EAAE,KAAK;MACbJ,UAAU,EAAEH,YAAK,CAACc,IAAI;AACtBhB,MAAAA,OAAO,EAAE,MAAM;AACfW,MAAAA,UAAU,EAAE,QAAQ;AACpBE,MAAAA,UAAU,EAAE,MAAM;AAClBI,MAAAA,OAAO,EAAE,SAAA;AACX,KAAA;AAAE,GAAA,EACH,UAED,CAAM,GACJ,IAAI,eACRhC,6BAAC,IAAI,EAAA;AACH,IAAA,KAAK,EAAE;AACLgC,MAAAA,OAAO,EAAE,MAAA;AACX,KAAA;AAAE,GAAA,EAEA,CAAE1B,EAAAA,SAAU,CAAC,CAAA,CACV,CACH,CAAA;AAEV,CAAC,CACF,CAAA;AAEDP,QAAQ,CAACkC,WAAW,GAAG,UAAU,CAAA;AAEjC,iBAAelC,QAAQ;;;;"}
@@ -1,51 +0,0 @@
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<Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & React.RefAttributes<HTMLButtonElement>>;
5
- export declare const ExpandButton: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & React.RefAttributes<HTMLButtonElement>>;
6
- export declare const CopyButton: ({ value }: {
7
- value: unknown;
8
- }) => JSX.Element;
9
- export declare const Value: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
10
- export declare const SubEntries: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
11
- export declare const Info: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
12
- declare type ExpanderProps = {
13
- expanded: boolean;
14
- style?: React.CSSProperties;
15
- };
16
- export declare const Expander: ({ expanded, style }: ExpanderProps) => JSX.Element;
17
- declare type EntryType = {
18
- label: string;
19
- };
20
- declare type RendererProps = {
21
- handleEntry: (entry: EntryType) => JSX.Element;
22
- label?: string;
23
- value: unknown;
24
- subEntries: EntryType[];
25
- subEntryPages: EntryType[][];
26
- type: string;
27
- expanded: boolean;
28
- copyable: boolean;
29
- toggleExpanded: () => void;
30
- pageSize: number;
31
- };
32
- /**
33
- * Chunk elements in the array by size
34
- *
35
- * when the array cannot be chunked evenly by size, the last chunk will be
36
- * filled with the remaining elements
37
- *
38
- * @example
39
- * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]
40
- */
41
- export declare function chunkArray<T>(array: T[], size: number): T[][];
42
- declare type Renderer = (props: RendererProps) => JSX.Element;
43
- export declare const DefaultRenderer: Renderer;
44
- declare type ExplorerProps = Partial<RendererProps> & {
45
- renderer?: Renderer;
46
- defaultExpanded?: true | Record<string, boolean>;
47
- copyable?: boolean;
48
- };
49
- export default function Explorer({ value, defaultExpanded, renderer, pageSize, copyable, ...rest }: ExplorerProps): JSX.Element;
50
- export {};
51
- //# sourceMappingURL=Explorer.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Explorer.d.ts","sourceRoot":"","sources":["../../src/Explorer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,eAAO,MAAM,KAAK,6GAMhB,CAAA;AAEF,eAAO,MAAM,KAAK,+GAEhB,CAAA;AAEF,eAAO,MAAM,WAAW,wOAGtB,CAAA;AAEF,eAAO,MAAM,YAAY,wOAQvB,CAAA;AAIF,eAAO,MAAM,UAAU;WAAwB,OAAO;iBA6CrD,CAAA;AAED,eAAO,MAAM,KAAK,+GAEf,CAAA;AAEH,eAAO,MAAM,UAAU,6GAIrB,CAAA;AAEF,eAAO,MAAM,IAAI,+GAGf,CAAA;AAEF,aAAK,aAAa,GAAG;IACnB,QAAQ,EAAE,OAAO,CAAA;IACjB,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CAC5B,CAAA;AAED,eAAO,MAAM,QAAQ,wBAA8B,aAAa,gBAW/D,CAAA;AAwED,aAAK,SAAS,GAAG;IACf,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,aAAK,aAAa,GAAG;IACnB,WAAW,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,GAAG,CAAC,OAAO,CAAA;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,EAAE,OAAO,CAAA;IACd,UAAU,EAAE,SAAS,EAAE,CAAA;IACvB,aAAa,EAAE,SAAS,EAAE,EAAE,CAAA;IAC5B,IAAI,EAAE,MAAM,CAAA;IACZ,QAAQ,EAAE,OAAO,CAAA;IACjB,QAAQ,EAAE,OAAO,CAAA;IACjB,cAAc,EAAE,MAAM,IAAI,CAAA;IAC1B,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,IAAI,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAS7D;AAED,aAAK,QAAQ,GAAG,CAAC,KAAK,EAAE,aAAa,KAAK,GAAG,CAAC,OAAO,CAAA;AAErD,eAAO,MAAM,eAAe,EAAE,QA+D7B,CAAA;AAED,aAAK,aAAa,GAAG,OAAO,CAAC,aAAa,CAAC,GAAG;IAC5C,QAAQ,CAAC,EAAE,QAAQ,CAAA;IACnB,eAAe,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAYD,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,EACL,eAAe,EACf,QAA0B,EAC1B,QAAc,EACd,QAAgB,EAChB,GAAG,IAAI,EACR,EAAE,aAAa,eAwEf"}
@@ -1,254 +0,0 @@
1
- 'use client';
2
- import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.esm.js';
3
- import * as React from 'react';
4
- import { displayValue, styled } from './utils.esm.js';
5
- import SuperJSON from 'superjson';
6
-
7
- const Entry = styled('div', {
8
- fontFamily: 'Menlo, monospace',
9
- fontSize: '1em',
10
- lineHeight: '1.7',
11
- outline: 'none',
12
- wordBreak: 'break-word'
13
- });
14
- const Label = styled('span', {
15
- color: 'white'
16
- });
17
- const LabelButton = styled('button', {
18
- cursor: 'pointer',
19
- color: 'white'
20
- });
21
- const ExpandButton = styled('button', {
22
- cursor: 'pointer',
23
- color: 'inherit',
24
- font: 'inherit',
25
- outline: 'inherit',
26
- background: 'transparent',
27
- border: 'none',
28
- padding: 0
29
- });
30
- const CopyButton = ({
31
- value
32
- }) => {
33
- const [copyState, setCopyState] = React.useState('NoCopy');
34
- return /*#__PURE__*/React.createElement("button", {
35
- onClick: copyState === 'NoCopy' ? () => {
36
- navigator.clipboard.writeText(SuperJSON.stringify(value)).then(() => {
37
- setCopyState('SuccessCopy');
38
- setTimeout(() => {
39
- setCopyState('NoCopy');
40
- }, 1500);
41
- }, err => {
42
- console.error('Failed to copy: ', err);
43
- setCopyState('ErrorCopy');
44
- setTimeout(() => {
45
- setCopyState('NoCopy');
46
- }, 1500);
47
- });
48
- } : undefined,
49
- style: {
50
- cursor: 'pointer',
51
- color: 'inherit',
52
- font: 'inherit',
53
- outline: 'inherit',
54
- background: 'transparent',
55
- border: 'none',
56
- padding: 0
57
- }
58
- }, copyState === 'NoCopy' ? /*#__PURE__*/React.createElement(Copier, null) : copyState === 'SuccessCopy' ? /*#__PURE__*/React.createElement(CopiedCopier, null) : /*#__PURE__*/React.createElement(ErrorCopier, null));
59
- };
60
- const Value = styled('span', (_props, theme) => ({
61
- color: theme.danger
62
- }));
63
- const SubEntries = styled('div', {
64
- marginLeft: '.1em',
65
- paddingLeft: '1em',
66
- borderLeft: '2px solid rgba(0,0,0,.15)'
67
- });
68
- const Info = styled('span', {
69
- color: 'grey',
70
- fontSize: '.7em'
71
- });
72
- const Expander = ({
73
- expanded,
74
- style = {}
75
- }) => /*#__PURE__*/React.createElement("span", {
76
- style: {
77
- display: 'inline-block',
78
- transition: 'all .1s ease',
79
- transform: `rotate(${expanded ? 90 : 0}deg) ${style.transform || ''}`,
80
- ...style
81
- }
82
- }, "\u25B6");
83
- const Copier = () => /*#__PURE__*/React.createElement("span", {
84
- "aria-label": "Copy object to clipboard",
85
- title: "Copy object to clipboard",
86
- style: {
87
- paddingLeft: '1em'
88
- }
89
- }, /*#__PURE__*/React.createElement("svg", {
90
- height: "12",
91
- viewBox: "0 0 16 12",
92
- width: "10"
93
- }, /*#__PURE__*/React.createElement("path", {
94
- fill: "currentColor",
95
- 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"
96
- }), /*#__PURE__*/React.createElement("path", {
97
- fill: "currentColor",
98
- 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"
99
- })));
100
- const ErrorCopier = () => /*#__PURE__*/React.createElement("span", {
101
- "aria-label": "Failed copying to clipboard",
102
- title: "Failed copying to clipboard",
103
- style: {
104
- paddingLeft: '1em',
105
- display: 'flex',
106
- alignItems: 'center'
107
- }
108
- }, /*#__PURE__*/React.createElement("svg", {
109
- height: "12",
110
- viewBox: "0 0 16 12",
111
- width: "10",
112
- display: "block"
113
- }, /*#__PURE__*/React.createElement("path", {
114
- fill: "red",
115
- 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"
116
- })), /*#__PURE__*/React.createElement("span", {
117
- style: {
118
- color: 'red',
119
- fontSize: '12px',
120
- paddingLeft: '4px',
121
- position: 'relative',
122
- top: '2px'
123
- }
124
- }, "See console"));
125
- const CopiedCopier = () => /*#__PURE__*/React.createElement("span", {
126
- "aria-label": "Object copied to clipboard",
127
- title: "Object copied to clipboard",
128
- style: {
129
- paddingLeft: '1em',
130
- display: 'inline-block',
131
- verticalAlign: 'middle'
132
- }
133
- }, /*#__PURE__*/React.createElement("svg", {
134
- height: "16",
135
- viewBox: "0 0 16 16",
136
- width: "16",
137
- display: "block"
138
- }, /*#__PURE__*/React.createElement("path", {
139
- fill: "green",
140
- 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"
141
- })));
142
- /**
143
- * Chunk elements in the array by size
144
- *
145
- * when the array cannot be chunked evenly by size, the last chunk will be
146
- * filled with the remaining elements
147
- *
148
- * @example
149
- * chunkArray(['a','b', 'c', 'd', 'e'], 2) // returns [['a','b'], ['c', 'd'], ['e']]
150
- */
151
- function chunkArray(array, size) {
152
- if (size < 1) return [];
153
- let i = 0;
154
- const result = [];
155
- while (i < array.length) {
156
- result.push(array.slice(i, i + size));
157
- i = i + size;
158
- }
159
- return result;
160
- }
161
- const DefaultRenderer = ({
162
- handleEntry,
163
- label,
164
- value,
165
- subEntries = [],
166
- subEntryPages = [],
167
- type,
168
- expanded = false,
169
- copyable = false,
170
- toggleExpanded,
171
- pageSize
172
- }) => {
173
- const [expandedPages, setExpandedPages] = React.useState([]);
174
- return /*#__PURE__*/React.createElement(Entry, {
175
- key: label
176
- }, subEntryPages.length ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ExpandButton, {
177
- onClick: () => toggleExpanded()
178
- }, /*#__PURE__*/React.createElement(Expander, {
179
- expanded: expanded
180
- }), " ", label, ' ', /*#__PURE__*/React.createElement(Info, null, String(type).toLowerCase() === 'iterable' ? '(Iterable) ' : '', subEntries.length, " ", subEntries.length > 1 ? `items` : `item`)), copyable ? /*#__PURE__*/React.createElement(CopyButton, {
181
- value: value
182
- }) : null, expanded ? subEntryPages.length === 1 ? /*#__PURE__*/React.createElement(SubEntries, null, subEntries.map(handleEntry)) : /*#__PURE__*/React.createElement(SubEntries, null, subEntryPages.map((entries, index) => /*#__PURE__*/React.createElement("div", {
183
- key: index
184
- }, /*#__PURE__*/React.createElement(Entry, null, /*#__PURE__*/React.createElement(LabelButton, {
185
- onClick: () => setExpandedPages(old => old.includes(index) ? old.filter(d => d !== index) : [...old, index])
186
- }, /*#__PURE__*/React.createElement(Expander, {
187
- expanded: expanded
188
- }), " [", index * pageSize, " ...", ' ', index * pageSize + pageSize - 1, "]"), expandedPages.includes(index) ? /*#__PURE__*/React.createElement(SubEntries, null, entries.map(handleEntry)) : null)))) : null) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Label, null, label, ":"), " ", /*#__PURE__*/React.createElement(Value, null, displayValue(value))));
189
- };
190
- function isIterable(x) {
191
- return Symbol.iterator in x;
192
- }
193
- function Explorer({
194
- value,
195
- defaultExpanded,
196
- renderer = DefaultRenderer,
197
- pageSize = 100,
198
- copyable = false,
199
- ...rest
200
- }) {
201
- const [expanded, setExpanded] = React.useState(Boolean(defaultExpanded));
202
- const toggleExpanded = React.useCallback(() => setExpanded(old => !old), []);
203
- let type = typeof value;
204
- let subEntries = [];
205
- const makeProperty = sub => {
206
- const subDefaultExpanded = defaultExpanded === true ? {
207
- [sub.label]: true
208
- } : defaultExpanded == null ? void 0 : defaultExpanded[sub.label];
209
- return {
210
- ...sub,
211
- defaultExpanded: subDefaultExpanded
212
- };
213
- };
214
- if (Array.isArray(value)) {
215
- type = 'array';
216
- subEntries = value.map((d, i) => makeProperty({
217
- label: i.toString(),
218
- value: d
219
- }));
220
- } else if (value !== null && typeof value === 'object' && isIterable(value) && typeof value[Symbol.iterator] === 'function') {
221
- type = 'Iterable';
222
- subEntries = Array.from(value, (val, i) => makeProperty({
223
- label: i.toString(),
224
- value: val
225
- }));
226
- } else if (typeof value === 'object' && value !== null) {
227
- type = 'object';
228
- subEntries = Object.entries(value).map(([key, val]) => makeProperty({
229
- label: key,
230
- value: val
231
- }));
232
- }
233
- const subEntryPages = chunkArray(subEntries, pageSize);
234
- return renderer({
235
- handleEntry: entry => /*#__PURE__*/React.createElement(Explorer, _extends({
236
- key: entry.label,
237
- value: value,
238
- renderer: renderer,
239
- copyable: copyable
240
- }, rest, entry)),
241
- type,
242
- subEntries,
243
- subEntryPages,
244
- value,
245
- expanded,
246
- copyable,
247
- toggleExpanded,
248
- pageSize,
249
- ...rest
250
- });
251
- }
252
-
253
- export { CopyButton, DefaultRenderer, Entry, ExpandButton, Expander, Info, Label, LabelButton, SubEntries, Value, chunkArray, Explorer as default };
254
- //# sourceMappingURL=Explorer.esm.js.map