@uipath/apollo-wind 2.36.0 → 2.36.2

package/dist/components/custom/flow-properties-simple.cjs

@@ -65,6 +65,7 @@ function FieldItem({ field, onGraphControl }) {
                 onValueChange: setValue,
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                        "aria-label": field.label,
                         className: "h-10 rounded-xl border-0 bg-surface-overlay text-foreground shadow-sm placeholder:text-foreground-muted",
                         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
                             placeholder: field.placeholder ?? 'Select...'

package/dist/components/custom/flow-properties-simple.js

@@ -37,6 +37,7 @@ function FieldItem({ field, onGraphControl }) {
                 onValueChange: setValue,
                 children: [
                     /*#__PURE__*/ jsx(SelectTrigger, {
+                        "aria-label": field.label,
                         className: "h-10 rounded-xl border-0 bg-surface-overlay text-foreground shadow-sm placeholder:text-foreground-muted",
                         children: /*#__PURE__*/ jsx(SelectValue, {
                             placeholder: field.placeholder ?? 'Select...'

package/dist/components/custom/panel-delegate.cjs

@@ -36,7 +36,7 @@ const tooltip_cjs_namespaceObject = require("../ui/tooltip.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 function UiPathLogo({ className }) {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: (0, index_cjs_namespaceObject.cn)('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-[#0092b8] shadow-sm', className),
+        className: (0, index_cjs_namespaceObject.cn)('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-brand shadow-sm', className),
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
             viewBox: "0 0 24 24",
             fill: "none",

package/dist/components/custom/panel-delegate.js

@@ -8,7 +8,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/
 import { cn } from "../../lib/index.js";
 function UiPathLogo({ className }) {
     return /*#__PURE__*/ jsx("div", {
-        className: cn('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-[#0092b8] shadow-sm', className),
+        className: cn('flex h-9 w-9 items-center justify-center overflow-hidden rounded-lg bg-brand shadow-sm', className),
         children: /*#__PURE__*/ jsxs("svg", {
             viewBox: "0 0 24 24",
             fill: "none",

package/dist/components/custom/panel-flow.cjs

@@ -37,7 +37,7 @@ const tooltip_cjs_namespaceObject = require("../ui/tooltip.cjs");
 const index_cjs_namespaceObject = require("../../lib/index.cjs");
 function UiPathLogo() {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
-        className: "flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-[#0092b8] shadow-sm",
+        className: "flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-brand shadow-sm",
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
             viewBox: "0 0 24 24",
             fill: "none",
@@ -101,6 +101,7 @@ function IconRail({ navItems, activeId, onNavClick, onLogoClick, hasShadow }) {
                                         asChild: true,
                                         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("button", {
                                             type: "button",
+                                            "aria-label": item.label,
                                             className: "group flex h-12 w-full items-center justify-center",
                                             onClick: ()=>onNavClick(item.id),
                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {

package/dist/components/custom/panel-flow.js

@@ -8,7 +8,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "../ui/
 import { cn } from "../../lib/index.js";
 function UiPathLogo() {
     return /*#__PURE__*/ jsx("div", {
-        className: "flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-[#0092b8] shadow-sm",
+        className: "flex h-9 w-9 items-center justify-center overflow-clip rounded-lg bg-brand shadow-sm",
         children: /*#__PURE__*/ jsxs("svg", {
             viewBox: "0 0 24 24",
             fill: "none",
@@ -72,6 +72,7 @@ function IconRail({ navItems, activeId, onNavClick, onLogoClick, hasShadow }) {
                                         asChild: true,
                                         children: /*#__PURE__*/ jsx("button", {
                                             type: "button",
+                                            "aria-label": item.label,
                                             className: "group flex h-12 w-full items-center justify-center",
                                             onClick: ()=>onNavClick(item.id),
                                             children: /*#__PURE__*/ jsx("div", {

package/dist/components/forms/field-renderer.cjs

@@ -305,6 +305,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
                         disabled: disabled,
                         children: [
                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                "aria-label": field.label,
                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
                                     placeholder: field.placeholder || 'Select...'
                                 })

package/dist/components/forms/field-renderer.js

@@ -277,6 +277,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
                         disabled: disabled,
                         children: [
                             /*#__PURE__*/ jsx(SelectTrigger, {
+                                "aria-label": field.label,
                                 children: /*#__PURE__*/ jsx(SelectValue, {
                                     placeholder: field.placeholder || 'Select...'
                                 })

package/dist/components/forms/form-designer.cjs

@@ -1061,6 +1061,7 @@ function FormDesigner() {
                                             className: "flex items-center gap-1 px-2 py-1.5",
                                             children: [
                                                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(accordion_cjs_namespaceObject.AccordionTrigger, {
+                                                    "aria-label": `Toggle section ${section.title}`,
                                                     className: "h-5 w-5 p-0 hover:no-underline hover:bg-accent rounded [&>svg]:hidden flex items-center justify-center shrink-0",
                                                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                                                         className: "flex items-center justify-center",
@@ -1100,6 +1101,7 @@ function FormDesigner() {
                                                                 moveSection(section.id, 'up');
                                                             },
                                                             disabled: 0 === sectionIndex,
+                                                            "aria-label": `Move section ${section.title} up`,
                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MoveUp, {
                                                                 className: "h-2.5 w-2.5"
                                                             })
@@ -1113,6 +1115,7 @@ function FormDesigner() {
                                                                 moveSection(section.id, 'down');
                                                             },
                                                             disabled: sectionIndex === sections.length - 1,
+                                                            "aria-label": `Move section ${section.title} down`,
                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MoveDown, {
                                                                 className: "h-2.5 w-2.5"
                                                             })
@@ -1126,6 +1129,7 @@ function FormDesigner() {
                                                                 removeSection(section.id);
                                                             },
                                                             disabled: sections.length <= 1,
+                                                            "aria-label": `Delete section ${section.title}`,
                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Trash2, {
                                                                 className: "h-2.5 w-2.5 text-destructive"
                                                             })
@@ -1192,6 +1196,7 @@ function FormDesigner() {
                                                                                 moveField(section.id, field.id, 'up');
                                                                             },
                                                                             disabled: 0 === fieldIndex,
+                                                                            "aria-label": `Move field ${field.label} up`,
                                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MoveUp, {
                                                                                 className: "h-2.5 w-2.5"
                                                                             })
@@ -1205,6 +1210,7 @@ function FormDesigner() {
                                                                                 moveField(section.id, field.id, 'down');
                                                                             },
                                                                             disabled: fieldIndex === section.fields.length - 1,
+                                                                            "aria-label": `Move field ${field.label} down`,
                                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.MoveDown, {
                                                                                 className: "h-2.5 w-2.5"
                                                                             })
@@ -1217,6 +1223,7 @@ function FormDesigner() {
                                                                                 e.stopPropagation();
                                                                                 removeField(section.id, field.id);
                                                                             },
+                                                                            "aria-label": `Delete field ${field.label}`,
                                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Trash2, {
                                                                                 className: "h-2.5 w-2.5 text-destructive"
                                                                             })
@@ -1467,6 +1474,7 @@ function FieldOptionsEditor({ options, onChange }) {
                             icon: true,
                             className: "text-muted-foreground hover:text-destructive",
                             onClick: ()=>removeOption(index),
+                            "aria-label": "Remove option",
                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Trash2, {
                                 className: "h-4 w-4"
                             })
@@ -1526,6 +1534,7 @@ function DataSourceEditor({ dataSource, onChange }) {
                         },
                         children: [
                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                "aria-label": "Data source type",
                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {})
                             }),
                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(select_cjs_namespaceObject.SelectContent, {
@@ -1707,28 +1716,28 @@ const RULE_EFFECTS = [
         label: 'Show field',
         description: 'Show this field when conditions are met',
         Icon: external_lucide_react_namespaceObject.Eye,
-        color: 'text-green-600 bg-green-50 border-green-200'
+        color: 'text-success bg-success-background border-success/30'
     },
     {
         value: 'hide',
         label: 'Hide field',
         description: 'Hide this field when conditions are met',
         Icon: external_lucide_react_namespaceObject.EyeOff,
-        color: 'text-orange-600 bg-orange-50 border-orange-200'
+        color: 'text-warning bg-warning-background border-warning/30'
     },
     {
         value: 'require',
         label: 'Make required',
         description: 'Require this field when conditions are met',
         Icon: external_lucide_react_namespaceObject.Asterisk,
-        color: 'text-red-600 bg-red-50 border-red-200'
+        color: 'text-error bg-error-background border-error/30'
     },
     {
         value: 'disable',
         label: 'Disable field',
         description: 'Disable this field when conditions are met',
         Icon: external_lucide_react_namespaceObject.Ban,
-        color: 'text-gray-600 bg-gray-50 border-gray-200'
+        color: 'text-muted-foreground bg-muted border-border'
     }
 ];
 function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequiredMessageChange }) {
@@ -1926,19 +1935,19 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
     const getEffectDescription = (rule)=>{
         if (true === rule.effects.visible) return {
             label: 'Show',
-            color: 'text-green-600 bg-green-50'
+            color: 'text-success bg-success-background'
         };
         if (false === rule.effects.visible) return {
             label: 'Hide',
-            color: 'text-orange-600 bg-orange-50'
+            color: 'text-warning bg-warning-background'
         };
         if (true === rule.effects.required) return {
             label: 'Required',
-            color: 'text-red-600 bg-red-50'
+            color: 'text-error bg-error-background'
         };
         if (true === rule.effects.disabled) return {
             label: 'Disabled',
-            color: 'text-gray-600 bg-gray-50'
+            color: 'text-muted-foreground bg-muted'
         };
         return {
             label: 'Unknown',
@@ -1962,7 +1971,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                 className: "flex items-center gap-3",
                                 children: [
                                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Asterisk, {
-                                        className: "h-5 w-5 text-red-500"
+                                        className: "h-5 w-5 text-error"
                                     }),
                                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
                                         children: [
@@ -1979,6 +1988,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                 ]
                             }),
                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(checkbox_cjs_namespaceObject.Checkbox, {
+                                "aria-label": "Always required",
                                 checked: isAlwaysRequired,
                                 onCheckedChange: (checked)=>{
                                     if (checked) {
@@ -2072,6 +2082,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                 size: "sm",
                                                 className: "h-7 w-7 p-0",
                                                 onClick: ()=>editRule(index),
+                                                "aria-label": "Edit rule",
                                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Settings, {
                                                     className: "h-3.5 w-3.5"
                                                 })
@@ -2082,6 +2093,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                 icon: true,
                                                 className: "text-destructive hover:text-destructive",
                                                 onClick: ()=>deleteRule(index),
+                                                "aria-label": "Delete rule",
                                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.Trash2, {
                                                     className: "h-3.5 w-3.5"
                                                 })
@@ -2153,6 +2165,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                         onValueChange: (v)=>setConditionOperator(v),
                                         children: [
                                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                                "aria-label": "Condition match mode",
                                                 className: "w-24 h-7 text-xs",
                                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {})
                                             }),
@@ -2202,6 +2215,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                 }),
                                                             children: [
                                                                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                                                    "aria-label": "Condition field",
                                                                     className: "h-8 text-sm",
                                                                     children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
                                                                         placeholder: "Select field..."
@@ -2225,6 +2239,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                         }),
                                                                     children: [
                                                                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                                                            "aria-label": "Condition operator",
                                                                             className: "w-32 h-8 text-sm",
                                                                             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {})
                                                                         }),
@@ -2245,6 +2260,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                             }),
                                                                         children: [
                                                                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                                                                "aria-label": "Condition value",
                                                                                 className: "h-8 text-sm",
                                                                                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
                                                                                     placeholder: "Select value..."

package/dist/components/forms/form-designer.js

@@ -1033,6 +1033,7 @@ function FormDesigner() {
                                             className: "flex items-center gap-1 px-2 py-1.5",
                                             children: [
                                                 /*#__PURE__*/ jsx(AccordionTrigger, {
+                                                    "aria-label": `Toggle section ${section.title}`,
                                                     className: "h-5 w-5 p-0 hover:no-underline hover:bg-accent rounded [&>svg]:hidden flex items-center justify-center shrink-0",
                                                     children: /*#__PURE__*/ jsx("span", {
                                                         className: "flex items-center justify-center",
@@ -1072,6 +1073,7 @@ function FormDesigner() {
                                                                 moveSection(section.id, 'up');
                                                             },
                                                             disabled: 0 === sectionIndex,
+                                                            "aria-label": `Move section ${section.title} up`,
                                                             children: /*#__PURE__*/ jsx(MoveUp, {
                                                                 className: "h-2.5 w-2.5"
                                                             })
@@ -1085,6 +1087,7 @@ function FormDesigner() {
                                                                 moveSection(section.id, 'down');
                                                             },
                                                             disabled: sectionIndex === sections.length - 1,
+                                                            "aria-label": `Move section ${section.title} down`,
                                                             children: /*#__PURE__*/ jsx(MoveDown, {
                                                                 className: "h-2.5 w-2.5"
                                                             })
@@ -1098,6 +1101,7 @@ function FormDesigner() {
                                                                 removeSection(section.id);
                                                             },
                                                             disabled: sections.length <= 1,
+                                                            "aria-label": `Delete section ${section.title}`,
                                                             children: /*#__PURE__*/ jsx(Trash2, {
                                                                 className: "h-2.5 w-2.5 text-destructive"
                                                             })
@@ -1164,6 +1168,7 @@ function FormDesigner() {
                                                                                 moveField(section.id, field.id, 'up');
                                                                             },
                                                                             disabled: 0 === fieldIndex,
+                                                                            "aria-label": `Move field ${field.label} up`,
                                                                             children: /*#__PURE__*/ jsx(MoveUp, {
                                                                                 className: "h-2.5 w-2.5"
                                                                             })
@@ -1177,6 +1182,7 @@ function FormDesigner() {
                                                                                 moveField(section.id, field.id, 'down');
                                                                             },
                                                                             disabled: fieldIndex === section.fields.length - 1,
+                                                                            "aria-label": `Move field ${field.label} down`,
                                                                             children: /*#__PURE__*/ jsx(MoveDown, {
                                                                                 className: "h-2.5 w-2.5"
                                                                             })
@@ -1189,6 +1195,7 @@ function FormDesigner() {
                                                                                 e.stopPropagation();
                                                                                 removeField(section.id, field.id);
                                                                             },
+                                                                            "aria-label": `Delete field ${field.label}`,
                                                                             children: /*#__PURE__*/ jsx(Trash2, {
                                                                                 className: "h-2.5 w-2.5 text-destructive"
                                                                             })
@@ -1439,6 +1446,7 @@ function FieldOptionsEditor({ options, onChange }) {
                             icon: true,
                             className: "text-muted-foreground hover:text-destructive",
                             onClick: ()=>removeOption(index),
+                            "aria-label": "Remove option",
                             children: /*#__PURE__*/ jsx(Trash2, {
                                 className: "h-4 w-4"
                             })
@@ -1498,6 +1506,7 @@ function DataSourceEditor({ dataSource, onChange }) {
                         },
                         children: [
                             /*#__PURE__*/ jsx(SelectTrigger, {
+                                "aria-label": "Data source type",
                                 children: /*#__PURE__*/ jsx(SelectValue, {})
                             }),
                             /*#__PURE__*/ jsxs(SelectContent, {
@@ -1679,28 +1688,28 @@ const RULE_EFFECTS = [
         label: 'Show field',
         description: 'Show this field when conditions are met',
         Icon: Eye,
-        color: 'text-green-600 bg-green-50 border-green-200'
+        color: 'text-success bg-success-background border-success/30'
     },
     {
         value: 'hide',
         label: 'Hide field',
         description: 'Hide this field when conditions are met',
         Icon: EyeOff,
-        color: 'text-orange-600 bg-orange-50 border-orange-200'
+        color: 'text-warning bg-warning-background border-warning/30'
     },
     {
         value: 'require',
         label: 'Make required',
         description: 'Require this field when conditions are met',
         Icon: Asterisk,
-        color: 'text-red-600 bg-red-50 border-red-200'
+        color: 'text-error bg-error-background border-error/30'
     },
     {
         value: 'disable',
         label: 'Disable field',
         description: 'Disable this field when conditions are met',
         Icon: Ban,
-        color: 'text-gray-600 bg-gray-50 border-gray-200'
+        color: 'text-muted-foreground bg-muted border-border'
     }
 ];
 function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequiredMessageChange }) {
@@ -1898,19 +1907,19 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
     const getEffectDescription = (rule)=>{
         if (true === rule.effects.visible) return {
             label: 'Show',
-            color: 'text-green-600 bg-green-50'
+            color: 'text-success bg-success-background'
         };
         if (false === rule.effects.visible) return {
             label: 'Hide',
-            color: 'text-orange-600 bg-orange-50'
+            color: 'text-warning bg-warning-background'
         };
         if (true === rule.effects.required) return {
             label: 'Required',
-            color: 'text-red-600 bg-red-50'
+            color: 'text-error bg-error-background'
         };
         if (true === rule.effects.disabled) return {
             label: 'Disabled',
-            color: 'text-gray-600 bg-gray-50'
+            color: 'text-muted-foreground bg-muted'
         };
         return {
             label: 'Unknown',
@@ -1934,7 +1943,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                 className: "flex items-center gap-3",
                                 children: [
                                     /*#__PURE__*/ jsx(Asterisk, {
-                                        className: "h-5 w-5 text-red-500"
+                                        className: "h-5 w-5 text-error"
                                     }),
                                     /*#__PURE__*/ jsxs("div", {
                                         children: [
@@ -1951,6 +1960,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                 ]
                             }),
                             /*#__PURE__*/ jsx(Checkbox, {
+                                "aria-label": "Always required",
                                 checked: isAlwaysRequired,
                                 onCheckedChange: (checked)=>{
                                     if (checked) {
@@ -2044,6 +2054,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                 size: "sm",
                                                 className: "h-7 w-7 p-0",
                                                 onClick: ()=>editRule(index),
+                                                "aria-label": "Edit rule",
                                                 children: /*#__PURE__*/ jsx(Settings, {
                                                     className: "h-3.5 w-3.5"
                                                 })
@@ -2054,6 +2065,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                 icon: true,
                                                 className: "text-destructive hover:text-destructive",
                                                 onClick: ()=>deleteRule(index),
+                                                "aria-label": "Delete rule",
                                                 children: /*#__PURE__*/ jsx(Trash2, {
                                                     className: "h-3.5 w-3.5"
                                                 })
@@ -2125,6 +2137,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                         onValueChange: (v)=>setConditionOperator(v),
                                         children: [
                                             /*#__PURE__*/ jsx(SelectTrigger, {
+                                                "aria-label": "Condition match mode",
                                                 className: "w-24 h-7 text-xs",
                                                 children: /*#__PURE__*/ jsx(SelectValue, {})
                                             }),
@@ -2174,6 +2187,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                 }),
                                                             children: [
                                                                 /*#__PURE__*/ jsx(SelectTrigger, {
+                                                                    "aria-label": "Condition field",
                                                                     className: "h-8 text-sm",
                                                                     children: /*#__PURE__*/ jsx(SelectValue, {
                                                                         placeholder: "Select field..."
@@ -2197,6 +2211,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                         }),
                                                                     children: [
                                                                         /*#__PURE__*/ jsx(SelectTrigger, {
+                                                                            "aria-label": "Condition operator",
                                                                             className: "w-32 h-8 text-sm",
                                                                             children: /*#__PURE__*/ jsx(SelectValue, {})
                                                                         }),
@@ -2217,6 +2232,7 @@ function RulesEditor({ rules = [], onChange, allFields, requiredMessage, onRequi
                                                                             }),
                                                                         children: [
                                                                             /*#__PURE__*/ jsx(SelectTrigger, {
+                                                                                "aria-label": "Condition value",
                                                                                 className: "h-8 text-sm",
                                                                                 children: /*#__PURE__*/ jsx(SelectValue, {
                                                                                     placeholder: "Select value..."

package/dist/components/forms/form-examples.cjs

@@ -924,7 +924,7 @@ function FileUploadExample() {
                                     children: [
                                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(badge_cjs_namespaceObject.Badge, {
                                             variant: "outline",
-                                            className: "bg-green-50 text-green-700 border-green-200",
+                                            className: "bg-success-background text-success border-success/30",
                                             children: "✓"
                                         }),
                                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {

package/dist/components/forms/form-examples.js

@@ -889,7 +889,7 @@ function FileUploadExample() {
                                     children: [
                                         /*#__PURE__*/ jsx(Badge, {
                                             variant: "outline",
-                                            className: "bg-green-50 text-green-700 border-green-200",
+                                            className: "bg-success-background text-success border-success/30",
                                             children: "✓"
                                         }),
                                         /*#__PURE__*/ jsx("span", {

package/dist/components/forms/form-state-viewer.cjs

@@ -63,8 +63,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                             className: "flex gap-2",
                             children: [
                                 stats.isValid ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(badge_cjs_namespaceObject.Badge, {
-                                    variant: "default",
-                                    className: "bg-green-600",
+                                    variant: "success",
                                     children: [
                                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.CheckCircle2, {
                                             className: "w-3 h-3 mr-1"
@@ -117,8 +116,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                                 className: "flex gap-2",
                                 children: [
                                     stats.isValid ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(badge_cjs_namespaceObject.Badge, {
-                                        variant: "default",
-                                        className: "bg-green-600",
+                                        variant: "success",
                                         children: [
                                             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.CheckCircle2, {
                                                 className: "w-3 h-3 mr-1"
@@ -295,7 +293,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                                             children: "Validation errors from Zod schema"
                                         }),
                                         0 === Object.keys(formState.errors).length ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                                            className: "flex items-center gap-2 p-4 bg-green-50 dark:bg-green-900/10 rounded text-green-700 dark:text-green-400",
+                                            className: "flex items-center gap-2 p-4 bg-success-background/25 rounded text-success",
                                             children: [
                                                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.CheckCircle2, {
                                                     className: "w-5 h-5"
@@ -466,8 +464,7 @@ function StateItem({ label, value, type = 'boolean' }) {
                 children: label
             }),
             'boolean' === type ? value ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(badge_cjs_namespaceObject.Badge, {
-                variant: "default",
-                className: "bg-green-600",
+                variant: "success",
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_lucide_react_namespaceObject.CheckCircle2, {
                         className: "w-3 h-3 mr-1"

package/dist/components/forms/form-state-viewer.js

@@ -35,8 +35,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                             className: "flex gap-2",
                             children: [
                                 stats.isValid ? /*#__PURE__*/ jsxs(Badge, {
-                                    variant: "default",
-                                    className: "bg-green-600",
+                                    variant: "success",
                                     children: [
                                         /*#__PURE__*/ jsx(CheckCircle2, {
                                             className: "w-3 h-3 mr-1"
@@ -89,8 +88,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                                 className: "flex gap-2",
                                 children: [
                                     stats.isValid ? /*#__PURE__*/ jsxs(Badge, {
-                                        variant: "default",
-                                        className: "bg-green-600",
+                                        variant: "success",
                                         children: [
                                             /*#__PURE__*/ jsx(CheckCircle2, {
                                                 className: "w-3 h-3 mr-1"
@@ -267,7 +265,7 @@ function FormStateViewer({ form, title = 'Form State', className = '', compact =
                                             children: "Validation errors from Zod schema"
                                         }),
                                         0 === Object.keys(formState.errors).length ? /*#__PURE__*/ jsxs("div", {
-                                            className: "flex items-center gap-2 p-4 bg-green-50 dark:bg-green-900/10 rounded text-green-700 dark:text-green-400",
+                                            className: "flex items-center gap-2 p-4 bg-success-background/25 rounded text-success",
                                             children: [
                                                 /*#__PURE__*/ jsx(CheckCircle2, {
                                                     className: "w-5 h-5"
@@ -438,8 +436,7 @@ function StateItem({ label, value, type = 'boolean' }) {
                 children: label
             }),
             'boolean' === type ? value ? /*#__PURE__*/ jsxs(Badge, {
-                variant: "default",
-                className: "bg-green-600",
+                variant: "success",
                 children: [
                     /*#__PURE__*/ jsx(CheckCircle2, {
                         className: "w-3 h-3 mr-1"

package/dist/components/forms/metadata-form.cjs

@@ -360,7 +360,7 @@ function FormSection({ section, context, customComponents, disabled, sectionVari
     const isPlain = 'plain' === sectionVariant;
     const dividerClassName = 'border-t first:border-t-0';
     const wrapperClassName = isPlain ? 'border-b-0' : 'border rounded-lg px-3';
-    const triggerClassName = isPlain ? 'justify-start gap-2 py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
+    const triggerClassName = isPlain ? 'py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
     const fieldsGrid = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         className: "grid",
         style: {

package/dist/components/forms/metadata-form.js

@@ -332,7 +332,7 @@ function FormSection({ section, context, customComponents, disabled, sectionVari
     const isPlain = 'plain' === sectionVariant;
     const dividerClassName = 'border-t first:border-t-0';
     const wrapperClassName = isPlain ? 'border-b-0' : 'border rounded-lg px-3';
-    const triggerClassName = isPlain ? 'justify-start gap-2 py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
+    const triggerClassName = isPlain ? 'py-4 text-sm font-semibold hover:no-underline' : 'text-sm font-medium';
     const fieldsGrid = /*#__PURE__*/ jsx("div", {
         className: "grid",
         style: {