@tanstack/react-query-devtools 5.0.0-alpha.2 → 5.0.0-alpha.23

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 (88) hide show
  1. package/build/lib/CachePanel/ActiveQuery.d.ts +18 -0
  2. package/build/lib/CachePanel/ActiveQuery.esm.js +271 -0
  3. package/build/lib/CachePanel/ActiveQuery.esm.js.map +1 -0
  4. package/build/lib/CachePanel/ActiveQuery.js +275 -0
  5. package/build/lib/CachePanel/ActiveQuery.js.map +1 -0
  6. package/build/lib/CachePanel/ActiveQuery.mjs +257 -0
  7. package/build/lib/CachePanel/ActiveQuery.mjs.map +1 -0
  8. package/build/lib/CachePanel/CachePanel.d.ts +57 -0
  9. package/build/lib/CachePanel/CachePanel.esm.js +310 -0
  10. package/build/lib/CachePanel/CachePanel.esm.js.map +1 -0
  11. package/build/lib/CachePanel/CachePanel.js +315 -0
  12. package/build/lib/CachePanel/CachePanel.js.map +1 -0
  13. package/build/lib/CachePanel/CachePanel.mjs +310 -0
  14. package/build/lib/CachePanel/CachePanel.mjs.map +1 -0
  15. package/build/lib/CachePanel/Header/QueryStatusCount.d.ts +7 -0
  16. package/build/lib/CachePanel/Header/QueryStatusCount.esm.js +49 -0
  17. package/build/lib/CachePanel/Header/QueryStatusCount.esm.js.map +1 -0
  18. package/build/lib/CachePanel/Header/QueryStatusCount.js +53 -0
  19. package/build/lib/CachePanel/Header/QueryStatusCount.js.map +1 -0
  20. package/build/lib/CachePanel/Header/QueryStatusCount.mjs +49 -0
  21. package/build/lib/CachePanel/Header/QueryStatusCount.mjs.map +1 -0
  22. package/build/lib/CachePanel/QueryRow.d.ts +13 -0
  23. package/build/lib/CachePanel/QueryRow.esm.js +98 -0
  24. package/build/lib/CachePanel/QueryRow.esm.js.map +1 -0
  25. package/build/lib/CachePanel/QueryRow.js +102 -0
  26. package/build/lib/CachePanel/QueryRow.js.map +1 -0
  27. package/build/lib/CachePanel/QueryRow.mjs +82 -0
  28. package/build/lib/CachePanel/QueryRow.mjs.map +1 -0
  29. package/build/lib/Explorer.esm.js +2 -1
  30. package/build/lib/Explorer.esm.js.map +1 -1
  31. package/build/lib/Explorer.js +2 -1
  32. package/build/lib/Explorer.js.map +1 -1
  33. package/build/lib/Explorer.mjs +1 -0
  34. package/build/lib/Explorer.mjs.map +1 -1
  35. package/build/lib/devtools.d.ts +5 -48
  36. package/build/lib/devtools.esm.js +11 -550
  37. package/build/lib/devtools.esm.js.map +1 -1
  38. package/build/lib/devtools.js +12 -551
  39. package/build/lib/devtools.js.map +1 -1
  40. package/build/lib/devtools.mjs +7 -547
  41. package/build/lib/devtools.mjs.map +1 -1
  42. package/build/lib/index.esm.js +3 -1
  43. package/build/lib/index.esm.js.map +1 -1
  44. package/build/lib/index.js +3 -1
  45. package/build/lib/index.js.map +1 -1
  46. package/build/lib/index.mjs +3 -1
  47. package/build/lib/index.mjs.map +1 -1
  48. package/build/lib/index.prod.esm.js +821 -651
  49. package/build/lib/index.prod.esm.js.map +1 -1
  50. package/build/lib/index.prod.js +819 -650
  51. package/build/lib/index.prod.js.map +1 -1
  52. package/build/lib/index.prod.mjs +764 -625
  53. package/build/lib/index.prod.mjs.map +1 -1
  54. package/build/lib/styledComponents.d.ts +0 -1
  55. package/build/lib/styledComponents.esm.js +11 -1
  56. package/build/lib/styledComponents.esm.js.map +1 -1
  57. package/build/lib/styledComponents.js +11 -1
  58. package/build/lib/styledComponents.js.map +1 -1
  59. package/build/lib/styledComponents.mjs +11 -1
  60. package/build/lib/styledComponents.mjs.map +1 -1
  61. package/build/lib/theme.esm.js +1 -0
  62. package/build/lib/theme.esm.js.map +1 -1
  63. package/build/lib/theme.js +1 -0
  64. package/build/lib/theme.js.map +1 -1
  65. package/build/lib/theme.mjs +1 -0
  66. package/build/lib/theme.mjs.map +1 -1
  67. package/build/lib/types.d.ts +11 -0
  68. package/build/lib/useSubscribeToQueryCache.d.ts +3 -0
  69. package/build/lib/useSubscribeToQueryCache.esm.js +15 -0
  70. package/build/lib/useSubscribeToQueryCache.esm.js.map +1 -0
  71. package/build/lib/useSubscribeToQueryCache.js +19 -0
  72. package/build/lib/useSubscribeToQueryCache.js.map +1 -0
  73. package/build/lib/useSubscribeToQueryCache.mjs +15 -0
  74. package/build/lib/useSubscribeToQueryCache.mjs.map +1 -0
  75. package/build/umd/index.development.js +1667 -1529
  76. package/build/umd/index.development.js.map +1 -1
  77. package/build/umd/index.production.js.map +1 -1
  78. package/package.json +4 -4
  79. package/src/CachePanel/ActiveQuery.tsx +380 -0
  80. package/src/CachePanel/CachePanel.tsx +439 -0
  81. package/src/CachePanel/Header/QueryStatusCount.tsx +93 -0
  82. package/src/CachePanel/QueryRow.tsx +125 -0
  83. package/src/__tests__/Explorer.test.tsx +3 -2
  84. package/src/__tests__/devtools.test.tsx +229 -9
  85. package/src/devtools.tsx +10 -865
  86. package/src/styledComponents.ts +19 -1
  87. package/src/types.ts +12 -0
  88. package/src/useSubscribeToQueryCache.ts +26 -0
