@cerberus-design/react 0.0.1-next-57d4255 → 0.0.1-next-11f55b0

package/build/legacy/_tsup-dts-rollup.d.cts

@@ -1,7 +1,20 @@
+import type { ButtonHTMLAttributes } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 import { ReactNode } from 'react';
 
+declare function Button(props: ButtonProps): JSX_2.Element;
+export { Button }
+export { Button as Button_alias_1 }
+
+declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    palette?: 'action' | 'danger';
+    usage?: 'filled' | 'outline' | 'text';
+    shape?: 'sharp' | 'rounded';
+}
+export { ButtonProps }
+export { ButtonProps as ButtonProps_alias_1 }
+
 declare type ColorModes = 'light' | 'dark';
 export { ColorModes }
 export { ColorModes as ColorModes_alias_1 }

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

@@ -1,7 +1,20 @@
+import type { ButtonHTMLAttributes } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 import { ReactNode } from 'react';
 
+declare function Button(props: ButtonProps): JSX_2.Element;
+export { Button }
+export { Button as Button_alias_1 }
+
+declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    palette?: 'action' | 'danger';
+    usage?: 'filled' | 'outline' | 'text';
+    shape?: 'sharp' | 'rounded';
+}
+export { ButtonProps }
+export { ButtonProps as ButtonProps_alias_1 }
+
 declare type ColorModes = 'light' | 'dark';
 export { ColorModes }
 export { ColorModes as ColorModes_alias_1 }

package/build/legacy/components/Button.cjs

@@ -0,0 +1,50 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Button.tsx
+var Button_exports = {};
+__export(Button_exports, {
+  Button: () => Button
+});
+module.exports = __toCommonJS(Button_exports);
+var import_css = require("@cerberus-design/styled-system/css");
+var import_recipes = require("@cerberus-design/styled-system/recipes");
+var import_jsx_runtime = require("react/jsx-runtime");
+function Button(props) {
+  const { palette, usage, shape, ...nativeProps } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      ...nativeProps,
+      className: (0, import_css.cx)(
+        nativeProps.className,
+        (0, import_recipes.button)({
+          palette,
+          usage,
+          shape
+        })
+      )
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button
+});
+//# sourceMappingURL=Button.cjs.map

