@tanstack/react-query-devtools 4.26.1 → 4.28.0

package/build/lib/styledComponents.esm.js

@@ -39,7 +39,9 @@ const Button = styled('button', (props, theme) => ({
   cursor: 'pointer'
 }));
 const QueryKeys = styled('span', {
-  display: 'inline-block',
+  display: 'flex',
+  flexWrap: 'wrap',
+  gap: '0.5em',
   fontSize: '0.9em'
 });
 const QueryKey = styled('span', {

package/build/lib/styledComponents.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"styledComponents.esm.js","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'inline-block',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}
+{"version":3,"file":"styledComponents.esm.js","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: '0.5em',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","flexWrap","gap","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}

package/build/lib/styledComponents.js

@@ -43,7 +43,9 @@ const Button = utils.styled('button', (props, theme) => ({
   cursor: 'pointer'
 }));
 const QueryKeys = utils.styled('span', {
-  display: 'inline-block',
+  display: 'flex',
+  flexWrap: 'wrap',
+  gap: '0.5em',
   fontSize: '0.9em'
 });
 const QueryKey = utils.styled('span', {

package/build/lib/styledComponents.js.map

@@ -1 +1 @@
-{"version":3,"file":"styledComponents.js","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'inline-block',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}
+{"version":3,"file":"styledComponents.js","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: '0.5em',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","flexWrap","gap","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}

package/build/lib/styledComponents.mjs

@@ -39,7 +39,9 @@ const Button = styled('button', (props, theme) => ({
   cursor: 'pointer'
 }));
 const QueryKeys = styled('span', {
-  display: 'inline-block',
+  display: 'flex',
+  flexWrap: 'wrap',
+  gap: '0.5em',
   fontSize: '0.9em'
 });
 const QueryKey = styled('span', {

package/build/lib/styledComponents.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"styledComponents.mjs","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'inline-block',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}
+{"version":3,"file":"styledComponents.mjs","sources":["../../src/styledComponents.ts"],"sourcesContent":["import { styled } from './utils'\n\nexport const Panel = styled(\n  'div',\n  (_props, theme) => ({\n    fontSize: 'clamp(12px, 1.5vw, 14px)',\n    fontFamily: `sans-serif`,\n    display: 'flex',\n    backgroundColor: theme.background,\n    color: theme.foreground,\n  }),\n  {\n    '(max-width: 700px)': {\n      flexDirection: 'column',\n    },\n    '(max-width: 600px)': {\n      fontSize: '.9em',\n      // flexDirection: 'column',\n    },\n  },\n)\n\nexport const ActiveQueryPanel = styled(\n  'div',\n  () => ({\n    flex: '1 1 500px',\n    display: 'flex',\n    flexDirection: 'column',\n    overflow: 'auto',\n    height: '100%',\n  }),\n  {\n    '(max-width: 700px)': (_props, theme) => ({\n      borderTop: `2px solid ${theme.gray}`,\n    }),\n  },\n)\n\nexport const Button = styled('button', (props, theme) => ({\n  appearance: 'none',\n  fontSize: '.9em',\n  fontWeight: 'bold',\n  background: theme.gray,\n  border: '0',\n  borderRadius: '.3em',\n  color: 'white',\n  padding: '.5em',\n  opacity: props.disabled ? '.5' : undefined,\n  cursor: 'pointer',\n}))\n\nexport const QueryKeys = styled('span', {\n  display: 'flex',\n  flexWrap: 'wrap',\n  gap: '0.5em',\n  fontSize: '0.9em',\n})\n\nexport const QueryKey = styled('span', {\n  display: 'inline-flex',\n  alignItems: 'center',\n  padding: '.2em .4em',\n  fontWeight: 'bold',\n  textShadow: '0 0 10px black',\n  borderRadius: '.2em',\n})\n\nexport const Code = styled('code', {\n  fontSize: '.9em',\n  color: 'inherit',\n  background: 'inherit',\n})\n\nexport const Input = styled('input', (_props, theme) => ({\n  backgroundColor: theme.inputBackgroundColor,\n  border: 0,\n  borderRadius: '.2em',\n  color: theme.inputTextColor,\n  fontSize: '.9em',\n  lineHeight: `1.3`,\n  padding: '.3em .4em',\n}))\n\nexport const Select = styled(\n  'select',\n  (_props, theme) => ({\n    display: `inline-block`,\n    fontSize: `.9em`,\n    fontFamily: `sans-serif`,\n    fontWeight: 'normal',\n    lineHeight: `1.3`,\n    padding: `.3em 1.5em .3em .5em`,\n    height: 'auto',\n    border: 0,\n    borderRadius: `.2em`,\n    appearance: `none`,\n    WebkitAppearance: 'none',\n    backgroundColor: theme.inputBackgroundColor,\n    backgroundImage: `url(\"data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23444444'><polygon points='0,25 100,25 50,75'/></svg>\")`,\n    backgroundRepeat: `no-repeat`,\n    backgroundPosition: `right .55em center`,\n    backgroundSize: `.65em auto, 100%`,\n    color: theme.inputTextColor,\n  }),\n  {\n    '(max-width: 500px)': {\n      display: 'none',\n    },\n  },\n)\n"],"names":["Panel","styled","_props","theme","fontSize","fontFamily","display","backgroundColor","background","color","foreground","flexDirection","ActiveQueryPanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","QueryKeys","flexWrap","gap","QueryKey","alignItems","textShadow","Code","Input","inputBackgroundColor","inputTextColor","lineHeight","Select","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}

package/build/lib/theme.esm.js

@@ -1,3 +1,4 @@
+'use client';
 import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.esm.js';
 import * as React from 'react';
 

package/build/lib/theme.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.esm.js","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["defaultTheme","background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning","ThemeContext","React","createContext","ThemeProvider","theme","rest","useTheme","useContext"],"mappings":";;;AAGO,MAAMA,YAAY,GAAG;AAC1BC,EAAAA,UAAU,EAAE,SADc;AAE1BC,EAAAA,aAAa,EAAE,SAFW;AAG1BC,EAAAA,UAAU,EAAE,OAHc;AAI1BC,EAAAA,IAAI,EAAE,SAJoB;AAK1BC,EAAAA,OAAO,EAAE,SALiB;AAM1BC,EAAAA,oBAAoB,EAAE,MANI;AAO1BC,EAAAA,cAAc,EAAE,MAPU;AAQ1BC,EAAAA,OAAO,EAAE,SARiB;AAS1BC,EAAAA,MAAM,EAAE,SATkB;AAU1BC,EAAAA,MAAM,EAAE,SAVkB;AAW1BC,EAAAA,MAAM,EAAE,SAXkB;AAY1BC,EAAAA,OAAO,EAAE,SAAA;AAZiB,EAArB;AAqBP,MAAMC,YAAY,gBAAGC,KAAK,CAACC,aAAN,CAAoBf,YAApB,CAArB,CAAA;AAEO,SAASgB,aAAT,CAAuB;EAAEC,KAAF;EAAS,GAAGC,IAAAA;AAAZ,CAAvB,EAA0D;EAC/D,oBAAO,KAAA,CAAA,aAAA,CAAC,YAAD,CAAc,QAAd,EAAA,QAAA,CAAA;AAAuB,IAAA,KAAK,EAAED,KAAAA;AAA9B,GAAA,EAAyCC,IAAzC,CAAP,CAAA,CAAA;AACD,CAAA;AAEM,SAASC,QAAT,GAAoB;AACzB,EAAA,OAAOL,KAAK,CAACM,UAAN,CAAiBP,YAAjB,CAAP,CAAA;AACD;;;;"}
+{"version":3,"file":"theme.esm.js","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning"],"mappings":";;;;AAGO;AACLA;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AAZ0B;AAqB5B;AAEO;;;AAAuB;;AACE;AAAvB;AACR;AAEM;AACL;AACD;;"}

package/build/lib/theme.js

@@ -1,3 +1,4 @@
+'use client';
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });

package/build/lib/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["defaultTheme","background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning","ThemeContext","React","createContext","ThemeProvider","theme","rest","_extends","useTheme","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO,MAAMA,YAAY,GAAG;AAC1BC,EAAAA,UAAU,EAAE,SADc;AAE1BC,EAAAA,aAAa,EAAE,SAFW;AAG1BC,EAAAA,UAAU,EAAE,OAHc;AAI1BC,EAAAA,IAAI,EAAE,SAJoB;AAK1BC,EAAAA,OAAO,EAAE,SALiB;AAM1BC,EAAAA,oBAAoB,EAAE,MANI;AAO1BC,EAAAA,cAAc,EAAE,MAPU;AAQ1BC,EAAAA,OAAO,EAAE,SARiB;AAS1BC,EAAAA,MAAM,EAAE,SATkB;AAU1BC,EAAAA,MAAM,EAAE,SAVkB;AAW1BC,EAAAA,MAAM,EAAE,SAXkB;AAY1BC,EAAAA,OAAO,EAAE,SAAA;AAZiB,EAArB;AAqBP,MAAMC,YAAY,gBAAGC,gBAAK,CAACC,aAAN,CAAoBf,YAApB,CAArB,CAAA;AAEO,SAASgB,aAAT,CAAuB;EAAEC,KAAF;EAAS,GAAGC,IAAAA;AAAZ,CAAvB,EAA0D;EAC/D,oBAAOJ,gBAAA,CAAA,aAAA,CAAC,YAAD,CAAc,QAAd,EAAAK,oCAAA,CAAA;AAAuB,IAAA,KAAK,EAAEF,KAAAA;AAA9B,GAAA,EAAyCC,IAAzC,CAAP,CAAA,CAAA;AACD,CAAA;AAEM,SAASE,QAAT,GAAoB;AACzB,EAAA,OAAON,gBAAK,CAACO,UAAN,CAAiBR,YAAjB,CAAP,CAAA;AACD;;;;;;"}
+{"version":3,"file":"theme.js","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO;AACLA;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AAZ0B;AAqB5B;AAEO;;;AAAuB;;AACE;AAAvB;AACR;AAEM;AACL;AACD;;;;"}

package/build/lib/theme.mjs

@@ -1,3 +1,4 @@
+'use client';
 import { extends as _extends } from './_virtual/_rollupPluginBabelHelpers.mjs';
 import * as React from 'react';
 

package/build/lib/theme.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"theme.mjs","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["defaultTheme","background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning","ThemeContext","React","createContext","ThemeProvider","theme","rest","useTheme","useContext"],"mappings":";;;AAGO,MAAMA,YAAY,GAAG;AAC1BC,EAAAA,UAAU,EAAE,SADc;AAE1BC,EAAAA,aAAa,EAAE,SAFW;AAG1BC,EAAAA,UAAU,EAAE,OAHc;AAI1BC,EAAAA,IAAI,EAAE,SAJoB;AAK1BC,EAAAA,OAAO,EAAE,SALiB;AAM1BC,EAAAA,oBAAoB,EAAE,MANI;AAO1BC,EAAAA,cAAc,EAAE,MAPU;AAQ1BC,EAAAA,OAAO,EAAE,SARiB;AAS1BC,EAAAA,MAAM,EAAE,SATkB;AAU1BC,EAAAA,MAAM,EAAE,SAVkB;AAW1BC,EAAAA,MAAM,EAAE,SAXkB;AAY1BC,EAAAA,OAAO,EAAE,SAAA;AAZiB,EAArB;AAqBP,MAAMC,YAAY,gBAAGC,KAAK,CAACC,aAAN,CAAoBf,YAApB,CAArB,CAAA;AAEO,SAASgB,aAAT,CAAuB;EAAEC,KAAF;EAAS,GAAGC,IAAAA;AAAZ,CAAvB,EAA0D;EAC/D,oBAAO,KAAA,CAAA,aAAA,CAAC,YAAD,CAAc,QAAd,EAAA,QAAA,CAAA;AAAuB,IAAA,KAAK,EAAED,KAAAA;AAA9B,GAAA,EAAyCC,IAAzC,CAAP,CAAA,CAAA;AACD,CAAA;AAEM,SAASC,QAAT,GAAoB;AACzB,EAAA,OAAOL,KAAK,CAACM,UAAN,CAAiBP,YAAjB,CAAP,CAAA;AACD;;;;"}
+{"version":3,"file":"theme.mjs","sources":["../../src/theme.tsx"],"sourcesContent":["'use client'\nimport * as React from 'react'\n\nexport const defaultTheme = {\n  background: '#0b1521',\n  backgroundAlt: '#132337',\n  foreground: 'white',\n  gray: '#3f4e60',\n  grayAlt: '#222e3e',\n  inputBackgroundColor: '#fff',\n  inputTextColor: '#000',\n  success: '#00ab52',\n  danger: '#ff0085',\n  active: '#006bff',\n  paused: '#8c49eb',\n  warning: '#ffb200',\n} as const\n\nexport type Theme = typeof defaultTheme\ninterface ProviderProps {\n  theme: Theme\n  children?: React.ReactNode\n}\n\nconst ThemeContext = React.createContext(defaultTheme)\n\nexport function ThemeProvider({ theme, ...rest }: ProviderProps) {\n  return <ThemeContext.Provider value={theme} {...rest} />\n}\n\nexport function useTheme() {\n  return React.useContext(ThemeContext)\n}\n"],"names":["background","backgroundAlt","foreground","gray","grayAlt","inputBackgroundColor","inputTextColor","success","danger","active","paused","warning"],"mappings":";;;;AAGO;AACLA;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AACAC;AAZ0B;AAqB5B;AAEO;;;AAAuB;;AACE;AAAvB;AACR;AAEM;AACL;AACD;;"}

package/build/umd/index.development.js

@@ -2264,7 +2264,9 @@
     cursor: 'pointer'
   }));
   const QueryKeys = styled('span', {
-    display: 'inline-block',
+    display: 'flex',
+    flexWrap: 'wrap',
+    gap: '0.5em',
     fontSize: '0.9em'
   });
   const QueryKey = styled('span', {
@@ -2618,7 +2620,8 @@
     containerElement: Container = 'aside',
     context,
     styleNonce,
-    panelPosition: initialPanelPosition = 'bottom'
+    panelPosition: initialPanelPosition = 'bottom',
+    errorTypes = []
   }) {
     const rootRef = React__namespace.useRef(null);
     const panelRef = React__namespace.useRef(null);
@@ -2797,7 +2800,8 @@
       style: style,
       isOpen: isResolvedOpen,
       setIsOpen: setIsOpen,
-      onDragStart: e => handleDragStart(panelRef.current, e)
+      onDragStart: e => handleDragStart(panelRef.current, e),
+      errorTypes: errorTypes
     }))), !isResolvedOpen ? /*#__PURE__*/React__namespace.createElement("button", _extends({
       type: "button"
     }, otherToggleButtonProps, {
@@ -2862,6 +2866,7 @@
       showCloseButton,
       position,
       closeButtonProps = {},
+      errorTypes = [],
       ...panelProps
     } = props;
     const {
@@ -2980,7 +2985,9 @@
     }, "Bottom")) : null), /*#__PURE__*/React__namespace.createElement("div", {
       style: {
         display: 'flex',
-        alignItems: 'center'
+        alignItems: 'center',
+        flexWrap: 'wrap',
+        gap: '0.5em'
       }
     }, /*#__PURE__*/React__namespace.createElement(Input, {
       placeholder: "Filter",
@@ -2992,7 +2999,6 @@
       },
       style: {
         flex: '1',
-        marginRight: '.5em',
         width: '100%'
       }
     }), /*#__PURE__*/React__namespace.createElement(Select, {
@@ -3092,7 +3098,8 @@
     }))), activeQueryHash && isOpen ? /*#__PURE__*/React__namespace.createElement(ActiveQuery, {
       activeQueryHash: activeQueryHash,
       queryCache: queryCache,
-      queryClient: queryClient
+      queryClient: queryClient,
+      errorTypes: errorTypes
     }) : null, showCloseButton ? /*#__PURE__*/React__namespace.createElement(Button, _extends({
       type: "button",
       "aria-controls": "ReactQueryDevtoolsPanel",
@@ -3117,7 +3124,8 @@
   const ActiveQuery = ({
     queryCache,
     activeQueryHash,
-    queryClient
+    queryClient,
+    errorTypes
   }) => {
     var _useSubscribeToQueryC, _useSubscribeToQueryC2;
 
@@ -3143,10 +3151,44 @@
       promise == null ? void 0 : promise.catch(noop);
     };
 
+    const currentErrorTypeName = React.useMemo(() => {
+      if (activeQuery && activeQueryState != null && activeQueryState.error) {
+        const errorType = errorTypes.find(type => {
+          var _activeQueryState$err;
+
+          return type.initializer(activeQuery).toString() === ((_activeQueryState$err = activeQueryState.error) == null ? void 0 : _activeQueryState$err.toString());
+        });
+        return errorType == null ? void 0 : errorType.name;
+      }
+
+      return undefined;
+    }, [activeQuery, activeQueryState == null ? void 0 : activeQueryState.error, errorTypes]);
+
     if (!activeQuery || !activeQueryState) {
       return null;
     }
 
+    const triggerError = errorType => {
+      var _errorType$initialize;
+
+      const error = (_errorType$initialize = errorType == null ? void 0 : errorType.initializer(activeQuery)) != null ? _errorType$initialize : new Error('Unknown error from devtools');
+      const __previousQueryOptions = activeQuery.options;
+      activeQuery.setState({
+        status: 'error',
+        error,
+        fetchMeta: { ...activeQuery.state.fetchMeta,
+          __previousQueryOptions
+        }
+      });
+    };
+
+    const restoreQueryAfterLoadingOrError = () => {
+      activeQuery.fetch(activeQuery.state.fetchMeta.__previousQueryOptions, {
+        // Make sure this fetch will cancel the previous one
+        cancelRefetch: true
+      });
+    };
+
     return /*#__PURE__*/React__namespace.createElement(ActiveQueryPanel, null, /*#__PURE__*/React__namespace.createElement("div", {
       style: {
         padding: '.5em',
@@ -3213,7 +3255,11 @@
       }
     }, "Actions"), /*#__PURE__*/React__namespace.createElement("div", {
       style: {
-        padding: '0.5em'
+        padding: '0.5em',
+        display: 'flex',
+        flexWrap: 'wrap',
+        gap: '0.5em',
+        alignItems: 'flex-end'
       }
     }, /*#__PURE__*/React__namespace.createElement(Button, {
       type: "button",
@@ -3241,7 +3287,61 @@
       style: {
         background: defaultTheme.danger
       }
-    }, "Remove")), /*#__PURE__*/React__namespace.createElement("div", {
+    }, "Remove"), ' ', /*#__PURE__*/React__namespace.createElement(Button, {
+      type: "button",
+      onClick: () => {
+        if (activeQuery.state.data === undefined) {
+          restoreQueryAfterLoadingOrError();
+        } else {
+          const __previousQueryOptions = activeQuery.options; // Trigger a fetch in order to trigger suspense as well.
+
+          activeQuery.fetch({ ...__previousQueryOptions,
+            queryFn: () => {
+              return new Promise(() => {// Never resolve
+              });
+            },
+            cacheTime: -1
+          });
+          activeQuery.setState({
+            data: undefined,
+            status: 'loading',
+            fetchMeta: { ...activeQuery.state.fetchMeta,
+              __previousQueryOptions
+            }
+          });
+        }
+      },
+      style: {
+        background: defaultTheme.paused
+      }
+    }, activeQuery.state.status === 'loading' ? 'Restore' : 'Trigger', ' ', "loading"), ' ', errorTypes.length === 0 || activeQuery.state.status === 'error' ? /*#__PURE__*/React__namespace.createElement(Button, {
+      type: "button",
+      onClick: () => {
+        if (!activeQuery.state.error) {
+          triggerError();
+        } else {
+          queryClient.resetQueries(activeQuery);
+        }
+      },
+      style: {
+        background: defaultTheme.danger
+      }
+    }, activeQuery.state.status === 'error' ? 'Restore' : 'Trigger', " error") : /*#__PURE__*/React__namespace.createElement("label", null, "Trigger error:", /*#__PURE__*/React__namespace.createElement(Select, {
+      value: currentErrorTypeName != null ? currentErrorTypeName : '',
+      style: {
+        marginInlineStart: '.5em'
+      },
+      onChange: e => {
+        const errorType = errorTypes.find(t => t.name === e.target.value);
+        triggerError(errorType);
+      }
+    }, /*#__PURE__*/React__namespace.createElement("option", {
+      key: "",
+      value: ""
+    }), errorTypes.map(errorType => /*#__PURE__*/React__namespace.createElement("option", {
+      key: errorType.name,
+      value: errorType.name
+    }, errorType.name))))), /*#__PURE__*/React__namespace.createElement("div", {
       style: {
         background: defaultTheme.backgroundAlt,
         padding: '.5em',