@macroui/macroui 4.0.3 → 4.0.5

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.
@@ -0,0 +1,104 @@
1
+ const Tokenizer = require("css-selector-tokenizer")
2
+
3
+ function itMatchesOne(arr, term) {
4
+ return arr.some((i) => term.search(i) >= 0)
5
+ }
6
+
7
+ function parseAttrSelector(node) {
8
+ const { content } = node
9
+ const regex =
10
+ /(^class|^id)([*^?~|$=]*)+(?:("\s*)([^"\\]*?(?:\\.[^"\\]*)*?)(\s*")|('\s*)([^'\\]*?(?:\\.[^'\\]*)*?)(\s*'))/i
11
+
12
+ const [type, operator, head, classes, foot] = content.split(regex).filter((part) => part)
13
+
14
+ return {
15
+ type,
16
+ operator,
17
+ head,
18
+ classes: classes ? classes.split(" ").map((c) => c.replace(/"|'/g, "")) : [],
19
+ foot,
20
+ }
21
+ }
22
+
23
+ function attrStringify({ type, operator, head, classes, foot }) {
24
+ return `${type}${operator || ""}${head || ""}${classes.join(" ")}${foot || ""}`
25
+ }
26
+
27
+ function prefixNode(node, prefix) {
28
+ if (["class", "id"].includes(node.type)) {
29
+ return {
30
+ ...node,
31
+ name: `${prefix}${node.name}`,
32
+ }
33
+ }
34
+
35
+ if (["attribute"].includes(node.type) && node.content) {
36
+ const { type, operator, head, classes, foot } = parseAttrSelector(node)
37
+
38
+ if (!["class", "id"].includes(type)) return node
39
+
40
+ return {
41
+ ...node,
42
+ content: attrStringify({
43
+ type,
44
+ operator,
45
+ head,
46
+ classes: classes.map((cls) => `${prefix}${cls}`),
47
+ foot,
48
+ }),
49
+ }
50
+ }
51
+
52
+ return node
53
+ }
54
+
55
+ function iterateSelectorNodes(selector, options) {
56
+ const { prefix, ignore } = options
57
+ return {
58
+ ...selector,
59
+ nodes: selector.nodes.map((node) => {
60
+ if (["selector", "nested-pseudo-class"].includes(node.type)) {
61
+ return iterateSelectorNodes(node, options)
62
+ }
63
+
64
+ if (itMatchesOne(ignore, Tokenizer.stringify(node))) return node
65
+
66
+ return prefixNode(node, prefix)
67
+ }),
68
+ }
69
+ }
70
+
71
+ /**
72
+ * @type {import('postcss').PluginCreator}
73
+ */
74
+ module.exports = (opts = {}) => {
75
+ const { prefix, ignore } = {
76
+ prefix: "",
77
+ ignore: [],
78
+ ...opts,
79
+ }
80
+
81
+ if (typeof prefix !== "string") {
82
+ throw new Error("prefix option should be of type string.")
83
+ }
84
+
85
+ if (!Array.isArray(ignore)) {
86
+ throw new Error("ignore options should be an Array.")
87
+ }
88
+
89
+ if (!prefix.length) return
90
+
91
+ return {
92
+ postcssPlugin: "addprefix",
93
+ Root(root, postcss) {
94
+ root.walkRules((rule) => {
95
+ const parsed = Tokenizer.parse(rule.selector)
96
+ const selector = iterateSelectorNodes(parsed, { prefix, ignore })
97
+
98
+ rule.selector = Tokenizer.stringify(selector)
99
+ })
100
+ },
101
+ }
102
+ }
103
+
104
+ module.exports.postcss = true
@@ -0,0 +1,19 @@
1
+ function createPlugin(plugin, config) {
2
+ return {
3
+ handler: plugin,
4
+ config,
5
+ }
6
+ }
7
+ createPlugin.withOptions = (pluginFunction, configFunction = () => ({})) => {
8
+ const optionsFunction = (options) => ({
9
+ __options: options,
10
+ handler: pluginFunction(options),
11
+ config: configFunction(options),
12
+ })
13
+ optionsFunction.__isOptionsFunction = true
14
+ optionsFunction.__pluginFunction = pluginFunction
15
+ optionsFunction.__configFunction = configFunction
16
+ return optionsFunction
17
+ }
18
+
19
+ module.exports = createPlugin
@@ -0,0 +1,45 @@
1
+ // regext for all daisyUI colors
2
+ // ((primary|secondary|accent|neutral)(-content|))|((info|success|warning|error)(-content|))|(base)(-100|-200|-300|-content)
3
+
4
+ // regex for all Tailwind CSS color utilities
5
+ // (bg|to|via|from|text|ring|fill|caret|stroke|border|divide|accent|shadow|outline|decoration|placeholder|ring-offset)
6
+
7
+ module.exports = [
8
+ {
9
+ pattern: /.*/,
10
+ },
11
+ {
12
+ // responsive utilities for daisyUI responsive modifiers
13
+ pattern: /.(sm|md|lg|xl)/,
14
+ variants: ["sm", "md", "lg", "xl"],
15
+ },
16
+ {
17
+ // responsive utilities for daisyUI components
18
+ pattern:
19
+ /(drawer-open|modal-(middle|top|bottom)|card-(side|compact|normal)|(stats|divider)-(horizontal|vertical)|dropdown-(end|top|bottom|left|right))/,
20
+ variants: ["sm", "md", "lg", "xl"],
21
+ },
22
+ {
23
+ // color utilities for daisyUI colors
24
+ pattern:
25
+ /(bg|to|via|from|text|fill|stroke|border|outline)-((primary|secondary|accent|neutral)(-content|))|((info|success|warning|error)(-content|))|(base)(-100|-200|-300|-content)/,
26
+ variants: [
27
+ // "first",
28
+ // "last",
29
+ // "odd",
30
+ // "even",
31
+ // "visited",
32
+ // "checked",
33
+ // "empty",
34
+ // "read-only",
35
+ // "group-hover",
36
+ // "group-focus",
37
+ // "focus-within",
38
+ "hover",
39
+ "focus",
40
+ // "focus-visible",
41
+ // "active",
42
+ // "disabled",
43
+ ],
44
+ },
45
+ ]
@@ -0,0 +1,7 @@
1
+ module.exports = {
2
+ borderRadius: {
3
+ badge: "var(--rounded-badge, 1.9rem)",
4
+ btn: "var(--rounded-btn, 0.5rem)",
5
+ box: "var(--rounded-box, 1rem)",
6
+ },
7
+ }
@@ -0,0 +1,30 @@
1
+ module.exports = {
2
+ "primary": "--p",
3
+ "primary-content": "--pc",
4
+
5
+ "secondary": "--s",
6
+ "secondary-content": "--sc",
7
+
8
+ "accent": "--a",
9
+ "accent-content": "--ac",
10
+
11
+ "neutral": "--n",
12
+ "neutral-content": "--nc",
13
+
14
+ "base-100": "--b1",
15
+ "base-200": "--b2",
16
+ "base-300": "--b3",
17
+ "base-content": "--bc",
18
+
19
+ "info": "--in",
20
+ "info-content": "--inc",
21
+
22
+ "success": "--su",
23
+ "success-content": "--suc",
24
+
25
+ "warning": "--wa",
26
+ "warning-content": "--wac",
27
+
28
+ "error": "--er",
29
+ "error-content": "--erc",
30
+ }
@@ -0,0 +1,262 @@
1
+ const pc = require("picocolors")
2
+ const colorNames = require("./colorNames")
3
+ const themeDefaults = require("./themeDefaults")
4
+
5
+ const { oklch, interpolate, wcagContrast } = require("culori/require")
6
+
7
+ const colorIsInvalid = (input) => {
8
+ console.error(
9
+ `├─ ${pc.red("⚠︎")} ${pc.bgRed(" Error ")} Invalid color ${pc.red(input)} in ${pc.green(
10
+ "tailwind.config.js"
11
+ )}`
12
+ )
13
+ }
14
+ const cutNumber = (number) => {
15
+ try {
16
+ if (number) {
17
+ return +number.toFixed(6)
18
+ }
19
+ return 0
20
+ } catch (e) {
21
+ // colorIsInvalid(number)
22
+ return false
23
+ }
24
+ }
25
+ module.exports = {
26
+ isDark: (color) => {
27
+ try {
28
+ if (wcagContrast(color, "black") < wcagContrast(color, "white")) {
29
+ return true
30
+ }
31
+ return false
32
+ } catch (e) {
33
+ // colorIsInvalid(color)
34
+ return false
35
+ }
36
+ },
37
+
38
+ colorObjToString: (input) => {
39
+ const { l, c, h } = input
40
+ return `${Number.parseFloat((cutNumber(l) * 100).toFixed(6))}% ${cutNumber(c)} ${cutNumber(h)}`
41
+ },
42
+
43
+ generateForegroundColorFrom: function (input, percentage = 0.8) {
44
+ try {
45
+ const result = interpolate(
46
+ [input, this.isDark(input) ? "white" : "black"],
47
+ "oklch"
48
+ )(percentage)
49
+ return this.colorObjToString(result)
50
+ } catch (e) {
51
+ // colorIsInvalid(input)
52
+ return false
53
+ }
54
+ },
55
+
56
+ generateDarkenColorFrom: function (input, percentage = 0.07) {
57
+ try {
58
+ const result = interpolate([input, "black"], "oklch")(percentage)
59
+ return this.colorObjToString(result)
60
+ } catch (e) {
61
+ // colorIsInvalid(input)
62
+ return false
63
+ }
64
+ },
65
+
66
+ convertColorFormat: function (input) {
67
+ if (typeof input !== "object" || input === null) {
68
+ return input
69
+ }
70
+
71
+ const resultObj = {}
72
+
73
+ for (const [rule, value] of Object.entries(input)) {
74
+ if (Object.hasOwn(colorNames, rule)) {
75
+ try {
76
+ const colorObj = oklch(value)
77
+ resultObj[colorNames[rule]] = this.colorObjToString(colorObj)
78
+ } catch (e) {
79
+ colorIsInvalid(value)
80
+ return false
81
+ }
82
+ } else {
83
+ resultObj[rule] = value
84
+ }
85
+
86
+ // auto generate base colors
87
+ if (!Object.hasOwn(input, "base-100")) {
88
+ resultObj["--b1"] = "100% 0 0"
89
+ }
90
+ if (!Object.hasOwn(input, "base-200")) {
91
+ resultObj["--b2"] = this.generateDarkenColorFrom(input["base-100"], 0.07)
92
+ }
93
+ if (!Object.hasOwn(input, "base-300")) {
94
+ if (Object.hasOwn(input, "base-200")) {
95
+ resultObj["--b3"] = this.generateDarkenColorFrom(input["base-200"], 0.07)
96
+ } else {
97
+ resultObj["--b3"] = this.generateDarkenColorFrom(input["base-100"], 0.14)
98
+ }
99
+ }
100
+
101
+ // auto generate state colors
102
+
103
+ if (!Object.hasOwn(input, "info")) {
104
+ resultObj["--in"] = "72.06% 0.191 231.6"
105
+ }
106
+ if (!Object.hasOwn(input, "success")) {
107
+ resultObj["--su"] = "64.8% 0.150 160"
108
+ }
109
+ if (!Object.hasOwn(input, "warning")) {
110
+ resultObj["--wa"] = "84.71% 0.199 83.87"
111
+ }
112
+ if (!Object.hasOwn(input, "error")) {
113
+ resultObj["--er"] = "71.76% 0.221 22.18"
114
+ }
115
+
116
+ // auto generate content colors
117
+ if (!Object.hasOwn(input, "base-content")) {
118
+ resultObj["--bc"] = this.generateForegroundColorFrom(input["base-100"], 0.8)
119
+ }
120
+ if (!Object.hasOwn(input, "primary-content")) {
121
+ resultObj["--pc"] = this.generateForegroundColorFrom(input.primary, 0.8)
122
+ }
123
+ if (!Object.hasOwn(input, "secondary-content")) {
124
+ resultObj["--sc"] = this.generateForegroundColorFrom(input.secondary, 0.8)
125
+ }
126
+ if (!Object.hasOwn(input, "accent-content")) {
127
+ resultObj["--ac"] = this.generateForegroundColorFrom(input.accent, 0.8)
128
+ }
129
+ if (!Object.hasOwn(input, "neutral-content")) {
130
+ resultObj["--nc"] = this.generateForegroundColorFrom(input.neutral, 0.8)
131
+ }
132
+ if (!Object.hasOwn(input, "info-content")) {
133
+ if (Object.hasOwn(input, "info")) {
134
+ resultObj["--inc"] = this.generateForegroundColorFrom(input.info, 0.8)
135
+ } else {
136
+ resultObj["--inc"] = "0% 0 0"
137
+ }
138
+ }
139
+ if (!Object.hasOwn(input, "success-content")) {
140
+ if (Object.hasOwn(input, "success")) {
141
+ resultObj["--suc"] = this.generateForegroundColorFrom(input.success, 0.8)
142
+ } else {
143
+ resultObj["--suc"] = "0% 0 0"
144
+ }
145
+ }
146
+ if (!Object.hasOwn(input, "warning-content")) {
147
+ if (Object.hasOwn(input, "warning")) {
148
+ resultObj["--wac"] = this.generateForegroundColorFrom(input.warning, 0.8)
149
+ } else {
150
+ resultObj["--wac"] = "0% 0 0"
151
+ }
152
+ }
153
+ if (!Object.hasOwn(input, "error-content")) {
154
+ if (Object.hasOwn(input, "error")) {
155
+ resultObj["--erc"] = this.generateForegroundColorFrom(input.error, 0.8)
156
+ } else {
157
+ resultObj["--erc"] = "0% 0 0"
158
+ }
159
+ }
160
+
161
+ // add css variables if not exist
162
+ for (const item of Object.entries(themeDefaults.variables)) {
163
+ const [variable, value] = item
164
+ if (!Object.hasOwn(input, variable)) {
165
+ resultObj[variable] = value
166
+ }
167
+ }
168
+
169
+ // add other custom styles
170
+ if (!Object.hasOwn(colorNames, rule)) {
171
+ resultObj[rule] = value
172
+ }
173
+ }
174
+
175
+ return resultObj
176
+ },
177
+
178
+ injectThemes: function (addBase, config, themes) {
179
+ const includedThemesObj = {}
180
+ // add default themes
181
+ const themeRoot = config("daisyui.themeRoot") ?? ":root"
182
+ for (const [theme, value] of Object.entries(themes)) {
183
+ includedThemesObj[theme] = this.convertColorFormat(value)
184
+ }
185
+
186
+ // add custom themes
187
+ if (Array.isArray(config("daisyui.themes"))) {
188
+ for (const item of config("daisyui.themes")) {
189
+ if (typeof item === "object" && item !== null) {
190
+ for (const [customThemeName, customThemevalue] of Object.entries(item)) {
191
+ includedThemesObj[customThemeName] = this.convertColorFormat(customThemevalue)
192
+ }
193
+ }
194
+ }
195
+ }
196
+
197
+ let themeOrder = []
198
+ if (Array.isArray(config("daisyui.themes"))) {
199
+ for (const theme of config("daisyui.themes")) {
200
+ if (typeof theme === "object" && theme !== null) {
201
+ for (const customThemeName of Object.keys(theme)) {
202
+ themeOrder.push(customThemeName)
203
+ }
204
+ } else if (Object.hasOwn(includedThemesObj, theme)) {
205
+ themeOrder.push(theme)
206
+ }
207
+ }
208
+ } else if (config("daisyui.themes") === true) {
209
+ themeOrder = themeDefaults.themeOrder
210
+ } else {
211
+ themeOrder = ["light", "dark"]
212
+ }
213
+
214
+ // inject themes in order
215
+ const themesToInject = {}
216
+ themeOrder.forEach((themeName, index) => {
217
+ if (index === 0) {
218
+ // first theme as root
219
+ themesToInject[themeRoot] = includedThemesObj[themeName]
220
+ } else if (index === 1) {
221
+ // auto dark
222
+ if (config("daisyui.darkTheme")) {
223
+ if (
224
+ themeOrder[0] !== config("daisyui.darkTheme") &&
225
+ themeOrder.includes(config("daisyui.darkTheme"))
226
+ ) {
227
+ themesToInject["@media (prefers-color-scheme: dark)"] = {
228
+ [themeRoot]: includedThemesObj[`${config("daisyui.darkTheme")}`],
229
+ }
230
+ }
231
+ } else if (config("daisyui.darkTheme") === false) {
232
+ // disables prefers-color-scheme: dark
233
+ } else {
234
+ if (themeOrder[0] !== "dark" && themeOrder.includes("dark")) {
235
+ themesToInject["@media (prefers-color-scheme: dark)"] = {
236
+ [themeRoot]: includedThemesObj.dark,
237
+ }
238
+ }
239
+ }
240
+ // theme 0 with name
241
+ themesToInject[`[data-theme=${themeOrder[0]}]`] = includedThemesObj[themeOrder[0]]
242
+ themesToInject[`${themeRoot}:has(input.theme-controller[value=${themeOrder[0]}]:checked)`] =
243
+ includedThemesObj[themeOrder[0]]
244
+ // theme 1 with name
245
+ themesToInject[`[data-theme=${themeOrder[1]}]`] = includedThemesObj[themeOrder[1]]
246
+ themesToInject[`${themeRoot}:has(input.theme-controller[value=${themeOrder[1]}]:checked)`] =
247
+ includedThemesObj[themeOrder[1]]
248
+ } else {
249
+ themesToInject[`[data-theme=${themeName}]`] = includedThemesObj[themeName]
250
+ themesToInject[`${themeRoot}:has(input.theme-controller[value=${themeName}]:checked)`] =
251
+ includedThemesObj[themeName]
252
+ }
253
+ })
254
+
255
+ addBase(themesToInject)
256
+
257
+ return {
258
+ includedThemesObj,
259
+ themeOrder,
260
+ }
261
+ },
262
+ }
@@ -0,0 +1,35 @@
1
+ const colorObject = {
2
+ "transparent": "transparent",
3
+ "current": "currentColor",
4
+
5
+ "primary": "var(--fallback-p,oklch(var(--p)/<alpha-value>))",
6
+ "primary-content": "var(--fallback-pc,oklch(var(--pc)/<alpha-value>))",
7
+
8
+ "secondary": "var(--fallback-s,oklch(var(--s)/<alpha-value>))",
9
+ "secondary-content": "var(--fallback-sc,oklch(var(--sc)/<alpha-value>))",
10
+
11
+ "accent": "var(--fallback-a,oklch(var(--a)/<alpha-value>))",
12
+ "accent-content": "var(--fallback-ac,oklch(var(--ac)/<alpha-value>))",
13
+
14
+ "neutral": "var(--fallback-n,oklch(var(--n)/<alpha-value>))",
15
+ "neutral-content": "var(--fallback-nc,oklch(var(--nc)/<alpha-value>))",
16
+
17
+ "base-100": "var(--fallback-b1,oklch(var(--b1)/<alpha-value>))",
18
+ "base-200": "var(--fallback-b2,oklch(var(--b2)/<alpha-value>))",
19
+ "base-300": "var(--fallback-b3,oklch(var(--b3)/<alpha-value>))",
20
+ "base-content": "var(--fallback-bc,oklch(var(--bc)/<alpha-value>))",
21
+
22
+ "info": "var(--fallback-in,oklch(var(--in)/<alpha-value>))",
23
+ "info-content": "var(--fallback-inc,oklch(var(--inc)/<alpha-value>))",
24
+
25
+ "success": "var(--fallback-su,oklch(var(--su)/<alpha-value>))",
26
+ "success-content": "var(--fallback-suc,oklch(var(--suc)/<alpha-value>))",
27
+
28
+ "warning": "var(--fallback-wa,oklch(var(--wa)/<alpha-value>))",
29
+ "warning-content": "var(--fallback-wac,oklch(var(--wac)/<alpha-value>))",
30
+
31
+ "error": "var(--fallback-er,oklch(var(--er)/<alpha-value>))",
32
+ "error-content": "var(--fallback-erc,oklch(var(--erc)/<alpha-value>))",
33
+ }
34
+
35
+ module.exports = colorObject
@@ -0,0 +1,47 @@
1
+ module.exports = {
2
+ themeOrder: [
3
+ "light",
4
+ "dark",
5
+ "cupcake",
6
+ "bumblebee",
7
+ "emerald",
8
+ "corporate",
9
+ "synthwave",
10
+ "retro",
11
+ "cyberpunk",
12
+ "valentine",
13
+ "halloween",
14
+ "garden",
15
+ "forest",
16
+ "aqua",
17
+ "lofi",
18
+ "pastel",
19
+ "fantasy",
20
+ "wireframe",
21
+ "black",
22
+ "luxury",
23
+ "dracula",
24
+ "cmyk",
25
+ "autumn",
26
+ "business",
27
+ "acid",
28
+ "lemonade",
29
+ "night",
30
+ "coffee",
31
+ "winter",
32
+ "dim",
33
+ "nord",
34
+ "sunset",
35
+ ],
36
+ variables: {
37
+ "--rounded-box": "1rem",
38
+ "--rounded-btn": "0.5rem",
39
+ "--rounded-badge": "1.9rem",
40
+ "--animation-btn": "0.25s",
41
+ "--animation-input": ".2s",
42
+ "--btn-focus-scale": "0.95",
43
+ "--border-btn": "1px",
44
+ "--tab-border": "1px",
45
+ "--tab-radius": "0.5rem",
46
+ },
47
+ }
@@ -0,0 +1,5 @@
1
+ import type { CustomTheme, Theme } from "../index"
2
+
3
+ declare const themes: Record<`${Theme}`, CustomTheme[string]>
4
+
5
+ export = themes
@@ -0,0 +1,485 @@
1
+ module.exports = {
2
+ aqua: {
3
+ "color-scheme": "dark",
4
+ "primary": "#09ecf3",
5
+ "primary-content": "#005355",
6
+ "secondary": "#966fb3",
7
+ "accent": "#ffe999",
8
+ "neutral": "#3b8ac4",
9
+ "base-100": "#345da7",
10
+ "info": "#2563eb",
11
+ "success": "#16a34a",
12
+ "warning": "#d97706",
13
+ "error": "oklch(73.95% 0.19 27.33)",
14
+ },
15
+ black: {
16
+ "color-scheme": "dark",
17
+ "primary": "#373737",
18
+ "secondary": "#373737",
19
+ "accent": "#373737",
20
+ "base-100": "#000000",
21
+ "base-200": "#141414",
22
+ "base-300": "#262626",
23
+ "base-content": "#d6d6d6",
24
+ "neutral": "#373737",
25
+ "info": "#0000ff",
26
+ "success": "#008000",
27
+ "warning": "#ffff00",
28
+ "error": "#ff0000",
29
+ "--rounded-box": "0",
30
+ "--rounded-btn": "0",
31
+ "--rounded-badge": "0",
32
+ "--animation-btn": "0",
33
+ "--animation-input": "0",
34
+ "--btn-focus-scale": "1",
35
+ "--tab-radius": "0",
36
+ },
37
+ bumblebee: {
38
+ "color-scheme": "light",
39
+ "primary": "oklch(89.51% 0.2132 96.61)",
40
+ "primary-content": "oklch(38.92% 0.046 96.61)",
41
+ "secondary": "oklch(80.39% 0.194 70.76)",
42
+ "secondary-content": "oklch(39.38% 0.068 70.76)",
43
+ "accent": "oklch(81.27% 0.157 56.52)",
44
+ "neutral": "oklch(12.75% 0.075 281.99)",
45
+ "base-100": "oklch(100% 0 0)",
46
+ },
47
+ cmyk: {
48
+ "color-scheme": "light",
49
+ "primary": "#45AEEE",
50
+ "secondary": "#E8488A",
51
+ "accent": "#FFF232",
52
+ "neutral": "#1a1a1a",
53
+ "base-100": "oklch(100% 0 0)",
54
+ "info": "#4AA8C0",
55
+ "success": "#823290",
56
+ "warning": "#EE8133",
57
+ "error": "#E93F33",
58
+ },
59
+ corporate: {
60
+ "color-scheme": "light",
61
+ "primary": "oklch(60.39% 0.228 269.1)",
62
+ "secondary": "#7b92b2",
63
+ "accent": "#67cba0",
64
+ "neutral": "#181a2a",
65
+ "neutral-content": "#edf2f7",
66
+ "base-100": "oklch(100% 0 0)",
67
+ "base-content": "#181a2a",
68
+ "--rounded-box": "0.25rem",
69
+ "--rounded-btn": ".125rem",
70
+ "--rounded-badge": ".125rem",
71
+ "--tab-radius": "0.25rem",
72
+ "--animation-btn": "0",
73
+ "--animation-input": "0",
74
+ "--btn-focus-scale": "1",
75
+ },
76
+ cupcake: {
77
+ "color-scheme": "light",
78
+ "primary": "#65c3c8",
79
+ "secondary": "#ef9fbc",
80
+ "accent": "#eeaf3a",
81
+ "neutral": "#291334",
82
+ "base-100": "#faf7f5",
83
+ "base-200": "#efeae6",
84
+ "base-300": "#e7e2df",
85
+ "base-content": "#291334",
86
+ "--rounded-btn": "1.9rem",
87
+ "--tab-border": "2px",
88
+ "--tab-radius": "0.7rem",
89
+ },
90
+ cyberpunk: {
91
+ "color-scheme": "light",
92
+ "fontFamily":
93
+ "ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace",
94
+ "primary": "oklch(74.22% 0.209 6.35)",
95
+ "secondary": "oklch(83.33% 0.184 204.72)",
96
+ "accent": "oklch(71.86% 0.2176 310.43)",
97
+ "neutral": "oklch(23.04% 0.065 269.31)",
98
+ "neutral-content": "oklch(94.51% 0.179 104.32)",
99
+ "base-100": "oklch(94.51% 0.179 104.32)",
100
+ "--rounded-box": "0",
101
+ "--rounded-btn": "0",
102
+ "--rounded-badge": "0",
103
+ "--tab-radius": "0",
104
+ },
105
+ dark: {
106
+ "color-scheme": "dark",
107
+ "primary": "oklch(65.69% 0.196 275.75)",
108
+ "secondary": "oklch(74.8% 0.26 342.55)",
109
+ "accent": "oklch(74.51% 0.167 183.61)",
110
+ "neutral": "#2a323c",
111
+ "neutral-content": "#A6ADBB",
112
+ "base-100": "#1d232a",
113
+ "base-200": "#191e24",
114
+ "base-300": "#15191e",
115
+ "base-content": "#A6ADBB",
116
+ },
117
+ dracula: {
118
+ "color-scheme": "dark",
119
+ "primary": "#ff79c6",
120
+ "secondary": "#bd93f9",
121
+ "accent": "#ffb86c",
122
+ "neutral": "#414558",
123
+ "base-100": "#282a36",
124
+ "base-content": "#f8f8f2",
125
+ "info": "#8be9fd",
126
+ "success": "#50fa7b",
127
+ "warning": "#f1fa8c",
128
+ "error": "#ff5555",
129
+ },
130
+ emerald: {
131
+ "color-scheme": "light",
132
+ "primary": "#66cc8a",
133
+ "primary-content": "#223D30",
134
+ "secondary": "#377cfb",
135
+ "secondary-content": "#fff",
136
+ "accent": "#f68067",
137
+ "accent-content": "#000",
138
+ "neutral": "#333c4d",
139
+ "neutral-content": "#f9fafb",
140
+ "base-100": "oklch(100% 0 0)",
141
+ "base-content": "#333c4d",
142
+ "--animation-btn": "0",
143
+ "--animation-input": "0",
144
+ "--btn-focus-scale": "1",
145
+ },
146
+ fantasy: {
147
+ "color-scheme": "light",
148
+ "primary": "oklch(37.45% 0.189 325.02)",
149
+ "secondary": "oklch(53.92% 0.162 241.36)",
150
+ "accent": "oklch(75.98% 0.204 56.72)",
151
+ "neutral": "#1f2937",
152
+ "base-100": "oklch(100% 0 0)",
153
+ "base-content": "#1f2937",
154
+ },
155
+ forest: {
156
+ "color-scheme": "dark",
157
+ "primary": "#1eb854",
158
+ "primary-content": "#000000",
159
+ "secondary": "#1DB88E",
160
+ "accent": "#1DB8AB",
161
+ "neutral": "#19362D",
162
+ "base-100": "#171212",
163
+ "--rounded-btn": "1.9rem",
164
+ },
165
+ garden: {
166
+ "color-scheme": "light",
167
+ "primary": "oklch(62.45% 0.278 3.8363600743192197)",
168
+ "primary-content": "#fff",
169
+ "secondary": "#8E4162",
170
+ "accent": "#5c7f67",
171
+ "neutral": "#291E00",
172
+ "neutral-content": "#e9e7e7",
173
+ "base-100": "#e9e7e7",
174
+ "base-content": "#100f0f",
175
+ },
176
+ halloween: {
177
+ "color-scheme": "dark",
178
+ "primary": "oklch(77.48% 0.204 60.62)",
179
+ "primary-content": "#131616",
180
+ "secondary": "oklch(45.98% 0.248 305.03)",
181
+ "accent": "oklch(64.8% 0.223 136.07347934356451)",
182
+ "accent-content": "#000000",
183
+ "neutral": "#2F1B05",
184
+ "base-100": "#212121",
185
+ "info": "#2563eb",
186
+ "success": "#16a34a",
187
+ "warning": "#d97706",
188
+ "error": "oklch(65.72% 0.199 27.33)",
189
+ },
190
+ light: {
191
+ "color-scheme": "light",
192
+ "primary": "oklch(49.12% 0.3096 275.75)",
193
+ "secondary": "oklch(69.71% 0.329 342.55)",
194
+ "secondary-content": "oklch(98.71% 0.0106 342.55)",
195
+ "accent": "oklch(76.76% 0.184 183.61)",
196
+ "neutral": "#2B3440",
197
+ "neutral-content": "#D7DDE4",
198
+ "base-100": "oklch(100% 0 0)",
199
+ "base-200": "#F2F2F2",
200
+ "base-300": "#E5E6E6",
201
+ "base-content": "#1f2937",
202
+ },
203
+ lofi: {
204
+ "color-scheme": "light",
205
+ "primary": "#0D0D0D",
206
+ "primary-content": "oklch(100% 0 0)",
207
+ "secondary": "#1A1919",
208
+ "secondary-content": "oklch(100% 0 0)",
209
+ "accent": "#262626",
210
+ "accent-content": "oklch(100% 0 0)",
211
+ "neutral": "#000000",
212
+ "neutral-content": "oklch(100% 0 0)",
213
+ "base-100": "oklch(100% 0 0)",
214
+ "base-200": "#F2F2F2",
215
+ "base-300": "#E6E5E5",
216
+ "base-content": "#000000",
217
+ "info": "oklch(79.54% 0.103 205.9)",
218
+ "success": "oklch(90.13% 0.153 164.14)",
219
+ "warning": "oklch(88.37% 0.135 79.94)",
220
+ "error": "oklch(78.66% 0.15 28.47)",
221
+ "--rounded-box": "0.25rem",
222
+ "--rounded-btn": "0.125rem",
223
+ "--rounded-badge": "0.125rem",
224
+ "--tab-radius": "0.125rem",
225
+ "--animation-btn": "0",
226
+ "--animation-input": "0",
227
+ "--btn-focus-scale": "1",
228
+ },
229
+ luxury: {
230
+ "color-scheme": "dark",
231
+ "primary": "oklch(100% 0 0)",
232
+ "secondary": "#152747",
233
+ "accent": "#513448",
234
+ "neutral": "#331800",
235
+ "neutral-content": "#FFE7A3",
236
+ "base-100": "#09090b",
237
+ "base-200": "#171618",
238
+ "base-300": "#2e2d2f",
239
+ "base-content": "#dca54c",
240
+ "info": "#66c6ff",
241
+ "success": "#87d039",
242
+ "warning": "#e2d562",
243
+ "error": "#ff6f6f",
244
+ },
245
+ pastel: {
246
+ "color-scheme": "light",
247
+ "primary": "#d1c1d7",
248
+ "secondary": "#f6cbd1",
249
+ "accent": "#b4e9d6",
250
+ "neutral": "#70acc7",
251
+ "base-100": "oklch(100% 0 0)",
252
+ "base-200": "#f9fafb",
253
+ "base-300": "#d1d5db",
254
+ "--rounded-btn": "1.9rem",
255
+ "--tab-radius": "0.7rem",
256
+ },
257
+ retro: {
258
+ "color-scheme": "light",
259
+ "primary": "#ef9995",
260
+ "primary-content": "#282425",
261
+ "secondary": "#a4cbb4",
262
+ "secondary-content": "#282425",
263
+ "accent": "#DC8850",
264
+ "accent-content": "#282425",
265
+ "neutral": "#2E282A",
266
+ "neutral-content": "#EDE6D4",
267
+ "base-100": "#ece3ca",
268
+ "base-200": "#e4d8b4",
269
+ "base-300": "#DBCA9A",
270
+ "base-content": "#282425",
271
+ "info": "#2563eb",
272
+ "success": "#16a34a",
273
+ "warning": "#d97706",
274
+ "error": "oklch(65.72% 0.199 27.33)",
275
+ "--rounded-box": "0.4rem",
276
+ "--rounded-btn": "0.4rem",
277
+ "--rounded-badge": "0.4rem",
278
+ "--tab-radius": "0.4rem",
279
+ },
280
+ synthwave: {
281
+ "color-scheme": "dark",
282
+ "primary": "#e779c1",
283
+ "secondary": "#58c7f3",
284
+ "accent": "oklch(88.04% 0.206 93.72)",
285
+ "neutral": "#221551",
286
+ "neutral-content": "#f9f7fd",
287
+ "base-100": "#1a103d",
288
+ "base-content": "#f9f7fd",
289
+ "info": "#53c0f3",
290
+ "info-content": "#201047",
291
+ "success": "#71ead2",
292
+ "success-content": "#201047",
293
+ "warning": "#eace6c",
294
+ "warning-content": "#201047",
295
+ "error": "#ec8c78",
296
+ "error-content": "#201047",
297
+ },
298
+ valentine: {
299
+ "color-scheme": "light",
300
+ "primary": "#e96d7b",
301
+ "secondary": "#a991f7",
302
+ "accent": "#66b1b3",
303
+ "neutral": "#af4670",
304
+ "neutral-content": "#f0d6e8",
305
+ "base-100": "#fae7f4",
306
+ "base-content": "#632c3b",
307
+ "info": "#2563eb",
308
+ "success": "#16a34a",
309
+ "warning": "#d97706",
310
+ "error": "oklch(73.07% 0.207 27.33)",
311
+ "--rounded-btn": "1.9rem",
312
+ "--tab-radius": "0.7rem",
313
+ },
314
+ wireframe: {
315
+ "color-scheme": "light",
316
+ "fontFamily": "Chalkboard,comic sans ms,'sans-serif'",
317
+ "primary": "#b8b8b8",
318
+ "secondary": "#b8b8b8",
319
+ "accent": "#b8b8b8",
320
+ "neutral": "#ebebeb",
321
+ "base-100": "oklch(100% 0 0)",
322
+ "base-200": "#eeeeee",
323
+ "base-300": "#dddddd",
324
+ "info": "#0000ff",
325
+ "success": "#008000",
326
+ "warning": "#a6a659",
327
+ "error": "#ff0000",
328
+ "--rounded-box": "0.2rem",
329
+ "--rounded-btn": "0.2rem",
330
+ "--rounded-badge": "0.2rem",
331
+ "--tab-radius": "0.2rem",
332
+ },
333
+ autumn: {
334
+ "color-scheme": "light",
335
+ "primary": "#8C0327",
336
+ "secondary": "#D85251",
337
+ "accent": "#D59B6A",
338
+ "neutral": "#826A5C",
339
+ "base-100": "#f1f1f1",
340
+ "info": "#42ADBB",
341
+ "success": "#499380",
342
+ "warning": "#E97F14",
343
+ "error": "oklch(53.07% 0.241 24.16)",
344
+ },
345
+ business: {
346
+ "color-scheme": "dark",
347
+ "primary": "#1C4E80",
348
+ "secondary": "#7C909A",
349
+ "accent": "#EA6947",
350
+ "neutral": "#23282E",
351
+ "base-100": "#202020",
352
+ "info": "#0091D5",
353
+ "success": "#6BB187",
354
+ "warning": "#DBAE59",
355
+ "error": "#AC3E31",
356
+ "--rounded-box": "0.25rem",
357
+ "--rounded-btn": ".125rem",
358
+ "--rounded-badge": ".125rem",
359
+ },
360
+ acid: {
361
+ "color-scheme": "light",
362
+ "primary": "oklch(71.9% 0.357 330.7595734057481)",
363
+ "secondary": "oklch(73.37% 0.224 48.25087840015526)",
364
+ "accent": "oklch(92.78% 0.264 122.96295065960891)",
365
+ "neutral": "oklch(21.31% 0.128 278.68)",
366
+ "base-100": "#fafafa",
367
+ "info": "oklch(60.72% 0.227 252.05)",
368
+ "success": "oklch(85.72% 0.266 158.53)",
369
+ "warning": "oklch(91.01% 0.212 100.5)",
370
+ "error": "oklch(64.84% 0.293 29.34918758658804)",
371
+ "--rounded-box": "1.25rem",
372
+ "--rounded-btn": "1rem",
373
+ "--rounded-badge": "1rem",
374
+ "--tab-radius": "0.7rem",
375
+ },
376
+ lemonade: {
377
+ "color-scheme": "light",
378
+ "primary": "oklch(58.92% 0.199 134.6)",
379
+ "secondary": "oklch(77.75% 0.196 111.09)",
380
+ "accent": "oklch(85.39% 0.201 100.73)",
381
+ "neutral": "oklch(30.98% 0.075 108.6)",
382
+ "base-100": "oklch(98.71% 0.02 123.72)",
383
+ "info": "oklch(86.19% 0.047 224.14)",
384
+ "success": "oklch(86.19% 0.047 157.85)",
385
+ "warning": "oklch(86.19% 0.047 102.15)",
386
+ "error": "oklch(86.19% 0.047 25.85)",
387
+ },
388
+ night: {
389
+ "color-scheme": "dark",
390
+ "primary": "#38bdf8",
391
+ "secondary": "#818CF8",
392
+ "accent": "#F471B5",
393
+ "neutral": "#1E293B",
394
+ "base-100": "#0F172A",
395
+ "info": "#0CA5E9",
396
+ "info-content": "#000000",
397
+ "success": "#2DD4BF",
398
+ "warning": "#F4BF50",
399
+ "error": "#FB7085",
400
+ },
401
+ coffee: {
402
+ "color-scheme": "dark",
403
+ "primary": "#DB924B",
404
+ "secondary": "#263E3F",
405
+ "accent": "#10576D",
406
+ "neutral": "#120C12",
407
+ "base-100": "#20161F",
408
+ "base-content": "#c59f60",
409
+ "info": "#8DCAC1",
410
+ "success": "#9DB787",
411
+ "warning": "#FFD25F",
412
+ "error": "#FC9581",
413
+ },
414
+ winter: {
415
+ "color-scheme": "light",
416
+ "primary": "oklch(56.86% 0.255 257.57)",
417
+ "secondary": "#463AA2",
418
+ "accent": "#C148AC",
419
+ "neutral": "#021431",
420
+ "base-100": "oklch(100% 0 0)",
421
+ "base-200": "#F2F7FF",
422
+ "base-300": "#E3E9F4",
423
+ "base-content": "#394E6A",
424
+ "info": "#93E7FB",
425
+ "success": "#81CFD1",
426
+ "warning": "#EFD7BB",
427
+ "error": "#E58B8B",
428
+ },
429
+ dim: {
430
+ "color-scheme": "dark",
431
+ "primary": "#9FE88D",
432
+ "secondary": "#FF7D5C",
433
+ "accent": "#C792E9",
434
+ "neutral": "#1c212b",
435
+ "neutral-content": "#B2CCD6",
436
+ "base-100": "#2A303C",
437
+ "base-200": "#242933",
438
+ "base-300": "#20252E",
439
+ "base-content": "#B2CCD6",
440
+ "info": "#28ebff",
441
+ "success": "#62efbd",
442
+ "warning": "#efd057",
443
+ "error": "#ffae9b",
444
+ },
445
+ nord: {
446
+ "color-scheme": "light",
447
+ "primary": "#5E81AC",
448
+ "secondary": "#81A1C1",
449
+ "accent": "#88C0D0",
450
+ "neutral": "#4C566A",
451
+ "neutral-content": "#D8DEE9",
452
+ "base-100": "#ECEFF4",
453
+ "base-200": "#E5E9F0",
454
+ "base-300": "#D8DEE9",
455
+ "base-content": "#2E3440",
456
+ "info": "#B48EAD",
457
+ "success": "#A3BE8C",
458
+ "warning": "#EBCB8B",
459
+ "error": "#BF616A",
460
+ "--rounded-box": "0.4rem",
461
+ "--rounded-btn": "0.2rem",
462
+ "--rounded-badge": "0.4rem",
463
+ "--tab-radius": "0.2rem",
464
+ },
465
+ sunset: {
466
+ "color-scheme": "dark",
467
+ "primary": "#FF865B",
468
+ "secondary": "#FD6F9C",
469
+ "accent": "#B387FA",
470
+ "neutral": "oklch(26% 0.019 237.69)",
471
+ "neutral-content": "oklch(70% 0.019 237.69)",
472
+ "base-100": "oklch(22% 0.019 237.69)",
473
+ "base-200": "oklch(20% 0.019 237.69)",
474
+ "base-300": "oklch(18% 0.019 237.69)",
475
+ "base-content": "#9fb9d0",
476
+ "info": "#89e0eb",
477
+ "success": "#addfad",
478
+ "warning": "#f1c891",
479
+ "error": "#ffbbbd",
480
+ "--rounded-box": "1.2rem",
481
+ "--rounded-btn": "0.8rem",
482
+ "--rounded-badge": "0.4rem",
483
+ "--tab-radius": "0.7rem",
484
+ },
485
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "@macroui/macroui",
4
- "version": "4.0.3",
4
+ "version": "4.0.5",
5
5
  "description": "Macroui - Tailwind CSS Component Library",
6
6
  "author": "Macroui <peng.deyou@gmail.com>",
7
7
  "license": "MIT",
@@ -13,6 +13,10 @@
13
13
  "bugs": {
14
14
  "url": "https://github.com/macroui/macroui/issues"
15
15
  },
16
+ "funding": {
17
+ "type": "individual",
18
+ "url": "https://github.com/sponsors/saadeghi"
19
+ },
16
20
  "keywords": [
17
21
  "macroui",
18
22
  "daisyui",