package/build/legacy/components/Button.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  palette?: 'action' | 'danger'\n  usage?: 'filled' | 'outline' | 'text'\n  shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, ...nativeProps } = props\n  return (\n    <button\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        button({\n          palette,\n          usage,\n          shape,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAmB;AACnB,qBAAuB;AAWnB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/legacy/components/Button.d.cts

@@ -0,0 +1,2 @@
+export { Button_alias_1 as Button } from '../_tsup-dts-rollup';
+export { ButtonProps_alias_1 as ButtonProps } from '../_tsup-dts-rollup';

package/build/legacy/components/Button.d.ts

@@ -0,0 +1,2 @@
+export { Button_alias_1 as Button } from '../_tsup-dts-rollup';
+export { ButtonProps_alias_1 as ButtonProps } from '../_tsup-dts-rollup';

package/build/legacy/components/Button.js

@@ -0,0 +1,25 @@
+// src/components/Button.tsx
+import { cx } from "@cerberus-design/styled-system/css";
+import { button } from "@cerberus-design/styled-system/recipes";
+import { jsx } from "react/jsx-runtime";
+function Button(props) {
+  const { palette, usage, shape, ...nativeProps } = props;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ...nativeProps,
+      className: cx(
+        nativeProps.className,
+        button({
+          palette,
+          usage,
+          shape
+        })
+      )
+    }
+  );
+}
+export {
+  Button
+};
+//# sourceMappingURL=Button.js.map

package/build/legacy/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  palette?: 'action' | 'danger'\n  usage?: 'filled' | 'outline' | 'text'\n  shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, ...nativeProps } = props\n  return (\n    <button\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        button({\n          palette,\n          usage,\n          shape,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";AACA,SAAS,UAAU;AACnB,SAAS,cAAc;AAWnB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/legacy/components/Show.cjs

@@ -0,0 +1,41 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Show.tsx
+var Show_exports = {};
+__export(Show_exports, {
+  Show: () => Show
+});
+module.exports = __toCommonJS(Show_exports);
+var import_react = require("react");
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = (0, import_react.useMemo)(() => when ?? false, [when]);
+  return (0, import_react.useMemo)(() => {
+    if (condition)
+      return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Show
+});
+//# sourceMappingURL=Show.cjs.map

package/build/legacy/components/Show.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n  when: boolean | null | undefined\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAgE;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}

package/build/legacy/components/Show.d.cts

@@ -0,0 +1,2 @@
+export { Show_alias_1 as Show } from '../_tsup-dts-rollup';
+export { ShowProps_alias_1 as ShowProps } from '../_tsup-dts-rollup';

package/build/legacy/components/Show.d.ts

@@ -0,0 +1,2 @@
+export { Show_alias_1 as Show } from '../_tsup-dts-rollup';
+export { ShowProps_alias_1 as ShowProps } from '../_tsup-dts-rollup';

package/build/legacy/components/Show.js

@@ -0,0 +1,17 @@
+"use client";
+
+// src/components/Show.tsx
+import { useMemo } from "react";
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = useMemo(() => when ?? false, [when]);
+  return useMemo(() => {
+    if (condition)
+      return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+export {
+  Show
+};
+//# sourceMappingURL=Show.js.map

package/build/legacy/components/Show.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n  when: boolean | null | undefined\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n"],"mappings":";;;AAEA,SAAS,eAAuD;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,YAAY,QAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,SAAO,QAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}

package/build/legacy/context/theme.cjs

@@ -0,0 +1,62 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/context/theme.tsx
+var theme_exports = {};
+__export(theme_exports, {
+  MODE_KEY: () => MODE_KEY,
+  THEME_KEY: () => THEME_KEY,
+  ThemeProvider: () => ThemeProvider,
+  useThemeContext: () => useThemeContext
+});
+module.exports = __toCommonJS(theme_exports);
+var import_react = require("react");
+var import_useTheme = require("../hooks/useTheme.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var THEME_KEY = "cerberus-theme";
+var MODE_KEY = "cerberus-mode";
+var initialThemeState = {
+  theme: "cerberus",
+  mode: "light",
+  updateTheme: () => {
+  },
+  updateMode: () => {
+  }
+};
+var ThemeContext = (0, import_react.createContext)(initialThemeState);
+function ThemeProvider(props) {
+  const state = (0, import_useTheme.useTheme)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ThemeContext.Provider, { value: state, children: props.children });
+}
+function useThemeContext() {
+  const context = (0, import_react.useContext)(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  return context;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MODE_KEY,
+  THEME_KEY,
+  ThemeProvider,
+  useThemeContext
+});
+//# sourceMappingURL=theme.cjs.map

package/build/legacy/context/theme.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n  theme: CustomThemes<T>\n  mode: ColorModes\n  updateTheme: (theme: T) => void\n  updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst initialThemeState = {\n  theme: 'cerberus' as const,\n  mode: 'light' as const,\n  updateTheme: () => {},\n  updateMode: () => {},\n}\n\nconst ThemeContext =\n  createContext<ThemeContextValue<DefaultThemes>>(initialThemeState)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n  const state = useTheme()\n  return (\n    <ThemeContext.Provider value={state}>\n      {props.children}\n    </ThemeContext.Provider>\n  )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAkE;AAClE,sBAAyB;AA6BrB;AAhBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,oBAAoB;AAAA,EACxB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AACrB;AAEA,IAAM,mBACJ,4BAAgD,iBAAiB;AAE5D,SAAS,cAAc,OAAmC;AAC/D,QAAM,YAAQ,0BAAS;AACvB,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,cAAU,yBAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}

package/build/legacy/context/theme.d.cts

@@ -0,0 +1,8 @@
+export { ThemeProvider_alias_1 as ThemeProvider } from '../_tsup-dts-rollup';
+export { useThemeContext_alias_1 as useThemeContext } from '../_tsup-dts-rollup';
+export { DefaultThemes_alias_1 as DefaultThemes } from '../_tsup-dts-rollup';
+export { CustomThemes_alias_1 as CustomThemes } from '../_tsup-dts-rollup';
+export { ColorModes_alias_1 as ColorModes } from '../_tsup-dts-rollup';
+export { ThemeContextValue_alias_1 as ThemeContextValue } from '../_tsup-dts-rollup';
+export { THEME_KEY_alias_1 as THEME_KEY } from '../_tsup-dts-rollup';
+export { MODE_KEY_alias_1 as MODE_KEY } from '../_tsup-dts-rollup';

package/build/legacy/context/theme.d.ts

@@ -0,0 +1,8 @@
+export { ThemeProvider_alias_1 as ThemeProvider } from '../_tsup-dts-rollup';
+export { useThemeContext_alias_1 as useThemeContext } from '../_tsup-dts-rollup';
+export { DefaultThemes_alias_1 as DefaultThemes } from '../_tsup-dts-rollup';
+export { CustomThemes_alias_1 as CustomThemes } from '../_tsup-dts-rollup';
+export { ColorModes_alias_1 as ColorModes } from '../_tsup-dts-rollup';
+export { ThemeContextValue_alias_1 as ThemeContextValue } from '../_tsup-dts-rollup';
+export { THEME_KEY_alias_1 as THEME_KEY } from '../_tsup-dts-rollup';
+export { MODE_KEY_alias_1 as MODE_KEY } from '../_tsup-dts-rollup';

package/build/legacy/context/theme.js

@@ -0,0 +1,35 @@
+"use client";
+
+// src/context/theme.tsx
+import { createContext, useContext } from "react";
+import { useTheme } from "../hooks/useTheme.js";
+import { jsx } from "react/jsx-runtime";
+var THEME_KEY = "cerberus-theme";
+var MODE_KEY = "cerberus-mode";
+var initialThemeState = {
+  theme: "cerberus",
+  mode: "light",
+  updateTheme: () => {
+  },
+  updateMode: () => {
+  }
+};
+var ThemeContext = createContext(initialThemeState);
+function ThemeProvider(props) {
+  const state = useTheme();
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: state, children: props.children });
+}
+function useThemeContext() {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  return context;
+}
+export {
+  MODE_KEY,
+  THEME_KEY,
+  ThemeProvider,
+  useThemeContext
+};
+//# sourceMappingURL=theme.js.map

