reactaform 1.4.4 → 1.5.0

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,31 @@
1
+ [data-reactaform-theme="antd-dark"] {
2
+ --reactaform-primary-bg: #141414;
3
+ --reactaform-secondary-bg: #1f1f1f;
4
+ --reactaform-input-bg: #1f1f1f;
5
+
6
+ --reactaform-text-color: #e8e8e8;
7
+ --reactaform-text-muted: #9ca3af;
8
+
9
+ --reactaform-border-color: #303030;
10
+ --reactaform-border-hover: #434343;
11
+ --reactaform-border-focus: #1677ff;
12
+
13
+ --reactaform-hover-bg: #1a1a1a;
14
+
15
+ --reactaform-error-color: #ff4d4f;
16
+ --reactaform-success-color: #52c41a;
17
+
18
+ --reactaform-border-radius: 6px;
19
+
20
+ --reactaform-shadow:
21
+ 0 6px 20px rgba(0,0,0,.55);
22
+
23
+ --reactaform-button-bg: #1677ff;
24
+ --reactaform-button-text: white;
25
+
26
+ --reactaform-input-padding: 10px 12px;
27
+
28
+ /* Tooltip */
29
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
30
+ --reactaform-tooltip-color: #F5F5F5;
31
+ }
@@ -0,0 +1,42 @@
1
+ [data-reactaform-theme="antd"] {
2
+ /* Surfaces */
3
+ --reactaform-primary-bg: #ffffff;
4
+ --reactaform-secondary-bg: #ffffff;
5
+ --reactaform-input-bg: #ffffff;
6
+
7
+ /* Text */
8
+ --reactaform-text-color: #1f1f1f;
9
+ --reactaform-text-muted: #8c8c8c;
10
+
11
+ /* Borders */
12
+ --reactaform-border-color: #d9d9d9;
13
+ --reactaform-border-hover: #bfbfbf;
14
+ --reactaform-border-focus: #1677ff; /* Ant Primary */
15
+
16
+ /* States */
17
+ --reactaform-error-color: #ff4d4f;
18
+ --reactaform-success-color: #52c41a;
19
+
20
+ /* Interaction */
21
+ --reactaform-hover-bg: #fafafa;
22
+
23
+ /* Shape — AntD slightly rounded */
24
+ --reactaform-border-radius: 6px;
25
+
26
+ /* Elevation */
27
+ --reactaform-shadow:
28
+ 0 2px 8px rgba(0,0,0,.08);
29
+
30
+ /* Buttons */
31
+ --reactaform-button-bg: #1677ff;
32
+ --reactaform-button-text: #ffffff;
33
+ --reactaform-button-border-radius: 6px;
34
+
35
+ /* Comfortable spacing */
36
+ --reactaform-input-padding: 10px 12px;
37
+ --reactaform-font-size: 14px;
38
+
39
+ /* Tooltip */
40
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
41
+ --reactaform-tooltip-color: #ffffff;
42
+ }
@@ -0,0 +1,31 @@
1
+ [data-reactaform-theme="blueprint-dark"] {
2
+ --reactaform-primary-bg: #202b33;
3
+ --reactaform-secondary-bg: #293742;
4
+ --reactaform-input-bg: #30404d;
5
+
6
+ --reactaform-text-color: #f5f8fa;
7
+ --reactaform-text-muted: #c0cbd3;
8
+
9
+ --reactaform-border-color: #394b59;
10
+ --reactaform-border-hover: #738694;
11
+ --reactaform-border-focus: #2b95d6;
12
+
13
+ --reactaform-hover-bg: rgba(255,255,255,0.07);
14
+
15
+ --reactaform-error-color: #ff7373;
16
+ --reactaform-success-color: #3dcc91;
17
+
18
+ --reactaform-border-radius: 4px;
19
+
20
+ --reactaform-shadow:
21
+ 0 4px 20px rgba(16,22,26,.45);
22
+
23
+ --reactaform-button-bg: #2b95d6;
24
+ --reactaform-button-text: white;
25
+
26
+ --reactaform-input-padding: 8px 10px;
27
+
28
+ /* Tooltip */
29
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
30
+ --reactaform-tooltip-color: #F5F5F5;
31
+ }
@@ -0,0 +1,43 @@
1
+ [data-reactaform-theme="blueprint"] {
2
+ /* Surfaces */
3
+ --reactaform-primary-bg: #f5f8fa;
4
+ --reactaform-secondary-bg: #ffffff;
5
+ --reactaform-input-bg: #ffffff;
6
+
7
+ /* Text */
8
+ --reactaform-text-color: #182026;
9
+ --reactaform-text-muted: #5c7080;
10
+
11
+ /* Borders */
12
+ --reactaform-border-color: #d8e1e8;
13
+ --reactaform-border-hover: #8a9ba8;
14
+ --reactaform-border-focus: #137cbd; /* Blueprint Primary Blue */
15
+
16
+ /* Status */
17
+ --reactaform-error-color: #c23030;
18
+ --reactaform-success-color: #0f9960;
19
+
20
+ /* Interaction */
21
+ --reactaform-hover-bg: #ebf1f5;
22
+
23
+ /* Shape */
24
+ --reactaform-border-radius: 4px;
25
+
26
+ /* Elevation */
27
+ --reactaform-shadow:
28
+ 0 1px 3px rgba(16,22,26,.1),
29
+ 0 0 0 1px rgba(16,22,26,.1);
30
+
31
+ /* Buttons */
32
+ --reactaform-button-bg: #137cbd;
33
+ --reactaform-button-text: #ffffff;
34
+ --reactaform-button-border-radius: 4px;
35
+
36
+ /* Density */
37
+ --reactaform-input-padding: 8px 10px;
38
+ --reactaform-font-size: 13px;
39
+
40
+ /* Tooltip */
41
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
42
+ --reactaform-tooltip-color: #ffffff;
43
+ }
@@ -0,0 +1,8 @@
1
+ [data-reactaform-size="compact"] {
2
+ --reactaform-input-padding: 6px 8px;
3
+ --reactaform-font-size: 12px;
4
+ --reactaform-space: 4px;
5
+ --reactaform-space-lg: 6px;
6
+ --reactaform-field-gap: 6px;
7
+ --reactaform-column-gap: 8px;
8
+ }
@@ -0,0 +1,40 @@
1
+ [data-reactaform-theme="fluent"] {
2
+ /* Surfaces */
3
+ --reactaform-primary-bg: #ffffff;
4
+ --reactaform-secondary-bg: #ffffff;
5
+ --reactaform-input-bg: #f5f6f8;
6
+
7
+ /* Text */
8
+ --reactaform-text-color: #242424;
9
+ --reactaform-text-muted: #616161;
10
+
11
+ /* Borders */
12
+ --reactaform-border-color: #d1d1d6;
13
+ --reactaform-border-hover: #bdbdbd;
14
+ --reactaform-border-focus: #0078d4;
15
+
16
+ /* Accent */
17
+ --reactaform-success-color: #107c10;
18
+ --reactaform-error-color: #d13438;
19
+
20
+ /* Interaction */
21
+ --reactaform-hover-bg: rgba(0,0,0,0.04);
22
+
23
+ /* Shape */
24
+ --reactaform-border-radius: 6px;
25
+
26
+ /* Shadow */
27
+ --reactaform-shadow:
28
+ 0 4px 12px rgba(0,0,0,.08);
29
+
30
+ /* Buttons */
31
+ --reactaform-button-bg: #0078d4;
32
+ --reactaform-button-text: white;
33
+ --reactaform-button-border-radius: 6px;
34
+
35
+ --reactaform-input-padding: 10px 12px;
36
+
37
+ /* Tooltip */
38
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
39
+ --reactaform-tooltip-color: #ffffff;
40
+ }
@@ -0,0 +1,25 @@
1
+ [data-reactaform-theme="glass"] {
2
+ --reactaform-primary-bg: rgba(255,255,255,0.25);
3
+ --reactaform-secondary-bg: rgba(255,255,255,0.35);
4
+ --reactaform-input-bg: rgba(255,255,255,0.35);
5
+
6
+ backdrop-filter: blur(14px);
7
+ -webkit-backdrop-filter: blur(14px);
8
+
9
+ --reactaform-text-color: #111827;
10
+ --reactaform-text-muted: #4b5563;
11
+
12
+ --reactaform-border-color: rgba(255,255,255,0.4);
13
+ --reactaform-border-hover: rgba(255,255,255,0.7);
14
+ --reactaform-border-focus: #38bdf8;
15
+
16
+ --reactaform-error-color: #e11d48;
17
+ --reactaform-success-color: #059669;
18
+
19
+ --reactaform-border-radius: 12px;
20
+ --reactaform-shadow: 0 12px 40px rgba(0,0,0,0.2);
21
+
22
+ /* Tooltip */
23
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
24
+ --reactaform-tooltip-color: #ffffff;
25
+ }
@@ -0,0 +1,22 @@
1
+ [data-reactaform-theme="accessible"] {
2
+ --reactaform-primary-bg: #ffffff;
3
+ --reactaform-secondary-bg: #ffffff;
4
+ --reactaform-input-bg: #ffffff;
5
+
6
+ --reactaform-text-color: #000000;
7
+ --reactaform-text-muted: #333333;
8
+
9
+ --reactaform-border-color: #000000;
10
+ --reactaform-border-hover: #000000;
11
+ --reactaform-border-focus: #1d4ed8;
12
+
13
+ --reactaform-error-color: #b91c1c;
14
+ --reactaform-success-color: #166534;
15
+
16
+ --reactaform-border-radius: 0;
17
+ --reactaform-shadow: none;
18
+
19
+ /* Tooltip */
20
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
21
+ --reactaform-tooltip-color: #ffffff;
22
+ }
@@ -0,0 +1,32 @@
1
+ [data-reactaform-theme="ios"] {
2
+ --reactaform-primary-bg: #f2f2f7;
3
+ --reactaform-secondary-bg: #ffffff;
4
+ --reactaform-input-bg: #ffffff;
5
+
6
+ --reactaform-text-color: #000000;
7
+ --reactaform-text-muted: #8e8e93;
8
+
9
+ --reactaform-border-color: #d1d1d6;
10
+ --reactaform-border-hover: #b3b3b9;
11
+ --reactaform-border-focus: #0a84ff;
12
+
13
+ --reactaform-error-color: #ff3b30;
14
+ --reactaform-success-color: #34c759;
15
+
16
+ --reactaform-hover-bg: rgba(0,0,0,0.03);
17
+
18
+ --reactaform-border-radius: 14px;
19
+
20
+ --reactaform-shadow:
21
+ 0 10px 30px rgba(0,0,0,.10);
22
+
23
+ --reactaform-button-bg: #0a84ff;
24
+ --reactaform-button-text: white;
25
+ --reactaform-button-border-radius: 14px;
26
+
27
+ --reactaform-input-padding: 14px 16px;
28
+
29
+ /* Tooltip */
30
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
31
+ --reactaform-tooltip-color: #ffffff;
32
+ }
@@ -0,0 +1,32 @@
1
+ [data-reactaform-theme="macos"] {
2
+ --reactaform-primary-bg: #f5f5f7;
3
+ --reactaform-secondary-bg: #ffffff;
4
+ --reactaform-input-bg: #ffffff;
5
+
6
+ --reactaform-text-color: #111111;
7
+ --reactaform-text-muted: #6e6e73;
8
+
9
+ --reactaform-border-color: #d2d2d7;
10
+ --reactaform-border-hover: #9e9ea2;
11
+ --reactaform-border-focus: #0a84ff;
12
+
13
+ --reactaform-success-color: #34c759;
14
+ --reactaform-error-color: #ff3b30;
15
+
16
+ --reactaform-hover-bg: rgba(0,0,0,0.03);
17
+
18
+ --reactaform-border-radius: 10px;
19
+
20
+ --reactaform-shadow:
21
+ 0 8px 30px rgba(0,0,0,.08);
22
+
23
+ --reactaform-button-bg: #0a84ff;
24
+ --reactaform-button-text: white;
25
+ --reactaform-button-border-radius: 999px;
26
+
27
+ --reactaform-input-padding: 12px 14px;
28
+
29
+ /* Tooltip */
30
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
31
+ --reactaform-tooltip-color: #ffffff;
32
+ }
@@ -0,0 +1,27 @@
1
+ [data-reactaform-theme="material-dark"] {
2
+ --reactaform-primary-bg: #121212;
3
+ --reactaform-secondary-bg: #1D1B20;
4
+ --reactaform-input-bg: #2B2830;
5
+
6
+ --reactaform-text-color: #EDE7F6;
7
+ --reactaform-text-muted: #BDB5D7;
8
+
9
+ --reactaform-border-color: #3A3346;
10
+ --reactaform-border-hover: #524364;
11
+ --reactaform-border-focus: #D0BCFF;
12
+
13
+ --reactaform-hover-bg: rgba(255,255,255,0.06);
14
+
15
+ --reactaform-error-color: #F2B8B5;
16
+ --reactaform-success-color: #81C995;
17
+
18
+ --reactaform-border-radius: 12px;
19
+ --reactaform-shadow: 0 8px 30px rgba(0,0,0,0.4);
20
+
21
+ --reactaform-button-bg: #D0BCFF;
22
+ --reactaform-button-text: #381E72;
23
+
24
+ /* Tooltip */
25
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
26
+ --reactaform-tooltip-color: #F5F5F5;
27
+ }
@@ -0,0 +1,46 @@
1
+ /* Material Design 3 Inspired Light Theme */
2
+ [data-reactaform-theme="material"] {
3
+
4
+ /* Surfaces */
5
+ --reactaform-primary-bg: #ffffff;
6
+ --reactaform-secondary-bg: #ffffff;
7
+ --reactaform-input-bg: #f9fafb;
8
+
9
+ /* Text */
10
+ --reactaform-text-color: #1f2937;
11
+ --reactaform-text-muted: #6b7280;
12
+
13
+ /* Material Border System */
14
+ --reactaform-border-color: #e5e7eb;
15
+ --reactaform-border-hover: #cbd5e1;
16
+ --reactaform-border-focus: #6750A4; /* Material Purple Primary */
17
+
18
+ /* State Colors */
19
+ --reactaform-error-color: #B3261E;
20
+ --reactaform-success-color: #1E8E3E;
21
+
22
+ /* Interaction */
23
+ --reactaform-hover-bg: rgba(0,0,0,0.03);
24
+
25
+ /* Shape */
26
+ --reactaform-border-radius: 12px;
27
+
28
+ /* Elevation */
29
+ --reactaform-shadow:
30
+ 0 1px 2px rgba(0,0,0,.08),
31
+ 0 2px 6px rgba(0,0,0,.08);
32
+
33
+ /* Buttons */
34
+ --reactaform-button-bg: #6750A4;
35
+ --reactaform-button-text: #ffffff;
36
+ --reactaform-button-border-radius: 999px; /* pill */
37
+ --reactaform-button-shadow:
38
+ 0 2px 6px rgba(0,0,0,0.18);
39
+
40
+ /* Inputs */
41
+ --reactaform-input-padding: 12px 14px;
42
+
43
+ /* Tooltip */
44
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
45
+ --reactaform-tooltip-color: #ffffff;
46
+ }
@@ -0,0 +1,24 @@
1
+ [data-reactaform-theme="midnight-dark"] {
2
+ --reactaform-primary-bg: #0b1120;
3
+ --reactaform-secondary-bg: #111c2d;
4
+ --reactaform-input-bg: #14223a;
5
+
6
+ --reactaform-text-color: #e5f0ff;
7
+ --reactaform-text-muted: #9db2d4;
8
+
9
+ --reactaform-border-color: #1f2b44;
10
+ --reactaform-border-hover: #2c3d5e;
11
+ --reactaform-border-focus: #60a5fa;
12
+
13
+ --reactaform-error-color: #fb7185;
14
+ --reactaform-success-color: #4ade80;
15
+
16
+ --reactaform-hover-bg: rgba(255,255,255,0.06);
17
+ --reactaform-border-radius: 6px;
18
+
19
+ --reactaform-shadow: 0 12px 28px rgba(0,0,0,0.55);
20
+
21
+ /* Tooltip */
22
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
23
+ --reactaform-tooltip-color: #F5F5F5;
24
+ }
@@ -0,0 +1,23 @@
1
+ [data-reactaform-theme="modern-light"] {
2
+ --reactaform-primary-bg: #ffffff;
3
+ --reactaform-secondary-bg: #fafafa;
4
+ --reactaform-input-bg: #ffffff;
5
+
6
+ --reactaform-text-color: #1f2937;
7
+ --reactaform-text-muted: #6b7280;
8
+
9
+ --reactaform-border-color: #e5e7eb;
10
+ --reactaform-border-hover: #d1d5db;
11
+ --reactaform-border-focus: #2563eb;
12
+
13
+ --reactaform-error-color: #dc2626;
14
+ --reactaform-success-color: #16a34a;
15
+
16
+ --reactaform-hover-bg: #f3f4f6;
17
+ --reactaform-border-radius: 6px;
18
+ --reactaform-shadow: 0 8px 24px rgba(0,0,0,0.06);
19
+
20
+ /* Tooltip */
21
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
22
+ --reactaform-tooltip-color: #ffffff;
23
+ }
@@ -0,0 +1,24 @@
1
+ [data-reactaform-theme="neon-cyber-dark"] {
2
+ --reactaform-primary-bg: #0c0f1a;
3
+ --reactaform-secondary-bg: #11172b;
4
+ --reactaform-input-bg: #141c33;
5
+
6
+ --reactaform-text-color: #e0e7ff;
7
+ --reactaform-text-muted: #9ca3af;
8
+
9
+ --reactaform-border-color: #303b63;
10
+ --reactaform-border-hover: #6366f1;
11
+ --reactaform-border-focus: #22d3ee;
12
+
13
+ --reactaform-error-color: #fb7185;
14
+ --reactaform-success-color: #34d399;
15
+
16
+ --reactaform-hover-bg: rgba(99,102,241,0.08);
17
+ --reactaform-border-radius: 10px;
18
+
19
+ --reactaform-shadow: 0 0 20px rgba(99,102,241,.3);
20
+
21
+ /* Tooltip */
22
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
23
+ --reactaform-tooltip-color: #F5F5F5;
24
+ }
@@ -0,0 +1,40 @@
1
+ [data-reactaform-theme="shadcn"] {
2
+ /* Surfaces */
3
+ --reactaform-primary-bg: #ffffff;
4
+ --reactaform-secondary-bg: #ffffff;
5
+ --reactaform-input-bg: #f5f6f8;
6
+
7
+ /* Text */
8
+ --reactaform-text-color: #242424;
9
+ --reactaform-text-muted: #616161;
10
+
11
+ /* Borders */
12
+ --reactaform-border-color: #d1d1d6;
13
+ --reactaform-border-hover: #bdbdbd;
14
+ --reactaform-border-focus: #0078d4;
15
+
16
+ /* Accent */
17
+ --reactaform-success-color: #107c10;
18
+ --reactaform-error-color: #d13438;
19
+
20
+ /* Interaction */
21
+ --reactaform-hover-bg: rgba(0,0,0,0.04);
22
+
23
+ /* Shape */
24
+ --reactaform-border-radius: 6px;
25
+
26
+ /* Shadow */
27
+ --reactaform-shadow:
28
+ 0 4px 12px rgba(0,0,0,.08);
29
+
30
+ /* Buttons */
31
+ --reactaform-button-bg: #0078d4;
32
+ --reactaform-button-text: white;
33
+ --reactaform-button-border-radius: 6px;
34
+
35
+ --reactaform-input-padding: 10px 12px;
36
+
37
+ /* Tooltip */
38
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
39
+ --reactaform-tooltip-color: #ffffff;
40
+ }
@@ -0,0 +1,24 @@
1
+ [data-reactaform-theme="pastel"] {
2
+ --reactaform-primary-bg: #fafafa;
3
+ --reactaform-secondary-bg: #ffffff;
4
+ --reactaform-input-bg: #ffffff;
5
+
6
+ --reactaform-text-color: #374151;
7
+ --reactaform-text-muted: #6b7280;
8
+
9
+ --reactaform-border-color: #e5e7eb;
10
+ --reactaform-border-hover: #cbd5e1;
11
+ --reactaform-border-focus: #a78bfa;
12
+
13
+ --reactaform-error-color: #fb7185;
14
+ --reactaform-success-color: #4ade80;
15
+
16
+ --reactaform-hover-bg: #f4f4ff;
17
+
18
+ --reactaform-border-radius: 10px;
19
+ --reactaform-shadow: 0 10px 28px rgba(99,102,241,0.08);
20
+
21
+ /* Tooltip */
22
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
23
+ --reactaform-tooltip-color: #ffffff;
24
+ }
@@ -0,0 +1,9 @@
1
+ [data-reactaform-size="spacious"] {
2
+ --reactaform-input-padding: 14px 16px;
3
+ --reactaform-font-size: 15px;
4
+ --reactaform-space: 14px;
5
+ --reactaform-space-lg: 18px;
6
+ --reactaform-field-gap: 18px;
7
+ --reactaform-column-gap: 14px;
8
+ --reactaform-border-radius: 10px;
9
+ }
@@ -0,0 +1,30 @@
1
+ [data-reactaform-theme="tailwind-dark"] {
2
+ --reactaform-primary-bg: #0f172a; /* slate-900 */
3
+ --reactaform-secondary-bg: #020617; /* slate-950 */
4
+ --reactaform-input-bg: #020617;
5
+
6
+ --reactaform-text-color: #f9fafb; /* slate-50 */
7
+ --reactaform-text-muted: #9ca3af; /* gray-400 */
8
+ --reactaform-field-text-color: #e5e7eb;
9
+
10
+ --reactaform-border-color: #334155; /* slate-600 */
11
+ --reactaform-border-hover: #475569; /* slate-500 */
12
+ --reactaform-border-focus: #818cf8; /* indigo-400 */
13
+
14
+ --reactaform-error-color: #fb7185; /* rose-400 */
15
+ --reactaform-success-color: #34d399; /* emerald-400 */
16
+
17
+ --reactaform-hover-bg: rgba(255,255,255,0.05);
18
+
19
+ --reactaform-border-radius: 0.5rem;
20
+
21
+ --reactaform-shadow:
22
+ 0 2px 8px rgba(0,0,0,.6);
23
+
24
+ --reactaform-button-bg: #4f46e5; /* indigo-600 */
25
+ --reactaform-button-text: #ffffff;
26
+
27
+ /* Tooltip */
28
+ --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
29
+ --reactaform-tooltip-color: #F5F5F5;
30
+ }
@@ -0,0 +1,50 @@
1
+ [data-reactaform-theme="tailwind"] {
2
+ /* Backgrounds */
3
+ --reactaform-primary-bg: #f9fafb; /* slate-50 */
4
+ --reactaform-secondary-bg: #ffffff; /* white */
5
+ --reactaform-input-bg: #ffffff;
6
+
7
+ /* Text */
8
+ --reactaform-text-color: #111827; /* gray-900 */
9
+ --reactaform-text-muted: #6b7280; /* gray-500 */
10
+ --reactaform-field-text-color: #1f2937; /* gray-800 */
11
+
12
+ /* Borders */
13
+ --reactaform-border-color: #d1d5db; /* gray-300 */
14
+ --reactaform-border-hover: #9ca3af; /* gray-400 */
15
+ --reactaform-border-focus: #6366f1; /* indigo-500 */
16
+
17
+ /* Status colors */
18
+ --reactaform-error-color: #f43f5e; /* rose-500 */
19
+ --reactaform-success-color: #10b981; /* emerald-500 */
20
+
21
+ /* Hover */
22
+ --reactaform-hover-bg: #f3f4f6; /* gray-100 */
23
+
24
+ /* Radii */
25
+ --reactaform-border-radius: 0.5rem; /* rounded-lg */
26
+
27
+ /* Shadows (Tailwind style) */
28
+ --reactaform-shadow:
29
+ 0 1px 2px rgba(0,0,0,.05),
30
+ 0 1px 3px rgba(0,0,0,.1);
31
+
32
+ /* Typography */
33
+ --reactaform-font-size: 14px;
34
+ --reactaform-font-weight: 500;
35
+
36
+ /* Spacing (Tailwind scale) */
37
+ --reactaform-space: 0.5rem; /* 2 = 8px */
38
+ --reactaform-space-lg: 0.75rem; /* 3 = 12px */
39
+
40
+ /* Buttons */
41
+ --reactaform-button-bg: #4f46e5; /* indigo-600 */
42
+ --reactaform-button-text: #ffffff;
43
+ --reactaform-button-border-radius: 0.5rem;
44
+ --reactaform-button-shadow:
45
+ 0 2px 4px rgba(79,70,229,.3);
46
+
47
+ /* Tooltip */
48
+ --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
49
+ --reactaform-tooltip-color: #ffffff;
50
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "reactaform",
3
- "version": "1.4.4",
3
+ "version": "1.5.0",
4
4
  "description": "A powerful, type-safe React form builder library with dynamic field rendering, conditional visibility, multi-language support, and extensible validation",
5
5
  "keywords": [
6
6
  "react",
@@ -34,7 +34,28 @@
34
34
  "import": "./dist/reactaform.es.js",
35
35
  "require": "./dist/reactaform.cjs.js"
36
36
  },
37
- "./style.css": "./dist/reactaform.css"
37
+ "./style.css": "./dist/reactaform.css",
38
+ "./themes/*.css": "./dist/themes/*.css",
39
+ "./themes/ant-design.css": "./dist/themes/ant-design.css",
40
+ "./themes/ant-design-dark.css": "./dist/themes/ant-design-dark.css",
41
+ "./themes/blueprint.css": "./dist/themes/blueprint.css",
42
+ "./themes/blueprint-dark.css": "./dist/themes/blueprint-dark.css",
43
+ "./themes/compact-variant.css": "./dist/themes/compact-variant.css",
44
+ "./themes/fluent.css": "./dist/themes/fluent.css",
45
+ "./themes/glass-morphism.css": "./dist/themes/glass-morphism.css",
46
+ "./themes/high-contrast-accessible.css": "./dist/themes/high-contrast-accessible.css",
47
+ "./themes/ios-mobile.css": "./dist/themes/ios-mobile.css",
48
+ "./themes/macos-native.css": "./dist/themes/macos-native.css",
49
+ "./themes/material.css": "./dist/themes/material.css",
50
+ "./themes/material-dark.css": "./dist/themes/material-dark.css",
51
+ "./themes/midnight-dark.css": "./dist/themes/midnight-dark.css",
52
+ "./themes/modern-light.css": "./dist/themes/modern-light.css",
53
+ "./themes/neon-cyber-dark.css": "./dist/themes/neon-cyber-dark.css",
54
+ "./themes/shadcn.css": "./dist/themes/shadcn.css",
55
+ "./themes/soft-pastel.css": "./dist/themes/soft-pastel.css",
56
+ "./themes/spacious-variant.css": "./dist/themes/spacious-variant.css",
57
+ "./themes/tailwind.css": "./dist/themes/tailwind.css",
58
+ "./themes/tailwind-dark.css": "./dist/themes/tailwind-dark.css"
38
59
  },
39
60
  "files": [
40
61
  "dist/*.js",
@@ -44,6 +65,7 @@
44
65
  "dist/*.css",
45
66
  "dist/*.map",
46
67
  "dist/*.d.ts",
68
+ "dist/themes/*.css",
47
69
  "README.md",
48
70
  "LICENSE"
49
71
  ],
@@ -53,7 +75,7 @@
53
75
  },
54
76
  "scripts": {
55
77
  "build:types": "tsc -p tsconfig.build.json --noEmit false",
56
- "build:lib": "vite build --config vite.lib.config.ts && npm run build:types",
78
+ "build:lib": "vite build --config vite.lib.config.ts && npm run build:types && node scripts/copy-themes.js",
57
79
  "build:pack": "npm run build:lib && npm pack",
58
80
  "test": "vitest run --config ./vitest.config.ts",
59
81
  "typecheck": "tsc -p tsconfig.build.json --noEmit",