@uipath/apollo-wind 0.7.2-pr188.4865fad

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

@@ -0,0 +1,595 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    FormFieldRenderer: ()=>FormFieldRenderer
+});
+const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const external_react_namespaceObject = require("react");
+const external_react_hook_form_namespaceObject = require("react-hook-form");
+const external_form_schema_cjs_namespaceObject = require("./form-schema.cjs");
+const external_rules_engine_cjs_namespaceObject = require("./rules-engine.cjs");
+const external_data_fetcher_cjs_namespaceObject = require("./data-fetcher.cjs");
+const input_cjs_namespaceObject = require("../ui/input.cjs");
+const textarea_cjs_namespaceObject = require("../ui/textarea.cjs");
+const select_cjs_namespaceObject = require("../ui/select.cjs");
+const multi_select_cjs_namespaceObject = require("../ui/multi-select.cjs");
+const checkbox_cjs_namespaceObject = require("../ui/checkbox.cjs");
+const switch_cjs_namespaceObject = require("../ui/switch.cjs");
+const radio_group_cjs_namespaceObject = require("../ui/radio-group.cjs");
+const slider_cjs_namespaceObject = require("../ui/slider.cjs");
+const label_cjs_namespaceObject = require("../ui/label.cjs");
+const date_picker_cjs_namespaceObject = require("../ui/date-picker.cjs");
+const datetime_picker_cjs_namespaceObject = require("../ui/datetime-picker.cjs");
+const file_upload_cjs_namespaceObject = require("../ui/file-upload.cjs");
+const index_cjs_namespaceObject = require("../../lib/index.cjs");
+function FormFieldRenderer({ field, context, customComponents, disabled: formDisabled = false }) {
+    const { control, watch, getValues } = (0, external_react_hook_form_namespaceObject.useFormContext)();
+    const contextRef = (0, external_react_namespaceObject.useRef)(context);
+    contextRef.current = context;
+    const getInitialVisibility = ()=>{
+        if (!field.rules || 0 === field.rules.length) return true;
+        const hasShowRule = field.rules.some((rule)=>rule.effects?.visible === true);
+        const hasHideRule = field.rules.some((rule)=>rule.effects?.visible === false);
+        if (!hasShowRule && !hasHideRule) return true;
+        const allValues = getValues();
+        const ruleResult = external_rules_engine_cjs_namespaceObject.RulesEngine.applyRules(field.rules, allValues, context);
+        if (void 0 !== ruleResult.visible) return ruleResult.visible;
+        return !hasShowRule;
+    };
+    const getInitialRequired = ()=>{
+        const staticRequired = field.validation?.required ?? false;
+        if (!field.rules || 0 === field.rules.length) return staticRequired;
+        const allValues = getValues();
+        const ruleResult = external_rules_engine_cjs_namespaceObject.RulesEngine.applyRules(field.rules, allValues, context);
+        return ruleResult.required ?? staticRequired;
+    };
+    const [fieldState, setFieldState] = (0, external_react_namespaceObject.useState)({
+        visible: getInitialVisibility(),
+        disabled: false,
+        required: getInitialRequired(),
+        options: (0, external_form_schema_cjs_namespaceObject.hasOptions)(field) ? field.options || [] : []
+    });
+    const dependentFields = (0, external_react_namespaceObject.useMemo)(()=>{
+        if (!field.rules || 0 === field.rules.length) return [];
+        const fields = new Set();
+        field.rules.forEach((rule)=>{
+            rule.conditions?.forEach((condition)=>{
+                if ('when' in condition && condition.when) fields.add(condition.when);
+            });
+        });
+        return Array.from(fields);
+    }, [
+        field.rules
+    ]);
+    const dataSourceDependentFields = (0, external_react_namespaceObject.useMemo)(()=>{
+        if (!field.dataSource) return [];
+        const fields = new Set();
+        if ('params' in field.dataSource && field.dataSource.params) Object.values(field.dataSource.params).forEach((value)=>{
+            if ('string' == typeof value && value.startsWith('$')) fields.add(value.slice(1));
+        });
+        if ('computed' === field.dataSource.type && 'dependency' in field.dataSource) field.dataSource.dependency.forEach((dep)=>fields.add(dep));
+        return Array.from(fields);
+    }, [
+        field.dataSource
+    ]);
+    const watchedDataSourceValues = watch(dataSourceDependentFields);
+    const watchedRuleDependentValues = watch(dependentFields);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!field.rules || 0 === field.rules.length) return;
+        const allValues = getValues();
+        const ruleResult = external_rules_engine_cjs_namespaceObject.RulesEngine.applyRules(field.rules, allValues, contextRef.current);
+        const hasShowRule = field.rules.some((rule)=>rule.effects?.visible === true);
+        const hasHideRule = field.rules.some((rule)=>rule.effects?.visible === false);
+        const hasRequiredRule = field.rules.some((rule)=>rule.effects?.required !== void 0);
+        const hasDisabledRule = field.rules.some((rule)=>rule.effects?.disabled !== void 0);
+        const newState = {};
+        if (void 0 !== ruleResult.visible) newState.visible = ruleResult.visible;
+        else if (hasShowRule || hasHideRule) newState.visible = !hasShowRule;
+        if (void 0 !== ruleResult.required) newState.required = ruleResult.required;
+        else if (hasRequiredRule) {
+            const hasUnconditionalRequired = field.rules.some((rule)=>rule.effects?.required === true && 0 === rule.conditions.length);
+            newState.required = hasUnconditionalRequired || (field.validation?.required ?? false);
+        }
+        if (void 0 !== ruleResult.disabled) newState.disabled = ruleResult.disabled;
+        else if (hasDisabledRule) newState.disabled = false;
+        setFieldState((prev)=>{
+            const nextState = {
+                ...prev,
+                ...newState
+            };
+            if ((0, index_cjs_namespaceObject.deepEqual)(prev, nextState)) return prev;
+            return nextState;
+        });
+    }, [
+        field.rules,
+        field.validation?.required,
+        getValues,
+        watchedRuleDependentValues
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (field.dataSource) return;
+        if (!(0, external_form_schema_cjs_namespaceObject.hasOptions)(field)) return;
+        const inlineOptions = field.options || [];
+        setFieldState((prev)=>{
+            if ((0, index_cjs_namespaceObject.deepEqual)(prev.options, inlineOptions)) return prev;
+            return {
+                ...prev,
+                options: inlineOptions
+            };
+        });
+    }, [
+        field
+    ]);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (!field.dataSource) return;
+        const fetchOptions = async ()=>{
+            try {
+                const allValues = getValues();
+                const data = await external_data_fetcher_cjs_namespaceObject.DataFetcher.fetch(field.dataSource, allValues);
+                setFieldState((prev)=>{
+                    if ((0, index_cjs_namespaceObject.deepEqual)(prev.options, data)) return prev;
+                    return {
+                        ...prev,
+                        options: data
+                    };
+                });
+            } catch (error) {
+                console.error(`Failed to fetch options for ${field.name}:`, error);
+            }
+        };
+        fetchOptions();
+    }, [
+        field.dataSource,
+        field.name,
+        getValues,
+        watchedDataSourceValues
+    ]);
+    if (!fieldState.visible) return null;
+    const gridSpan = field.grid?.span || 1;
+    const gridStyle = {
+        gridColumn: `span ${gridSpan}`
+    };
+    if ((0, external_form_schema_cjs_namespaceObject.isCustomField)(field) && customComponents[field.component]) {
+        const CustomComponent = customComponents[field.component];
+        return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+            style: gridStyle,
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_hook_form_namespaceObject.Controller, {
+                name: field.name,
+                control: control,
+                defaultValue: field.defaultValue,
+                render: ({ field: formField, fieldState: { error } })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CustomComponent, {
+                        ...formField,
+                        ...field.componentProps,
+                        field: field,
+                        disabled: formDisabled || fieldState.disabled,
+                        required: fieldState.required,
+                        error: error?.message
+                    })
+            })
+        });
+    }
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        style: gridStyle,
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_react_hook_form_namespaceObject.Controller, {
+            name: field.name,
+            control: control,
+            defaultValue: field.defaultValue,
+            render: ({ field: formField, fieldState: { error } })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FieldByType, {
+                    field: field,
+                    formField: formField,
+                    error: error?.message,
+                    disabled: formDisabled || fieldState.disabled,
+                    required: fieldState.required,
+                    options: fieldState.options
+                })
+        })
+    });
+}
+function FieldByType({ field, formField, error, disabled, required, options }) {
+    switch(field.type){
+        case 'text':
+        case 'email':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_cjs_namespaceObject.Input, {
+                        value: formField.value,
+                        onChange: (e)=>formField.onChange(e.target.value),
+                        onBlur: formField.onBlur,
+                        name: formField.name,
+                        ref: formField.ref,
+                        type: field.type,
+                        placeholder: field.placeholder,
+                        disabled: disabled,
+                        "aria-label": field.ariaLabel
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'number':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_cjs_namespaceObject.Input, {
+                        value: formField.value,
+                        onBlur: formField.onBlur,
+                        name: formField.name,
+                        ref: formField.ref,
+                        type: "number",
+                        min: field.min,
+                        max: field.max,
+                        step: field.step,
+                        placeholder: field.placeholder,
+                        disabled: disabled,
+                        onChange: (e)=>formField.onChange(parseFloat(e.target.value))
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'textarea':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(textarea_cjs_namespaceObject.Textarea, {
+                        value: formField.value,
+                        onChange: (e)=>formField.onChange(e.target.value),
+                        onBlur: formField.onBlur,
+                        name: formField.name,
+                        ref: formField.ref,
+                        placeholder: field.placeholder,
+                        disabled: disabled,
+                        rows: field.rows || 4
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'select':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(select_cjs_namespaceObject.Select, {
+                        value: formField.value,
+                        onValueChange: formField.onChange,
+                        disabled: disabled,
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
+                                    placeholder: field.placeholder || 'Select...'
+                                })
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectContent, {
+                                children: options.map((option)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectItem, {
+                                        value: String(option.value),
+                                        disabled: 'disabled' in option ? Boolean(option.disabled) : false,
+                                        children: option.label
+                                    }, String(option.value)))
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'multiselect':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(multi_select_cjs_namespaceObject.MultiSelect, {
+                        selected: formField.value || [],
+                        onChange: formField.onChange,
+                        options: options.map((opt)=>({
+                                label: opt.label,
+                                value: String(opt.value)
+                            })),
+                        disabled: disabled,
+                        placeholder: field.placeholder || 'Select items...',
+                        emptyMessage: "No items found.",
+                        searchPlaceholder: "Search...",
+                        maxSelected: field.maxSelected
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'checkbox':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "flex items-start space-x-2",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(checkbox_cjs_namespaceObject.Checkbox, {
+                                checked: true === formField.value,
+                                onCheckedChange: (checked)=>formField.onChange(true === checked),
+                                disabled: disabled,
+                                id: field.name
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                                className: "space-y-1 leading-none",
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                                        htmlFor: field.name,
+                                        className: "font-normal",
+                                        children: field.label
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                                        children: field.description
+                                    })
+                                ]
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'switch':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "flex items-center justify-between",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                                className: "space-y-0.5",
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                                        children: field.label
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                                        children: field.description
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(switch_cjs_namespaceObject.Switch, {
+                                checked: true === formField.value,
+                                onCheckedChange: (checked)=>formField.onChange(true === checked),
+                                disabled: disabled
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'radio':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(radio_group_cjs_namespaceObject.RadioGroup, {
+                        value: formField.value,
+                        onValueChange: formField.onChange,
+                        disabled: disabled,
+                        children: options.map((option)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                                className: "flex items-center space-x-2",
+                                children: [
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(radio_group_cjs_namespaceObject.RadioGroupItem, {
+                                        value: String(option.value),
+                                        id: `${field.name}-${option.value}`,
+                                        disabled: 'disabled' in option ? Boolean(option.disabled) : false
+                                    }),
+                                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(label_cjs_namespaceObject.Label, {
+                                        htmlFor: `${field.name}-${option.value}`,
+                                        children: option.label
+                                    })
+                                ]
+                            }, String(option.value)))
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'slider':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                        className: "flex justify-between",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                                required: required,
+                                children: field.label
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                className: "text-sm text-muted-foreground",
+                                children: formField.value
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(slider_cjs_namespaceObject.Slider, {
+                        value: [
+                            formField.value
+                        ],
+                        onValueChange: (values)=>formField.onChange(values[0]),
+                        min: field.min || 0,
+                        max: field.max || 100,
+                        step: field.step || 1,
+                        disabled: disabled
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'date':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(date_picker_cjs_namespaceObject.DatePicker, {
+                        value: formField.value,
+                        onValueChange: formField.onChange,
+                        disabled: disabled,
+                        placeholder: field.placeholder
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'datetime':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(datetime_picker_cjs_namespaceObject.DateTimePicker, {
+                        value: formField.value,
+                        onValueChange: formField.onChange,
+                        disabled: disabled,
+                        placeholder: field.placeholder,
+                        use12Hour: field.use12Hour
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        case 'file':
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(FormField, {
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormLabel, {
+                        required: required,
+                        children: field.label
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(file_upload_cjs_namespaceObject.FileUpload, {
+                        accept: field.accept,
+                        multiple: field.multiple,
+                        disabled: disabled,
+                        maxSize: field.maxSize,
+                        showPreview: field.showPreview,
+                        onFilesChange: (files)=>{
+                            formField.onChange(field.multiple ? files : files[0]);
+                        }
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormDescription, {
+                        children: field.description
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(FormError, {
+                        children: error
+                    })
+                ]
+            });
+        default:
+            return null;
+    }
+}
+function FormField({ children, className = '' }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+        className: (0, index_cjs_namespaceObject.cn)('space-y-2', className),
+        children: children
+    });
+}
+function FormLabel({ children, required, htmlFor, className = '' }) {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(label_cjs_namespaceObject.Label, {
+        htmlFor: htmlFor,
+        className: className,
+        children: [
+            children,
+            required && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "text-destructive ml-1",
+                children: "*"
+            })
+        ]
+    });
+}
+function FormDescription({ children }) {
+    if (!children) return null;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+        className: "text-sm text-muted-foreground",
+        children: children
+    });
+}
+function FormError({ children }) {
+    if (!children) return null;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("p", {
+        className: "text-sm text-destructive",
+        children: children
+    });
+}
+exports.FormFieldRenderer = __webpack_exports__.FormFieldRenderer;
+for(var __webpack_i__ in __webpack_exports__)if (-1 === [
+    "FormFieldRenderer"
+].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/components/forms/field-renderer.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import type { FieldMetadata, FormContext, CustomFieldComponentProps } from './form-schema';
+/**
+ * Field Renderer - Connects metadata to actual UI components
+ * Integrates with shadcn/ui components from apollo-wind
+ */
+interface FormFieldRendererProps {
+    field: FieldMetadata;
+    context: FormContext;
+    customComponents: Record<string, React.ComponentType<CustomFieldComponentProps>>;
+    disabled?: boolean;
+}
+export declare function FormFieldRenderer({ field, context, customComponents, disabled: formDisabled, }: FormFieldRendererProps): import("react/jsx-runtime").JSX.Element | null;
+export {};