@tanstack/react-router-devtools 0.0.1-beta.2 → 0.0.1-beta.30

package/build/cjs/styledComponents.js.map

@@ -0,0 +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 ActivePanel = 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\n// export const QueryKeys = styled('span', {\n//   display: 'inline-block',\n//   fontSize: '0.9em',\n// })\n\n// export 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})\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","ActivePanel","flex","overflow","height","borderTop","gray","Button","props","appearance","fontWeight","border","borderRadius","padding","opacity","disabled","undefined","cursor","Code","inputBackgroundColor","inputTextColor","lineHeight","WebkitAppearance","backgroundImage","backgroundRepeat","backgroundPosition","backgroundSize"],"mappings":"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"}

package/build/cjs/{packages/react-router-devtools/src/theme.js → theme.js}

@@ -12,7 +12,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -36,10 +36,9 @@ const defaultTheme = {
 const ThemeContext = /*#__PURE__*/React__default["default"].createContext(defaultTheme);
 function ThemeProvider(_ref) {
   let {
-    theme
-  } = _ref,
-      rest = _rollupPluginBabelHelpers.objectWithoutPropertiesLoose(_ref, _excluded);
-
+      theme
+    } = _ref,
+    rest = _rollupPluginBabelHelpers.objectWithoutPropertiesLoose(_ref, _excluded);
   return /*#__PURE__*/React__default["default"].createElement(ThemeContext.Provider, _rollupPluginBabelHelpers["extends"]({
     value: theme
   }, rest));

package/build/cjs/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sources":["../../src/theme.tsx"],"sourcesContent":["import 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  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","warning","ThemeContext","React","createContext","ThemeProvider","theme","rest","_objectWithoutPropertiesLoose","_extends","useTheme","useContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAEO,MAAMA,YAAY,GAAG;AAC1BC,EAAAA,UAAU,EAAE,SAAS;AACrBC,EAAAA,aAAa,EAAE,SAAS;AACxBC,EAAAA,UAAU,EAAE,OAAO;AACnBC,EAAAA,IAAI,EAAE,SAAS;AACfC,EAAAA,OAAO,EAAE,SAAS;AAClBC,EAAAA,oBAAoB,EAAE,MAAM;AAC5BC,EAAAA,cAAc,EAAE,MAAM;AACtBC,EAAAA,OAAO,EAAE,SAAS;AAClBC,EAAAA,MAAM,EAAE,SAAS;AACjBC,EAAAA,MAAM,EAAE,SAAS;AACjBC,EAAAA,OAAO,EAAE,SAAA;AACX,EAAU;AAQV,MAAMC,YAAY,gBAAGC,yBAAK,CAACC,aAAa,CAACd,YAAY,CAAC,CAAA;AAE/C,SAASe,aAAa,CAAoC,IAAA,EAAA;EAAA,IAAnC;AAAEC,MAAAA,KAAAA;KAA+B,GAAA,IAAA;IAArBC,IAAI,GAAAC,sDAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;EAC5C,oBAAOL,yBAAA,CAAA,aAAA,CAAC,YAAY,CAAC,QAAQ,EAAAM,oCAAA,CAAA;AAAC,IAAA,KAAK,EAAEH,KAAAA;AAAM,GAAA,EAAKC,IAAI,CAAI,CAAA,CAAA;AAC1D,CAAA;AAEO,SAASG,QAAQ,GAAG;AACzB,EAAA,OAAOP,yBAAK,CAACQ,UAAU,CAACT,YAAY,CAAC,CAAA;AACvC;;;;;;"}

package/build/cjs/{packages/react-router-devtools/src/useLocalStorage.js → useLocalStorage.js}

@@ -21,22 +21,18 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const getItem = key => {
   try {
     const itemValue = localStorage.getItem(key);
-
     if (typeof itemValue === 'string') {
       return JSON.parse(itemValue);
     }
-
     return undefined;
   } catch (_unused) {
     return undefined;
   }
 };
-
 function useLocalStorage(key, defaultValue) {
   const [value, setValue] = React__default["default"].useState();
   React__default["default"].useEffect(() => {
     const initialValue = getItem(key);
-
     if (typeof initialValue === 'undefined' || initialValue === null) {
       setValue(typeof defaultValue === 'function' ? defaultValue() : defaultValue);
     } else {
@@ -46,15 +42,12 @@ function useLocalStorage(key, defaultValue) {
   const setter = React__default["default"].useCallback(updater => {
     setValue(old => {
       let newVal = updater;
-
       if (typeof updater == 'function') {
         newVal = updater(old);
       }
-
       try {
         localStorage.setItem(key, JSON.stringify(newVal));
       } catch (_unused2) {}
-
       return newVal;
     });
   }, [key]);

package/build/cjs/useLocalStorage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useLocalStorage.js","sources":["../../src/useLocalStorage.ts"],"sourcesContent":["import React from 'react'\n\nconst getItem = (key: string): unknown => {\n  try {\n    const itemValue = localStorage.getItem(key)\n    if (typeof itemValue === 'string') {\n      return JSON.parse(itemValue)\n    }\n    return undefined\n  } catch {\n    return undefined\n  }\n}\n\nexport default function useLocalStorage<T>(\n  key: string,\n  defaultValue: T | undefined,\n): [T | undefined, (newVal: T | ((prevVal: T) => T)) => void] {\n  const [value, setValue] = React.useState<T>()\n\n  React.useEffect(() => {\n    const initialValue = getItem(key) as T | undefined\n\n    if (typeof initialValue === 'undefined' || initialValue === null) {\n      setValue(\n        typeof defaultValue === 'function' ? defaultValue() : defaultValue,\n      )\n    } else {\n      setValue(initialValue)\n    }\n  }, [defaultValue, key])\n\n  const setter = React.useCallback(\n    (updater: any) => {\n      setValue((old) => {\n        let newVal = updater\n\n        if (typeof updater == 'function') {\n          newVal = updater(old)\n        }\n        try {\n          localStorage.setItem(key, JSON.stringify(newVal))\n        } catch {}\n\n        return newVal\n      })\n    },\n    [key],\n  )\n\n  return [value, setter]\n}\n"],"names":["getItem","key","itemValue","localStorage","JSON","parse","undefined","useLocalStorage","defaultValue","value","setValue","React","useState","useEffect","initialValue","setter","useCallback","updater","old","newVal","setItem","stringify"],"mappings":";;;;;;;;;;;;;;;;;;;;AAEA,MAAMA,OAAO,GAAIC,GAAW,IAAc;EACxC,IAAI;AACF,IAAA,MAAMC,SAAS,GAAGC,YAAY,CAACH,OAAO,CAACC,GAAG,CAAC,CAAA;AAC3C,IAAA,IAAI,OAAOC,SAAS,KAAK,QAAQ,EAAE;AACjC,MAAA,OAAOE,IAAI,CAACC,KAAK,CAACH,SAAS,CAAC,CAAA;AAC9B,KAAA;AACA,IAAA,OAAOI,SAAS,CAAA;AAClB,GAAC,CAAC,OAAM,OAAA,EAAA;AACN,IAAA,OAAOA,SAAS,CAAA;AAClB,GAAA;AACF,CAAC,CAAA;AAEc,SAASC,eAAe,CACrCN,GAAW,EACXO,YAA2B,EACiC;EAC5D,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGC,yBAAK,CAACC,QAAQ,EAAK,CAAA;EAE7CD,yBAAK,CAACE,SAAS,CAAC,MAAM;AACpB,IAAA,MAAMC,YAAY,GAAGd,OAAO,CAACC,GAAG,CAAkB,CAAA;IAElD,IAAI,OAAOa,YAAY,KAAK,WAAW,IAAIA,YAAY,KAAK,IAAI,EAAE;MAChEJ,QAAQ,CACN,OAAOF,YAAY,KAAK,UAAU,GAAGA,YAAY,EAAE,GAAGA,YAAY,CACnE,CAAA;AACH,KAAC,MAAM;MACLE,QAAQ,CAACI,YAAY,CAAC,CAAA;AACxB,KAAA;AACF,GAAC,EAAE,CAACN,YAAY,EAAEP,GAAG,CAAC,CAAC,CAAA;AAEvB,EAAA,MAAMc,MAAM,GAAGJ,yBAAK,CAACK,WAAW,CAC7BC,OAAY,IAAK;IAChBP,QAAQ,CAAEQ,GAAG,IAAK;MAChB,IAAIC,MAAM,GAAGF,OAAO,CAAA;AAEpB,MAAA,IAAI,OAAOA,OAAO,IAAI,UAAU,EAAE;AAChCE,QAAAA,MAAM,GAAGF,OAAO,CAACC,GAAG,CAAC,CAAA;AACvB,OAAA;MACA,IAAI;QACFf,YAAY,CAACiB,OAAO,CAACnB,GAAG,EAAEG,IAAI,CAACiB,SAAS,CAACF,MAAM,CAAC,CAAC,CAAA;OAClD,CAAC,iBAAM,EAAC;AAET,MAAA,OAAOA,MAAM,CAAA;AACf,KAAC,CAAC,CAAA;AACJ,GAAC,EACD,CAAClB,GAAG,CAAC,CACN,CAAA;AAED,EAAA,OAAO,CAACQ,KAAK,EAAEM,MAAM,CAAC,CAAA;AACxB;;;;"}

package/build/cjs/{packages/react-router-devtools/src/useMediaQuery.js → useMediaQuery.js}

@@ -24,34 +24,34 @@ function useMediaQuery(query) {
     if (typeof window !== 'undefined') {
       return window.matchMedia && window.matchMedia(query).matches;
     }
-
     return;
-  }); // Watch for changes
+  });
 
+  // Watch for changes
   React__default["default"].useEffect(() => {
     if (typeof window !== 'undefined') {
       if (!window.matchMedia) {
         return;
-      } // Create a matcher
-
+      }
 
-      const matcher = window.matchMedia(query); // Create our handler
+      // Create a matcher
+      const matcher = window.matchMedia(query);
 
+      // Create our handler
       const onChange = _ref => {
         let {
           matches
         } = _ref;
         return setIsMatch(matches);
-      }; // Listen for changes
-
+      };
 
+      // Listen for changes
       matcher.addListener(onChange);
       return () => {
         // Stop listening for changes
         matcher.removeListener(onChange);
       };
     }
-
     return;
   }, [isMatch, query, setIsMatch]);
   return isMatch;

package/build/cjs/useMediaQuery.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMediaQuery.js","sources":["../../src/useMediaQuery.ts"],"sourcesContent":["import 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 && window.matchMedia(query).matches\n    }\n    return\n  })\n\n  // Watch for changes\n  React.useEffect(() => {\n    if (typeof window !== 'undefined') {\n      if (!window.matchMedia) {\n        return\n      }\n\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\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,yBAAK,CAACC,QAAQ,CAAC,MAAM;AACjD,IAAA,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;MACjC,OAAOA,MAAM,CAACC,UAAU,IAAID,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAACO,OAAO,CAAA;AAC9D,KAAA;AACA,IAAA,OAAA;AACF,GAAC,CAAC,CAAA;;AAEF;EACAJ,yBAAK,CAACK,SAAS,CAAC,MAAM;AACpB,IAAA,IAAI,OAAOH,MAAM,KAAK,WAAW,EAAE;AACjC,MAAA,IAAI,CAACA,MAAM,CAACC,UAAU,EAAE;AACtB,QAAA,OAAA;AACF,OAAA;;AAEA;AACA,MAAA,MAAMG,OAAO,GAAGJ,MAAM,CAACC,UAAU,CAACN,KAAK,CAAC,CAAA;;AAExC;AACA,MAAA,MAAMU,QAAQ,GAAG,IAAA,IAAA;QAAA,IAAC;AAAEH,UAAAA,OAAAA;SAA+B,GAAA,IAAA,CAAA;QAAA,OACjDL,UAAU,CAACK,OAAO,CAAC,CAAA;AAAA,OAAA,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;AAEA,IAAA,OAAA;GACD,EAAE,CAACT,OAAO,EAAED,KAAK,EAAEE,UAAU,CAAC,CAAC,CAAA;AAEhC,EAAA,OAAOD,OAAO,CAAA;AAChB;;;;"}