package/build/legacy/context/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n  theme: CustomThemes<T>\n  mode: ColorModes\n  updateTheme: (theme: T) => void\n  updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst initialThemeState = {\n  theme: 'cerberus' as const,\n  mode: 'light' as const,\n  updateTheme: () => {},\n  updateMode: () => {},\n}\n\nconst ThemeContext =\n  createContext<ThemeContextValue<DefaultThemes>>(initialThemeState)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n  const state = useTheme()\n  return (\n    <ThemeContext.Provider value={state}>\n      {props.children}\n    </ThemeContext.Provider>\n  )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":";;;AAEA,SAAS,eAAe,kBAA0C;AAClE,SAAS,gBAAgB;AA6BrB;AAhBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,oBAAoB;AAAA,EACxB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AACrB;AAEA,IAAM,eACJ,cAAgD,iBAAiB;AAE5D,SAAS,cAAc,OAAmC;AAC/D,QAAM,QAAQ,SAAS;AACvB,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,UAAU,WAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}

package/build/legacy/index.cjs

@@ -17,11 +17,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./components/Button.cjs"), module.exports);
 __reExport(src_exports, require("./components/Show.cjs"), module.exports);
 __reExport(src_exports, require("./context/theme.cjs"), module.exports);
 __reExport(src_exports, require("./hooks/useTheme.cjs"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  ...require("./components/Button.cjs"),
   ...require("./components/Show.cjs"),
   ...require("./context/theme.cjs"),
   ...require("./hooks/useTheme.cjs")

package/build/legacy/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAEA,wBAAc,kCAFd;AAMA,wBAAc,gCANd;AAUA,wBAAc,iCAVd;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Button'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAEA,wBAAc,oCAFd;AAGA,wBAAc,kCAHd;AAOA,wBAAc,gCAPd;AAWA,wBAAc,iCAXd;","names":[]}

package/build/legacy/index.d.cts

@@ -1,3 +1,5 @@
+export { Button } from './_tsup-dts-rollup';
+export { ButtonProps } from './_tsup-dts-rollup';
 export { Show } from './_tsup-dts-rollup';
 export { ShowProps } from './_tsup-dts-rollup';
 export { ThemeProvider } from './_tsup-dts-rollup';

package/build/legacy/index.d.ts

@@ -1,3 +1,5 @@
+export { Button } from './_tsup-dts-rollup';
+export { ButtonProps } from './_tsup-dts-rollup';
 export { Show } from './_tsup-dts-rollup';
 export { ShowProps } from './_tsup-dts-rollup';
 export { ThemeProvider } from './_tsup-dts-rollup';

package/build/legacy/index.js

@@ -1,4 +1,5 @@
 // src/index.ts
+export * from "./components/Button.js";
 export * from "./components/Show.js";
 export * from "./context/theme.js";
 export * from "./hooks/useTheme.js";

package/build/legacy/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";AAEA,cAAc;AAId,cAAc;AAId,cAAc;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Button'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";AAEA,cAAc;AACd,cAAc;AAId,cAAc;AAId,cAAc;","names":[]}

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

@@ -1,7 +1,20 @@
+import type { ButtonHTMLAttributes } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 import { ReactNode } from 'react';
 
+declare function Button(props: ButtonProps): JSX_2.Element;
+export { Button }
+export { Button as Button_alias_1 }
+
+declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    palette?: 'action' | 'danger';
+    usage?: 'filled' | 'outline' | 'text';
+    shape?: 'sharp' | 'rounded';
+}
+export { ButtonProps }
+export { ButtonProps as ButtonProps_alias_1 }
+
 declare type ColorModes = 'light' | 'dark';
 export { ColorModes }
 export { ColorModes as ColorModes_alias_1 }

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

@@ -1,7 +1,20 @@
+import type { ButtonHTMLAttributes } from 'react';
 import { JSX as JSX_2 } from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 import { ReactNode } from 'react';
 
+declare function Button(props: ButtonProps): JSX_2.Element;
+export { Button }
+export { Button as Button_alias_1 }
+
+declare interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    palette?: 'action' | 'danger';
+    usage?: 'filled' | 'outline' | 'text';
+    shape?: 'sharp' | 'rounded';
+}
+export { ButtonProps }
+export { ButtonProps as ButtonProps_alias_1 }
+
 declare type ColorModes = 'light' | 'dark';
 export { ColorModes }
 export { ColorModes as ColorModes_alias_1 }

