@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,36 +0,0 @@
1
- import * as React from 'react';
2
-
3
- function useMediaQuery(query) {
4
- // Keep track of the preference in state, start with the current match
5
- const [isMatch, setIsMatch] = React.useState(() => {
6
- if (typeof window !== 'undefined') {
7
- return window.matchMedia(query).matches;
8
- }
9
- return;
10
- });
11
-
12
- // Watch for changes
13
- React.useEffect(() => {
14
- if (typeof window !== 'undefined') {
15
- // Create a matcher
16
- const matcher = window.matchMedia(query);
17
-
18
- // Create our handler
19
- const onChange = ({
20
- matches
21
- }) => setIsMatch(matches);
22
-
23
- // Listen for changes
24
- matcher.addListener(onChange);
25
- return () => {
26
- // Stop listening for changes
27
- matcher.removeListener(onChange);
28
- };
29
- }
30
- return;
31
- }, [isMatch, query, setIsMatch]);
32
- return isMatch;
33
- }
34
-
35
- export { useMediaQuery as default };
36
- //# sourceMappingURL=useMediaQuery.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useMediaQuery.esm.js","sources":["../../src/useMediaQuery.ts"],"sourcesContent":["import * as React from 'react'\n\nexport default function useMediaQuery(query: string): boolean | undefined {\n // Keep track of the preference in state, start with the current match\n const [isMatch, setIsMatch] = React.useState(() => {\n if (typeof window !== 'undefined') {\n return window.matchMedia(query).matches\n }\n return\n })\n\n // Watch for changes\n React.useEffect(() => {\n if (typeof window !== 'undefined') {\n // Create a matcher\n const matcher = window.matchMedia(query)\n\n // Create our handler\n const onChange = ({ matches }: { matches: boolean }) =>\n setIsMatch(matches)\n\n // Listen for changes\n matcher.addListener(onChange)\n\n return () => {\n // Stop listening for changes\n matcher.removeListener(onChange)\n }\n }\n return\n }, [isMatch, query, setIsMatch])\n\n return isMatch\n}\n"],"names":["useMediaQuery","query","isMatch","setIsMatch","React","useState","window","matchMedia","matches","useEffect","matcher","onChange","addListener","removeListener"],"mappings":";;AAEe,SAASA,aAAa,CAACC,KAAa,EAAuB;AACxE;EACA,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAAC,MAAM;AACjD,IAAA,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;AACjC,MAAA,OAAOA,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAACO,OAAO,CAAA;AACzC,KAAA;AACA,IAAA,OAAA;AACF,GAAC,CAAC,CAAA;;AAEF;EACAJ,KAAK,CAACK,SAAS,CAAC,MAAM;AACpB,IAAA,IAAI,OAAOH,MAAM,KAAK,WAAW,EAAE;AACjC;AACA,MAAA,MAAMI,OAAO,GAAGJ,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAAA;;AAExC;MACA,MAAMU,QAAQ,GAAG,CAAC;AAAEH,QAAAA,OAAAA;AAA8B,OAAC,KACjDL,UAAU,CAACK,OAAO,CAAC,CAAA;;AAErB;AACAE,MAAAA,OAAO,CAACE,WAAW,CAACD,QAAQ,CAAC,CAAA;AAE7B,MAAA,OAAO,MAAM;AACX;AACAD,QAAAA,OAAO,CAACG,cAAc,CAACF,QAAQ,CAAC,CAAA;OACjC,CAAA;AACH,KAAA;AACA,IAAA,OAAA;GACD,EAAE,CAACT,OAAO,EAAED,KAAK,EAAEE,UAAU,CAAC,CAAC,CAAA;AAEhC,EAAA,OAAOD,OAAO,CAAA;AAChB;;;;"}
@@ -1,59 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
-
7
- function _interopNamespaceDefault(e) {
8
- var n = Object.create(null);
9
- if (e) {
10
- Object.keys(e).forEach(function (k) {
11
- if (k !== 'default') {
12
- var d = Object.getOwnPropertyDescriptor(e, k);
13
- Object.defineProperty(n, k, d.get ? d : {
14
- enumerable: true,
15
- get: function () { return e[k]; }
16
- });
17
- }
18
- });
19
- }
20
- n.default = e;
21
- return Object.freeze(n);
22
- }
23
-
24
- var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
25
-
26
- function useMediaQuery(query) {
27
- // Keep track of the preference in state, start with the current match
28
- const [isMatch, setIsMatch] = React__namespace.useState(() => {
29
- if (typeof window !== 'undefined') {
30
- return window.matchMedia(query).matches;
31
- }
32
- return;
33
- });
34
-
35
- // Watch for changes
36
- React__namespace.useEffect(() => {
37
- if (typeof window !== 'undefined') {
38
- // Create a matcher
39
- const matcher = window.matchMedia(query);
40
-
41
- // Create our handler
42
- const onChange = ({
43
- matches
44
- }) => setIsMatch(matches);
45
-
46
- // Listen for changes
47
- matcher.addListener(onChange);
48
- return () => {
49
- // Stop listening for changes
50
- matcher.removeListener(onChange);
51
- };
52
- }
53
- return;
54
- }, [isMatch, query, setIsMatch]);
55
- return isMatch;
56
- }
57
-
58
- exports.default = useMediaQuery;
59
- //# sourceMappingURL=useMediaQuery.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useMediaQuery.js","sources":["../../src/useMediaQuery.ts"],"sourcesContent":["import * as React from 'react'\n\nexport default function useMediaQuery(query: string): boolean | undefined {\n // Keep track of the preference in state, start with the current match\n const [isMatch, setIsMatch] = React.useState(() => {\n if (typeof window !== 'undefined') {\n return window.matchMedia(query).matches\n }\n return\n })\n\n // Watch for changes\n React.useEffect(() => {\n if (typeof window !== 'undefined') {\n // Create a matcher\n const matcher = window.matchMedia(query)\n\n // Create our handler\n const onChange = ({ matches }: { matches: boolean }) =>\n setIsMatch(matches)\n\n // Listen for changes\n matcher.addListener(onChange)\n\n return () => {\n // Stop listening for changes\n matcher.removeListener(onChange)\n }\n }\n return\n }, [isMatch, query, setIsMatch])\n\n return isMatch\n}\n"],"names":["useMediaQuery","query","isMatch","setIsMatch","React","useState","window","matchMedia","matches","useEffect","matcher","onChange","addListener","removeListener"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEe,SAASA,aAAa,CAACC,KAAa,EAAuB;AACxE;EACA,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGC,gBAAK,CAACC,QAAQ,CAAC,MAAM;AACjD,IAAA,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;AACjC,MAAA,OAAOA,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAACO,OAAO,CAAA;AACzC,KAAA;AACA,IAAA,OAAA;AACF,GAAC,CAAC,CAAA;;AAEF;EACAJ,gBAAK,CAACK,SAAS,CAAC,MAAM;AACpB,IAAA,IAAI,OAAOH,MAAM,KAAK,WAAW,EAAE;AACjC;AACA,MAAA,MAAMI,OAAO,GAAGJ,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAAA;;AAExC;MACA,MAAMU,QAAQ,GAAG,CAAC;AAAEH,QAAAA,OAAAA;AAA8B,OAAC,KACjDL,UAAU,CAACK,OAAO,CAAC,CAAA;;AAErB;AACAE,MAAAA,OAAO,CAACE,WAAW,CAACD,QAAQ,CAAC,CAAA;AAE7B,MAAA,OAAO,MAAM;AACX;AACAD,QAAAA,OAAO,CAACG,cAAc,CAACF,QAAQ,CAAC,CAAA;OACjC,CAAA;AACH,KAAA;AACA,IAAA,OAAA;GACD,EAAE,CAACT,OAAO,EAAED,KAAK,EAAEE,UAAU,CAAC,CAAC,CAAA;AAEhC,EAAA,OAAOD,OAAO,CAAA;AAChB;;;;"}
@@ -1,36 +0,0 @@
1
- import * as React from 'react';
2
-
3
- function useMediaQuery(query) {
4
- // Keep track of the preference in state, start with the current match
5
- const [isMatch, setIsMatch] = React.useState(() => {
6
- if (typeof window !== 'undefined') {
7
- return window.matchMedia(query).matches;
8
- }
9
- return;
10
- });
11
-
12
- // Watch for changes
13
- React.useEffect(() => {
14
- if (typeof window !== 'undefined') {
15
- // Create a matcher
16
- const matcher = window.matchMedia(query);
17
-
18
- // Create our handler
19
- const onChange = ({
20
- matches
21
- }) => setIsMatch(matches);
22
-
23
- // Listen for changes
24
- matcher.addListener(onChange);
25
- return () => {
26
- // Stop listening for changes
27
- matcher.removeListener(onChange);
28
- };
29
- }
30
- return;
31
- }, [isMatch, query, setIsMatch]);
32
- return isMatch;
33
- }
34
-
35
- export { useMediaQuery as default };
36
- //# sourceMappingURL=useMediaQuery.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useMediaQuery.mjs","sources":["../../src/useMediaQuery.ts"],"sourcesContent":["import * as React from 'react'\n\nexport default function useMediaQuery(query: string): boolean | undefined {\n // Keep track of the preference in state, start with the current match\n const [isMatch, setIsMatch] = React.useState(() => {\n if (typeof window !== 'undefined') {\n return window.matchMedia(query).matches\n }\n return\n })\n\n // Watch for changes\n React.useEffect(() => {\n if (typeof window !== 'undefined') {\n // Create a matcher\n const matcher = window.matchMedia(query)\n\n // Create our handler\n const onChange = ({ matches }: { matches: boolean }) =>\n setIsMatch(matches)\n\n // Listen for changes\n matcher.addListener(onChange)\n\n return () => {\n // Stop listening for changes\n matcher.removeListener(onChange)\n }\n }\n return\n }, [isMatch, query, setIsMatch])\n\n return isMatch\n}\n"],"names":["useMediaQuery","query","isMatch","setIsMatch","React","useState","window","matchMedia","matches","useEffect","matcher","onChange","addListener","removeListener"],"mappings":";;AAEe,SAASA,aAAa,CAACC,KAAa,EAAuB;AACxE;EACA,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGC,KAAK,CAACC,QAAQ,CAAC,MAAM;AACjD,IAAA,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;AACjC,MAAA,OAAOA,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAACO,OAAO,CAAA;AACzC,KAAA;AACA,IAAA,OAAA;AACF,GAAC,CAAC,CAAA;;AAEF;EACAJ,KAAK,CAACK,SAAS,CAAC,MAAM;AACpB,IAAA,IAAI,OAAOH,MAAM,KAAK,WAAW,EAAE;AACjC;AACA,MAAA,MAAMI,OAAO,GAAGJ,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAAA;;AAExC;MACA,MAAMU,QAAQ,GAAG,CAAC;AAAEH,QAAAA,OAAAA;AAA8B,OAAC,KACjDL,UAAU,CAACK,OAAO,CAAC,CAAA;;AAErB;AACAE,MAAAA,OAAO,CAACE,WAAW,CAACD,QAAQ,CAAC,CAAA;AAE7B,MAAA,OAAO,MAAM;AACX;AACAD,QAAAA,OAAO,CAACG,cAAc,CAACF,QAAQ,CAAC,CAAA;OACjC,CAAA;AACH,KAAA;AACA,IAAA,OAAA;GACD,EAAE,CAACT,OAAO,EAAED,KAAK,EAAEE,UAAU,CAAC,CAAC,CAAA;AAEhC,EAAA,OAAOD,OAAO,CAAA;AAChB;;;;"}
@@ -1,4 +0,0 @@
1
- import type { QueryCache } from '@tanstack/react-query';
2
- declare const useSubscribeToQueryCache: <T>(queryCache: QueryCache, getSnapshot: () => T, skip?: boolean) => T;
3
- export default useSubscribeToQueryCache;
4
- //# sourceMappingURL=useSubscribeToQueryCache.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSubscribeToQueryCache.d.ts","sourceRoot":"","sources":["../../src/useSubscribeToQueryCache.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAA;AAGvD,QAAA,MAAM,wBAAwB,kBAChB,UAAU,+BAEhB,OAAO,MAgBd,CAAA;AAED,eAAe,wBAAwB,CAAA"}
@@ -1,15 +0,0 @@
1
- import React__default from 'react';
2
- import { notifyManager } from '@tanstack/react-query';
3
-
4
- const useSubscribeToQueryCache = (queryCache, getSnapshot, skip = false) => {
5
- return React__default.useSyncExternalStore(React__default.useCallback(onStoreChange => {
6
- if (!skip) return queryCache.subscribe(notifyManager.batchCalls(onStoreChange));
7
- return () => {
8
- return;
9
- };
10
- }, [queryCache, skip]), getSnapshot, getSnapshot);
11
- };
12
- var useSubscribeToQueryCache$1 = useSubscribeToQueryCache;
13
-
14
- export { useSubscribeToQueryCache$1 as default };
15
- //# sourceMappingURL=useSubscribeToQueryCache.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSubscribeToQueryCache.esm.js","sources":["../../src/useSubscribeToQueryCache.ts"],"sourcesContent":["import React from 'react'\nimport type { QueryCache } from '@tanstack/react-query'\nimport { notifyManager } from '@tanstack/react-query'\n\nconst useSubscribeToQueryCache = <T>(\n queryCache: QueryCache,\n getSnapshot: () => T,\n skip: boolean = false,\n): T => {\n return React.useSyncExternalStore(\n React.useCallback(\n (onStoreChange) => {\n if (!skip)\n return queryCache.subscribe(notifyManager.batchCalls(onStoreChange))\n return () => {\n return\n }\n },\n [queryCache, skip],\n ),\n getSnapshot,\n getSnapshot,\n )\n}\n\nexport default useSubscribeToQueryCache\n"],"names":["useSubscribeToQueryCache","queryCache","getSnapshot","skip","React","useSyncExternalStore","useCallback","onStoreChange","subscribe","notifyManager","batchCalls"],"mappings":";;;AAIA,MAAMA,wBAAwB,GAAG,CAC/BC,UAAsB,EACtBC,WAAoB,EACpBC,IAAa,GAAG,KAAK,KACf;EACN,OAAOC,cAAK,CAACC,oBAAoB,CAC/BD,cAAK,CAACE,WAAW,CACdC,aAAa,IAAK;AACjB,IAAA,IAAI,CAACJ,IAAI,EACP,OAAOF,UAAU,CAACO,SAAS,CAACC,aAAa,CAACC,UAAU,CAACH,aAAa,CAAC,CAAC,CAAA;AACtE,IAAA,OAAO,MAAM;AACX,MAAA,OAAA;KACD,CAAA;GACF,EACD,CAACN,UAAU,EAAEE,IAAI,CAAC,CACnB,EACDD,WAAW,EACXA,WAAW,CACZ,CAAA;AACH,CAAC,CAAA;AAED,iCAAeF,wBAAwB;;;;"}
@@ -1,19 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var reactQuery = require('@tanstack/react-query');
7
-
8
- const useSubscribeToQueryCache = (queryCache, getSnapshot, skip = false) => {
9
- return React.useSyncExternalStore(React.useCallback(onStoreChange => {
10
- if (!skip) return queryCache.subscribe(reactQuery.notifyManager.batchCalls(onStoreChange));
11
- return () => {
12
- return;
13
- };
14
- }, [queryCache, skip]), getSnapshot, getSnapshot);
15
- };
16
- var useSubscribeToQueryCache$1 = useSubscribeToQueryCache;
17
-
18
- exports.default = useSubscribeToQueryCache$1;
19
- //# sourceMappingURL=useSubscribeToQueryCache.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSubscribeToQueryCache.js","sources":["../../src/useSubscribeToQueryCache.ts"],"sourcesContent":["import React from 'react'\nimport type { QueryCache } from '@tanstack/react-query'\nimport { notifyManager } from '@tanstack/react-query'\n\nconst useSubscribeToQueryCache = <T>(\n queryCache: QueryCache,\n getSnapshot: () => T,\n skip: boolean = false,\n): T => {\n return React.useSyncExternalStore(\n React.useCallback(\n (onStoreChange) => {\n if (!skip)\n return queryCache.subscribe(notifyManager.batchCalls(onStoreChange))\n return () => {\n return\n }\n },\n [queryCache, skip],\n ),\n getSnapshot,\n getSnapshot,\n )\n}\n\nexport default useSubscribeToQueryCache\n"],"names":["useSubscribeToQueryCache","queryCache","getSnapshot","skip","React","useSyncExternalStore","useCallback","onStoreChange","subscribe","notifyManager","batchCalls"],"mappings":";;;;;;;AAIA,MAAMA,wBAAwB,GAAG,CAC/BC,UAAsB,EACtBC,WAAoB,EACpBC,IAAa,GAAG,KAAK,KACf;EACN,OAAOC,KAAK,CAACC,oBAAoB,CAC/BD,KAAK,CAACE,WAAW,CACdC,aAAa,IAAK;AACjB,IAAA,IAAI,CAACJ,IAAI,EACP,OAAOF,UAAU,CAACO,SAAS,CAACC,wBAAa,CAACC,UAAU,CAACH,aAAa,CAAC,CAAC,CAAA;AACtE,IAAA,OAAO,MAAM;AACX,MAAA,OAAA;KACD,CAAA;GACF,EACD,CAACN,UAAU,EAAEE,IAAI,CAAC,CACnB,EACDD,WAAW,EACXA,WAAW,CACZ,CAAA;AACH,CAAC,CAAA;AAED,iCAAeF,wBAAwB;;;;"}
@@ -1,15 +0,0 @@
1
- import React__default from 'react';
2
- import { notifyManager } from '@tanstack/react-query';
3
-
4
- const useSubscribeToQueryCache = (queryCache, getSnapshot, skip = false) => {
5
- return React__default.useSyncExternalStore(React__default.useCallback(onStoreChange => {
6
- if (!skip) return queryCache.subscribe(notifyManager.batchCalls(onStoreChange));
7
- return () => {
8
- return;
9
- };
10
- }, [queryCache, skip]), getSnapshot, getSnapshot);
11
- };
12
- var useSubscribeToQueryCache$1 = useSubscribeToQueryCache;
13
-
14
- export { useSubscribeToQueryCache$1 as default };
15
- //# sourceMappingURL=useSubscribeToQueryCache.mjs.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"useSubscribeToQueryCache.mjs","sources":["../../src/useSubscribeToQueryCache.ts"],"sourcesContent":["import React from 'react'\nimport type { QueryCache } from '@tanstack/react-query'\nimport { notifyManager } from '@tanstack/react-query'\n\nconst useSubscribeToQueryCache = <T>(\n queryCache: QueryCache,\n getSnapshot: () => T,\n skip: boolean = false,\n): T => {\n return React.useSyncExternalStore(\n React.useCallback(\n (onStoreChange) => {\n if (!skip)\n return queryCache.subscribe(notifyManager.batchCalls(onStoreChange))\n return () => {\n return\n }\n },\n [queryCache, skip],\n ),\n getSnapshot,\n getSnapshot,\n )\n}\n\nexport default useSubscribeToQueryCache\n"],"names":["useSubscribeToQueryCache","queryCache","getSnapshot","skip","React","useSyncExternalStore","useCallback","onStoreChange","subscribe","notifyManager","batchCalls"],"mappings":";;;AAIA,MAAMA,wBAAwB,GAAG,CAC/BC,UAAsB,EACtBC,WAAoB,EACpBC,IAAa,GAAG,KAAK,KACf;EACN,OAAOC,cAAK,CAACC,oBAAoB,CAC/BD,cAAK,CAACE,WAAW,CACdC,aAAa,IAAK;AACjB,IAAA,IAAI,CAACJ,IAAI,EACP,OAAOF,UAAU,CAACO,SAAS,CAACC,aAAa,CAACC,UAAU,CAACH,aAAa,CAAC,CAAC,CAAA;AACtE,IAAA,OAAO,MAAM;AACX,MAAA,OAAA;KACD,CAAA;GACF,EACD,CAACN,UAAU,EAAEE,IAAI,CAAC,CACnB,EACDD,WAAW,EACXA,WAAW,CACZ,CAAA;AACH,CAAC,CAAA;AAED,iCAAeF,wBAAwB;;;;"}
@@ -1,80 +0,0 @@
1
- import * as React from 'react';
2
- import type { Query } from '@tanstack/react-query';
3
- import type { Theme } from './theme';
4
- declare type StyledComponent<T> = T extends 'button' ? React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement> : T extends 'input' ? React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement> : T extends 'select' ? React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement> : T extends keyof HTMLElementTagNameMap ? React.HTMLAttributes<HTMLElementTagNameMap[T]> : never;
5
- export declare function getQueryStatusColor({ queryState, observerCount, isStale, theme, }: {
6
- queryState: Query['state'];
7
- observerCount: number;
8
- isStale: boolean;
9
- theme: Theme;
10
- }): "#3f4e60" | "#00ab52" | "#006bff" | "#8c49eb" | "#ffb200";
11
- export declare function getQueryStatusLabel(query: Query): "fetching" | "paused" | "inactive" | "stale" | "fresh";
12
- declare type Styles = React.CSSProperties | ((props: Record<string, any>, theme: Theme) => React.CSSProperties);
13
- export declare function styled<T extends keyof HTMLElementTagNameMap>(type: T, newStyles: Styles, queries?: Record<string, Styles>): React.ForwardRefExoticComponent<React.PropsWithoutRef<StyledComponent<T>> & React.RefAttributes<HTMLElementTagNameMap[T]>>;
14
- export declare function useIsMounted(): () => boolean;
15
- /**
16
- * Displays a string regardless the type of the data
17
- * @param {unknown} value Value to be stringified
18
- * @param {boolean} beautify Formats json to multiline
19
- */
20
- export declare const displayValue: (value: unknown, beautify?: boolean) => string;
21
- declare type SortFn = (a: Query, b: Query) => number;
22
- export declare const sortFns: Record<string, SortFn>;
23
- export declare const minPanelSize = 70;
24
- export declare const defaultPanelSize = 500;
25
- export declare const sides: Record<Side, Side>;
26
- export declare type Corner = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
27
- export declare type Side = 'left' | 'right' | 'top' | 'bottom';
28
- /**
29
- * Check if the given side is vertical (left/right)
30
- */
31
- export declare function isVerticalSide(side: Side): boolean;
32
- /**
33
- * Get the opposite side, eg 'left' => 'right'. 'top' => 'bottom', etc
34
- */
35
- export declare function getOppositeSide(side: Side): Side;
36
- /**
37
- * Given as css prop it will return a sided css prop based on a given side
38
- * Example given `border` and `right` it return `borderRight`
39
- */
40
- export declare function getSidedProp<T extends string>(prop: T, side: Side): `${T}Left` | `${T}Right` | `${T}Bottom` | `${T}Top`;
41
- export interface SidePanelStyleOptions {
42
- /**
43
- * Position of the panel
44
- * Defaults to 'bottom'
45
- */
46
- position?: Side;
47
- /**
48
- * Staring height for the panel, it is set if the position is horizontal eg 'top' or 'bottom'
49
- * Defaults to 500
50
- */
51
- height?: number;
52
- /**
53
- * Staring width for the panel, it is set if the position is vertical eg 'left' or 'right'
54
- * Defaults to 500
55
- */
56
- width?: number;
57
- /**
58
- * RQ devtools theme
59
- */
60
- devtoolsTheme: Theme;
61
- /**
62
- * Sets the correct transition and visibility styles
63
- */
64
- isOpen?: boolean;
65
- /**
66
- * If the panel is resizing set to true to apply the correct transition styles
67
- */
68
- isResizing?: boolean;
69
- /**
70
- * Extra panel style passed by the user
71
- */
72
- panelStyle?: React.CSSProperties;
73
- }
74
- export declare function getSidePanelStyle({ position, height, width, devtoolsTheme, isOpen, isResizing, panelStyle, }: SidePanelStyleOptions): React.CSSProperties;
75
- /**
76
- * Get resize handle style based on a given side
77
- */
78
- export declare function getResizeHandleStyle(position?: Side): React.CSSProperties;
79
- export {};
80
- //# sourceMappingURL=utils.d.ts.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,uBAAuB,CAAA;AAGlD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAIpC,aAAK,eAAe,CAAC,CAAC,IAAI,CAAC,SAAS,QAAQ,GACxC,KAAK,CAAC,iBAAiB,CACrB,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,iBAAiB,CAClB,GACD,CAAC,SAAS,OAAO,GACjB,KAAK,CAAC,iBAAiB,CACrB,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC,EAC3C,gBAAgB,CACjB,GACD,CAAC,SAAS,QAAQ,GAClB,KAAK,CAAC,iBAAiB,CACrB,KAAK,CAAC,oBAAoB,CAAC,iBAAiB,CAAC,EAC7C,iBAAiB,CAClB,GACD,CAAC,SAAS,MAAM,qBAAqB,GACrC,KAAK,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,GAC9C,KAAK,CAAA;AAET,wBAAgB,mBAAmB,CAAC,EAClC,UAAU,EACV,aAAa,EACb,OAAO,EACP,KAAK,GACN,EAAE;IACD,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAA;IAC1B,aAAa,EAAE,MAAM,CAAA;IACrB,OAAO,EAAE,OAAO,CAAA;IAChB,KAAK,EAAE,KAAK,CAAA;CACb,6DAUA;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,KAAK,0DAU/C;AAED,aAAK,MAAM,GACP,KAAK,CAAC,aAAa,GACnB,CAAC,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,KAAK,KAAK,CAAC,aAAa,CAAC,CAAA;AAEvE,wBAAgB,MAAM,CAAC,CAAC,SAAS,MAAM,qBAAqB,EAC1D,IAAI,EAAE,CAAC,EACP,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAM,8HAgCrC;AAED,wBAAgB,YAAY,kBAY3B;AAED;;;;GAIG;AACH,eAAO,MAAM,YAAY,UAAW,OAAO,aAAY,OAAO,WAI7D,CAAA;AAGD,aAAK,MAAM,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,KAAK,MAAM,CAAA;AAwB5C,eAAO,MAAM,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAI1C,CAAA;AAED,eAAO,MAAM,YAAY,KAAK,CAAA;AAC9B,eAAO,MAAM,gBAAgB,MAAM,CAAA;AACnC,eAAO,MAAM,KAAK,EAAE,MAAM,CAAC,IAAI,EAAE,IAAI,CAKpC,CAAA;AAED,oBAAY,MAAM,GAAG,UAAU,GAAG,WAAW,GAAG,aAAa,GAAG,cAAc,CAAA;AAC9E,oBAAY,IAAI,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAA;AACtD;;GAEG;AACH,wBAAgB,cAAc,CAAC,IAAI,EAAE,IAAI,WAExC;AACD;;GAEG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAEhD;AACD;;;GAGG;AACH,wBAAgB,YAAY,CAAC,CAAC,SAAS,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,uDAIjE;AAED,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,CAAC,EAAE,IAAI,CAAA;IACf;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAA;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,aAAa,EAAE,KAAK,CAAA;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;OAEG;IACH,UAAU,CAAC,EAAE,KAAK,CAAC,aAAa,CAAA;CACjC;AAED,wBAAgB,iBAAiB,CAAC,EAChC,QAAmB,EACnB,MAAM,EACN,KAAK,EACL,aAAa,EACb,MAAM,EACN,UAAU,EACV,UAAU,GACX,EAAE,qBAAqB,GAAG,KAAK,CAAC,aAAa,CAwD7C;AAED;;GAEG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,GAAE,IAAe,GACxB,KAAK,CAAC,aAAa,CAsBrB"}
@@ -1,184 +0,0 @@
1
- import * as React from 'react';
2
- import SuperJSON from 'superjson';
3
- import { useTheme } from './theme.esm.js';
4
- import useMediaQuery from './useMediaQuery.esm.js';
5
-
6
- function getQueryStatusColor({
7
- queryState,
8
- observerCount,
9
- isStale,
10
- theme
11
- }) {
12
- return queryState.fetchStatus === 'fetching' ? theme.active : !observerCount ? theme.gray : queryState.fetchStatus === 'paused' ? theme.paused : isStale ? theme.warning : theme.success;
13
- }
14
- function getQueryStatusLabel(query) {
15
- return query.state.fetchStatus === 'fetching' ? 'fetching' : !query.getObserversCount() ? 'inactive' : query.state.fetchStatus === 'paused' ? 'paused' : query.isStale() ? 'stale' : 'fresh';
16
- }
17
- function styled(type, newStyles, queries = {}) {
18
- return /*#__PURE__*/React.forwardRef(({
19
- style,
20
- ...rest
21
- }, ref) => {
22
- const theme = useTheme();
23
- const mediaStyles = Object.entries(queries).reduce((current, [key, value]) => {
24
- // eslint-disable-next-line react-hooks/rules-of-hooks
25
- return useMediaQuery(key) ? {
26
- ...current,
27
- ...(typeof value === 'function' ? value(rest, theme) : value)
28
- } : current;
29
- }, {});
30
- return /*#__PURE__*/React.createElement(type, {
31
- ...rest,
32
- style: {
33
- ...(typeof newStyles === 'function' ? newStyles(rest, theme) : newStyles),
34
- ...style,
35
- ...mediaStyles
36
- },
37
- ref
38
- });
39
- });
40
- }
41
- function useIsMounted() {
42
- const mountedRef = React.useRef(false);
43
- const isMounted = React.useCallback(() => mountedRef.current, []);
44
- React.useEffect(() => {
45
- mountedRef.current = true;
46
- return () => {
47
- mountedRef.current = false;
48
- };
49
- }, []);
50
- return isMounted;
51
- }
52
-
53
- /**
54
- * Displays a string regardless the type of the data
55
- * @param {unknown} value Value to be stringified
56
- * @param {boolean} beautify Formats json to multiline
57
- */
58
- const displayValue = (value, beautify = false) => {
59
- const {
60
- json
61
- } = SuperJSON.serialize(value);
62
- return JSON.stringify(json, null, beautify ? 2 : undefined);
63
- };
64
-
65
- // Sorting functions
66
-
67
- const getStatusRank = q => q.state.fetchStatus !== 'idle' ? 0 : !q.getObserversCount() ? 3 : q.isStale() ? 2 : 1;
68
- const queryHashSort = (a, b) => a.queryHash.localeCompare(b.queryHash);
69
- const dateSort = (a, b) => a.state.dataUpdatedAt < b.state.dataUpdatedAt ? 1 : -1;
70
- const statusAndDateSort = (a, b) => {
71
- if (getStatusRank(a) === getStatusRank(b)) {
72
- return dateSort(a, b);
73
- }
74
- return getStatusRank(a) > getStatusRank(b) ? 1 : -1;
75
- };
76
- const sortFns = {
77
- 'Status > Last Updated': statusAndDateSort,
78
- 'Query Hash': queryHashSort,
79
- 'Last Updated': dateSort
80
- };
81
- const minPanelSize = 70;
82
- const defaultPanelSize = 500;
83
- const sides = {
84
- top: 'bottom',
85
- bottom: 'top',
86
- left: 'right',
87
- right: 'left'
88
- };
89
- /**
90
- * Check if the given side is vertical (left/right)
91
- */
92
- function isVerticalSide(side) {
93
- return ['left', 'right'].includes(side);
94
- }
95
- /**
96
- * Get the opposite side, eg 'left' => 'right'. 'top' => 'bottom', etc
97
- */
98
- function getOppositeSide(side) {
99
- return sides[side];
100
- }
101
- /**
102
- * Given as css prop it will return a sided css prop based on a given side
103
- * Example given `border` and `right` it return `borderRight`
104
- */
105
- function getSidedProp(prop, side) {
106
- return `${prop}${side.charAt(0).toUpperCase() + side.slice(1)}`;
107
- }
108
- function getSidePanelStyle({
109
- position = 'bottom',
110
- height,
111
- width,
112
- devtoolsTheme,
113
- isOpen,
114
- isResizing,
115
- panelStyle
116
- }) {
117
- const oppositeSide = getOppositeSide(position);
118
- const borderSide = getSidedProp('border', oppositeSide);
119
- const isVertical = isVerticalSide(position);
120
- return {
121
- ...panelStyle,
122
- direction: 'ltr',
123
- position: 'fixed',
124
- [position]: 0,
125
- [borderSide]: `1px solid ${devtoolsTheme.gray}`,
126
- transformOrigin: oppositeSide,
127
- boxShadow: '0 0 20px rgba(0,0,0,.3)',
128
- zIndex: 99999,
129
- // visibility will be toggled after transitions, but set initial state here
130
- visibility: isOpen ? 'visible' : 'hidden',
131
- ...(isResizing ? {
132
- transition: `none`
133
- } : {
134
- transition: `all .2s ease`
135
- }),
136
- ...(isOpen ? {
137
- opacity: 1,
138
- pointerEvents: 'all',
139
- transform: isVertical ? `translateX(0) scale(1)` : `translateY(0) scale(1)`
140
- } : {
141
- opacity: 0,
142
- pointerEvents: 'none',
143
- transform: isVertical ? `translateX(15px) scale(1.02)` : `translateY(15px) scale(1.02)`
144
- }),
145
- ...(isVertical ? {
146
- top: 0,
147
- height: '100vh',
148
- maxWidth: '90%',
149
- width: typeof width === 'number' && width >= minPanelSize ? width : defaultPanelSize
150
- } : {
151
- left: 0,
152
- width: '100%',
153
- maxHeight: '90%',
154
- height: typeof height === 'number' && height >= minPanelSize ? height : defaultPanelSize
155
- })
156
- };
157
- }
158
-
159
- /**
160
- * Get resize handle style based on a given side
161
- */
162
- function getResizeHandleStyle(position = 'bottom') {
163
- const isVertical = isVerticalSide(position);
164
- const oppositeSide = getOppositeSide(position);
165
- const marginSide = getSidedProp('margin', oppositeSide);
166
- return {
167
- position: 'absolute',
168
- cursor: isVertical ? 'col-resize' : 'row-resize',
169
- zIndex: 100000,
170
- [oppositeSide]: 0,
171
- [marginSide]: `-4px`,
172
- ...(isVertical ? {
173
- top: 0,
174
- height: '100%',
175
- width: '4px'
176
- } : {
177
- width: '100%',
178
- height: '4px'
179
- })
180
- };
181
- }
182
-
183
- export { defaultPanelSize, displayValue, getOppositeSide, getQueryStatusColor, getQueryStatusLabel, getResizeHandleStyle, getSidePanelStyle, getSidedProp, isVerticalSide, minPanelSize, sides, sortFns, styled, useIsMounted };
184
- //# sourceMappingURL=utils.esm.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.esm.js","sources":["../../src/utils.ts"],"sourcesContent":["import * as React from 'react'\nimport type { Query } from '@tanstack/react-query'\nimport SuperJSON from 'superjson'\n\nimport type { Theme } from './theme'\nimport { useTheme } from './theme'\nimport useMediaQuery from './useMediaQuery'\n\ntype StyledComponent<T> = T extends 'button'\n ? React.DetailedHTMLProps<\n React.ButtonHTMLAttributes<HTMLButtonElement>,\n HTMLButtonElement\n >\n : T extends 'input'\n ? React.DetailedHTMLProps<\n React.InputHTMLAttributes<HTMLInputElement>,\n HTMLInputElement\n >\n : T extends 'select'\n ? React.DetailedHTMLProps<\n React.SelectHTMLAttributes<HTMLSelectElement>,\n HTMLSelectElement\n >\n : T extends keyof HTMLElementTagNameMap\n ? React.HTMLAttributes<HTMLElementTagNameMap[T]>\n : never\n\nexport function getQueryStatusColor({\n queryState,\n observerCount,\n isStale,\n theme,\n}: {\n queryState: Query['state']\n observerCount: number\n isStale: boolean\n theme: Theme\n}) {\n return queryState.fetchStatus === 'fetching'\n ? theme.active\n : !observerCount\n ? theme.gray\n : queryState.fetchStatus === 'paused'\n ? theme.paused\n : isStale\n ? theme.warning\n : theme.success\n}\n\nexport function getQueryStatusLabel(query: Query) {\n return query.state.fetchStatus === 'fetching'\n ? 'fetching'\n : !query.getObserversCount()\n ? 'inactive'\n : query.state.fetchStatus === 'paused'\n ? 'paused'\n : query.isStale()\n ? 'stale'\n : 'fresh'\n}\n\ntype Styles =\n | React.CSSProperties\n | ((props: Record<string, any>, theme: Theme) => React.CSSProperties)\n\nexport function styled<T extends keyof HTMLElementTagNameMap>(\n type: T,\n newStyles: Styles,\n queries: Record<string, Styles> = {},\n) {\n return React.forwardRef<HTMLElementTagNameMap[T], StyledComponent<T>>(\n ({ style, ...rest }, ref) => {\n const theme = useTheme()\n\n const mediaStyles = Object.entries(queries).reduce(\n (current, [key, value]) => {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useMediaQuery(key)\n ? {\n ...current,\n ...(typeof value === 'function' ? value(rest, theme) : value),\n }\n : current\n },\n {},\n )\n\n return React.createElement(type, {\n ...rest,\n style: {\n ...(typeof newStyles === 'function'\n ? newStyles(rest, theme)\n : newStyles),\n ...style,\n ...mediaStyles,\n },\n ref,\n })\n },\n )\n}\n\nexport function useIsMounted() {\n const mountedRef = React.useRef(false)\n const isMounted = React.useCallback(() => mountedRef.current, [])\n\n React.useEffect(() => {\n mountedRef.current = true\n return () => {\n mountedRef.current = false\n }\n }, [])\n\n return isMounted\n}\n\n/**\n * Displays a string regardless the type of the data\n * @param {unknown} value Value to be stringified\n * @param {boolean} beautify Formats json to multiline\n */\nexport const displayValue = (value: unknown, beautify: boolean = false) => {\n const { json } = SuperJSON.serialize(value)\n\n return JSON.stringify(json, null, beautify ? 2 : undefined)\n}\n\n// Sorting functions\ntype SortFn = (a: Query, b: Query) => number\n\nconst getStatusRank = (q: Query) =>\n q.state.fetchStatus !== 'idle'\n ? 0\n : !q.getObserversCount()\n ? 3\n : q.isStale()\n ? 2\n : 1\n\nconst queryHashSort: SortFn = (a, b) => a.queryHash.localeCompare(b.queryHash)\n\nconst dateSort: SortFn = (a, b) =>\n a.state.dataUpdatedAt < b.state.dataUpdatedAt ? 1 : -1\n\nconst statusAndDateSort: SortFn = (a, b) => {\n if (getStatusRank(a) === getStatusRank(b)) {\n return dateSort(a, b)\n }\n\n return getStatusRank(a) > getStatusRank(b) ? 1 : -1\n}\n\nexport const sortFns: Record<string, SortFn> = {\n 'Status > Last Updated': statusAndDateSort,\n 'Query Hash': queryHashSort,\n 'Last Updated': dateSort,\n}\n\nexport const minPanelSize = 70\nexport const defaultPanelSize = 500\nexport const sides: Record<Side, Side> = {\n top: 'bottom',\n bottom: 'top',\n left: 'right',\n right: 'left',\n}\n\nexport type Corner = 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'\nexport type Side = 'left' | 'right' | 'top' | 'bottom'\n/**\n * Check if the given side is vertical (left/right)\n */\nexport function isVerticalSide(side: Side) {\n return ['left', 'right'].includes(side)\n}\n/**\n * Get the opposite side, eg 'left' => 'right'. 'top' => 'bottom', etc\n */\nexport function getOppositeSide(side: Side): Side {\n return sides[side]\n}\n/**\n * Given as css prop it will return a sided css prop based on a given side\n * Example given `border` and `right` it return `borderRight`\n */\nexport function getSidedProp<T extends string>(prop: T, side: Side) {\n return `${prop}${\n side.charAt(0).toUpperCase() + side.slice(1)\n }` as `${T}${Capitalize<Side>}`\n}\n\nexport interface SidePanelStyleOptions {\n /**\n * Position of the panel\n * Defaults to 'bottom'\n */\n position?: Side\n /**\n * Staring height for the panel, it is set if the position is horizontal eg 'top' or 'bottom'\n * Defaults to 500\n */\n height?: number\n /**\n * Staring width for the panel, it is set if the position is vertical eg 'left' or 'right'\n * Defaults to 500\n */\n width?: number\n /**\n * RQ devtools theme\n */\n devtoolsTheme: Theme\n /**\n * Sets the correct transition and visibility styles\n */\n isOpen?: boolean\n /**\n * If the panel is resizing set to true to apply the correct transition styles\n */\n isResizing?: boolean\n /**\n * Extra panel style passed by the user\n */\n panelStyle?: React.CSSProperties\n}\n\nexport function getSidePanelStyle({\n position = 'bottom',\n height,\n width,\n devtoolsTheme,\n isOpen,\n isResizing,\n panelStyle,\n}: SidePanelStyleOptions): React.CSSProperties {\n const oppositeSide = getOppositeSide(position)\n const borderSide = getSidedProp('border', oppositeSide)\n const isVertical = isVerticalSide(position)\n\n return {\n ...panelStyle,\n direction: 'ltr',\n position: 'fixed',\n [position]: 0,\n [borderSide]: `1px solid ${devtoolsTheme.gray}`,\n transformOrigin: oppositeSide,\n boxShadow: '0 0 20px rgba(0,0,0,.3)',\n zIndex: 99999,\n // visibility will be toggled after transitions, but set initial state here\n visibility: isOpen ? 'visible' : 'hidden',\n ...(isResizing\n ? {\n transition: `none`,\n }\n : { transition: `all .2s ease` }),\n ...(isOpen\n ? {\n opacity: 1,\n pointerEvents: 'all',\n transform: isVertical\n ? `translateX(0) scale(1)`\n : `translateY(0) scale(1)`,\n }\n : {\n opacity: 0,\n pointerEvents: 'none',\n transform: isVertical\n ? `translateX(15px) scale(1.02)`\n : `translateY(15px) scale(1.02)`,\n }),\n ...(isVertical\n ? {\n top: 0,\n height: '100vh',\n maxWidth: '90%',\n width:\n typeof width === 'number' && width >= minPanelSize\n ? width\n : defaultPanelSize,\n }\n : {\n left: 0,\n width: '100%',\n maxHeight: '90%',\n height:\n typeof height === 'number' && height >= minPanelSize\n ? height\n : defaultPanelSize,\n }),\n }\n}\n\n/**\n * Get resize handle style based on a given side\n */\nexport function getResizeHandleStyle(\n position: Side = 'bottom',\n): React.CSSProperties {\n const isVertical = isVerticalSide(position)\n const oppositeSide = getOppositeSide(position)\n const marginSide = getSidedProp('margin', oppositeSide)\n\n return {\n position: 'absolute',\n cursor: isVertical ? 'col-resize' : 'row-resize',\n zIndex: 100000,\n [oppositeSide]: 0,\n [marginSide]: `-4px`,\n ...(isVertical\n ? {\n top: 0,\n height: '100%',\n width: '4px',\n }\n : {\n width: '100%',\n height: '4px',\n }),\n }\n}\n"],"names":["getQueryStatusColor","queryState","observerCount","isStale","theme","fetchStatus","active","gray","paused","warning","success","getQueryStatusLabel","query","state","getObserversCount","styled","type","newStyles","queries","React","forwardRef","style","rest","ref","useTheme","mediaStyles","Object","entries","reduce","current","key","value","useMediaQuery","createElement","useIsMounted","mountedRef","useRef","isMounted","useCallback","useEffect","displayValue","beautify","json","SuperJSON","serialize","JSON","stringify","undefined","getStatusRank","q","queryHashSort","a","b","queryHash","localeCompare","dateSort","dataUpdatedAt","statusAndDateSort","sortFns","minPanelSize","defaultPanelSize","sides","top","bottom","left","right","isVerticalSide","side","includes","getOppositeSide","getSidedProp","prop","charAt","toUpperCase","slice","getSidePanelStyle","position","height","width","devtoolsTheme","isOpen","isResizing","panelStyle","oppositeSide","borderSide","isVertical","direction","transformOrigin","boxShadow","zIndex","visibility","transition","opacity","pointerEvents","transform","maxWidth","maxHeight","getResizeHandleStyle","marginSide","cursor"],"mappings":";;;;;AA2BO,SAASA,mBAAmB,CAAC;EAClCC,UAAU;EACVC,aAAa;EACbC,OAAO;AACPC,EAAAA,KAAAA;AAMF,CAAC,EAAE;AACD,EAAA,OAAOH,UAAU,CAACI,WAAW,KAAK,UAAU,GACxCD,KAAK,CAACE,MAAM,GACZ,CAACJ,aAAa,GACdE,KAAK,CAACG,IAAI,GACVN,UAAU,CAACI,WAAW,KAAK,QAAQ,GACnCD,KAAK,CAACI,MAAM,GACZL,OAAO,GACPC,KAAK,CAACK,OAAO,GACbL,KAAK,CAACM,OAAO,CAAA;AACnB,CAAA;AAEO,SAASC,mBAAmB,CAACC,KAAY,EAAE;AAChD,EAAA,OAAOA,KAAK,CAACC,KAAK,CAACR,WAAW,KAAK,UAAU,GACzC,UAAU,GACV,CAACO,KAAK,CAACE,iBAAiB,EAAE,GAC1B,UAAU,GACVF,KAAK,CAACC,KAAK,CAACR,WAAW,KAAK,QAAQ,GACpC,QAAQ,GACRO,KAAK,CAACT,OAAO,EAAE,GACf,OAAO,GACP,OAAO,CAAA;AACb,CAAA;AAMO,SAASY,MAAM,CACpBC,IAAO,EACPC,SAAiB,EACjBC,OAA+B,GAAG,EAAE,EACpC;AACA,EAAA,oBAAOC,KAAK,CAACC,UAAU,CACrB,CAAC;IAAEC,KAAK;IAAE,GAAGC,IAAAA;GAAM,EAAEC,GAAG,KAAK;IAC3B,MAAMnB,KAAK,GAAGoB,QAAQ,EAAE,CAAA;AAExB,IAAA,MAAMC,WAAW,GAAGC,MAAM,CAACC,OAAO,CAACT,OAAO,CAAC,CAACU,MAAM,CAChD,CAACC,OAAO,EAAE,CAACC,GAAG,EAAEC,KAAK,CAAC,KAAK;AACzB;AACA,MAAA,OAAOC,aAAa,CAACF,GAAG,CAAC,GACrB;AACE,QAAA,GAAGD,OAAO;AACV,QAAA,IAAI,OAAOE,KAAK,KAAK,UAAU,GAAGA,KAAK,CAACT,IAAI,EAAElB,KAAK,CAAC,GAAG2B,KAAK,CAAA;AAC9D,OAAC,GACDF,OAAO,CAAA;KACZ,EACD,EAAE,CACH,CAAA;AAED,IAAA,oBAAOV,KAAK,CAACc,aAAa,CAACjB,IAAI,EAAE;AAC/B,MAAA,GAAGM,IAAI;AACPD,MAAAA,KAAK,EAAE;AACL,QAAA,IAAI,OAAOJ,SAAS,KAAK,UAAU,GAC/BA,SAAS,CAACK,IAAI,EAAElB,KAAK,CAAC,GACtBa,SAAS,CAAC;AACd,QAAA,GAAGI,KAAK;QACR,GAAGI,WAAAA;OACJ;AACDF,MAAAA,GAAAA;AACF,KAAC,CAAC,CAAA;AACJ,GAAC,CACF,CAAA;AACH,CAAA;AAEO,SAASW,YAAY,GAAG;AAC7B,EAAA,MAAMC,UAAU,GAAGhB,KAAK,CAACiB,MAAM,CAAC,KAAK,CAAC,CAAA;AACtC,EAAA,MAAMC,SAAS,GAAGlB,KAAK,CAACmB,WAAW,CAAC,MAAMH,UAAU,CAACN,OAAO,EAAE,EAAE,CAAC,CAAA;EAEjEV,KAAK,CAACoB,SAAS,CAAC,MAAM;IACpBJ,UAAU,CAACN,OAAO,GAAG,IAAI,CAAA;AACzB,IAAA,OAAO,MAAM;MACXM,UAAU,CAACN,OAAO,GAAG,KAAK,CAAA;KAC3B,CAAA;GACF,EAAE,EAAE,CAAC,CAAA;AAEN,EAAA,OAAOQ,SAAS,CAAA;AAClB,CAAA;;AAEA;AACA;AACA;AACA;AACA;AACO,MAAMG,YAAY,GAAG,CAACT,KAAc,EAAEU,QAAiB,GAAG,KAAK,KAAK;EACzE,MAAM;AAAEC,IAAAA,IAAAA;AAAK,GAAC,GAAGC,SAAS,CAACC,SAAS,CAACb,KAAK,CAAC,CAAA;AAE3C,EAAA,OAAOc,IAAI,CAACC,SAAS,CAACJ,IAAI,EAAE,IAAI,EAAED,QAAQ,GAAG,CAAC,GAAGM,SAAS,CAAC,CAAA;AAC7D,EAAC;;AAED;;AAGA,MAAMC,aAAa,GAAIC,CAAQ,IAC7BA,CAAC,CAACpC,KAAK,CAACR,WAAW,KAAK,MAAM,GAC1B,CAAC,GACD,CAAC4C,CAAC,CAACnC,iBAAiB,EAAE,GACtB,CAAC,GACDmC,CAAC,CAAC9C,OAAO,EAAE,GACX,CAAC,GACD,CAAC,CAAA;AAEP,MAAM+C,aAAqB,GAAG,CAACC,CAAC,EAAEC,CAAC,KAAKD,CAAC,CAACE,SAAS,CAACC,aAAa,CAACF,CAAC,CAACC,SAAS,CAAC,CAAA;AAE9E,MAAME,QAAgB,GAAG,CAACJ,CAAC,EAAEC,CAAC,KAC5BD,CAAC,CAACtC,KAAK,CAAC2C,aAAa,GAAGJ,CAAC,CAACvC,KAAK,CAAC2C,aAAa,GAAG,CAAC,GAAG,CAAC,CAAC,CAAA;AAExD,MAAMC,iBAAyB,GAAG,CAACN,CAAC,EAAEC,CAAC,KAAK;EAC1C,IAAIJ,aAAa,CAACG,CAAC,CAAC,KAAKH,aAAa,CAACI,CAAC,CAAC,EAAE;AACzC,IAAA,OAAOG,QAAQ,CAACJ,CAAC,EAAEC,CAAC,CAAC,CAAA;AACvB,GAAA;AAEA,EAAA,OAAOJ,aAAa,CAACG,CAAC,CAAC,GAAGH,aAAa,CAACI,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAA;AACrD,CAAC,CAAA;AAEM,MAAMM,OAA+B,GAAG;AAC7C,EAAA,uBAAuB,EAAED,iBAAiB;AAC1C,EAAA,YAAY,EAAEP,aAAa;AAC3B,EAAA,cAAc,EAAEK,QAAAA;AAClB,EAAC;AAEM,MAAMI,YAAY,GAAG,GAAE;AACvB,MAAMC,gBAAgB,GAAG,IAAG;AAC5B,MAAMC,KAAyB,GAAG;AACvCC,EAAAA,GAAG,EAAE,QAAQ;AACbC,EAAAA,MAAM,EAAE,KAAK;AACbC,EAAAA,IAAI,EAAE,OAAO;AACbC,EAAAA,KAAK,EAAE,MAAA;AACT,EAAC;AAID;AACA;AACA;AACO,SAASC,cAAc,CAACC,IAAU,EAAE;EACzC,OAAO,CAAC,MAAM,EAAE,OAAO,CAAC,CAACC,QAAQ,CAACD,IAAI,CAAC,CAAA;AACzC,CAAA;AACA;AACA;AACA;AACO,SAASE,eAAe,CAACF,IAAU,EAAQ;EAChD,OAAON,KAAK,CAACM,IAAI,CAAC,CAAA;AACpB,CAAA;AACA;AACA;AACA;AACA;AACO,SAASG,YAAY,CAAmBC,IAAO,EAAEJ,IAAU,EAAE;AAClE,EAAA,OAAQ,GAAEI,IAAK,CAAA,EACbJ,IAAI,CAACK,MAAM,CAAC,CAAC,CAAC,CAACC,WAAW,EAAE,GAAGN,IAAI,CAACO,KAAK,CAAC,CAAC,CAC5C,CAAC,CAAA,CAAA;AACJ,CAAA;AAoCO,SAASC,iBAAiB,CAAC;AAChCC,EAAAA,QAAQ,GAAG,QAAQ;EACnBC,MAAM;EACNC,KAAK;EACLC,aAAa;EACbC,MAAM;EACNC,UAAU;AACVC,EAAAA,UAAAA;AACqB,CAAC,EAAuB;AAC7C,EAAA,MAAMC,YAAY,GAAGd,eAAe,CAACO,QAAQ,CAAC,CAAA;AAC9C,EAAA,MAAMQ,UAAU,GAAGd,YAAY,CAAC,QAAQ,EAAEa,YAAY,CAAC,CAAA;AACvD,EAAA,MAAME,UAAU,GAAGnB,cAAc,CAACU,QAAQ,CAAC,CAAA;EAE3C,OAAO;AACL,IAAA,GAAGM,UAAU;AACbI,IAAAA,SAAS,EAAE,KAAK;AAChBV,IAAAA,QAAQ,EAAE,OAAO;IACjB,CAACA,QAAQ,GAAG,CAAC;AACb,IAAA,CAACQ,UAAU,GAAI,CAAA,UAAA,EAAYL,aAAa,CAACxE,IAAK,CAAC,CAAA;AAC/CgF,IAAAA,eAAe,EAAEJ,YAAY;AAC7BK,IAAAA,SAAS,EAAE,yBAAyB;AACpCC,IAAAA,MAAM,EAAE,KAAK;AACb;AACAC,IAAAA,UAAU,EAAEV,MAAM,GAAG,SAAS,GAAG,QAAQ;AACzC,IAAA,IAAIC,UAAU,GACV;AACEU,MAAAA,UAAU,EAAG,CAAA,IAAA,CAAA;AACf,KAAC,GACD;AAAEA,MAAAA,UAAU,EAAG,CAAA,YAAA,CAAA;AAAc,KAAC,CAAC;AACnC,IAAA,IAAIX,MAAM,GACN;AACEY,MAAAA,OAAO,EAAE,CAAC;AACVC,MAAAA,aAAa,EAAE,KAAK;AACpBC,MAAAA,SAAS,EAAET,UAAU,GAChB,CAAA,sBAAA,CAAuB,GACvB,CAAA,sBAAA,CAAA;AACP,KAAC,GACD;AACEO,MAAAA,OAAO,EAAE,CAAC;AACVC,MAAAA,aAAa,EAAE,MAAM;AACrBC,MAAAA,SAAS,EAAET,UAAU,GAChB,CAAA,4BAAA,CAA6B,GAC7B,CAAA,4BAAA,CAAA;AACP,KAAC,CAAC;AACN,IAAA,IAAIA,UAAU,GACV;AACEvB,MAAAA,GAAG,EAAE,CAAC;AACNe,MAAAA,MAAM,EAAE,OAAO;AACfkB,MAAAA,QAAQ,EAAE,KAAK;MACfjB,KAAK,EACH,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,IAAInB,YAAY,GAC9CmB,KAAK,GACLlB,gBAAAA;AACR,KAAC,GACD;AACEI,MAAAA,IAAI,EAAE,CAAC;AACPc,MAAAA,KAAK,EAAE,MAAM;AACbkB,MAAAA,SAAS,EAAE,KAAK;MAChBnB,MAAM,EACJ,OAAOA,MAAM,KAAK,QAAQ,IAAIA,MAAM,IAAIlB,YAAY,GAChDkB,MAAM,GACNjB,gBAAAA;KACP,CAAA;GACN,CAAA;AACH,CAAA;;AAEA;AACA;AACA;AACO,SAASqC,oBAAoB,CAClCrB,QAAc,GAAG,QAAQ,EACJ;AACrB,EAAA,MAAMS,UAAU,GAAGnB,cAAc,CAACU,QAAQ,CAAC,CAAA;AAC3C,EAAA,MAAMO,YAAY,GAAGd,eAAe,CAACO,QAAQ,CAAC,CAAA;AAC9C,EAAA,MAAMsB,UAAU,GAAG5B,YAAY,CAAC,QAAQ,EAAEa,YAAY,CAAC,CAAA;EAEvD,OAAO;AACLP,IAAAA,QAAQ,EAAE,UAAU;AACpBuB,IAAAA,MAAM,EAAEd,UAAU,GAAG,YAAY,GAAG,YAAY;AAChDI,IAAAA,MAAM,EAAE,MAAM;IACd,CAACN,YAAY,GAAG,CAAC;IACjB,CAACe,UAAU,GAAI,CAAK,IAAA,CAAA;AACpB,IAAA,IAAIb,UAAU,GACV;AACEvB,MAAAA,GAAG,EAAE,CAAC;AACNe,MAAAA,MAAM,EAAE,MAAM;AACdC,MAAAA,KAAK,EAAE,KAAA;AACT,KAAC,GACD;AACEA,MAAAA,KAAK,EAAE,MAAM;AACbD,MAAAA,MAAM,EAAE,KAAA;KACT,CAAA;GACN,CAAA;AACH;;;;"}