@cerberus-design/react 0.13.1-next-394d7c4 → 0.13.1-next-8e40fb6

package/build/modern/_tsup-dts-rollup.d.ts

@@ -99,12 +99,12 @@ import { PointerSensor } from '@dnd-kit/core';
 import { PointerSensorOptions } from '@dnd-kit/core';
 import { PointerSensorProps } from '@dnd-kit/core';
 import { pointerWithin } from '@dnd-kit/core';
+import { PortalProps as PortalProps_2 } from '@ark-ui/react';
 import type { Pretty } from '@cerberus/styled-system/types';
 import { ProgressBarVariantProps } from '@cerberus/styled-system/recipes';
 import { PropsWithChildren } from 'react';
 import { radio } from '@cerberus/styled-system/recipes';
 import { ReactNode } from 'react';
-import { ReactPortal } from 'react';
 import type { RecipeVariantProps } from '@cerberus/styled-system/types';
 import { rectIntersection } from '@dnd-kit/core';
 import { RefAttributes } from 'react';
@@ -1920,7 +1920,7 @@ export { pointerWithin }
  *   )
  * }
  */
-declare function Portal(props: PropsWithChildren<PortalProps>): ReactPortal;
+declare const Portal: (props: PropsWithChildren<PortalProps_2>) => JSX_2.Element;
 export { Portal }
 export { Portal as Portal_alias_1 }
 
@@ -1928,17 +1928,7 @@ export { Portal as Portal_alias_1 }
  * This module is the Portal component.
  * @module
  */
-declare interface PortalProps {
-    /**
-     * The root container to render the children into.
-     * @default document.body
-     */
-    container?: Element | DocumentFragment;
-    /**
-     * An optional key to use for the Portal component.
-     */
-    key?: null | string;
-}
+declare type PortalProps = PortalProps_2;
 export { PortalProps }
 export { PortalProps as PortalProps_alias_1 }
 
@@ -2101,7 +2091,16 @@ export { rectIntersection }
  * This module provides a hook to get Cerberus colors from the document root.
  * @module useRootColors
  */
-declare type RootColorsResult = Record<string, string>;
+declare interface RootColorsResult {
+    /**
+     * A record of Cerberus colors where the key is the token name provided and the value is the color hex.
+     */
+    colors: Record<string, string>;
+    /**
+     * A function to refetch the Cerberus colors from the document root. Useful when you need the latest colors after a theme/mode change.
+     */
+    refetch: () => Promise<void>;
+}
 export { RootColorsResult }
 export { RootColorsResult as RootColorsResult_alias_1 }
 

package/build/modern/{chunk-B3LRHIEG.js → chunk-3XGLNXJJ.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-SXIXDXG3.js";
 import {
   Portal
-} from "./chunk-K2PSHGS7.js";
+} from "./chunk-IQJDVFPP.js";
 import {
   Notification
 } from "./chunk-7SGPJM66.js";
@@ -159,4 +159,4 @@ export {
   NotificationCenter,
   useNotificationCenter
 };
-//# sourceMappingURL=chunk-B3LRHIEG.js.map
+//# sourceMappingURL=chunk-3XGLNXJJ.js.map

package/build/modern/{chunk-S6JWPDB4.js → chunk-FBSESDWJ.js}

@@ -1,6 +1,6 @@
 import {
   Portal
-} from "./chunk-K2PSHGS7.js";
+} from "./chunk-IQJDVFPP.js";
 import {
   ModalDescription
 } from "./chunk-Q7BRMIBR.js";
@@ -240,4 +240,4 @@ export {
   PromptModal,
   usePromptModal
 };
-//# sourceMappingURL=chunk-S6JWPDB4.js.map
+//# sourceMappingURL=chunk-FBSESDWJ.js.map

package/build/modern/{chunk-FHS7VVGN.js → chunk-GRUXP3NG.js}

@@ -1,6 +1,6 @@
 import {
   Portal
-} from "./chunk-K2PSHGS7.js";
+} from "./chunk-IQJDVFPP.js";
 import {
   ModalDescription
 } from "./chunk-Q7BRMIBR.js";
@@ -170,4 +170,4 @@ export {
   ConfirmModal,
   useConfirmModal
 };
-//# sourceMappingURL=chunk-FHS7VVGN.js.map
+//# sourceMappingURL=chunk-GRUXP3NG.js.map

