reactaform 1.4.4 → 1.8.0

package/dist/themes/ant-design-dark.css

@@ -0,0 +1,31 @@
+[data-reactaform-theme="antd-dark"] {
+  --reactaform-primary-bg: #141414;
+  --reactaform-secondary-bg: #1f1f1f;
+  --reactaform-input-bg: #1f1f1f;
+
+  --reactaform-text-color: #e8e8e8;
+  --reactaform-text-muted: #9ca3af;
+
+  --reactaform-border-color: #303030;
+  --reactaform-border-hover: #434343;
+  --reactaform-border-focus: #1677ff;
+
+  --reactaform-hover-bg: #1a1a1a;
+
+  --reactaform-error-color: #ff4d4f;
+  --reactaform-success-color: #52c41a;
+
+  --reactaform-border-radius: 6px;
+
+  --reactaform-shadow:
+    0 6px 20px rgba(0,0,0,.55);
+
+  --reactaform-button-bg: #1677ff;
+  --reactaform-button-text: white;
+
+  --reactaform-input-padding: 10px 12px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/ant-design.css

@@ -0,0 +1,42 @@
+[data-reactaform-theme="antd"] {
+  /* Surfaces */
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  /* Text */
+  --reactaform-text-color: #1f1f1f;
+  --reactaform-text-muted: #8c8c8c;
+
+  /* Borders */
+  --reactaform-border-color: #d9d9d9;
+  --reactaform-border-hover: #bfbfbf;
+  --reactaform-border-focus: #1677ff; /* Ant Primary */
+
+  /* States */
+  --reactaform-error-color: #ff4d4f;
+  --reactaform-success-color: #52c41a;
+
+  /* Interaction */
+  --reactaform-hover-bg: #fafafa;
+
+  /* Shape — AntD slightly rounded */
+  --reactaform-border-radius: 6px;
+
+  /* Elevation */
+  --reactaform-shadow:
+    0 2px 8px rgba(0,0,0,.08);
+
+  /* Buttons */
+  --reactaform-button-bg: #1677ff;
+  --reactaform-button-text: #ffffff;
+  --reactaform-button-border-radius: 6px;
+
+  /* Comfortable spacing */
+  --reactaform-input-padding: 10px 12px;
+  --reactaform-font-size: 14px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/blueprint-dark.css

@@ -0,0 +1,31 @@
+[data-reactaform-theme="blueprint-dark"] {
+  --reactaform-primary-bg: #202b33;
+  --reactaform-secondary-bg: #293742;
+  --reactaform-input-bg: #30404d;
+
+  --reactaform-text-color: #f5f8fa;
+  --reactaform-text-muted: #c0cbd3;
+
+  --reactaform-border-color: #394b59;
+  --reactaform-border-hover: #738694;
+  --reactaform-border-focus: #2b95d6;
+
+  --reactaform-hover-bg: rgba(255,255,255,0.07);
+
+  --reactaform-error-color: #ff7373;
+  --reactaform-success-color: #3dcc91;
+
+  --reactaform-border-radius: 4px;
+
+  --reactaform-shadow:
+    0 4px 20px rgba(16,22,26,.45);
+
+  --reactaform-button-bg: #2b95d6;
+  --reactaform-button-text: white;
+
+  --reactaform-input-padding: 8px 10px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/blueprint.css

@@ -0,0 +1,43 @@
+[data-reactaform-theme="blueprint"] {
+  /* Surfaces */
+  --reactaform-primary-bg: #f5f8fa;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  /* Text */
+  --reactaform-text-color: #182026;
+  --reactaform-text-muted: #5c7080;
+
+  /* Borders */
+  --reactaform-border-color: #d8e1e8;
+  --reactaform-border-hover: #8a9ba8;
+  --reactaform-border-focus: #137cbd; /* Blueprint Primary Blue */
+
+  /* Status */
+  --reactaform-error-color: #c23030;
+  --reactaform-success-color: #0f9960;
+
+  /* Interaction */
+  --reactaform-hover-bg: #ebf1f5;
+
+  /* Shape */
+  --reactaform-border-radius: 4px;
+
+  /* Elevation */
+  --reactaform-shadow:
+    0 1px 3px rgba(16,22,26,.1),
+    0 0 0 1px rgba(16,22,26,.1);
+
+  /* Buttons */
+  --reactaform-button-bg: #137cbd;
+  --reactaform-button-text: #ffffff;
+  --reactaform-button-border-radius: 4px;
+
+  /* Density */
+  --reactaform-input-padding: 8px 10px;
+  --reactaform-font-size: 13px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/compact-variant.css

@@ -0,0 +1,8 @@
+[data-reactaform-size="compact"] {
+  --reactaform-input-padding: 6px 8px;
+  --reactaform-font-size: 12px;
+  --reactaform-space: 4px;
+  --reactaform-space-lg: 6px;
+  --reactaform-field-gap: 6px;
+  --reactaform-column-gap: 8px;
+}

package/dist/themes/fluent.css

@@ -0,0 +1,40 @@
+[data-reactaform-theme="fluent"] {
+  /* Surfaces */
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #f5f6f8;
+
+  /* Text */
+  --reactaform-text-color: #242424;
+  --reactaform-text-muted: #616161;
+
+  /* Borders */
+  --reactaform-border-color: #d1d1d6;
+  --reactaform-border-hover: #bdbdbd;
+  --reactaform-border-focus: #0078d4;
+
+  /* Accent */
+  --reactaform-success-color: #107c10;
+  --reactaform-error-color: #d13438;
+
+  /* Interaction */
+  --reactaform-hover-bg: rgba(0,0,0,0.04);
+
+  /* Shape */
+  --reactaform-border-radius: 6px;
+
+  /* Shadow */
+  --reactaform-shadow:
+    0 4px 12px rgba(0,0,0,.08);
+
+  /* Buttons */
+  --reactaform-button-bg: #0078d4;
+  --reactaform-button-text: white;
+  --reactaform-button-border-radius: 6px;
+
+  --reactaform-input-padding: 10px 12px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/glass-morphism.css

@@ -0,0 +1,25 @@
+[data-reactaform-theme="glass"] {
+  --reactaform-primary-bg: rgba(255,255,255,0.25);
+  --reactaform-secondary-bg: rgba(255,255,255,0.35);
+  --reactaform-input-bg: rgba(255,255,255,0.35);
+
+  backdrop-filter: blur(14px);
+  -webkit-backdrop-filter: blur(14px);
+
+  --reactaform-text-color: #111827;
+  --reactaform-text-muted: #4b5563;
+
+  --reactaform-border-color: rgba(255,255,255,0.4);
+  --reactaform-border-hover: rgba(255,255,255,0.7);
+  --reactaform-border-focus: #38bdf8;
+
+  --reactaform-error-color: #e11d48;
+  --reactaform-success-color: #059669;
+
+  --reactaform-border-radius: 12px;
+  --reactaform-shadow: 0 12px 40px rgba(0,0,0,0.2);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/high-contrast-accessible.css

@@ -0,0 +1,22 @@
+[data-reactaform-theme="accessible"] {
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  --reactaform-text-color: #000000;
+  --reactaform-text-muted: #333333;
+
+  --reactaform-border-color: #000000;
+  --reactaform-border-hover: #000000;
+  --reactaform-border-focus: #1d4ed8;
+
+  --reactaform-error-color: #b91c1c;
+  --reactaform-success-color: #166534;
+
+  --reactaform-border-radius: 0;
+  --reactaform-shadow: none;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/ios-mobile.css

@@ -0,0 +1,32 @@
+[data-reactaform-theme="ios"] {
+  --reactaform-primary-bg: #f2f2f7;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  --reactaform-text-color: #000000;
+  --reactaform-text-muted: #8e8e93;
+
+  --reactaform-border-color: #d1d1d6;
+  --reactaform-border-hover: #b3b3b9;
+  --reactaform-border-focus: #0a84ff;
+
+  --reactaform-error-color: #ff3b30;
+  --reactaform-success-color: #34c759;
+
+  --reactaform-hover-bg: rgba(0,0,0,0.03);
+
+  --reactaform-border-radius: 14px;
+
+  --reactaform-shadow:
+    0 10px 30px rgba(0,0,0,.10);
+
+  --reactaform-button-bg: #0a84ff;
+  --reactaform-button-text: white;
+  --reactaform-button-border-radius: 14px;
+
+  --reactaform-input-padding: 14px 16px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/macos-native.css

@@ -0,0 +1,32 @@
+[data-reactaform-theme="macos"] {
+  --reactaform-primary-bg: #f5f5f7;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  --reactaform-text-color: #111111;
+  --reactaform-text-muted: #6e6e73;
+
+  --reactaform-border-color: #d2d2d7;
+  --reactaform-border-hover: #9e9ea2;
+  --reactaform-border-focus: #0a84ff;
+
+  --reactaform-success-color: #34c759;
+  --reactaform-error-color: #ff3b30;
+
+  --reactaform-hover-bg: rgba(0,0,0,0.03);
+
+  --reactaform-border-radius: 10px;
+
+  --reactaform-shadow:
+    0 8px 30px rgba(0,0,0,.08);
+
+  --reactaform-button-bg: #0a84ff;
+  --reactaform-button-text: white;
+  --reactaform-button-border-radius: 999px;
+
+  --reactaform-input-padding: 12px 14px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/material-dark.css

@@ -0,0 +1,27 @@
+[data-reactaform-theme="material-dark"] {
+  --reactaform-primary-bg: #121212;
+  --reactaform-secondary-bg: #1D1B20;
+  --reactaform-input-bg: #2B2830;
+
+  --reactaform-text-color: #EDE7F6;
+  --reactaform-text-muted: #BDB5D7;
+
+  --reactaform-border-color: #3A3346;
+  --reactaform-border-hover: #524364;
+  --reactaform-border-focus: #D0BCFF;
+
+  --reactaform-hover-bg: rgba(255,255,255,0.06);
+
+  --reactaform-error-color: #F2B8B5;
+  --reactaform-success-color: #81C995;
+
+  --reactaform-border-radius: 12px;
+  --reactaform-shadow: 0 8px 30px rgba(0,0,0,0.4);
+
+  --reactaform-button-bg: #D0BCFF;
+  --reactaform-button-text: #381E72;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/material.css

@@ -0,0 +1,46 @@
+/* Material Design 3 Inspired Light Theme */
+[data-reactaform-theme="material"] {
+
+  /* Surfaces */
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #f9fafb;
+
+  /* Text */
+  --reactaform-text-color: #1f2937;
+  --reactaform-text-muted: #6b7280;
+
+  /* Material Border System */
+  --reactaform-border-color: #e5e7eb;
+  --reactaform-border-hover: #cbd5e1;
+  --reactaform-border-focus: #6750A4; /* Material Purple Primary */
+
+  /* State Colors */
+  --reactaform-error-color: #B3261E;
+  --reactaform-success-color: #1E8E3E;
+
+  /* Interaction */
+  --reactaform-hover-bg: rgba(0,0,0,0.03);
+
+  /* Shape */
+  --reactaform-border-radius: 12px;
+
+  /* Elevation */
+  --reactaform-shadow:
+    0 1px 2px rgba(0,0,0,.08),
+    0 2px 6px rgba(0,0,0,.08);
+
+  /* Buttons */
+  --reactaform-button-bg: #6750A4;
+  --reactaform-button-text: #ffffff;
+  --reactaform-button-border-radius: 999px; /* pill */
+  --reactaform-button-shadow:
+    0 2px 6px rgba(0,0,0,0.18);
+
+  /* Inputs */
+  --reactaform-input-padding: 12px 14px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/midnight-dark.css

@@ -0,0 +1,24 @@
+[data-reactaform-theme="midnight-dark"] {
+  --reactaform-primary-bg: #0b1120;
+  --reactaform-secondary-bg: #111c2d;
+  --reactaform-input-bg: #14223a;
+
+  --reactaform-text-color: #e5f0ff;
+  --reactaform-text-muted: #9db2d4;
+
+  --reactaform-border-color: #1f2b44;
+  --reactaform-border-hover: #2c3d5e;
+  --reactaform-border-focus: #60a5fa;
+
+  --reactaform-error-color: #fb7185;
+  --reactaform-success-color: #4ade80;
+
+  --reactaform-hover-bg: rgba(255,255,255,0.06);
+  --reactaform-border-radius: 6px;
+
+  --reactaform-shadow: 0 12px 28px rgba(0,0,0,0.55);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/modern-light.css

@@ -0,0 +1,23 @@
+[data-reactaform-theme="modern-light"] {
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #fafafa;
+  --reactaform-input-bg: #ffffff;
+
+  --reactaform-text-color: #1f2937;
+  --reactaform-text-muted: #6b7280;
+
+  --reactaform-border-color: #e5e7eb;
+  --reactaform-border-hover: #d1d5db;
+  --reactaform-border-focus: #2563eb;
+
+  --reactaform-error-color: #dc2626;
+  --reactaform-success-color: #16a34a;
+
+  --reactaform-hover-bg: #f3f4f6;
+  --reactaform-border-radius: 6px;
+  --reactaform-shadow: 0 8px 24px rgba(0,0,0,0.06);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/neon-cyber-dark.css

@@ -0,0 +1,24 @@
+[data-reactaform-theme="neon-cyber-dark"] {
+  --reactaform-primary-bg: #0c0f1a;
+  --reactaform-secondary-bg: #11172b;
+  --reactaform-input-bg: #141c33;
+
+  --reactaform-text-color: #e0e7ff;
+  --reactaform-text-muted: #9ca3af;
+
+  --reactaform-border-color: #303b63;
+  --reactaform-border-hover: #6366f1;
+  --reactaform-border-focus: #22d3ee;
+
+  --reactaform-error-color: #fb7185;
+  --reactaform-success-color: #34d399;
+
+  --reactaform-hover-bg: rgba(99,102,241,0.08);
+  --reactaform-border-radius: 10px;
+
+  --reactaform-shadow: 0 0 20px rgba(99,102,241,.3);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/shadcn.css

@@ -0,0 +1,40 @@
+[data-reactaform-theme="shadcn"] {
+  /* Surfaces */
+  --reactaform-primary-bg: #ffffff;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #f5f6f8;
+
+  /* Text */
+  --reactaform-text-color: #242424;
+  --reactaform-text-muted: #616161;
+
+  /* Borders */
+  --reactaform-border-color: #d1d1d6;
+  --reactaform-border-hover: #bdbdbd;
+  --reactaform-border-focus: #0078d4;
+
+  /* Accent */
+  --reactaform-success-color: #107c10;
+  --reactaform-error-color: #d13438;
+
+  /* Interaction */
+  --reactaform-hover-bg: rgba(0,0,0,0.04);
+
+  /* Shape */
+  --reactaform-border-radius: 6px;
+
+  /* Shadow */
+  --reactaform-shadow:
+    0 4px 12px rgba(0,0,0,.08);
+
+  /* Buttons */
+  --reactaform-button-bg: #0078d4;
+  --reactaform-button-text: white;
+  --reactaform-button-border-radius: 6px;
+
+  --reactaform-input-padding: 10px 12px;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/soft-pastel.css

@@ -0,0 +1,24 @@
+[data-reactaform-theme="pastel"] {
+  --reactaform-primary-bg: #fafafa;
+  --reactaform-secondary-bg: #ffffff;
+  --reactaform-input-bg: #ffffff;
+
+  --reactaform-text-color: #374151;
+  --reactaform-text-muted: #6b7280;
+
+  --reactaform-border-color: #e5e7eb;
+  --reactaform-border-hover: #cbd5e1;
+  --reactaform-border-focus: #a78bfa;
+
+  --reactaform-error-color: #fb7185;
+  --reactaform-success-color: #4ade80;
+
+  --reactaform-hover-bg: #f4f4ff;
+
+  --reactaform-border-radius: 10px;
+  --reactaform-shadow: 0 10px 28px rgba(99,102,241,0.08);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/themes/spacious-variant.css

@@ -0,0 +1,9 @@
+[data-reactaform-size="spacious"] {
+  --reactaform-input-padding: 14px 16px;
+  --reactaform-font-size: 15px;
+  --reactaform-space: 14px;
+  --reactaform-space-lg: 18px;
+  --reactaform-field-gap: 18px;
+  --reactaform-column-gap: 14px;
+  --reactaform-border-radius: 10px;
+}

package/dist/themes/tailwind-dark.css

@@ -0,0 +1,30 @@
+[data-reactaform-theme="tailwind-dark"] {
+  --reactaform-primary-bg: #0f172a; /* slate-900 */
+  --reactaform-secondary-bg: #020617; /* slate-950 */
+  --reactaform-input-bg: #020617;
+
+  --reactaform-text-color: #f9fafb;  /* slate-50 */
+  --reactaform-text-muted: #9ca3af;  /* gray-400 */
+  --reactaform-field-text-color: #e5e7eb;
+
+  --reactaform-border-color: #334155; /* slate-600 */
+  --reactaform-border-hover: #475569; /* slate-500 */
+  --reactaform-border-focus: #818cf8; /* indigo-400 */
+
+  --reactaform-error-color: #fb7185;  /* rose-400 */
+  --reactaform-success-color: #34d399; /* emerald-400 */
+
+  --reactaform-hover-bg: rgba(255,255,255,0.05);
+
+  --reactaform-border-radius: 0.5rem;
+
+  --reactaform-shadow:
+      0 2px 8px rgba(0,0,0,.6);
+
+  --reactaform-button-bg: #4f46e5; /* indigo-600 */
+  --reactaform-button-text: #ffffff;
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(40, 40, 40, 0.95);
+  --reactaform-tooltip-color: #F5F5F5;
+}

package/dist/themes/tailwind.css

@@ -0,0 +1,50 @@
+[data-reactaform-theme="tailwind"] {
+  /* Backgrounds */
+  --reactaform-primary-bg: #f9fafb; /* slate-50 */
+  --reactaform-secondary-bg: #ffffff; /* white */
+  --reactaform-input-bg: #ffffff;
+
+  /* Text */
+  --reactaform-text-color: #111827; /* gray-900 */
+  --reactaform-text-muted: #6b7280; /* gray-500 */
+  --reactaform-field-text-color: #1f2937; /* gray-800 */
+
+  /* Borders */
+  --reactaform-border-color: #d1d5db; /* gray-300 */
+  --reactaform-border-hover: #9ca3af; /* gray-400 */
+  --reactaform-border-focus: #6366f1; /* indigo-500 */
+
+  /* Status colors */
+  --reactaform-error-color: #f43f5e; /* rose-500 */
+  --reactaform-success-color: #10b981; /* emerald-500 */
+
+  /* Hover */
+  --reactaform-hover-bg: #f3f4f6; /* gray-100 */
+
+  /* Radii */
+  --reactaform-border-radius: 0.5rem; /* rounded-lg */
+
+  /* Shadows (Tailwind style) */
+  --reactaform-shadow:
+      0 1px 2px rgba(0,0,0,.05),
+      0 1px 3px rgba(0,0,0,.1);
+
+  /* Typography */
+  --reactaform-font-size: 14px;
+  --reactaform-font-weight: 500;
+
+  /* Spacing (Tailwind scale) */
+  --reactaform-space: 0.5rem;     /* 2 = 8px */
+  --reactaform-space-lg: 0.75rem; /* 3 = 12px */
+
+  /* Buttons */
+  --reactaform-button-bg: #4f46e5; /* indigo-600 */
+  --reactaform-button-text: #ffffff;
+  --reactaform-button-border-radius: 0.5rem;
+  --reactaform-button-shadow:
+      0 2px 4px rgba(79,70,229,.3);
+
+  /* Tooltip */
+  --reactaform-tooltip-color-bg: rgba(60,60,60,0.92);
+  --reactaform-tooltip-color: #ffffff;
+}

package/dist/utils/cssClasses.d.ts

@@ -0,0 +1,14 @@
+/**
+ * CSS class constants and helpers
+ */
+export declare const CSS_CLASSES: {
+    readonly field: "reactaform-field";
+    readonly label: "reactaform-label";
+    readonly input: "reactaform-input";
+    readonly textInput: "reactaform-input--text";
+    readonly inputNumber: "reactaform-input--number";
+    readonly inputSelect: "reactaform-select";
+    readonly rangeInput: "reactaform-input--range";
+    readonly button: "reactaform-button";
+};
+export declare const combineClasses: (...classes: (string | undefined | null | false | Record<string, boolean>)[]) => string;