@tecsinapse/cortex-core 1.3.0-beta.0 → 1.3.0-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (37) hide show
  1. package/dist/cjs/components/card/card.js +1 -1
  2. package/dist/cjs/components/drawer/drawer.js +1 -1
  3. package/dist/cjs/components/input/input.js +1 -1
  4. package/dist/cjs/components/manager/manager.js +1 -1
  5. package/dist/cjs/components/modal/modal.js +1 -1
  6. package/dist/cjs/components/select/select.js +1 -1
  7. package/dist/cjs/components/table/table.js +2 -2
  8. package/dist/cjs/components/tag/tag.js +1 -1
  9. package/dist/cjs/components/toggle/toggle.js +1 -1
  10. package/dist/cjs/index.js +3 -0
  11. package/dist/cjs/provider/DarkThemeContext.js +35 -0
  12. package/dist/cjs/tokens/definitions.js +6 -0
  13. package/dist/esm/components/card/card.js +1 -1
  14. package/dist/esm/components/drawer/drawer.js +1 -1
  15. package/dist/esm/components/input/input.js +1 -1
  16. package/dist/esm/components/manager/manager.js +1 -1
  17. package/dist/esm/components/modal/modal.js +1 -1
  18. package/dist/esm/components/select/select.js +1 -1
  19. package/dist/esm/components/table/table.js +2 -2
  20. package/dist/esm/components/tag/tag.js +1 -1
  21. package/dist/esm/components/toggle/toggle.js +1 -1
  22. package/dist/esm/index.js +1 -0
  23. package/dist/esm/provider/DarkThemeContext.js +32 -0
  24. package/dist/esm/tokens/definitions.js +6 -0
  25. package/dist/types/components/card/card.d.ts +1 -1
  26. package/dist/types/components/drawer/drawer.d.ts +2 -2
  27. package/dist/types/components/input/input.d.ts +2 -2
  28. package/dist/types/components/manager/manager.d.ts +2 -2
  29. package/dist/types/components/modal/modal.d.ts +2 -2
  30. package/dist/types/components/table/table.d.ts +2 -2
  31. package/dist/types/components/toggle/toggle.d.ts +2 -2
  32. package/dist/types/index.d.ts +1 -0
  33. package/dist/types/preset/index.d.ts +6 -0
  34. package/dist/types/provider/DarkThemeContext.d.ts +12 -0
  35. package/dist/types/provider/index.d.ts +1 -0
  36. package/dist/types/tokens/definitions.d.ts +6 -0
  37. package/package.json +2 -2
@@ -3,7 +3,7 @@
3
3
  var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const card = tailwindVariants.tv({
6
- base: "rounded-mili shadow-default bg-white p-deca"
6
+ base: "rounded-mili shadow-default bg-surface-overlay p-deca"
7
7
  });
8
8
 
9
9
  exports.card = card;