package/build/modern/chunk-IQJDVFPP.js

@@ -0,0 +1,10 @@
+// src/components/Portal.tsx
+import {
+  Portal as ArkPortal
+} from "@ark-ui/react";
+var Portal = ArkPortal;
+
+export {
+  Portal
+};
+//# sourceMappingURL=chunk-IQJDVFPP.js.map

package/build/modern/chunk-IQJDVFPP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/Portal.tsx"],"sourcesContent":["import {\n  Portal as ArkPortal,\n  type PortalProps as ArkPortalProps,\n} from '@ark-ui/react'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport type PortalProps = ArkPortalProps\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n *   return (\n *     <Portal>\n *       <div>Portal Content outside of the React VDom tree</div>\n *     </Portal>\n *   )\n * }\n */\nexport const Portal = ArkPortal\n"],"mappings":";AAAA;AAAA,EACE,UAAU;AAAA,OAEL;AA2BA,IAAM,SAAS;","names":[]}

package/build/modern/chunk-RMVJK26W.js

@@ -0,0 +1,39 @@
+// src/hooks/useRootColors.ts
+import { useCallback, useEffect, useMemo, useReducer } from "react";
+function useRootColors(colors = []) {
+  const [state, dispatch] = useReducer(rootColorsReducer, {});
+  const handleRefetch = useCallback(() => {
+    return new Promise((resolve) => {
+      dispatch(formatColors(colors));
+      resolve();
+    });
+  }, []);
+  useEffect(() => {
+    if (Object.keys(state).length === colors.length) return;
+    dispatch(formatColors(colors));
+    console.log("updating colors in root hook");
+  }, [colors]);
+  return useMemo(
+    () => ({ colors: state, refetch: handleRefetch }),
+    [state, handleRefetch]
+  );
+}
+function formatColors(colors) {
+  const rootStyles = getComputedStyle(document.body);
+  return colors.reduce(
+    (acc, color) => {
+      const formattedColor = color.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase().replaceAll(".", "-");
+      acc[color] = rootStyles.getPropertyValue(`--cerberus-colors-${formattedColor}`).trim();
+      return acc;
+    },
+    {}
+  );
+}
+function rootColorsReducer(state, action) {
+  return { ...state, ...action };
+}
+
+export {
+  useRootColors
+};
+//# sourceMappingURL=chunk-RMVJK26W.js.map