package/build/modern/components/Button.cjs

@@ -0,0 +1,50 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Button.tsx
+var Button_exports = {};
+__export(Button_exports, {
+  Button: () => Button
+});
+module.exports = __toCommonJS(Button_exports);
+var import_css = require("@cerberus-design/styled-system/css");
+var import_recipes = require("@cerberus-design/styled-system/recipes");
+var import_jsx_runtime = require("react/jsx-runtime");
+function Button(props) {
+  const { palette, usage, shape, ...nativeProps } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "button",
+    {
+      ...nativeProps,
+      className: (0, import_css.cx)(
+        nativeProps.className,
+        (0, import_recipes.button)({
+          palette,
+          usage,
+          shape
+        })
+      )
+    }
+  );
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Button
+});
+//# sourceMappingURL=Button.cjs.map

package/build/modern/components/Button.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  palette?: 'action' | 'danger'\n  usage?: 'filled' | 'outline' | 'text'\n  shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, ...nativeProps } = props\n  return (\n    <button\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        button({\n          palette,\n          usage,\n          shape,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAmB;AACnB,qBAAuB;AAWnB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAW;AAAA,QACT,YAAY;AAAA,YACZ,uBAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/modern/components/Button.d.cts

@@ -0,0 +1,2 @@
+export { Button_alias_1 as Button } from '../_tsup-dts-rollup';
+export { ButtonProps_alias_1 as ButtonProps } from '../_tsup-dts-rollup';

package/build/modern/components/Button.d.ts

@@ -0,0 +1,2 @@
+export { Button_alias_1 as Button } from '../_tsup-dts-rollup';
+export { ButtonProps_alias_1 as ButtonProps } from '../_tsup-dts-rollup';

package/build/modern/components/Button.js

@@ -0,0 +1,25 @@
+// src/components/Button.tsx
+import { cx } from "@cerberus-design/styled-system/css";
+import { button } from "@cerberus-design/styled-system/recipes";
+import { jsx } from "react/jsx-runtime";
+function Button(props) {
+  const { palette, usage, shape, ...nativeProps } = props;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      ...nativeProps,
+      className: cx(
+        nativeProps.className,
+        button({
+          palette,
+          usage,
+          shape
+        })
+      )
+    }
+  );
+}
+export {
+  Button
+};
+//# sourceMappingURL=Button.js.map

package/build/modern/components/Button.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Button.tsx"],"sourcesContent":["import type { ButtonHTMLAttributes } from 'react'\nimport { cx } from '@cerberus-design/styled-system/css'\nimport { button } from '@cerberus-design/styled-system/recipes'\n\nexport interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  palette?: 'action' | 'danger'\n  usage?: 'filled' | 'outline' | 'text'\n  shape?: 'sharp' | 'rounded'\n}\n\nexport function Button(props: ButtonProps) {\n  const { palette, usage, shape, ...nativeProps } = props\n  return (\n    <button\n      {...nativeProps}\n      className={cx(\n        nativeProps.className,\n        button({\n          palette,\n          usage,\n          shape,\n        }),\n      )}\n    />\n  )\n}\n"],"mappings":";AACA,SAAS,UAAU;AACnB,SAAS,cAAc;AAWnB;AAHG,SAAS,OAAO,OAAoB;AACzC,QAAM,EAAE,SAAS,OAAO,OAAO,GAAG,YAAY,IAAI;AAClD,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,OAAO;AAAA,UACL;AAAA,UACA;AAAA,UACA;AAAA,QACF,CAAC;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/build/modern/components/Show.cjs