@@ -0,0 +1,98 @@
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
@@ -0,0 +1 @@
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;;;;"}
@@ -0,0 +1,102 @@
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
@@ -0,0 +1 @@
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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"}
@@ -0,0 +1,82 @@
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
@@ -0,0 +1 @@
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":"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"}
@@ -1,3 +1,4 @@
1
+ 'use client';
1
2
  import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.esm.js';
2
3
  import * as React from 'react';
3
4
  import { displayValue, styled } from './utils.esm.js';
@@ -204,7 +205,7 @@ function Explorer({
204
205
  const makeProperty = sub => {
205
206
  const subDefaultExpanded = defaultExpanded === true ? {
206
207
  [sub.label]: true
207
- } : defaultExpanded?.[sub.label];
208
+ } : defaultExpanded == null ? void 0 : defaultExpanded[sub.label];
208
209
  return {
209
210
  ...sub,
210
211
  defaultExpanded: subDefaultExpanded
@@ -1 +1 @@
1
- {"version":3,"file":"Explorer.esm.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { displayValue, styled } from './utils'\nimport superjson from 'superjson'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '1em',\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\ntype CopyState = 'NoCopy' | 'SuccessCopy' | 'ErrorCopy'\n\nexport const CopyButton = ({ value }: { value: unknown }) => {\n const [copyState, setCopyState] = React.useState<CopyState>('NoCopy')\n\n return (\n <button\n onClick={\n copyState === 'NoCopy'\n ? () => {\n navigator.clipboard.writeText(superjson.stringify(value)).then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n style={{\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n }}\n >\n {copyState === 'NoCopy' ? (\n <Copier />\n ) : copyState === 'SuccessCopy' ? (\n <CopiedCopier />\n ) : (\n <ErrorCopier />\n )}\n </button>\n )\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\nconst Copier = () => (\n <span\n aria-label=\"Copy object to clipboard\"\n title=\"Copy object to clipboard\"\n style={{\n paddingLeft: '1em',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\">\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\nconst ErrorCopier = () => (\n <span\n aria-label=\"Failed copying to clipboard\"\n title=\"Failed copying to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\" display=\"block\">\n <path\n fill=\"red\"\n 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\"\n ></path>\n </svg>\n <span\n style={{\n color: 'red',\n fontSize: '12px',\n paddingLeft: '4px',\n position: 'relative',\n top: '2px',\n }}\n >\n See console\n </span>\n </span>\n)\n\nconst CopiedCopier = () => (\n <span\n aria-label=\"Object copied to clipboard\"\n title=\"Object copied to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n >\n <svg height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" display=\"block\">\n <path\n fill=\"green\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\ntype EntryType = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: (entry: EntryType) => JSX.Element\n label?: string\n value: unknown\n subEntries: EntryType[]\n subEntryPages: EntryType[][]\n type: string\n expanded: boolean\n copyable: boolean\n toggleExpanded: () => void\n pageSize: number\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 copyable = false,\n toggleExpanded,\n pageSize,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n\n return (\n <Entry key={label}>\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 {copyable ? <CopyButton value={value} /> : null}\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>{subEntries.map(handleEntry)}</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>{entries.map(handleEntry)}</SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n copyable?: 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 copyable = false,\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 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 copyable={copyable}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n copyable,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["Entry","styled","fontFamily","fontSize","lineHeight","outline","wordBreak","Label","color","LabelButton","cursor","ExpandButton","font","background","border","padding","CopyButton","value","copyState","setCopyState","React","useState","navigator","clipboard","writeText","superjson","stringify","then","setTimeout","err","console","error","undefined","Value","_props","theme","danger","SubEntries","marginLeft","paddingLeft","borderLeft","Info","Expander","expanded","style","display","transition","transform","Copier","ErrorCopier","alignItems","position","top","CopiedCopier","verticalAlign","chunkArray","array","size","i","result","length","push","slice","DefaultRenderer","handleEntry","label","subEntries","subEntryPages","type","copyable","toggleExpanded","pageSize","expandedPages","setExpandedPages","String","toLowerCase","map","entries","index","old","includes","filter","d","displayValue","isIterable","x","Symbol","iterator","Explorer","defaultExpanded","renderer","rest","setExpanded","Boolean","useCallback","makeProperty","sub","subDefaultExpanded","Array","isArray","toString","from","val","Object","key","entry"],"mappings":"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"}
1
+ {"version":3,"file":"Explorer.esm.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { displayValue, styled } from './utils'\nimport superjson from 'superjson'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '1em',\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\ntype CopyState = 'NoCopy' | 'SuccessCopy' | 'ErrorCopy'\n\nexport const CopyButton = ({ value }: { value: unknown }) => {\n const [copyState, setCopyState] = React.useState<CopyState>('NoCopy')\n\n return (\n <button\n onClick={\n copyState === 'NoCopy'\n ? () => {\n navigator.clipboard.writeText(superjson.stringify(value)).then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n style={{\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n }}\n >\n {copyState === 'NoCopy' ? (\n <Copier />\n ) : copyState === 'SuccessCopy' ? (\n <CopiedCopier />\n ) : (\n <ErrorCopier />\n )}\n </button>\n )\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\nconst Copier = () => (\n <span\n aria-label=\"Copy object to clipboard\"\n title=\"Copy object to clipboard\"\n style={{\n paddingLeft: '1em',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\">\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\nconst ErrorCopier = () => (\n <span\n aria-label=\"Failed copying to clipboard\"\n title=\"Failed copying to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\" display=\"block\">\n <path\n fill=\"red\"\n 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\"\n ></path>\n </svg>\n <span\n style={{\n color: 'red',\n fontSize: '12px',\n paddingLeft: '4px',\n position: 'relative',\n top: '2px',\n }}\n >\n See console\n </span>\n </span>\n)\n\nconst CopiedCopier = () => (\n <span\n aria-label=\"Object copied to clipboard\"\n title=\"Object copied to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n >\n <svg height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" display=\"block\">\n <path\n fill=\"green\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\ntype EntryType = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: (entry: EntryType) => JSX.Element\n label?: string\n value: unknown\n subEntries: EntryType[]\n subEntryPages: EntryType[][]\n type: string\n expanded: boolean\n copyable: boolean\n toggleExpanded: () => void\n pageSize: number\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 copyable = false,\n toggleExpanded,\n pageSize,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n\n return (\n <Entry key={label}>\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 {copyable ? <CopyButton value={value} /> : null}\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>{subEntries.map(handleEntry)}</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>{entries.map(handleEntry)}</SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n copyable?: 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 copyable = false,\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 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 copyable={copyable}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n copyable,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["fontFamily","fontSize","lineHeight","outline","wordBreak","color","cursor","font","background","border","padding","value","navigator","setTimeout","console","marginLeft","paddingLeft","borderLeft","style","display","transition","transform","alignItems","position","top","verticalAlign","result","subEntries","subEntryPages","expanded","copyable","pageSize","renderer","defaultExpanded","type","label","handleEntry"],"mappings":";;;;;;;AAOEA;AACAC;AACAC;AACAC;AACAC;AACF;;AAGEC;AACF;;AAGEC;AACAD;AACF;;AAGEC;AACAD;AACAE;AACAJ;AACAK;AACAC;AACAC;AACF;AAIO;AAAsBC;AAA0B;;;AAKjD;AAGQC;;AAGIC;;;;AAKAC;;AAEAD;;;AAGF;AAEJ;AAGN;AACEP;AACAD;AACAE;AACAJ;AACAK;AACAC;AACAC;AACF;AAAE;AAWR;AAEO;;AAEP;;AAGEK;AACAC;AACAC;AACF;;AAGEZ;AACAJ;AACF;AAOO;;AAA8BiB;AAA0B;AAE3D;AACEC;AACAC;AACAC;;AAEF;AAAE;AAMN;AAEI;AACA;AACA;AACEL;AACF;AAAE;AAEG;AAAY;AAAoB;AAAU;AAE3C;AACA;AAA6M;AAG7M;AACA;AAAmO;AAM3O;AAEI;AACA;AACA;AACEA;AACAG;AACAG;AACF;AAAE;AAEG;AAAY;AAAoB;AAAW;AAAe;AAE3D;AACA;AAAyL;AAI3L;AACEjB;AACAJ;AACAe;AACAO;AACAC;AACF;AAAE;AAOR;AAEI;AACA;AACA;AACER;AACAG;AACAM;AACF;AAAE;AAEG;AAAY;AAAoB;AAAW;AAAe;AAE3D;AACA;AAAmI;AAuB3I;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACL;;;AAGA;AACEC;;AAEF;AACA;AACF;AAIO;;;;AAILC;AACAC;;AAEAC;AACAC;;AAEAC;AACF;;AAGE;AACS;AAAW;;AAGkC;AAClC;;AAMY;AAAa;AAOxB;AAAW;AAGV;AAMC;AAES;AAAmB;AAoBrD;AAcA;AACE;AACF;AAEe;;;AAGbC;AACAD;AACAD;;AAEa;AACb;AACA;;;;AAME;;;;AAKE;AACAG;;;AAIJ;AACEC;;AAGIC;AACAxB;AACF;;AAQFuB;AACAP;AAEIQ;AACAxB;AACF;;AAGFuB;AACAP;AAEIQ;AACAxB;AACF;AAEJ;AAEA;AAEA;AACEyB;;AAGI;AACA;AACA;;;;;;;;;;;AAcN;AACF;;"}
@@ -1,3 +1,4 @@
1
+ 'use client';
1
2
  'use strict';
2
3
 
3
4
  Object.defineProperty(exports, '__esModule', { value: true });
@@ -227,7 +228,7 @@ function Explorer({
227
228
  const makeProperty = sub => {
228
229
  const subDefaultExpanded = defaultExpanded === true ? {
229
230
  [sub.label]: true
230
- } : defaultExpanded?.[sub.label];
231
+ } : defaultExpanded == null ? void 0 : defaultExpanded[sub.label];
231
232
  return {
232
233
  ...sub,
233
234
  defaultExpanded: subDefaultExpanded
@@ -1 +1 @@
1
- {"version":3,"file":"Explorer.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { displayValue, styled } from './utils'\nimport superjson from 'superjson'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '1em',\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\ntype CopyState = 'NoCopy' | 'SuccessCopy' | 'ErrorCopy'\n\nexport const CopyButton = ({ value }: { value: unknown }) => {\n const [copyState, setCopyState] = React.useState<CopyState>('NoCopy')\n\n return (\n <button\n onClick={\n copyState === 'NoCopy'\n ? () => {\n navigator.clipboard.writeText(superjson.stringify(value)).then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n style={{\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n }}\n >\n {copyState === 'NoCopy' ? (\n <Copier />\n ) : copyState === 'SuccessCopy' ? (\n <CopiedCopier />\n ) : (\n <ErrorCopier />\n )}\n </button>\n )\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\nconst Copier = () => (\n <span\n aria-label=\"Copy object to clipboard\"\n title=\"Copy object to clipboard\"\n style={{\n paddingLeft: '1em',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\">\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\nconst ErrorCopier = () => (\n <span\n aria-label=\"Failed copying to clipboard\"\n title=\"Failed copying to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\" display=\"block\">\n <path\n fill=\"red\"\n 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\"\n ></path>\n </svg>\n <span\n style={{\n color: 'red',\n fontSize: '12px',\n paddingLeft: '4px',\n position: 'relative',\n top: '2px',\n }}\n >\n See console\n </span>\n </span>\n)\n\nconst CopiedCopier = () => (\n <span\n aria-label=\"Object copied to clipboard\"\n title=\"Object copied to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n >\n <svg height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" display=\"block\">\n <path\n fill=\"green\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\ntype EntryType = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: (entry: EntryType) => JSX.Element\n label?: string\n value: unknown\n subEntries: EntryType[]\n subEntryPages: EntryType[][]\n type: string\n expanded: boolean\n copyable: boolean\n toggleExpanded: () => void\n pageSize: number\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 copyable = false,\n toggleExpanded,\n pageSize,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n\n return (\n <Entry key={label}>\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 {copyable ? <CopyButton value={value} /> : null}\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>{subEntries.map(handleEntry)}</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>{entries.map(handleEntry)}</SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n copyable?: 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 copyable = false,\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 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 copyable={copyable}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n copyable,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["Entry","styled","fontFamily","fontSize","lineHeight","outline","wordBreak","Label","color","LabelButton","cursor","ExpandButton","font","background","border","padding","CopyButton","value","copyState","setCopyState","React","useState","navigator","clipboard","writeText","superjson","stringify","then","setTimeout","err","console","error","undefined","Value","_props","theme","danger","SubEntries","marginLeft","paddingLeft","borderLeft","Info","Expander","expanded","style","display","transition","transform","Copier","ErrorCopier","alignItems","position","top","CopiedCopier","verticalAlign","chunkArray","array","size","i","result","length","push","slice","DefaultRenderer","handleEntry","label","subEntries","subEntryPages","type","copyable","toggleExpanded","pageSize","expandedPages","setExpandedPages","String","toLowerCase","map","entries","index","old","includes","filter","d","displayValue","isIterable","x","Symbol","iterator","Explorer","defaultExpanded","renderer","rest","setExpanded","Boolean","useCallback","makeProperty","sub","subDefaultExpanded","Array","isArray","toString","from","val","Object","key","entry","_extends"],"mappings":"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"}
1
+ {"version":3,"file":"Explorer.js","sources":["../../src/Explorer.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nimport { displayValue, styled } from './utils'\nimport superjson from 'superjson'\n\nexport const Entry = styled('div', {\n fontFamily: 'Menlo, monospace',\n fontSize: '1em',\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\ntype CopyState = 'NoCopy' | 'SuccessCopy' | 'ErrorCopy'\n\nexport const CopyButton = ({ value }: { value: unknown }) => {\n const [copyState, setCopyState] = React.useState<CopyState>('NoCopy')\n\n return (\n <button\n onClick={\n copyState === 'NoCopy'\n ? () => {\n navigator.clipboard.writeText(superjson.stringify(value)).then(\n () => {\n setCopyState('SuccessCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n (err) => {\n console.error('Failed to copy: ', err)\n setCopyState('ErrorCopy')\n setTimeout(() => {\n setCopyState('NoCopy')\n }, 1500)\n },\n )\n }\n : undefined\n }\n style={{\n cursor: 'pointer',\n color: 'inherit',\n font: 'inherit',\n outline: 'inherit',\n background: 'transparent',\n border: 'none',\n padding: 0,\n }}\n >\n {copyState === 'NoCopy' ? (\n <Copier />\n ) : copyState === 'SuccessCopy' ? (\n <CopiedCopier />\n ) : (\n <ErrorCopier />\n )}\n </button>\n )\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\nconst Copier = () => (\n <span\n aria-label=\"Copy object to clipboard\"\n title=\"Copy object to clipboard\"\n style={{\n paddingLeft: '1em',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\">\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n <path\n fill=\"currentColor\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\nconst ErrorCopier = () => (\n <span\n aria-label=\"Failed copying to clipboard\"\n title=\"Failed copying to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'flex',\n alignItems: 'center',\n }}\n >\n <svg height=\"12\" viewBox=\"0 0 16 12\" width=\"10\" display=\"block\">\n <path\n fill=\"red\"\n 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\"\n ></path>\n </svg>\n <span\n style={{\n color: 'red',\n fontSize: '12px',\n paddingLeft: '4px',\n position: 'relative',\n top: '2px',\n }}\n >\n See console\n </span>\n </span>\n)\n\nconst CopiedCopier = () => (\n <span\n aria-label=\"Object copied to clipboard\"\n title=\"Object copied to clipboard\"\n style={{\n paddingLeft: '1em',\n display: 'inline-block',\n verticalAlign: 'middle',\n }}\n >\n <svg height=\"16\" viewBox=\"0 0 16 16\" width=\"16\" display=\"block\">\n <path\n fill=\"green\"\n 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\"\n ></path>\n </svg>\n </span>\n)\n\ntype EntryType = {\n label: string\n}\n\ntype RendererProps = {\n handleEntry: (entry: EntryType) => JSX.Element\n label?: string\n value: unknown\n subEntries: EntryType[]\n subEntryPages: EntryType[][]\n type: string\n expanded: boolean\n copyable: boolean\n toggleExpanded: () => void\n pageSize: number\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 copyable = false,\n toggleExpanded,\n pageSize,\n}) => {\n const [expandedPages, setExpandedPages] = React.useState<number[]>([])\n\n return (\n <Entry key={label}>\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 {copyable ? <CopyButton value={value} /> : null}\n {expanded ? (\n subEntryPages.length === 1 ? (\n <SubEntries>{subEntries.map(handleEntry)}</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>{entries.map(handleEntry)}</SubEntries>\n ) : null}\n </Entry>\n </div>\n ))}\n </SubEntries>\n )\n ) : null}\n </>\n ) : (\n <>\n <Label>{label}:</Label> <Value>{displayValue(value)}</Value>\n </>\n )}\n </Entry>\n )\n}\n\ntype ExplorerProps = Partial<RendererProps> & {\n renderer?: Renderer\n defaultExpanded?: true | Record<string, boolean>\n copyable?: 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 copyable = false,\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 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 copyable={copyable}\n {...rest}\n {...entry}\n />\n ),\n type,\n subEntries,\n subEntryPages,\n value,\n expanded,\n copyable,\n toggleExpanded,\n pageSize,\n ...rest,\n })\n}\n"],"names":["fontFamily","fontSize","lineHeight","outline","wordBreak","color","cursor","font","background","border","padding","value","navigator","setTimeout","console","marginLeft","paddingLeft","borderLeft","style","display","transition","transform","alignItems","position","top","verticalAlign","result","subEntries","subEntryPages","expanded","copyable","pageSize","renderer","defaultExpanded","type","label","handleEntry"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOEA;AACAC;AACAC;AACAC;AACAC;AACF;;AAGEC;AACF;;AAGEC;AACAD;AACF;;AAGEC;AACAD;AACAE;AACAJ;AACAK;AACAC;AACAC;AACF;AAIO;AAAsBC;AAA0B;;;AAKjD;AAGQC;;AAGIC;;;;AAKAC;;AAEAD;;;AAGF;AAEJ;AAGN;AACEP;AACAD;AACAE;AACAJ;AACAK;AACAC;AACAC;AACF;AAAE;AAWR;AAEO;;AAEP;;AAGEK;AACAC;AACAC;AACF;;AAGEZ;AACAJ;AACF;AAOO;;AAA8BiB;AAA0B;AAE3D;AACEC;AACAC;AACAC;;AAEF;AAAE;AAMN;AAEI;AACA;AACA;AACEL;AACF;AAAE;AAEG;AAAY;AAAoB;AAAU;AAE3C;AACA;AAA6M;AAG7M;AACA;AAAmO;AAM3O;AAEI;AACA;AACA;AACEA;AACAG;AACAG;AACF;AAAE;AAEG;AAAY;AAAoB;AAAW;AAAe;AAE3D;AACA;AAAyL;AAI3L;AACEjB;AACAJ;AACAe;AACAO;AACAC;AACF;AAAE;AAOR;AAEI;AACA;AACA;AACER;AACAG;AACAM;AACF;AAAE;AAEG;AAAY;AAAoB;AAAW;AAAe;AAE3D;AACA;AAAmI;AAuB3I;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;AACL;;;AAGA;AACEC;;AAEF;AACA;AACF;AAIO;;;;AAILC;AACAC;;AAEAC;AACAC;;AAEAC;AACF;;AAGE;AACS;AAAW;;AAGkC;AAClC;;AAMY;AAAa;AAOxB;AAAW;AAGV;AAMC;AAES;AAAmB;AAoBrD;AAcA;AACE;AACF;AAEe;;;AAGbC;AACAD;AACAD;;AAEa;AACb;AACA;;;;AAME;;;;AAKE;AACAG;;;AAIJ;AACEC;;AAGIC;AACAxB;AACF;;AAQFuB;AACAP;AAEIQ;AACAxB;AACF;;AAGFuB;AACAP;AAEIQ;AACAxB;AACF;AAEJ;AAEA;AAEA;AACEyB;;AAGI;AACA;AACA;;;;;;;;;;;AAcN;AACF;;;;;;;;;;;;;"}
@@ -1,3 +1,4 @@
1
+ 'use client';
1
2
  import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.mjs';
2
3
  import * as React from 'react';
3
4
  import { displayValue, styled } from './utils.mjs';