package/build/modern/chunk-RMVJK26W.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/hooks/useRootColors.ts"],"sourcesContent":["'use client'\n\nimport { useCallback, useEffect, useMemo, useReducer } from 'react'\n\n/**\n * This module provides a hook to get Cerberus colors from the document root.\n * @module useRootColors\n */\n\nexport interface RootColorsResult {\n  /**\n   * A record of Cerberus colors where the key is the token name provided and the value is the color hex.\n   */\n  colors: Record<string, string>\n  /**\n   * A function to refetch the Cerberus colors from the document root. Useful when you need the latest colors after a theme/mode change.\n   */\n  refetch: () => Promise<void>\n}\n\n/**\n * This hook returns a record of Cerberus colors from the document root.\n * This is useful when you are working with a component that uses the `<canvas>`\n * element.\n * @param colors - An array of Cerberus tokens to get from the document root (i.e. `['dataViz.diverging.50', 'dataViz.diverging.200']`).\n * @returns A record of Cerberus colors where the key is the token name provided and the value is the color hex.\n */\nexport function useRootColors(colors: string[] = []): RootColorsResult {\n  const [state, dispatch] = useReducer(rootColorsReducer, {})\n\n  const handleRefetch = useCallback(() => {\n    return new Promise<void>((resolve) => {\n      dispatch(formatColors(colors))\n      resolve()\n    })\n  }, [])\n\n  useEffect(() => {\n    if (Object.keys(state).length === colors.length) return\n    dispatch(formatColors(colors))\n    console.log('updating colors in root hook')\n  }, [colors])\n\n  // reducer is already memoized\n  return useMemo(\n    () => ({ colors: state, refetch: handleRefetch }),\n    [state, handleRefetch],\n  )\n}\n\nfunction formatColors(colors: string[]): Record<string, string> {\n  const rootStyles = getComputedStyle(document.body)\n  return colors.reduce(\n    (acc, color) => {\n      const formattedColor = color\n        .replace(/([a-z])([A-Z])/g, '$1-$2')\n        .toLowerCase()\n        .replaceAll('.', '-')\n      acc[color] = rootStyles\n        .getPropertyValue(`--cerberus-colors-${formattedColor}`)\n        .trim()\n      return acc\n    },\n    {} as Record<string, string>,\n  )\n}\n\nfunction rootColorsReducer(\n  state: Record<string, string>,\n  action: Record<string, string>,\n): Record<string, string> {\n  return { ...state, ...action }\n}\n"],"mappings":";AAEA,SAAS,aAAa,WAAW,SAAS,kBAAkB;AAyBrD,SAAS,cAAc,SAAmB,CAAC,GAAqB;AACrE,QAAM,CAAC,OAAO,QAAQ,IAAI,WAAW,mBAAmB,CAAC,CAAC;AAE1D,QAAM,gBAAgB,YAAY,MAAM;AACtC,WAAO,IAAI,QAAc,CAAC,YAAY;AACpC,eAAS,aAAa,MAAM,CAAC;AAC7B,cAAQ;AAAA,IACV,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,QAAI,OAAO,KAAK,KAAK,EAAE,WAAW,OAAO,OAAQ;AACjD,aAAS,aAAa,MAAM,CAAC;AAC7B,YAAQ,IAAI,8BAA8B;AAAA,EAC5C,GAAG,CAAC,MAAM,CAAC;AAGX,SAAO;AAAA,IACL,OAAO,EAAE,QAAQ,OAAO,SAAS,cAAc;AAAA,IAC/C,CAAC,OAAO,aAAa;AAAA,EACvB;AACF;AAEA,SAAS,aAAa,QAA0C;AAC9D,QAAM,aAAa,iBAAiB,SAAS,IAAI;AACjD,SAAO,OAAO;AAAA,IACZ,CAAC,KAAK,UAAU;AACd,YAAM,iBAAiB,MACpB,QAAQ,mBAAmB,OAAO,EAClC,YAAY,EACZ,WAAW,KAAK,GAAG;AACtB,UAAI,KAAK,IAAI,WACV,iBAAiB,qBAAqB,cAAc,EAAE,EACtD,KAAK;AACR,aAAO;AAAA,IACT;AAAA,IACA,CAAC;AAAA,EACH;AACF;AAEA,SAAS,kBACP,OACA,QACwB;AACxB,SAAO,EAAE,GAAG,OAAO,GAAG,OAAO;AAC/B;","names":[]}

package/build/modern/{chunk-SRPSJGNI.js → chunk-WFJWCZ7E.js}

@@ -1,6 +1,6 @@
 import {
   Portal
-} from "./chunk-K2PSHGS7.js";
+} from "./chunk-IQJDVFPP.js";
 import {
   ModalDescription
 } from "./chunk-Q7BRMIBR.js";
@@ -152,4 +152,4 @@ export {
   CTAModal,
   useCTAModal
 };
-//# sourceMappingURL=chunk-SRPSJGNI.js.map
+//# sourceMappingURL=chunk-WFJWCZ7E.js.map

package/build/modern/components/Portal.js

@@ -1,7 +1,6 @@
-"use client";
 import {
   Portal
-} from "../chunk-K2PSHGS7.js";
+} from "../chunk-IQJDVFPP.js";
 export {
   Portal
 };

package/build/modern/context/confirm-modal.js

@@ -2,8 +2,8 @@
 import {
   ConfirmModal,
   useConfirmModal
-} from "../chunk-FHS7VVGN.js";
-import "../chunk-K2PSHGS7.js";
+} from "../chunk-GRUXP3NG.js";
+import "../chunk-IQJDVFPP.js";
 import "../chunk-Q7BRMIBR.js";
 import "../chunk-XY6WL55R.js";
 import "../chunk-2UXE5PDG.js";

package/build/modern/context/cta-modal.js

@@ -2,8 +2,8 @@
 import {
   CTAModal,
   useCTAModal
-} from "../chunk-SRPSJGNI.js";
-import "../chunk-K2PSHGS7.js";
+} from "../chunk-WFJWCZ7E.js";
+import "../chunk-IQJDVFPP.js";
 import "../chunk-Q7BRMIBR.js";
 import "../chunk-XY6WL55R.js";
 import "../chunk-2UXE5PDG.js";

package/build/modern/context/notification-center.js