@@ -3,7 +3,7 @@
3
3
  var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const drawerStyles = tailwindVariants.tv({
6
- base: "bg-white fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll",
6
+ base: "bg-surface-overlay fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll",
7
7
  variants: {
8
8
  position: {
9
9
  left: "left-0 -translate-x-full rounded-r-mili",
@@ -4,7 +4,7 @@ var clsx = require('clsx');
4
4
  var tailwindVariants = require('tailwind-variants');
5
5
 
6
6
  const inputBaseStyles = tailwindVariants.tv({
7
- base: "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-white focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent",
7
+ base: "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-surface-overlay focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent",
8
8
  variants: {
9
9
  intent: {
10
10
  default: [
@@ -3,7 +3,7 @@
3
3
  var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const manager = tailwindVariants.tv({
6
- base: "fixed rounded-micro p-deca bg-white shadow-xl flex transition bottom-deca right-deca z-modal",
6
+ base: "fixed rounded-micro p-deca bg-surface-overlay shadow-xl flex transition bottom-deca right-deca z-modal",
7
7
  variants: {
8
8
  open: {
9
9
  true: "scale-100 visible",
@@ -3,7 +3,7 @@
3
3
  var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const modal = tailwindVariants.tv({
6
- base: "fixed rounded-micro p-kilo bg-white shadow-default flex transition inset-0 z-modal",
6
+ base: "fixed rounded-micro p-kilo bg-surface-overlay shadow-default flex transition inset-0 z-modal",
7
7
  variants: {
8
8
  open: {
9
9
  true: "scale-100 visible",
@@ -15,7 +15,7 @@ const option = tailwindVariants.tv({
15
15
  });
16
16
  const selectVariants = tailwindVariants.tv({
17
17
  slots: {
18
- button: "disabled:pointer-events-none disabled:text-secondary-light flex w-full justify-between items-center bg-white relative min-h-[44px] h-auto flex px-centi py-1.5 text-base font-bold items-center border border-secondary-light rounded-mili",
18
+ button: "disabled:pointer-events-none disabled:text-secondary-light flex w-full justify-between items-center bg-surface-overlay relative min-h-[44px] h-auto flex px-centi py-1.5 text-base font-bold items-center border border-secondary-light rounded-mili",
19
19
  groupedTitle: "font-bold text-secondary-medium mx-centi",
20
20
  list: "list-none p-0"
21
21
  },
@@ -18,10 +18,10 @@ const tFoot = tailwindVariants.tv({
18
18
  base: "[&>tr]:rounded-none [&>tr]:shadow-none"
19
19
  });
20
20
  const tRoot = tailwindVariants.tv({
21
- base: "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-white shadow-default"
21
+ base: "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-surface-overlay shadow-default"
22
22
  });
23
23
  const hr = tailwindVariants.tv({
24
- base: "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-secondary-xlight"
24
+ base: "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-surface-base"
25
25
  });
26
26
 
27
27
  exports.hr = hr;
@@ -21,7 +21,7 @@ const tagStyles = myTV({
21
21
  success: "bg-success-medium text-white",
22
22
  warning: "bg-warning-medium text-white",
23
23
  error: "bg-error-medium text-white",
24
- white: "bg-white text-secondary-medium"
24
+ white: "bg-surface-overlay text-secondary-medium"
25
25
  }
26
26
  },
27
27
  defaultVariants: {
@@ -3,7 +3,7 @@
3
3
  var tailwindVariants = require('tailwind-variants');
4
4
 
5
5
  const toggleStyles = tailwindVariants.tv({
6
- base: "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-white after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none",
6
+ base: "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-surface-overlay after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none",
7
7
  variants: {
8
8
  intent: {
9
9
  primary: "peer-focus:primary-medium peer-checked:bg-primary-medium",
package/dist/cjs/index.js CHANGED
@@ -22,6 +22,7 @@ var manager = require('./components/manager/manager.js');
22
22
  var index = require('./preset/index.js');
23
23
  var definitions = require('./tokens/definitions.js');
24
24
  var index$1 = require('./utils/index.js');
25
+ var DarkThemeContext = require('./provider/DarkThemeContext.js');
25
26
 
26
27
 
27
28
 
@@ -75,3 +76,5 @@ exports.textColor = definitions.textColor;
75
76
  exports.zIndex = definitions.zIndex;
76
77
  exports.setDarkMode = index$1.setDarkMode;
77
78
  exports.updateThemeColors = index$1.updateThemeColors;
79
+ exports.ThemeProvider = DarkThemeContext.ThemeProvider;
80
+ exports.useDarkTheme = DarkThemeContext.useDarkTheme;
@@ -0,0 +1,35 @@
1
+ 'use strict';
2
+
3
+ var jsxRuntime = require('react/jsx-runtime');
4
+ var react = require('react');
5
+
6
+ const ThemeContext = react.createContext(null);
7
+ const ThemeProvider = ({ children }) => {
8
+ const [theme, setTheme] = react.useState("light");
9
+ react.useEffect(() => {
10
+ const style = document.documentElement.style;
11
+ if (theme === "dark") {
12
+ style.setProperty("--color-body", "#1e1e1e");
13
+ style.setProperty("--color-text-default", "#fff");
14
+ style.setProperty("--color-surface-base", "#1e1e1e");
15
+ style.setProperty("--color-surface-raised", "#252526");
16
+ style.setProperty("--color-surface-overlay", "#2d2d30");
17
+ } else {
18
+ style.setProperty("--color-body", "#f8f7f7");
19
+ style.setProperty("--color-text-default", "#000");
20
+ style.setProperty("--color-surface-base", "#f8f7f7");
21
+ style.setProperty("--color-surface-raised", "#fbfbfb");
22
+ style.setProperty("--color-surface-overlay", "#ffffff");
23
+ }
24
+ }, [theme]);
25
+ const toggleTheme = () => setTheme((t) => t === "light" ? "dark" : "light");
26
+ return /* @__PURE__ */ jsxRuntime.jsx(ThemeContext.Provider, { value: { theme, setTheme, toggleTheme }, children });
27
+ };
28
+ const useDarkTheme = () => {
29
+ const ctx = react.useContext(ThemeContext);
30
+ if (!ctx) throw new Error("useTheme must be used inside ThemeProvider");
31
+ return ctx;
32
+ };
33
+
34
+ exports.ThemeProvider = ThemeProvider;
35
+ exports.useDarkTheme = useDarkTheme;
@@ -36,6 +36,11 @@ const colors = {
36
36
  dark: "#cc9f00",
37
37
  xdark: "#665000"
38
38
  },
39
+ surface: {
40
+ base: "var(--color-surface-base, #f8f7f7)",
41
+ raised: "var(--color-surface-raised, #fbfbfb)",
42
+ overlay: "var(--color-surface-overlay, #ffffff)"
43
+ },
39
44
  error: {
40
45
  xlight: "#fdf3f2",
41
46
  light: "#ee9891",
@@ -153,6 +158,7 @@ const fontFamily = {
153
158
  mono: "Consolas, monaco, monospace"
154
159
  };
155
160
  const textColor = {
161
+ default: "var(--color-text-default, #000)",
156
162
  light: "#fff",
157
163
  medium: "#85807a",
158
164
  dark: "#353231",
@@ -1,7 +1,7 @@
1
1
  import { tv } from 'tailwind-variants';
2
2
 
3
3
  const card = tv({
4
- base: "rounded-mili shadow-default bg-white p-deca"
4
+ base: "rounded-mili shadow-default bg-surface-overlay p-deca"
5
5
  });
6
6
 
7
7
  export { card };
@@ -1,7 +1,7 @@
1
1
  import { tv } from 'tailwind-variants';
2
2
 
3
3
  const drawerStyles = tv({
4
- base: "bg-white fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll",
4
+ base: "bg-surface-overlay fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll",
5
5
  variants: {
6
6
  position: {
7
7
  left: "left-0 -translate-x-full rounded-r-mili",
@@ -2,7 +2,7 @@ import { clsx } from 'clsx';
2
2
  import { tv } from 'tailwind-variants';
3
3
 
4
4
  const inputBaseStyles = tv({
5
- base: "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-white focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent",
5
+ base: "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-surface-overlay focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent",
6
6
  variants: {
7
7
  intent: {
8
8
  default: [
@@ -1,7 +1,7 @@
1
1
  import { tv } from 'tailwind-variants';
2
2
 
3
3
  const manager = tv({
4
- base: "fixed rounded-micro p-deca bg-white shadow-xl flex transition bottom-deca right-deca z-modal",
4
+ base: "fixed rounded-micro p-deca bg-surface-overlay shadow-xl flex transition bottom-deca right-deca z-modal",
5
5
  variants: {
6
6
  open: {
7
7
  true: "scale-100 visible",
@@ -1,7 +1,7 @@
1
1
  import { tv } from 'tailwind-variants';
2
2
 
3
3
  const modal = tv({
4
- base: "fixed rounded-micro p-kilo bg-white shadow-default flex transition inset-0 z-modal",
4
+ base: "fixed rounded-micro p-kilo bg-surface-overlay shadow-default flex transition inset-0 z-modal",
5
5
  variants: {
6
6
  open: {
7
7
  true: "scale-100 visible",
@@ -13,7 +13,7 @@ const option = tv({
13
13
  });
14
14
  const selectVariants = tv({
15
15
  slots: {
16
- button: "disabled:pointer-events-none disabled:text-secondary-light flex w-full justify-between items-center bg-white relative min-h-[44px] h-auto flex px-centi py-1.5 text-base font-bold items-center border border-secondary-light rounded-mili",
16
+ button: "disabled:pointer-events-none disabled:text-secondary-light flex w-full justify-between items-center bg-surface-overlay relative min-h-[44px] h-auto flex px-centi py-1.5 text-base font-bold items-center border border-secondary-light rounded-mili",
17
17
  groupedTitle: "font-bold text-secondary-medium mx-centi",
18
18
  list: "list-none p-0"
19
19
  },
@@ -16,10 +16,10 @@ const tFoot = tv({
16
16
  base: "[&>tr]:rounded-none [&>tr]:shadow-none"
17
17
  });
18
18
  const tRoot = tv({
19
- base: "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-white shadow-default"
19
+ base: "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-surface-overlay shadow-default"
20
20
  });
21
21
  const hr = tv({
22
- base: "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-secondary-xlight"
22
+ base: "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-surface-base"
23
23
  });
24
24
 
25
25
  export { hr, tCell, tFoot, tHead, tHeadCell, tRoot, tRow };
@@ -19,7 +19,7 @@ const tagStyles = myTV({
19
19
  success: "bg-success-medium text-white",
20
20
  warning: "bg-warning-medium text-white",
21
21
  error: "bg-error-medium text-white",
22
- white: "bg-white text-secondary-medium"
22
+ white: "bg-surface-overlay text-secondary-medium"
23
23
  }
24
24
  },
25
25
  defaultVariants: {
@@ -1,7 +1,7 @@
1
1
  import { tv } from 'tailwind-variants';
2
2
 
3
3
  const toggleStyles = tv({
4
- base: "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-white after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none",
4
+ base: "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-surface-overlay after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none",
5
5
  variants: {
6
6
  intent: {
7
7
  primary: "peer-focus:primary-medium peer-checked:bg-primary-medium",
package/dist/esm/index.js CHANGED
@@ -20,3 +20,4 @@ export { manager } from './components/manager/manager.js';
20
20
  export { default as preset } from './preset/index.js';
21
21
  export { borderColor, borderRadius, borderWidth, boxShadow, colors, fontFamily, fontSize, spacing, textColor, zIndex } from './tokens/definitions.js';
22
22
  export { setDarkMode, updateThemeColors } from './utils/index.js';
23
+ export { ThemeProvider, useDarkTheme } from './provider/DarkThemeContext.js';
@@ -0,0 +1,32 @@
1
+ import { jsx } from 'react/jsx-runtime';
2
+ import { createContext, useState, useEffect, useContext } from 'react';
3
+
4
+ const ThemeContext = createContext(null);
5
+ const ThemeProvider = ({ children }) => {
6
+ const [theme, setTheme] = useState("light");
7
+ useEffect(() => {
8
+ const style = document.documentElement.style;
9
+ if (theme === "dark") {
10
+ style.setProperty("--color-body", "#1e1e1e");
11
+ style.setProperty("--color-text-default", "#fff");
12
+ style.setProperty("--color-surface-base", "#1e1e1e");
13
+ style.setProperty("--color-surface-raised", "#252526");
14
+ style.setProperty("--color-surface-overlay", "#2d2d30");
15
+ } else {
16
+ style.setProperty("--color-body", "#f8f7f7");
17
+ style.setProperty("--color-text-default", "#000");
18
+ style.setProperty("--color-surface-base", "#f8f7f7");
19
+ style.setProperty("--color-surface-raised", "#fbfbfb");
20
+ style.setProperty("--color-surface-overlay", "#ffffff");
21
+ }
22
+ }, [theme]);
23
+ const toggleTheme = () => setTheme((t) => t === "light" ? "dark" : "light");
24
+ return /* @__PURE__ */ jsx(ThemeContext.Provider, { value: { theme, setTheme, toggleTheme }, children });
25
+ };
26
+ const useDarkTheme = () => {
27
+ const ctx = useContext(ThemeContext);
28
+ if (!ctx) throw new Error("useTheme must be used inside ThemeProvider");
29
+ return ctx;
30
+ };
31
+
32
+ export { ThemeProvider, useDarkTheme };
@@ -34,6 +34,11 @@ const colors = {
34
34
  dark: "#cc9f00",
35
35
  xdark: "#665000"
36
36
  },
37
+ surface: {
38
+ base: "var(--color-surface-base, #f8f7f7)",
39
+ raised: "var(--color-surface-raised, #fbfbfb)",
40
+ overlay: "var(--color-surface-overlay, #ffffff)"
41
+ },
37
42
  error: {
38
43
  xlight: "#fdf3f2",
39
44
  light: "#ee9891",
@@ -151,6 +156,7 @@ const fontFamily = {
151
156
  mono: "Consolas, monaco, monospace"
152
157
  };
153
158
  const textColor = {
159
+ default: "var(--color-text-default, #000)",
154
160
  light: "#fff",
155
161
  medium: "#85807a",
156
162
  dark: "#353231",
@@ -1 +1 @@
1
- export declare const card: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "rounded-mili shadow-default bg-white p-deca", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "rounded-mili shadow-default bg-white p-deca", unknown, unknown, undefined>>;
1
+ export declare const card: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "rounded-mili shadow-default bg-surface-overlay p-deca", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "rounded-mili shadow-default bg-surface-overlay p-deca", unknown, unknown, undefined>>;
@@ -8,7 +8,7 @@ declare const drawerStyles: import("tailwind-variants").TVReturnType<{
8
8
  true: string;
9
9
  false: string;
10
10
  };
11
- }, undefined, "bg-white fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll", {
11
+ }, undefined, "bg-surface-overlay fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll", {
12
12
  position: {
13
13
  left: string;
14
14
  right: string;
@@ -26,7 +26,7 @@ declare const drawerStyles: import("tailwind-variants").TVReturnType<{
26
26
  true: string;
27
27
  false: string;
28
28
  };
29
- }, undefined, "bg-white fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll", unknown, unknown, undefined>>;
29
+ }, undefined, "bg-surface-overlay fixed top-0 h-full p-deca shadow-lg transition-all duration-500 transform overflow-y-scroll", unknown, unknown, undefined>>;
30
30
  export type DrawerVariants = VariantProps<typeof drawerStyles> & ClassProp;
31
31
  export declare const drawer: (props: DrawerVariants) => string;
32
32
  export {};
@@ -6,7 +6,7 @@ export declare const inputBaseStyles: import("tailwind-variants").TVReturnType<{
6
6
  warning: string[];
7
7
  error: string[];
8
8
  };
9
- }, undefined, "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-white focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent", {
9
+ }, undefined, "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-surface-overlay focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent", {
10
10
  intent: {
11
11
  default: string[];
12
12
  success: string[];
@@ -20,7 +20,7 @@ export declare const inputBaseStyles: import("tailwind-variants").TVReturnType<{
20
20
  warning: string[];
21
21
  error: string[];
22
22
  };
23
- }, undefined, "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-white focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent", unknown, unknown, undefined>>;
23
+ }, undefined, "relative min-h-[44px] h-auto flex px-centi py-1.5 bg-surface-overlay focus-within:outline focus-within:outline-1 text-base font-bold items-center border rounded-mili has-[:disabled]:bg-transparent", unknown, unknown, undefined>>;
24
24
  declare const labelBaseStyles: import("tailwind-variants").TVReturnType<{
25
25
  intent: {
26
26
  default: string[];
@@ -3,7 +3,7 @@ export declare const manager: import("tailwind-variants").TVReturnType<{
3
3
  true: string;
4
4
  false: string;
5
5
  };
6
- }, undefined, "fixed rounded-micro p-deca bg-white shadow-xl flex transition bottom-deca right-deca z-modal", {
6
+ }, undefined, "fixed rounded-micro p-deca bg-surface-overlay shadow-xl flex transition bottom-deca right-deca z-modal", {
7
7
  open: {
8
8
  true: string;
9
9
  false: string;
@@ -13,4 +13,4 @@ export declare const manager: import("tailwind-variants").TVReturnType<{
13
13
  true: string;
14
14
  false: string;
15
15
  };
16
- }, undefined, "fixed rounded-micro p-deca bg-white shadow-xl flex transition bottom-deca right-deca z-modal", unknown, unknown, undefined>>;
16
+ }, undefined, "fixed rounded-micro p-deca bg-surface-overlay shadow-xl flex transition bottom-deca right-deca z-modal", unknown, unknown, undefined>>;
@@ -3,7 +3,7 @@ export declare const modal: import("tailwind-variants").TVReturnType<{
3
3
  true: string;
4
4
  false: string;
5
5
  };
6
- }, undefined, "fixed rounded-micro p-kilo bg-white shadow-default flex transition inset-0 z-modal", {
6
+ }, undefined, "fixed rounded-micro p-kilo bg-surface-overlay shadow-default flex transition inset-0 z-modal", {
7
7
  open: {
8
8
  true: string;
9
9
  false: string;
@@ -13,4 +13,4 @@ export declare const modal: import("tailwind-variants").TVReturnType<{
13
13
  true: string;
14
14
  false: string;
15
15
  };
16
- }, undefined, "fixed rounded-micro p-kilo bg-white shadow-default flex transition inset-0 z-modal", unknown, unknown, undefined>>;
16
+ }, undefined, "fixed rounded-micro p-kilo bg-surface-overlay shadow-default flex transition inset-0 z-modal", unknown, unknown, undefined>>;
@@ -3,5 +3,5 @@ export declare const tRow: import("tailwind-variants").TVReturnType<{} | {} | {}
3
3
  export declare const tHeadCell: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "truncate px-deca py-centi text-start text-sub font-bold text-medium", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "truncate px-deca py-centi text-start text-sub font-bold text-medium", unknown, unknown, undefined>>;
4
4
  export declare const tCell: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "p-deca text-base font-bold text-dark", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "p-deca text-base font-bold text-dark", unknown, unknown, undefined>>;
5
5
  export declare const tFoot: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "[&>tr]:rounded-none [&>tr]:shadow-none", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "[&>tr]:rounded-none [&>tr]:shadow-none", unknown, unknown, undefined>>;
6
- export declare const tRoot: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-white shadow-default", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-white shadow-default", unknown, unknown, undefined>>;
7
- export declare const hr: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-secondary-xlight", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-secondary-xlight", unknown, unknown, undefined>>;
6
+ export declare const tRoot: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-surface-overlay shadow-default", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "min-w-fit border-separate border-spacing-x-[22px] border-spacing-y-mili rounded-mili bg-surface-overlay shadow-default", unknown, unknown, undefined>>;
7
+ export declare const hr: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-surface-base", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "-mx-[24px] -mb-[4px] -mt-[50px] h-[42px] border-0 bg-surface-base", unknown, unknown, undefined>>;
@@ -8,7 +8,7 @@ declare const toggleStyles: import("tailwind-variants").TVReturnType<{
8
8
  warning: string;
9
9
  error: string;
10
10
  };
11
- }, undefined, "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-white after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none", {
11
+ }, undefined, "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-surface-overlay after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none", {
12
12
  intent: {
13
13
  primary: string;
14
14
  secondary: string;
@@ -26,7 +26,7 @@ declare const toggleStyles: import("tailwind-variants").TVReturnType<{
26
26
  warning: string;
27
27
  error: string;
28
28
  };
29
- }, undefined, "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-white after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none", unknown, unknown, undefined>>;
29
+ }, undefined, "peer h-[22px] w-[40px] rounded-full bg-secondary-light after:absolute after:left-micro after:top-[3px] after:h-deca after:w-deca after:rounded-full after:border after:border-white after:bg-surface-overlay after:transition-all after:content-[''] peer-checked:after:translate-x-full peer-checked:after:border-white peer-focus:outline-none", unknown, unknown, undefined>>;
30
30
  export declare const styleLabelElement: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "relative inline-flex cursor-pointer items-center", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "relative inline-flex cursor-pointer items-center", unknown, unknown, undefined>>;
31
31
  export declare const styleInputElement: import("tailwind-variants").TVReturnType<{} | {} | {}, undefined, "peer sr-only", {} | {}, undefined, import("tailwind-variants").TVReturnType<unknown, undefined, "peer sr-only", unknown, unknown, undefined>>;
32
32
  type ToggleVariants = VariantProps<typeof toggleStyles> & ClassProp;
@@ -2,3 +2,4 @@ export * from './components';
2
2
  export { default as preset } from './preset';
3
3
  export * from './tokens/definitions';
4
4
  export * from './utils';
5
+ export * from './provider';
@@ -41,6 +41,11 @@ declare const preset: {
41
41
  dark: string;
42
42
  xdark: string;
43
43
  };
44
+ surface: {
45
+ base: string;
46
+ raised: string;
47
+ overlay: string;
48
+ };
44
49
  error: {
45
50
  xlight: string;
46
51
  light: string;
@@ -53,6 +58,7 @@ declare const preset: {
53
58
  };
54
59
  };
55
60
  textColor: {
61
+ default: string;
56
62
  light: string;
57
63
  medium: string;
58
64
  dark: string;
@@ -0,0 +1,12 @@
1
+ import { ReactNode } from 'react';
2
+ type Theme = 'light' | 'dark';
3
+ interface ThemeContextValue {
4
+ theme: Theme;
5
+ setTheme: (theme: Theme) => void;
6
+ toggleTheme: () => void;
7
+ }
8
+ export declare const ThemeProvider: ({ children }: {
9
+ children: ReactNode;
10
+ }) => import("react/jsx-runtime").JSX.Element;
11
+ export declare const useDarkTheme: () => ThemeContextValue;
12
+ export {};
@@ -0,0 +1 @@
1
+ export * from './DarkThemeContext';
@@ -34,6 +34,11 @@ declare const colors: {
34
34
  dark: string;
35
35
  xdark: string;
36
36
  };
37
+ surface: {
38
+ base: string;
39
+ raised: string;
40
+ overlay: string;
41
+ };
37
42
  error: {
38
43
  xlight: string;
39
44
  light: string;
@@ -97,6 +102,7 @@ declare const fontFamily: {
97
102
  mono: string;
98
103
  };
99
104
  declare const textColor: {
105
+ default: string;
100
106
  light: string;
101
107
  medium: string;
102
108
  dark: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tecsinapse/cortex-core",
3
- "version": "1.3.0-beta.0",
3
+ "version": "1.3.0-beta.2",
4
4
  "license": "MIT",
5
5
  "description": "Core library for tailwindcss based design",
6
6
  "main": "dist/esm/index.js",
@@ -31,5 +31,5 @@
31
31
  "peerDependencies": {
32
32
  "tailwindcss": ">=3.3.0"
33
33
  },
34
- "gitHead": "c267542fbb45c9c598be530f2c2d4211365a816e"
34
+ "gitHead": "5365cc6cb2202caec12950731aff22afcc24ccbb"
35
35
  }