@@ -0,0 +1,41 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/Show.tsx
+var Show_exports = {};
+__export(Show_exports, {
+  Show: () => Show
+});
+module.exports = __toCommonJS(Show_exports);
+var import_react = require("react");
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = (0, import_react.useMemo)(() => when ?? false, [when]);
+  return (0, import_react.useMemo)(() => {
+    if (condition)
+      return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Show
+});
+//# sourceMappingURL=Show.cjs.map

package/build/modern/components/Show.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n  when: boolean | null | undefined\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAgE;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,gBAAY,sBAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,aAAO,sBAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}

package/build/modern/components/Show.d.cts

@@ -0,0 +1,2 @@
+export { Show_alias_1 as Show } from '../_tsup-dts-rollup';
+export { ShowProps_alias_1 as ShowProps } from '../_tsup-dts-rollup';

package/build/modern/components/Show.d.ts

@@ -0,0 +1,2 @@
+export { Show_alias_1 as Show } from '../_tsup-dts-rollup';
+export { ShowProps_alias_1 as ShowProps } from '../_tsup-dts-rollup';

package/build/modern/components/Show.js

@@ -0,0 +1,17 @@
+"use client";
+
+// src/components/Show.tsx
+import { useMemo } from "react";
+function Show(props) {
+  const { when, children, fallback } = props;
+  const condition = useMemo(() => when ?? false, [when]);
+  return useMemo(() => {
+    if (condition)
+      return children;
+    return fallback ?? null;
+  }, [condition, children, fallback]);
+}
+export {
+  Show
+};
+//# sourceMappingURL=Show.js.map

package/build/modern/components/Show.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Show.tsx"],"sourcesContent":["'use client'\n\nimport { useMemo, type PropsWithChildren, type ReactNode } from 'react'\n\nexport interface ShowProps {\n  when: boolean | null | undefined\n  fallback?: ReactNode\n}\n\n/**\n * Conditionally render its children or an optional fallback component\n * based on the SolidJS component.\n * @description https://docs.solidjs.com/reference/components/show\n */\nexport function Show(props: PropsWithChildren<ShowProps>) {\n  const { when, children, fallback } = props\n  const condition = useMemo(() => when ?? false, [when])\n\n  return useMemo(() => {\n    if (condition) return children\n    return fallback ?? null\n  }, [condition, children, fallback])\n}\n"],"mappings":";;;AAEA,SAAS,eAAuD;AAYzD,SAAS,KAAK,OAAqC;AACxD,QAAM,EAAE,MAAM,UAAU,SAAS,IAAI;AACrC,QAAM,YAAY,QAAQ,MAAM,QAAQ,OAAO,CAAC,IAAI,CAAC;AAErD,SAAO,QAAQ,MAAM;AACnB,QAAI;AAAW,aAAO;AACtB,WAAO,YAAY;AAAA,EACrB,GAAG,CAAC,WAAW,UAAU,QAAQ,CAAC;AACpC;","names":[]}