@@ -2,9 +2,9 @@
 import {
   NotificationCenter,
   useNotificationCenter
-} from "../chunk-B3LRHIEG.js";
+} from "../chunk-3XGLNXJJ.js";
 import "../chunk-SXIXDXG3.js";
-import "../chunk-K2PSHGS7.js";
+import "../chunk-IQJDVFPP.js";
 import "../chunk-7SGPJM66.js";
 import "../chunk-XEW6TJJ4.js";
 import "../chunk-EXGKZGML.js";

package/build/modern/context/prompt-modal.js

@@ -2,8 +2,8 @@
 import {
   PromptModal,
   usePromptModal
-} from "../chunk-S6JWPDB4.js";
-import "../chunk-K2PSHGS7.js";
+} from "../chunk-FBSESDWJ.js";
+import "../chunk-IQJDVFPP.js";
 import "../chunk-Q7BRMIBR.js";
 import "../chunk-XY6WL55R.js";
 import "../chunk-2UXE5PDG.js";

package/build/modern/hooks/useRootColors.js

@@ -1,7 +1,7 @@
 "use client";
 import {
   useRootColors
-} from "../chunk-RO4AJOVX.js";
+} from "../chunk-RMVJK26W.js";
 export {
   useRootColors
 };

package/build/modern/index.js

@@ -1,11 +1,11 @@
 import {
   NotificationCenter,
   useNotificationCenter
-} from "./chunk-B3LRHIEG.js";
+} from "./chunk-3XGLNXJJ.js";
 import {
   PromptModal,
   usePromptModal
-} from "./chunk-S6JWPDB4.js";
+} from "./chunk-FBSESDWJ.js";
 import {
   ThemeProvider,
   useThemeContext
@@ -22,11 +22,11 @@ import {
 import {
   ConfirmModal,
   useConfirmModal
-} from "./chunk-FHS7VVGN.js";
+} from "./chunk-GRUXP3NG.js";
 import {
   CTAModal,
   useCTAModal
-} from "./chunk-SRPSJGNI.js";
+} from "./chunk-WFJWCZ7E.js";
 import {
   TabList
 } from "./chunk-UKPF7JOB.js";
@@ -57,7 +57,7 @@ import {
 } from "./chunk-SXIXDXG3.js";
 import {
   Portal
-} from "./chunk-K2PSHGS7.js";
+} from "./chunk-IQJDVFPP.js";
 import {
   Radio
 } from "./chunk-FTPZHG6J.js";
