@g4rcez/components 0.0.40 → 0.0.42

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 (51) hide show
  1. package/dist/index.css +1 -1
  2. package/dist/index.js +44 -44
  3. package/dist/index.js.map +1 -1
  4. package/dist/index.mjs +6172 -6269
  5. package/dist/index.mjs.map +1 -1
  6. package/dist/index.umd.js +43 -43
  7. package/dist/index.umd.js.map +1 -1
  8. package/dist/preset/preset.tailwind.d.ts +0 -3
  9. package/dist/preset/preset.tailwind.d.ts.map +1 -1
  10. package/dist/preset/preset.tailwind.js +0 -1
  11. package/dist/preset/src/styles/common.d.ts +17 -0
  12. package/dist/preset/src/styles/common.d.ts.map +1 -0
  13. package/dist/preset/src/styles/common.js +16 -0
  14. package/dist/preset/src/styles/dark.d.ts +3 -0
  15. package/dist/preset/src/styles/dark.d.ts.map +1 -0
  16. package/dist/preset/src/styles/dark.js +140 -0
  17. package/dist/preset/src/styles/light.d.ts +3 -0
  18. package/dist/preset/src/styles/light.d.ts.map +1 -0
  19. package/dist/preset/src/styles/light.js +140 -0
  20. package/dist/preset/src/styles/theme.d.ts +2 -3
  21. package/dist/preset/src/styles/theme.d.ts.map +1 -1
  22. package/dist/preset/src/styles/theme.js +4 -294
  23. package/dist/preset.tailwind.d.ts +0 -3
  24. package/dist/preset.tailwind.d.ts.map +1 -1
  25. package/dist/preset.tailwind.js +0 -1
  26. package/dist/src/components/form/autocomplete.d.ts.map +1 -1
  27. package/dist/src/components/form/autocomplete.js +17 -10
  28. package/dist/src/components/form/date-picker.d.ts.map +1 -1
  29. package/dist/src/components/form/date-picker.js +1 -1
  30. package/dist/src/components/form/input-field.d.ts.map +1 -1
  31. package/dist/src/components/form/input-field.js +1 -1
  32. package/dist/src/components/form/input.d.ts.map +1 -1
  33. package/dist/src/components/form/input.js +1 -1
  34. package/dist/src/components/form/select.d.ts.map +1 -1
  35. package/dist/src/components/form/select.js +2 -2
  36. package/dist/src/hooks/use-form.d.ts +8 -5
  37. package/dist/src/hooks/use-form.d.ts.map +1 -1
  38. package/dist/src/hooks/use-form.js +26 -9
  39. package/dist/src/styles/common.d.ts +17 -0
  40. package/dist/src/styles/common.d.ts.map +1 -0
  41. package/dist/src/styles/common.js +16 -0
  42. package/dist/src/styles/dark.d.ts +3 -0
  43. package/dist/src/styles/dark.d.ts.map +1 -0
  44. package/dist/src/styles/dark.js +140 -0
  45. package/dist/src/styles/light.d.ts +3 -0
  46. package/dist/src/styles/light.d.ts.map +1 -0
  47. package/dist/src/styles/light.js +140 -0
  48. package/dist/src/styles/theme.d.ts +2 -3
  49. package/dist/src/styles/theme.d.ts.map +1 -1
  50. package/dist/src/styles/theme.js +4 -294
  51. package/package.json +2 -2
@@ -1,9 +1,6 @@
1
1
  import { Config } from "tailwindcss";
2
2
  import { createDesignTokens, parsers } from "./src/styles/design-tokens";
3
3
  import { defaultDarkTheme } from "./src/styles/theme";
4
- export declare const css: (template: {
5
- raw: readonly string[] | ArrayLike<string>;
6
- }, ...substitutions: any[]) => string;
7
4
  declare const config: Partial<Config>;
8
5
  export { createDesignTokens, parsers, defaultDarkTheme };
9
6
  export default config;