package/build/cjs/{packages/react-router-devtools/src/utils.js → utils.js}

@@ -12,7 +12,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _rollupPluginBabelHelpers = require('../../../_virtual/_rollupPluginBabelHelpers.js');
+var _rollupPluginBabelHelpers = require('./_virtual/_rollupPluginBabelHelpers.js');
 var React = require('react');
 var theme = require('./theme.js');
 var useMediaQuery = require('./useMediaQuery.js');
@@ -24,8 +24,10 @@ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 const _excluded = ["style"];
 const isServer = typeof window === 'undefined';
 function getStatusColor(match, theme) {
-  return match.isPending ? theme.warning : match.isFetching ? theme.active : match.status === 'error' ? theme.danger : match.status === 'success' ? theme.success : theme.gray;
-} // export function getQueryStatusLabel(query: Query) {
+  return match.isFetching ? theme.active : match.status === 'error' ? theme.danger : match.status === 'success' ? theme.success : theme.gray;
+}
+
+// export function getQueryStatusLabel(query: Query) {
 //   return query.state.isFetching
 //     ? 'fetching'
 //     : !query.getObserversCount()
@@ -39,13 +41,11 @@ function styled(type, newStyles, queries) {
   if (queries === void 0) {
     queries = {};
   }
-
   return /*#__PURE__*/React__default["default"].forwardRef((_ref, ref) => {
     let {
-      style
-    } = _ref,
-        rest = _rollupPluginBabelHelpers.objectWithoutPropertiesLoose(_ref, _excluded);
-
+        style
+      } = _ref,
+      rest = _rollupPluginBabelHelpers.objectWithoutPropertiesLoose(_ref, _excluded);
     const theme$1 = theme.useTheme();
     const mediaStyles = Object.entries(queries).reduce((current, _ref2) => {
       let [key, value] = _ref2;
@@ -69,22 +69,22 @@ function useIsMounted() {
   }, []);
   return isMounted;
 }
+
 /**
  * Displays a string regardless the type of the data
  * @param {unknown} value Value to be stringified
  */
-
 const displayValue = value => {
   const name = Object.getOwnPropertyNames(Object(value));
   const newValue = typeof value === 'bigint' ? value.toString() + "n" : value;
   return JSON.stringify(newValue, name);
 };
+
 /**
  * This hook is a safe useState version which schedules state updates in microtasks
  * to prevent updating a component state while React is rendering different components
  * or when the component is not mounted anymore.
  */
-
 function useSafeState(initialState) {
   const isMounted = useIsMounted();
   const [state, setState] = React__default["default"].useState(initialState);
@@ -97,45 +97,37 @@ function useSafeState(initialState) {
   }, [isMounted]);
   return [state, safeSetState];
 }
+
 /**
  * Schedules a microtask.
  * This can be useful to schedule state updates after rendering.
  */
-
 function scheduleMicrotask(callback) {
   Promise.resolve().then(callback).catch(error => setTimeout(() => {
     throw error;
   }));
 }
-
 function multiSortBy(arr, accessors) {
   if (accessors === void 0) {
     accessors = [d => d];
   }
-
   return arr.map((d, i) => [d, i]).sort((_ref3, _ref4) => {
     let [a, ai] = _ref3;
     let [b, bi] = _ref4;
-
     for (const accessor of accessors) {
       const ao = accessor(a);
       const bo = accessor(b);
-
       if (typeof ao === 'undefined') {
         if (typeof bo === 'undefined') {
           continue;
         }
-
         return 1;
       }
-
       if (ao === bo) {
         continue;
       }
-
       return ao > bo ? 1 : -1;
     }
-
     return ai - bi;
   }).map(_ref5 => {
     let [d] = _ref5;

package/build/cjs/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sources":["../../src/utils.ts"],"sourcesContent":["import React from 'react'\nimport { RouteMatch } from '@tanstack/react-router'\n\nimport { Theme, useTheme } from './theme'\nimport useMediaQuery from './useMediaQuery'\n\nexport const isServer = typeof window === 'undefined'\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 getStatusColor(match: RouteMatch, theme: Theme) {\n  return match.isFetching\n    ? theme.active\n    : match.status === 'error'\n    ? theme.danger\n    : match.status === 'success'\n    ? theme.success\n    : theme.gray\n}\n\n// export function getQueryStatusLabel(query: Query) {\n//   return query.state.isFetching\n//     ? 'fetching'\n//     : !query.getObserversCount()\n//     ? 'inactive'\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[isServer ? 'useEffect' : 'useLayoutEffect'](() => {\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 */\nexport const displayValue = (value: unknown) => {\n  const name = Object.getOwnPropertyNames(Object(value))\n  const newValue = typeof value === 'bigint' ? `${value.toString()}n` : value\n\n  return JSON.stringify(newValue, name)\n}\n\n/**\n * This hook is a safe useState version which schedules state updates in microtasks\n * to prevent updating a component state while React is rendering different components\n * or when the component is not mounted anymore.\n */\nexport function useSafeState<T>(initialState: T): [T, (value: T) => void] {\n  const isMounted = useIsMounted()\n  const [state, setState] = React.useState(initialState)\n\n  const safeSetState = React.useCallback(\n    (value: T) => {\n      scheduleMicrotask(() => {\n        if (isMounted()) {\n          setState(value)\n        }\n      })\n    },\n    [isMounted],\n  )\n\n  return [state, safeSetState]\n}\n\n/**\n * Schedules a microtask.\n * This can be useful to schedule state updates after rendering.\n */\nfunction scheduleMicrotask(callback: () => void) {\n  Promise.resolve()\n    .then(callback)\n    .catch((error) =>\n      setTimeout(() => {\n        throw error\n      }),\n    )\n}\n\nexport function multiSortBy<T>(\n  arr: T[],\n  accessors: ((item: T) => any)[] = [(d) => d],\n): T[] {\n  return arr\n    .map((d, i) => [d, i] as const)\n    .sort(([a, ai], [b, bi]) => {\n      for (const accessor of accessors) {\n        const ao = accessor(a)\n        const bo = accessor(b)\n\n        if (typeof ao === 'undefined') {\n          if (typeof bo === 'undefined') {\n            continue\n          }\n          return 1\n        }\n\n        if (ao === bo) {\n          continue\n        }\n\n        return ao > bo ? 1 : -1\n      }\n\n      return ai - bi\n    })\n    .map(([d]) => d)\n}\n"],"names":["isServer","window","getStatusColor","match","theme","isFetching","active","status","danger","success","gray","styled","type","newStyles","queries","React","forwardRef","ref","style","rest","_objectWithoutPropertiesLoose","useTheme","mediaStyles","Object","entries","reduce","current","key","value","useMediaQuery","createElement","useIsMounted","mountedRef","useRef","isMounted","useCallback","displayValue","name","getOwnPropertyNames","newValue","toString","JSON","stringify","useSafeState","initialState","state","setState","useState","safeSetState","scheduleMicrotask","callback","Promise","resolve","then","catch","error","setTimeout","multiSortBy","arr","accessors","d","map","i","sort","a","ai","b","bi","accessor","ao","bo"],"mappings":"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"}