@@ -171,7 +171,7 @@ import {
 } from "./chunk-KGQG5JGW.js";
 import {
   useRootColors
-} from "./chunk-RO4AJOVX.js";
+} from "./chunk-RMVJK26W.js";
 import {
   MODE_KEY,
   THEME_KEY,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cerberus-design/react",
-  "version": "0.13.1-next-394d7c4",
+  "version": "0.13.1-next-8e40fb6",
   "description": "The Cerberus Design React component library.",
   "browserslist": "> 0.25%, not dead",
   "sideEffects": false,
@@ -26,8 +26,8 @@
     "react": "^18",
     "react-dom": "^18",
     "tsup": "^8.1.0",
-    "@cerberus-design/styled-system": "0.13.1-next-394d7c4",
-    "@cerberus-design/configs": "0.0.0"
+    "@cerberus-design/configs": "0.0.0",
+    "@cerberus-design/styled-system": "0.13.1-next-8e40fb6"
   },
   "publishConfig": {
     "access": "public"

package/src/components/Portal.tsx

@@ -1,24 +1,14 @@
-'use client'
-
-import type { PropsWithChildren } from 'react'
-import { createPortal } from 'react-dom'
+import {
+  Portal as ArkPortal,
+  type PortalProps as ArkPortalProps,
+} from '@ark-ui/react'
 
 /**
  * This module is the Portal component.
  * @module
  */
 
-export interface PortalProps {
-  /**
-   * The root container to render the children into.
-   * @default document.body
-   */
-  container?: Element | DocumentFragment
-  /**
-   * An optional key to use for the Portal component.
-   */
-  key?: null | string
-}
+export type PortalProps = ArkPortalProps
 
 /**
  * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.
@@ -38,7 +28,4 @@ export interface PortalProps {
  *   )
  * }
  */
-export function Portal(props: PropsWithChildren<PortalProps>) {
-  const container = props.container || document.body
-  return createPortal(props.children, container, props.key)
-}
+export const Portal = ArkPortal

package/src/hooks/useRootColors.ts

@@ -1,13 +1,22 @@
 'use client'
 
-import { useEffect, useReducer } from 'react'
+import { useCallback, useEffect, useMemo, useReducer } from 'react'
 
 /**
  * This module provides a hook to get Cerberus colors from the document root.
  * @module useRootColors
  */
 
-export type RootColorsResult = Record<string, string>
+export interface RootColorsResult {
+  /**
+   * A record of Cerberus colors where the key is the token name provided and the value is the color hex.
+   */
+  colors: Record<string, string>
+  /**
+   * A function to refetch the Cerberus colors from the document root. Useful when you need the latest colors after a theme/mode change.
+   */
+  refetch: () => Promise<void>
+}
 
 /**
  * This hook returns a record of Cerberus colors from the document root.
@@ -19,26 +28,41 @@ export type RootColorsResult = Record<string, string>
 export function useRootColors(colors: string[] = []): RootColorsResult {
   const [state, dispatch] = useReducer(rootColorsReducer, {})
 
+  const handleRefetch = useCallback(() => {
+    return new Promise<void>((resolve) => {
+      dispatch(formatColors(colors))
+      resolve()
+    })
+  }, [])
+
   useEffect(() => {
     if (Object.keys(state).length === colors.length) return
+    dispatch(formatColors(colors))
+    console.log('updating colors in root hook')
+  }, [colors])
+
+  // reducer is already memoized
+  return useMemo(
+    () => ({ colors: state, refetch: handleRefetch }),
+    [state, handleRefetch],
+  )
+}
 
-    const rootStyles = getComputedStyle(document.body)
-    const rootColors = colors.reduce((acc, color) => {
+function formatColors(colors: string[]): Record<string, string> {
+  const rootStyles = getComputedStyle(document.body)
+  return colors.reduce(
+    (acc, color) => {
       const formattedColor = color
         .replace(/([a-z])([A-Z])/g, '$1-$2')
         .toLowerCase()
         .replaceAll('.', '-')
-      acc[color as keyof typeof acc] = rootStyles
+      acc[color] = rootStyles
         .getPropertyValue(`--cerberus-colors-${formattedColor}`)
         .trim()
       return acc
-    }, {} as RootColorsResult)
-
-    dispatch(rootColors)
-  }, [colors])
-
-  // reducer is already memoized
-  return state
+    },
+    {} as Record<string, string>,
+  )
 }
 
 function rootColorsReducer(

package/build/modern/chunk-K2PSHGS7.js

@@ -1,11 +0,0 @@
-// src/components/Portal.tsx
-import { createPortal } from "react-dom";
-function Portal(props) {
-  const container = props.container || document.body;
-  return createPortal(props.children, container, props.key);
-}
-
-export {
-  Portal
-};
-//# sourceMappingURL=chunk-K2PSHGS7.js.map

package/build/modern/chunk-K2PSHGS7.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/components/Portal.tsx"],"sourcesContent":["'use client'\n\nimport type { PropsWithChildren } from 'react'\nimport { createPortal } from 'react-dom'\n\n/**\n * This module is the Portal component.\n * @module\n */\n\nexport interface PortalProps {\n  /**\n   * The root container to render the children into.\n   * @default document.body\n   */\n  container?: Element | DocumentFragment\n  /**\n   * An optional key to use for the Portal component.\n   */\n  key?: null | string\n}\n\n/**\n * The Portal component is used to render children into a DOM node that exists outside the DOM hierarchy of the parent component.\n * @see https://cerberus.digitalu.design/react/portal\n * @definition [React Portal Docs](https://react.dev/reference/react-dom/createPortal)\n * @example\n * ```tsx\n * 'use client'\n *\n * import { Portal } from '@cerberus/react'\n *\n * function SomeFeatureWithinSSRPage() {\n *   return (\n *     <Portal>\n *       <div>Portal Content outside of the React VDom tree</div>\n *     </Portal>\n *   )\n * }\n */\nexport function Portal(props: PropsWithChildren<PortalProps>) {\n  const container = props.container || document.body\n  return createPortal(props.children, container, props.key)\n}\n"],"mappings":";AAGA,SAAS,oBAAoB;AAqCtB,SAAS,OAAO,OAAuC;AAC5D,QAAM,YAAY,MAAM,aAAa,SAAS;AAC9C,SAAO,aAAa,MAAM,UAAU,WAAW,MAAM,GAAG;AAC1D;","names":[]}

package/build/modern/chunk-RO4AJOVX.js

@@ -1,24 +0,0 @@
-// src/hooks/useRootColors.ts
-import { useEffect, useReducer } from "react";
-function useRootColors(colors = []) {
-  const [state, dispatch] = useReducer(rootColorsReducer, {});
-  useEffect(() => {
-    if (Object.keys(state).length === colors.length) return;
-    const rootStyles = getComputedStyle(document.body);
-    const rootColors = colors.reduce((acc, color) => {
-      const formattedColor = color.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase().replaceAll(".", "-");
-      acc[color] = rootStyles.getPropertyValue(`--cerberus-colors-${formattedColor}`).trim();
-      return acc;
-    }, {});
-    dispatch(rootColors);
-  }, [colors]);
-  return state;
-}
-function rootColorsReducer(state, action) {
-  return { ...state, ...action };
-}
-
-export {
-  useRootColors
-};
-//# sourceMappingURL=chunk-RO4AJOVX.js.map

package/build/modern/chunk-RO4AJOVX.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/hooks/useRootColors.ts"],"sourcesContent":["'use client'\n\nimport { useEffect, useReducer } from 'react'\n\n/**\n * This module provides a hook to get Cerberus colors from the document root.\n * @module useRootColors\n */\n\nexport type RootColorsResult = Record<string, string>\n\n/**\n * This hook returns a record of Cerberus colors from the document root.\n * This is useful when you are working with a component that uses the `<canvas>`\n * element.\n * @param colors - An array of Cerberus tokens to get from the document root (i.e. `['dataViz.diverging.50', 'dataViz.diverging.200']`).\n * @returns A record of Cerberus colors where the key is the token name provided and the value is the color hex.\n */\nexport function useRootColors(colors: string[] = []): RootColorsResult {\n  const [state, dispatch] = useReducer(rootColorsReducer, {})\n\n  useEffect(() => {\n    if (Object.keys(state).length === colors.length) return\n\n    const rootStyles = getComputedStyle(document.body)\n    const rootColors = colors.reduce((acc, color) => {\n      const formattedColor = color\n        .replace(/([a-z])([A-Z])/g, '$1-$2')\n        .toLowerCase()\n        .replaceAll('.', '-')\n      acc[color as keyof typeof acc] = rootStyles\n        .getPropertyValue(`--cerberus-colors-${formattedColor}`)\n        .trim()\n      return acc\n    }, {} as RootColorsResult)\n\n    dispatch(rootColors)\n  }, [colors])\n\n  // reducer is already memoized\n  return state\n}\n\nfunction rootColorsReducer(\n  state: Record<string, string>,\n  action: Record<string, string>,\n): Record<string, string> {\n  return { ...state, ...action }\n}\n"],"mappings":";AAEA,SAAS,WAAW,kBAAkB;AAgB/B,SAAS,cAAc,SAAmB,CAAC,GAAqB;AACrE,QAAM,CAAC,OAAO,QAAQ,IAAI,WAAW,mBAAmB,CAAC,CAAC;AAE1D,YAAU,MAAM;AACd,QAAI,OAAO,KAAK,KAAK,EAAE,WAAW,OAAO,OAAQ;AAEjD,UAAM,aAAa,iBAAiB,SAAS,IAAI;AACjD,UAAM,aAAa,OAAO,OAAO,CAAC,KAAK,UAAU;AAC/C,YAAM,iBAAiB,MACpB,QAAQ,mBAAmB,OAAO,EAClC,YAAY,EACZ,WAAW,KAAK,GAAG;AACtB,UAAI,KAAyB,IAAI,WAC9B,iBAAiB,qBAAqB,cAAc,EAAE,EACtD,KAAK;AACR,aAAO;AAAA,IACT,GAAG,CAAC,CAAqB;AAEzB,aAAS,UAAU;AAAA,EACrB,GAAG,CAAC,MAAM,CAAC;AAGX,SAAO;AACT;AAEA,SAAS,kBACP,OACA,QACwB;AACxB,SAAO,EAAE,GAAG,OAAO,GAAG,OAAO;AAC/B;","names":[]}