package/build/modern/context/theme.cjs

@@ -0,0 +1,62 @@
+"use strict";
+"use client";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/context/theme.tsx
+var theme_exports = {};
+__export(theme_exports, {
+  MODE_KEY: () => MODE_KEY,
+  THEME_KEY: () => THEME_KEY,
+  ThemeProvider: () => ThemeProvider,
+  useThemeContext: () => useThemeContext
+});
+module.exports = __toCommonJS(theme_exports);
+var import_react = require("react");
+var import_useTheme = require("../hooks/useTheme.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+var THEME_KEY = "cerberus-theme";
+var MODE_KEY = "cerberus-mode";
+var initialThemeState = {
+  theme: "cerberus",
+  mode: "light",
+  updateTheme: () => {
+  },
+  updateMode: () => {
+  }
+};
+var ThemeContext = (0, import_react.createContext)(initialThemeState);
+function ThemeProvider(props) {
+  const state = (0, import_useTheme.useTheme)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ThemeContext.Provider, { value: state, children: props.children });
+}
+function useThemeContext() {
+  const context = (0, import_react.useContext)(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  return context;
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MODE_KEY,
+  THEME_KEY,
+  ThemeProvider,
+  useThemeContext
+});
+//# sourceMappingURL=theme.cjs.map

package/build/modern/context/theme.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n  theme: CustomThemes<T>\n  mode: ColorModes\n  updateTheme: (theme: T) => void\n  updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst initialThemeState = {\n  theme: 'cerberus' as const,\n  mode: 'light' as const,\n  updateTheme: () => {},\n  updateMode: () => {},\n}\n\nconst ThemeContext =\n  createContext<ThemeContextValue<DefaultThemes>>(initialThemeState)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n  const state = useTheme()\n  return (\n    <ThemeContext.Provider value={state}>\n      {props.children}\n    </ThemeContext.Provider>\n  )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,mBAAkE;AAClE,sBAAyB;AA6BrB;AAhBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,oBAAoB;AAAA,EACxB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AACrB;AAEA,IAAM,mBACJ,4BAAgD,iBAAiB;AAE5D,SAAS,cAAc,OAAmC;AAC/D,QAAM,YAAQ,0BAAS;AACvB,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,cAAU,yBAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}

package/build/modern/context/theme.d.cts

@@ -0,0 +1,8 @@
+export { ThemeProvider_alias_1 as ThemeProvider } from '../_tsup-dts-rollup';
+export { useThemeContext_alias_1 as useThemeContext } from '../_tsup-dts-rollup';
+export { DefaultThemes_alias_1 as DefaultThemes } from '../_tsup-dts-rollup';
+export { CustomThemes_alias_1 as CustomThemes } from '../_tsup-dts-rollup';
+export { ColorModes_alias_1 as ColorModes } from '../_tsup-dts-rollup';
+export { ThemeContextValue_alias_1 as ThemeContextValue } from '../_tsup-dts-rollup';
+export { THEME_KEY_alias_1 as THEME_KEY } from '../_tsup-dts-rollup';
+export { MODE_KEY_alias_1 as MODE_KEY } from '../_tsup-dts-rollup';

package/build/modern/context/theme.d.ts

@@ -0,0 +1,8 @@
+export { ThemeProvider_alias_1 as ThemeProvider } from '../_tsup-dts-rollup';
+export { useThemeContext_alias_1 as useThemeContext } from '../_tsup-dts-rollup';
+export { DefaultThemes_alias_1 as DefaultThemes } from '../_tsup-dts-rollup';
+export { CustomThemes_alias_1 as CustomThemes } from '../_tsup-dts-rollup';
+export { ColorModes_alias_1 as ColorModes } from '../_tsup-dts-rollup';
+export { ThemeContextValue_alias_1 as ThemeContextValue } from '../_tsup-dts-rollup';
+export { THEME_KEY_alias_1 as THEME_KEY } from '../_tsup-dts-rollup';
+export { MODE_KEY_alias_1 as MODE_KEY } from '../_tsup-dts-rollup';

