tailwind-preset-mantine 2.0.0 → 2.0.1

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.
package/README.md CHANGED
@@ -16,7 +16,7 @@ A Tailwind CSS (v4) preset for seamless integration with Mantine UI (v7) compone
16
16
  ## Installation
17
17
 
18
18
  ```bash
19
- npm install tailwind-preset-mantine@beta
19
+ npm install tailwind-preset-mantine
20
20
  ```
21
21
 
22
22
  ## Usage
package/package.json CHANGED
@@ -1,12 +1,15 @@
1
1
  {
2
2
  "name": "tailwind-preset-mantine",
3
- "version": "2.0.0",
3
+ "version": "2.0.1",
4
4
  "description": "Integrate Mantine with Tailwind CSS",
5
5
  "keywords": [
6
6
  "mantine",
7
7
  "tailwind",
8
8
  "preset"
9
9
  ],
10
+ "files": [
11
+ "src"
12
+ ],
10
13
  "homepage": "https://github.com/songkeys/tailwind-preset-mantine#readme",
11
14
  "bugs": {
12
15
  "url": "https://github.com/songkeys/tailwind-preset-mantine/issues"
package/src/generate.js CHANGED
@@ -37,35 +37,35 @@ ${isDefault ? '@custom-variant dark (&:where([data-mantine-color-scheme="dark"],
37
37
  --font-headings: var(--mantine-font-family-headings);
38
38
 
39
39
  /* colors - primary */
40
- --color-primary-50: rgb(from var(--mantine-primary-color-0) r g b / <alpha-value>);
41
- --color-primary-100: rgb(from var(--mantine-primary-color-1) r g b / <alpha-value>);
42
- --color-primary-200: rgb(from var(--mantine-primary-color-2) r g b / <alpha-value>);
43
- --color-primary-300: rgb(from var(--mantine-primary-color-3) r g b / <alpha-value>);
44
- --color-primary-400: rgb(from var(--mantine-primary-color-4) r g b / <alpha-value>);
45
- --color-primary-500: rgb(from var(--mantine-primary-color-5) r g b / <alpha-value>);
46
- --color-primary-600: rgb(from var(--mantine-primary-color-6) r g b / <alpha-value>);
47
- --color-primary-700: rgb(from var(--mantine-primary-color-7) r g b / <alpha-value>);
48
- --color-primary-800: rgb(from var(--mantine-primary-color-8) r g b / <alpha-value>);
49
- --color-primary-900: rgb(from var(--mantine-primary-color-9) r g b / <alpha-value>);
50
- --color-primary: rgb(from var(--mantine-primary-color-filled) r g b / <alpha-value>);
40
+ --color-primary-50: var(--mantine-primary-color-0);
41
+ --color-primary-100: var(--mantine-primary-color-1);
42
+ --color-primary-200: var(--mantine-primary-color-2);
43
+ --color-primary-300: var(--mantine-primary-color-3);
44
+ --color-primary-400: var(--mantine-primary-color-4);
45
+ --color-primary-500: var(--mantine-primary-color-5);
46
+ --color-primary-600: var(--mantine-primary-color-6);
47
+ --color-primary-700: var(--mantine-primary-color-7);
48
+ --color-primary-800: var(--mantine-primary-color-8);
49
+ --color-primary-900: var(--mantine-primary-color-9);
50
+ --color-primary: var(--mantine-primary-color-filled);
51
51
 
52
52
  /* colors - variant specific primary */
53
- --color-primary-filled: rgb(from var(--mantine-primary-color-filled) r g b / <alpha-value>);
53
+ --color-primary-filled: var(--mantine-primary-color-filled);
54
54
  --color-primary-filled-hover: var(--mantine-primary-color-filled-hover);
55
55
  --color-primary-light: var(--mantine-primary-color-light);
56
56
  --color-primary-light-hover: var(--mantine-primary-color-light-hover);
57
- --color-primary-light-color: rgb(from var(--mantine-primary-color-light-color) r g b / <alpha-value>);
58
- --color-primary-outline: rgb(from var(--mantine-primary-color-outline) r g b / <alpha-value>);
57
+ --color-primary-light-color: var(--mantine-primary-color-light-color);
58
+ --color-primary-outline: var(--mantine-primary-color-outline);
59
59
  --color-primary-outline-hover: var(--mantine-primary-color-outline-hover);
60
60
 
61
61
  /* colors - others */
62
- --color-white: rgb(from var(--mantine-color-white) r g b / <alpha-value>);
63
- --color-black: rgb(from var(--mantine-color-black) r g b / <alpha-value>);
64
- --color-body: rgb(from var(--mantine-color-text) r g b / <alpha-value>);
65
- --color-error: rgb(from var(--mantine-color-error) r g b / <alpha-value>);
66
- --color-placeholder: rgb(from var(--mantine-color-placeholder) r g b / <alpha-value>);
67
- --color-anchor: rgb(from var(--mantine-color-anchor) r g b / <alpha-value>);
68
- --color-default: rgb(from var(--mantine-color-default-color) r g b / <alpha-value>);
62
+ --color-white: var(--mantine-color-white);
63
+ --color-black: var(--mantine-color-black);
64
+ --color-body: var(--mantine-color-text);
65
+ --color-error: var(--mantine-color-error);
66
+ --color-placeholder: var(--mantine-color-placeholder);
67
+ --color-anchor: var(--mantine-color-anchor);
68
+ --color-default: var(--mantine-color-default-color);
69
69
 
70
70
  /* spacing */
71
71
  --spacing-xs: var(--mantine-spacing-xs);
@@ -146,17 +146,17 @@ ${isDefault ? '@custom-variant dark (&:where([data-mantine-color-scheme="dark"],
146
146
  ${Object.keys(theme.colors ?? {})
147
147
  .map((key) =>
148
148
  `
149
- --color-${key}-50: rgb(from var(--mantine-color-${key}-0) r g b / <alpha-value>);
150
- --color-${key}-100: rgb(from var(--mantine-color-${key}-1) r g b / <alpha-value>);
151
- --color-${key}-200: rgb(from var(--mantine-color-${key}-2) r g b / <alpha-value>);
152
- --color-${key}-300: rgb(from var(--mantine-color-${key}-3) r g b / <alpha-value>);
153
- --color-${key}-400: rgb(from var(--mantine-color-${key}-4) r g b / <alpha-value>);
154
- --color-${key}-500: rgb(from var(--mantine-color-${key}-5) r g b / <alpha-value>);
155
- --color-${key}-600: rgb(from var(--mantine-color-${key}-6) r g b / <alpha-value>);
156
- --color-${key}-700: rgb(from var(--mantine-color-${key}-7) r g b / <alpha-value>);
157
- --color-${key}-800: rgb(from var(--mantine-color-${key}-8) r g b / <alpha-value>);
158
- --color-${key}-900: rgb(from var(--mantine-color-${key}-9) r g b / <alpha-value>);
159
- --color-${key}: rgb(from var(--mantine-color-${key}-filled) r g b / <alpha-value>);
149
+ --color-${key}-50: var(--mantine-color-${key}-0);
150
+ --color-${key}-100: var(--mantine-color-${key}-1);
151
+ --color-${key}-200: var(--mantine-color-${key}-2);
152
+ --color-${key}-300: var(--mantine-color-${key}-3);
153
+ --color-${key}-400: var(--mantine-color-${key}-4);
154
+ --color-${key}-500: var(--mantine-color-${key}-5);
155
+ --color-${key}-600: var(--mantine-color-${key}-6);
156
+ --color-${key}-700: var(--mantine-color-${key}-7);
157
+ --color-${key}-800: var(--mantine-color-${key}-8);
158
+ --color-${key}-900: var(--mantine-color-${key}-9);
159
+ --color-${key}: var(--mantine-color-${key}-filled);
160
160
  `.trimEnd(),
161
161
  )
162
162
  .join("\n")}
@@ -165,12 +165,12 @@ ${isDefault ? '@custom-variant dark (&:where([data-mantine-color-scheme="dark"],
165
165
  ${Object.keys(theme.colors ?? {})
166
166
  .map((key) =>
167
167
  `
168
- --color-${key}-filled: rgb(from var(--mantine-color-${key}-filled) r g b / <alpha-value>);
168
+ --color-${key}-filled: var(--mantine-color-${key}-filled);
169
169
  --color-${key}-filled-hover: var(--mantine-color-${key}-filled-hover);
170
170
  --color-${key}-light: var(--mantine-color-${key}-light);
171
171
  --color-${key}-light-hover: var(--mantine-color-${key}-light-hover);
172
- --color-${key}-light-color: rgb(from var(--mantine-color-${key}-light-color) r g b / <alpha-value>);
173
- --color-${key}-outline: rgb(from var(--mantine-color-${key}-outline) r g b / <alpha-value>);
172
+ --color-${key}-light-color: var(--mantine-color-${key}-light-color);
173
+ --color-${key}-outline: var(--mantine-color-${key}-outline);
174
174
  --color-${key}-outline-hover: var(--mantine-color-${key}-outline-hover);
175
175
  `.trimEnd(),
176
176
  )