@@ -1 +1 @@
1
- {"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAItD,eAAO,MAAM,GAAG;;qCAAa,CAAC;AAI9B,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAEzD,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"preset.tailwind.d.ts","sourceRoot":"","sources":["../../preset.tailwind.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,MAAM,aAAa,CAAC;AAErC,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAMtD,QAAA,MAAM,MAAM,EAAE,OAAO,CAAC,MAAM,CA2C3B,CAAC;AAEF,OAAO,EAAE,kBAAkB,EAAE,OAAO,EAAE,gBAAgB,EAAE,CAAC;AAEzD,eAAe,MAAM,CAAC"}
@@ -14,7 +14,6 @@ import plugin from "tailwindcss/plugin";
14
14
  import { createDesignTokens, parsers } from "./src/styles/design-tokens";
15
15
  import { defaultDarkTheme } from "./src/styles/theme";
16
16
  var COLORS = createDesignTokens(defaultDarkTheme.colors, parsers.formatWithVar("hsla"));
17
- export var css = String.raw;
18
17
  var spacing = createDesignTokens(defaultDarkTheme.spacing, parsers.cssVariable);
19
18
  var config = {
20
19
  theme: {
@@ -0,0 +1,17 @@
1
+ export declare const rounded: {
2
+ readonly button: "0.4rem";
3
+ readonly pill: "2rem";
4
+ readonly card: "0.75rem";
5
+ readonly full: "9999px";
6
+ };
7
+ export declare const spacing: {
8
+ readonly base: "1rem";
9
+ readonly lg: "1.5rem";
10
+ readonly sm: "0.75rem";
11
+ readonly "input-height": "2.5rem";
12
+ readonly "input-x": "0.5rem";
13
+ readonly "input-y": "0.25rem";
14
+ readonly "input-inline": "0.25rem";
15
+ readonly "input-gap": "0.3rem";
16
+ };
17
+ //# sourceMappingURL=common.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../src/styles/common.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;CAKV,CAAC;AAEX,eAAO,MAAM,OAAO;;;;;;;;;CASV,CAAC"}
@@ -0,0 +1,16 @@
1
+ export var rounded = {
2
+ button: "0.4rem",
3
+ pill: "2rem",
4
+ card: "0.75rem",
5
+ full: "9999px",
6
+ };
7
+ export var spacing = {
8
+ base: "1rem",
9
+ lg: "1.5rem",
10
+ sm: "0.75rem",
11
+ "input-height": "2.5rem",
12
+ "input-x": "0.5rem",
13
+ "input-y": "0.25rem",
14
+ "input-inline": "0.25rem",
15
+ "input-gap": "0.3rem",
16
+ };
@@ -0,0 +1,3 @@
1
+ import { DesignTokens } from "./theme.types";
2
+ export declare const DARK_THEME: DesignTokens;
3
+ //# sourceMappingURL=dark.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"dark.d.ts","sourceRoot":"","sources":["../../../../src/styles/dark.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,UAAU,EAAE,YA0IxB,CAAC"}
@@ -0,0 +1,140 @@
1
+ import { rounded, spacing } from "./common";
2
+ export var DARK_THEME = {
3
+ name: "dark",
4
+ rounded: rounded,
5
+ spacing: spacing,
6
+ shadow: {
7
+ floating: "rgba(15, 15, 15, 0.1) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 5px 12px",
8
+ },
9
+ colors: {
10
+ foreground: "hsla(210, 50%, 98%)",
11
+ background: "hsla(0, 0%, 9%)",
12
+ disabled: "hsla(240, 4%, 33%)",
13
+ primary: {
14
+ foreground: "hsla(210, 40%, 98%)",
15
+ DEFAULT: "hsla(200,98%,39%)",
16
+ subtle: "hsla(199, 95%, 87%)",
17
+ hover: "hsla(199, 97%, 40%)",
18
+ },
19
+ secondary: {
20
+ DEFAULT: "hsla(210, 32%, 70%)",
21
+ background: "hsla(210, 30%, 81%)",
22
+ subtle: "hsla(210, 27%, 88%)",
23
+ hover: "hsla(210, 10%, 58%)",
24
+ foreground: "hsla(210, 20%, 30%)",
25
+ },
26
+ info: {
27
+ DEFAULT: "hsla(219, 91%, 59%)",
28
+ subtle: "hsla(219, 93%, 77%)",
29
+ hover: "hsla(219, 83%, 41%)",
30
+ foreground: "hsla(210, 40%, 98%)",
31
+ notification: "hsla(219, 91%, 59%)",
32
+ },
33
+ warn: {
34
+ DEFAULT: "hsla(27, 96%, 61%)",
35
+ subtle: "hsla(45, 95%, 66%)",
36
+ hover: "hsla(21, 90%, 48%)",
37
+ foreground: "hsla(210, 40%, 98%)",
38
+ notification: "hsla(32, 65%, 75%)",
39
+ },
40
+ danger: {
41
+ DEFAULT: "hsla(358, 65%, 57%)",
42
+ subtle: "hsla(0, 94%, 81%)",
43
+ hover: "hsla(0, 82%, 47%)",
44
+ foreground: "hsla(210, 40%, 98%)",
45
+ notification: "hsla(358, 40%, 23%)",
46
+ },
47
+ success: {
48
+ DEFAULT: "hsla(160, 73%, 36%)",
49
+ subtle: "hsla(160, 75%, 75%)",
50
+ hover: "hsla(160, 91%, 27%)",
51
+ foreground: "hsla(160, 91%, 50%)",
52
+ notification: "hsla(161,62%,17%)",
53
+ },
54
+ input: {
55
+ border: "hsla(240, 4%, 25%)",
56
+ placeholder: "hsla(210, 24%, 71%)",
57
+ "mask-error": "hsla(0, 94%, 81%)",
58
+ "switch-bg": "hsla(0, 0%, 9%)",
59
+ switch: "hsla(0, 0%, 100%)",
60
+ },
61
+ card: {
62
+ background: "hsla(0, 0%, 15%)",
63
+ border: "hsla(240, 7%, 27%)",
64
+ },
65
+ floating: {
66
+ background: "hsla(0, 0%, 14%)",
67
+ border: "hsla(240, 7%, 27%)",
68
+ overlay: "hsla(0, 0%, 0%)",
69
+ },
70
+ tooltip: {
71
+ foreground: "hsla(210, 40%, 98%)",
72
+ background: "hsla(0, 0%, 8%)",
73
+ border: "hsla(0, 0%, 19%)",
74
+ },
75
+ table: {
76
+ background: "hsla(0, 0%, 15%)",
77
+ border: "hsla(240, 4%, 33%)",
78
+ },
79
+ button: {
80
+ primary: {
81
+ text: "hsla(200,98%,60%)",
82
+ bg: "hsla(200,28%,19%)",
83
+ },
84
+ warn: {
85
+ text: "hsla(26,100%,67%)",
86
+ bg: "hsla(37,100%,15%)",
87
+ },
88
+ info: {
89
+ text: "hsla(200,80%,70%)",
90
+ bg: "hsla(206,66%,24%)",
91
+ },
92
+ success: {
93
+ text: "hsla(151,65%,54%)",
94
+ bg: "hsla(154,52%,19%)",
95
+ },
96
+ danger: {
97
+ text: "hsla(2,100%,90%)",
98
+ bg: "hsla(5,62%,23%)",
99
+ },
100
+ neutral: {
101
+ text: "hsla(200,98%,60%)",
102
+ bg: "hsla(200,28%,19%)",
103
+ },
104
+ secondary: {
105
+ text: "hsla(216,10%,90%)",
106
+ bg: "hsla(214,7%,19%)",
107
+ },
108
+ },
109
+ tag: {
110
+ primary: {
111
+ text: "hsla(200,98%,60%)",
112
+ bg: "hsla(200,28%,19%)",
113
+ },
114
+ warn: {
115
+ text: "hsla(26,100%,67%)",
116
+ bg: "hsla(37,100%,15%)",
117
+ },
118
+ info: {
119
+ text: "hsla(200,80%,70%)",
120
+ bg: "hsla(206,66%,24%)",
121
+ },
122
+ success: {
123
+ text: "hsla(151,65%,54%)",
124
+ bg: "hsla(154,52%,19%)",
125
+ },
126
+ danger: {
127
+ text: "hsla(2,100%,79%)",
128
+ bg: "hsla(5,62%,23%)",
129
+ },
130
+ neutral: {
131
+ text: "hsla(200,98%,60%)",
132
+ bg: "hsla(200,28%,19%)",
133
+ },
134
+ secondary: {
135
+ text: "hsla(216,10%,90%)",
136
+ bg: "hsla(214,7%,19%)",
137
+ },
138
+ },
139
+ },
140
+ };
@@ -0,0 +1,3 @@
1
+ import { DesignTokens } from "./theme.types";
2
+ export declare const LIGHT_THEME: DesignTokens;
3
+ //# sourceMappingURL=light.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"light.d.ts","sourceRoot":"","sources":["../../../../src/styles/light.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAE7C,eAAO,MAAM,WAAW,EAAE,YA0IzB,CAAC"}
@@ -0,0 +1,140 @@
1
+ import { rounded, spacing } from "./common";
2
+ export var LIGHT_THEME = {
3
+ name: "light",
4
+ rounded: rounded,
5
+ spacing: spacing,
6
+ shadow: {
7
+ floating: "rgba(50, 50, 50, 0.1) 0px 0px 0px 1px, rgba(50, 50, 50, 0.1) 0px 3px 6px, rgba(50, 50, 50, 0.1) 0px 2px 3px",
8
+ },
9
+ colors: {
10
+ foreground: "hsla(217, 15%, 30%)",
11
+ background: "hsla(210, 34%, 96%)",
12
+ disabled: "hsla(240, 10%, 78%)",
13
+ primary: {
14
+ foreground: "hsla(210, 40%, 98%)",
15
+ DEFAULT: "hsla(199, 89%, 54%)",
16
+ subtle: "hsla(199, 95%, 87%)",
17
+ hover: "hsla(199, 97%, 40%)",
18
+ },
19
+ secondary: {
20
+ background: "hsla(210, 25%, 35%)",
21
+ DEFAULT: "hsla(210, 25%, 35%)",
22
+ subtle: "hsla(207, 29%, 39%)",
23
+ hover: "hsla(210, 21%, 67%)",
24
+ foreground: "hsla(210, 40%, 98%)",
25
+ },
26
+ info: {
27
+ DEFAULT: "hsla(219, 91%, 59%)",
28
+ subtle: "hsla(219, 70%, 90%)",
29
+ hover: "hsla(219, 83%, 41%)",
30
+ foreground: "hsla(210, 34%, 96%)",
31
+ notification: "hsla(219, 91%, 59%)",
32
+ },
33
+ danger: {
34
+ DEFAULT: "hsla(0, 82%, 63%)",
35
+ subtle: "hsla(0, 96%, 95%)",
36
+ hover: "hsla(0, 82%, 47%)",
37
+ foreground: "hsla(210, 34%, 96%)",
38
+ notification: "hsla(0, 100%, 87%)",
39
+ },
40
+ warn: {
41
+ DEFAULT: "hsla(27, 100%, 70%)",
42
+ subtle: "hsla(45, 95%, 80%)",
43
+ hover: "hsla(29, 85%, 50%)",
44
+ foreground: "hsla(210, 34%, 96%)",
45
+ notification: "hsla(27, 85%, 92%)",
46
+ },
47
+ success: {
48
+ DEFAULT: "hsla(160, 73%, 36%)",
49
+ subtle: "hsla(160, 75%, 90%)",
50
+ hover: "hsla(160, 91%, 27%)",
51
+ foreground: "hsla(160, 91%, 17%)",
52
+ notification: "hsla(160, 75%, 80%)",
53
+ },
54
+ input: {
55
+ border: "hsla(218, 22%, 85%)",
56
+ placeholder: "hsla(210, 24%, 71%)",
57
+ "mask-error": "hsla(0, 94%, 81%)",
58
+ "switch-bg": "hsla(0, 0%, 45%)",
59
+ switch: "hsla(0, 0%, 100%)",
60
+ },
61
+ card: {
62
+ background: "hsla(0, 0%, 100%)",
63
+ border: "hsla(210, 25%, 88%)",
64
+ },
65
+ floating: {
66
+ background: "hsla(0, 0%, 100%)",
67
+ border: "hsla(210, 25%, 88%)",
68
+ overlay: "hsla(0, 0%, 0%)",
69
+ },
70
+ tooltip: {
71
+ foreground: "hsla(217, 15%, 20%)",
72
+ background: "hsla(210, 25%, 98%)",
73
+ border: "hsla(200, 1%, 80%)",
74
+ },
75
+ table: {
76
+ background: "hsla(0, 0%, 100%)",
77
+ border: "hsla(210, 25%, 88%)",
78
+ },
79
+ button: {
80
+ primary: {
81
+ text: "hsla(0, 0%, 100%)",
82
+ bg: "hsla(207,96%,48%)",
83
+ },
84
+ warn: {
85
+ bg: "hsla(26,90%,60%)",
86
+ text: "hsla(0, 0%, 100%)",
87
+ },
88
+ info: {
89
+ text: "hsla(0, 0%, 100%)",
90
+ bg: "hsla(210,60%,60%)",
91
+ },
92
+ success: {
93
+ text: "hsla(0, 0%, 100%)",
94
+ bg: "hsla(152,56%,39%)",
95
+ },
96
+ danger: {
97
+ text: "hsla(0, 0%, 100%)",
98
+ bg: "hsla(10,78%,54%)",
99
+ },
100
+ neutral: {
101
+ text: "hsla(200,98%,60%)",
102
+ bg: "hsla(200,28%,19%)",
103
+ },
104
+ secondary: {
105
+ text: "hsla(216,10%,90%)",
106
+ bg: "hsla(214,7%,19%)",
107
+ },
108
+ },
109
+ tag: {
110
+ primary: {
111
+ text: "hsla(0, 0%, 100%)",
112
+ bg: "hsla(207,70%,55%)",
113
+ },
114
+ warn: {
115
+ bg: "hsla(30,100%,82%)",
116
+ text: "hsla(23,100%,40%)",
117
+ },
118
+ info: {
119
+ text: "hsla(196,100%,20%)",
120
+ bg: "hsla(197,65%,80%)",
121
+ },
122
+ success: {
123
+ text: "hsla(154,52%,19%)",
124
+ bg: "hsla(152,56%,80%)",
125
+ },
126
+ danger: {
127
+ text: "hsla(10,82%,45%)",
128
+ bg: "hsla(359,94%,92%)",
129
+ },
130
+ neutral: {
131
+ text: "hsla(200,98%,60%)",
132
+ bg: "hsla(200,28%,19%)",
133
+ },
134
+ secondary: {
135
+ text: "hsla(216,10%,90%)",
136
+ bg: "hsla(214,7%,19%)",
137
+ },
138
+ },
139
+ },
140
+ };
@@ -1,4 +1,3 @@
1
- import { DesignTokens } from "./theme.types";
2
- export declare const defaultDarkTheme: DesignTokens;
3
- export declare const defaultLightTheme: DesignTokens;
1
+ export declare const defaultDarkTheme: import("./theme.types").DesignTokens;
2
+ export declare const defaultLightTheme: import("./theme.types").DesignTokens;
4
3
  //# sourceMappingURL=theme.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAoB7C,eAAO,MAAM,gBAAgB,EAAE,YA0I9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,YA0I/B,CAAC"}
1
+ {"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../../src/styles/theme.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,gBAAgB,sCAAa,CAAC;AAE3C,eAAO,MAAM,iBAAiB,sCAAc,CAAC"}
@@ -1,294 +1,4 @@
1
- var rounded = {
2
- button: "0.4rem",
3
- pill: "2rem",
4
- card: "0.75rem",
5
- full: "9999px",
6
- };
7
- var spacing = {
8
- base: "1rem",
9
- lg: "1.5rem",
10
- sm: "0.75rem",
11
- "input-height": "2.5rem",
12
- "input-x": "0.5rem",
13
- "input-y": "0.25rem",
14
- "input-inline": "0.25rem",
15
- "input-gap": "0.375rem",
16
- };
17
- export var defaultDarkTheme = {
18
- name: "dark",
19
- rounded: rounded,
20
- spacing: spacing,
21
- shadow: {
22
- floating: "rgba(15, 15, 15, 0.1) 0px 0px 0px 1px, rgba(15, 15, 15, 0.1) 0px 3px 6px, rgba(15, 15, 15, 0.2) 0px 5px 12px",
23
- },
24
- colors: {
25
- foreground: "hsla(210, 50%, 98%)",
26
- background: "hsla(0, 0%, 9%)",
27
- disabled: "hsla(240, 4%, 33%)",
28
- primary: {
29
- foreground: "hsla(210, 40%, 98%)",
30
- DEFAULT: "hsla(200,98%,39%)",
31
- subtle: "hsla(199, 95%, 87%)",
32
- hover: "hsla(199, 97%, 40%)",
33
- },
34
- secondary: {
35
- DEFAULT: "hsla(210, 32%, 70%)",
36
- background: "hsla(210, 30%, 81%)",
37
- subtle: "hsla(210, 27%, 88%)",
38
- hover: "hsla(210, 10%, 58%)",
39
- foreground: "hsla(210, 20%, 30%)",
40
- },
41
- info: {
42
- DEFAULT: "hsla(219, 91%, 59%)",
43
- subtle: "hsla(219, 93%, 77%)",
44
- hover: "hsla(219, 83%, 41%)",
45
- foreground: "hsla(210, 40%, 98%)",
46
- notification: "hsla(219, 91%, 59%)",
47
- },
48
- warn: {
49
- DEFAULT: "hsla(27, 96%, 61%)",
50
- subtle: "hsla(45, 95%, 66%)",
51
- hover: "hsla(21, 90%, 48%)",
52
- foreground: "hsla(210, 40%, 98%)",
53
- notification: "hsla(32, 65%, 75%)",
54
- },
55
- danger: {
56
- DEFAULT: "hsla(358, 65%, 57%)",
57
- subtle: "hsla(0, 94%, 81%)",
58
- hover: "hsla(0, 82%, 47%)",
59
- foreground: "hsla(210, 40%, 98%)",
60
- notification: "hsla(358, 40%, 23%)",
61
- },
62
- success: {
63
- DEFAULT: "hsla(160, 73%, 36%)",
64
- subtle: "hsla(160, 75%, 75%)",
65
- hover: "hsla(160, 91%, 27%)",
66
- foreground: "hsla(160, 91%, 50%)",
67
- notification: "hsla(161,62%,17%)",
68
- },
69
- input: {
70
- border: "hsla(240, 4%, 25%)",
71
- placeholder: "hsla(210, 24%, 71%)",
72
- "mask-error": "hsla(0, 94%, 81%)",
73
- "switch-bg": "hsla(0, 0%, 9%)",
74
- switch: "hsla(0, 0%, 100%)",
75
- },
76
- card: {
77
- background: "hsla(0, 0%, 15%)",
78
- border: "hsla(240, 7%, 27%)",
79
- },
80
- floating: {
81
- background: "hsla(0, 0%, 14%)",
82
- border: "hsla(240, 7%, 27%)",
83
- overlay: "hsla(0, 0%, 0%)",
84
- },
85
- tooltip: {
86
- foreground: "hsla(210, 40%, 98%)",
87
- background: "hsla(0, 0%, 8%)",
88
- border: "hsla(0, 0%, 19%)",
89
- },
90
- table: {
91
- background: "hsla(0, 0%, 15%)",
92
- border: "hsla(240, 4%, 33%)",
93
- },
94
- button: {
95
- primary: {
96
- text: "hsla(200,98%,60%)",
97
- bg: "hsla(200,28%,19%)",
98
- },
99
- warn: {
100
- text: "hsla(26,100%,67%)",
101
- bg: "hsla(37,100%,15%)",
102
- },
103
- info: {
104
- text: "hsla(200,80%,70%)",
105
- bg: "hsla(206,66%,24%)",
106
- },
107
- success: {
108
- text: "hsla(151,65%,54%)",
109
- bg: "hsla(154,52%,19%)",
110
- },
111
- danger: {
112
- text: "hsla(2,100%,90%)",
113
- bg: "hsla(5,62%,23%)",
114
- },
115
- neutral: {
116
- text: "hsla(200,98%,60%)",
117
- bg: "hsla(200,28%,19%)",
118
- },
119
- secondary: {
120
- text: "hsla(216,10%,90%)",
121
- bg: "hsla(214,7%,19%)",
122
- },
123
- },
124
- tag: {
125
- primary: {
126
- text: "hsla(200,98%,60%)",
127
- bg: "hsla(200,28%,19%)",
128
- },
129
- warn: {
130
- text: "hsla(26,100%,67%)",
131
- bg: "hsla(37,100%,15%)",
132
- },
133
- info: {
134
- text: "hsla(200,80%,70%)",
135
- bg: "hsla(206,66%,24%)",
136
- },
137
- success: {
138
- text: "hsla(151,65%,54%)",
139
- bg: "hsla(154,52%,19%)",
140
- },
141
- danger: {
142
- text: "hsla(2,100%,79%)",
143
- bg: "hsla(5,62%,23%)",
144
- },
145
- neutral: {
146
- text: "hsla(200,98%,60%)",
147
- bg: "hsla(200,28%,19%)",
148
- },
149
- secondary: {
150
- text: "hsla(216,10%,90%)",
151
- bg: "hsla(214,7%,19%)",
152
- },
153
- },
154
- },
155
- };
156
- export var defaultLightTheme = {
157
- name: "light",
158
- rounded: rounded,
159
- spacing: spacing,
160
- shadow: {
161
- floating: "rgba(50, 50, 50, 0.1) 0px 0px 0px 1px, rgba(50, 50, 50, 0.1) 0px 3px 6px, rgba(50, 50, 50, 0.1) 0px 2px 3px",
162
- },
163
- colors: {
164
- foreground: "hsla(217, 15%, 30%)",
165
- background: "hsla(210, 34%, 96%)",
166
- disabled: "hsla(240, 10%, 78%)",
167
- primary: {
168
- foreground: "hsla(210, 40%, 98%)",
169
- DEFAULT: "hsla(199, 89%, 54%)",
170
- subtle: "hsla(199, 95%, 87%)",
171
- hover: "hsla(199, 97%, 40%)",
172
- },
173
- secondary: {
174
- background: "hsla(210, 25%, 35%)",
175
- DEFAULT: "hsla(210, 25%, 35%)",
176
- subtle: "hsla(207, 29%, 39%)",
177
- hover: "hsla(210, 21%, 67%)",
178
- foreground: "hsla(210, 40%, 98%)",
179
- },
180
- info: {
181
- DEFAULT: "hsla(219, 91%, 59%)",
182
- subtle: "hsla(219, 70%, 90%)",
183
- hover: "hsla(219, 83%, 41%)",
184
- foreground: "hsla(210, 34%, 96%)",
185
- notification: "hsla(219, 91%, 59%)",
186
- },
187
- danger: {
188
- DEFAULT: "hsla(0, 82%, 63%)",
189
- subtle: "hsla(0, 96%, 95%)",
190
- hover: "hsla(0, 82%, 47%)",
191
- foreground: "hsla(210, 34%, 96%)",
192
- notification: "hsla(0, 100%, 87%)",
193
- },
194
- warn: {
195
- DEFAULT: "hsla(27, 100%, 70%)",
196
- subtle: "hsla(45, 95%, 80%)",
197
- hover: "hsla(29, 85%, 50%)",
198
- foreground: "hsla(210, 34%, 96%)",
199
- notification: "hsla(27, 85%, 92%)",
200
- },
201
- success: {
202
- DEFAULT: "hsla(160, 73%, 36%)",
203
- subtle: "hsla(160, 75%, 90%)",
204
- hover: "hsla(160, 91%, 27%)",
205
- foreground: "hsla(160, 91%, 17%)",
206
- notification: "hsla(160, 75%, 80%)",
207
- },
208
- input: {
209
- border: "hsla(218, 22%, 85%)",
210
- placeholder: "hsla(210, 24%, 71%)",
211
- "mask-error": "hsla(0, 94%, 81%)",
212
- "switch-bg": "hsla(0, 0%, 45%)",
213
- switch: "hsla(0, 0%, 100%)",
214
- },
215
- card: {
216
- background: "hsla(0, 0%, 100%)",
217
- border: "hsla(210, 25%, 88%)",
218
- },
219
- floating: {
220
- background: "hsla(0, 0%, 100%)",
221
- border: "hsla(210, 25%, 88%)",
222
- overlay: "hsla(0, 0%, 0%)",
223
- },
224
- tooltip: {
225
- foreground: "hsla(217, 15%, 20%)",
226
- background: "hsla(210, 25%, 98%)",
227
- border: "hsla(200, 1%, 80%)",
228
- },
229
- table: {
230
- background: "hsla(0, 0%, 100%)",
231
- border: "hsla(210, 25%, 88%)",
232
- },
233
- button: {
234
- primary: {
235
- text: "hsla(0, 0%, 100%)",
236
- bg: "hsla(207,96%,48%)",
237
- },
238
- warn: {
239
- bg: "hsla(26,90%,60%)",
240
- text: "hsla(0, 0%, 100%)",
241
- },
242
- info: {
243
- text: "hsla(0, 0%, 100%)",
244
- bg: "hsla(210,60%,60%)",
245
- },
246
- success: {
247
- text: "hsla(0, 0%, 100%)",
248
- bg: "hsla(152,56%,39%)",
249
- },
250
- danger: {
251
- text: "hsla(0, 0%, 100%)",
252
- bg: "hsla(10,78%,54%)",
253
- },
254
- neutral: {
255
- text: "hsla(200,98%,60%)",
256
- bg: "hsla(200,28%,19%)",
257
- },
258
- secondary: {
259
- text: "hsla(216,10%,90%)",
260
- bg: "hsla(214,7%,19%)",
261
- },
262
- },
263
- tag: {
264
- primary: {
265
- text: "hsla(0, 0%, 100%)",
266
- bg: "hsla(207,70%,55%)",
267
- },
268
- warn: {
269
- bg: "hsla(30,100%,82%)",
270
- text: "hsla(23,100%,40%)",
271
- },
272
- info: {
273
- text: "hsla(196,100%,20%)",
274
- bg: "hsla(197,65%,80%)",
275
- },
276
- success: {
277
- text: "hsla(154,52%,19%)",
278
- bg: "hsla(152,56%,80%)",
279
- },
280
- danger: {
281
- text: "hsla(10,82%,45%)",
282
- bg: "hsla(359,94%,92%)",
283
- },
284
- neutral: {
285
- text: "hsla(200,98%,60%)",
286
- bg: "hsla(200,28%,19%)",
287
- },
288
- secondary: {
289
- text: "hsla(216,10%,90%)",
290
- bg: "hsla(214,7%,19%)",
291
- },
292
- },
293
- },
294
- };
1
+ import { DARK_THEME } from "./dark";
2
+ import { LIGHT_THEME } from "./light";
3
+ export var defaultDarkTheme = DARK_THEME;
4
+ export var defaultLightTheme = LIGHT_THEME;
@@ -1,9 +1,6 @@
1
1
  import { Config } from "tailwindcss";
2
2
  import { createDesignTokens, parsers } from "./src/styles/design-tokens";
3
3
  import { defaultDarkTheme } from "./src/styles/theme";
4
- export declare const css: (template: {
5
- raw: readonly string[] | ArrayLike<string>;
6
- }, ...substitutions: any[]) => string;
7
4
  declare const config: Partial<Config>;
8
5
  export { createDesignTokens, parsers, defaultDarkTheme };
9
6
  export default config;