package/build/modern/context/theme.js

@@ -0,0 +1,35 @@
+"use client";
+
+// src/context/theme.tsx
+import { createContext, useContext } from "react";
+import { useTheme } from "../hooks/useTheme.js";
+import { jsx } from "react/jsx-runtime";
+var THEME_KEY = "cerberus-theme";
+var MODE_KEY = "cerberus-mode";
+var initialThemeState = {
+  theme: "cerberus",
+  mode: "light",
+  updateTheme: () => {
+  },
+  updateMode: () => {
+  }
+};
+var ThemeContext = createContext(initialThemeState);
+function ThemeProvider(props) {
+  const state = useTheme();
+  return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: state, children: props.children });
+}
+function useThemeContext() {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useThemeContext must be used within a ThemeProvider");
+  }
+  return context;
+}
+export {
+  MODE_KEY,
+  THEME_KEY,
+  ThemeProvider,
+  useThemeContext
+};
+//# sourceMappingURL=theme.js.map

package/build/modern/context/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/context/theme.tsx"],"sourcesContent":["'use client'\n\nimport { createContext, useContext, type PropsWithChildren } from 'react'\nimport { useTheme } from '../hooks/useTheme'\n\nexport type DefaultThemes = 'cerberus'\nexport type CustomThemes<K extends string = DefaultThemes> = 'cerberus' | K\nexport type ColorModes = 'light' | 'dark'\n\nexport interface ThemeContextValue<T extends DefaultThemes> {\n  theme: CustomThemes<T>\n  mode: ColorModes\n  updateTheme: (theme: T) => void\n  updateMode: () => void\n}\n\nexport const THEME_KEY = 'cerberus-theme'\nexport const MODE_KEY = 'cerberus-mode'\n\nconst initialThemeState = {\n  theme: 'cerberus' as const,\n  mode: 'light' as const,\n  updateTheme: () => {},\n  updateMode: () => {},\n}\n\nconst ThemeContext =\n  createContext<ThemeContextValue<DefaultThemes>>(initialThemeState)\n\nexport function ThemeProvider(props: PropsWithChildren<unknown>) {\n  const state = useTheme()\n  return (\n    <ThemeContext.Provider value={state}>\n      {props.children}\n    </ThemeContext.Provider>\n  )\n}\n\nexport function useThemeContext(): ThemeContextValue<DefaultThemes> {\n  const context = useContext(ThemeContext)\n  if (!context) {\n    throw new Error('useThemeContext must be used within a ThemeProvider')\n  }\n  return context\n}\n"],"mappings":";;;AAEA,SAAS,eAAe,kBAA0C;AAClE,SAAS,gBAAgB;AA6BrB;AAhBG,IAAM,YAAY;AAClB,IAAM,WAAW;AAExB,IAAM,oBAAoB;AAAA,EACxB,OAAO;AAAA,EACP,MAAM;AAAA,EACN,aAAa,MAAM;AAAA,EAAC;AAAA,EACpB,YAAY,MAAM;AAAA,EAAC;AACrB;AAEA,IAAM,eACJ,cAAgD,iBAAiB;AAE5D,SAAS,cAAc,OAAmC;AAC/D,QAAM,QAAQ,SAAS;AACvB,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAO,OAC3B,gBAAM,UACT;AAEJ;AAEO,SAAS,kBAAoD;AAClE,QAAM,UAAU,WAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,qDAAqD;AAAA,EACvE;AACA,SAAO;AACT;","names":[]}

package/build/modern/index.cjs

@@ -17,11 +17,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var src_exports = {};
 module.exports = __toCommonJS(src_exports);
+__reExport(src_exports, require("./components/Button.cjs"), module.exports);
 __reExport(src_exports, require("./components/Show.cjs"), module.exports);
 __reExport(src_exports, require("./context/theme.cjs"), module.exports);
 __reExport(src_exports, require("./hooks/useTheme.cjs"), module.exports);
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  ...require("./components/Button.cjs"),
   ...require("./components/Show.cjs"),
   ...require("./context/theme.cjs"),
   ...require("./hooks/useTheme.cjs")

package/build/modern/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAEA,wBAAc,kCAFd;AAMA,wBAAc,gCANd;AAUA,wBAAc,iCAVd;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Button'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";;;;;;;;;;;;;;;;;AAAA;AAAA;AAEA,wBAAc,oCAFd;AAGA,wBAAc,kCAHd;AAOA,wBAAc,gCAPd;AAWA,wBAAc,iCAXd;","names":[]}

package/build/modern/index.d.cts

@@ -1,3 +1,5 @@
+export { Button } from './_tsup-dts-rollup';
+export { ButtonProps } from './_tsup-dts-rollup';
 export { Show } from './_tsup-dts-rollup';
 export { ShowProps } from './_tsup-dts-rollup';
 export { ThemeProvider } from './_tsup-dts-rollup';

package/build/modern/index.d.ts

@@ -1,3 +1,5 @@
+export { Button } from './_tsup-dts-rollup';
+export { ButtonProps } from './_tsup-dts-rollup';
 export { Show } from './_tsup-dts-rollup';
 export { ShowProps } from './_tsup-dts-rollup';
 export { ThemeProvider } from './_tsup-dts-rollup';

package/build/modern/index.js

@@ -1,4 +1,5 @@
 // src/index.ts
+export * from "./components/Button.js";
 export * from "./components/Show.js";
 export * from "./context/theme.js";
 export * from "./hooks/useTheme.js";

package/build/modern/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";AAEA,cAAc;AAId,cAAc;AAId,cAAc;","names":[]}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["// components\n\nexport * from './components/Button'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useTheme'\n"],"mappings":";AAEA,cAAc;AACd,cAAc;AAId,cAAc;AAId,cAAc;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cerberus-design/react",
-  "version": "0.0.1-next-57d4255",
+  "version": "0.0.1-next-11f55b0",
   "description": "The Cerberus Design React component library",
   "browserslist": "> 0.25%, not dead",
   "sideEffects": false,
@@ -9,19 +9,19 @@
   "module": "build/legacy/index.js",
   "peerDependencies": {
     "@cerberus-design/panda-preset": "*",
+    "@cerberus-design/styled-system": "*",
     "@pandacss/dev": "*",
     "react": "*",
     "react-dom": "*"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.43.4",
-    "@pandacss/dev": "^0.39.0",
-    "@pandacss/types": "^0.39.1",
     "@types/react": "^18",
     "react": "^18",
     "react-dom": "^18",
     "tsup": "^8.0.2",
-    "@cerberus-design/configs": "0.0.0"
+    "@cerberus-design/configs": "0.0.0",
+    "@cerberus-design/styled-system": "0.0.0"
   },
   "publishConfig": {
     "access": "public"
@@ -62,6 +62,12 @@
         "default": "./build/modern/index.cjs"
       }
     },
+    "./src": {
+      "import": {
+        "types": "./src/index.d.ts",
+        "default": "./src/index.ts"
+      }
+    },
     "./package.json": "./package.json"
   },
   "typesVersions": {

package/src/components/Button.tsx

@@ -0,0 +1,26 @@
+import type { ButtonHTMLAttributes } from 'react'
+import { cx } from '@cerberus-design/styled-system/css'
+import { button } from '@cerberus-design/styled-system/recipes'
+
+export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+  palette?: 'action' | 'danger'
+  usage?: 'filled' | 'outline' | 'text'
+  shape?: 'sharp' | 'rounded'
+}
+
+export function Button(props: ButtonProps) {
+  const { palette, usage, shape, ...nativeProps } = props
+  return (
+    <button
+      {...nativeProps}
+      className={cx(
+        nativeProps.className,
+        button({
+          palette,
+          usage,
+          shape,
+        }),
+      )}
+    />
+  )
+}

package/src/index.ts

@@ -1,5 +1,6 @@
 // components
 
+export * from './components/Button'
 export * from './components/Show'
 
 // context