eai-frontend-components 2.0.16 → 2.0.17

package/dist/index.js

@@ -2815,6 +2815,16 @@ const FormSelect = ({ control, name, label, subLabel, helpText, placeholder, cla
     return (jsxRuntime.jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (jsxRuntime.jsxs(FormItem, { className: className, children: [jsxRuntime.jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), jsxRuntime.jsx(FormControl, { children: jsxRuntime.jsxs(SelectPrimitive.Select, { onValueChange: field.onChange, defaultValue: field.value, disabled: disabled, children: [jsxRuntime.jsx(SelectTrigger, { className: cn('', formState.errors[name] ? 'border-red-600' : '', className), children: jsxRuntime.jsx(SelectValue, { className: 'text-slate-400', placeholder: placeholder }) }), jsxRuntime.jsx(SelectContent, { className: 'bg-white cursor-pointer', children: jsxRuntime.jsx(SelectGroup, { children: options.map((option) => (jsxRuntime.jsx(SelectItem, { value: option.value, children: option.label }, option.value))) }) })] }) }), formMessage(FormMessage)] })) }));
 };
 
+const StepNewForm = ({ steps, currentIndex }) => {
+    const getStepIcon = (index) => {
+        if (index < currentIndex) {
+            return (jsxRuntime.jsx("div", { className: 'flex w-6 h-6 rounded-md items-center justify-center bg-background-secondary border', children: jsxRuntime.jsx(lucideReact.Check, { size: 16, className: 'stroke-2 stroke-primary' }) }));
+        }
+        return (jsxRuntime.jsx("div", { className: `flex w-6 h-6 rounded-md items-center justify-center border ${index === currentIndex ? 'bg-background-primary text-white' : 'bg-white text-black'}`, children: index + 1 }));
+    };
+    return (jsxRuntime.jsx("div", { className: 'flex flex-row gap-x-3 my-2.5', children: steps.map((step, index, array) => (jsxRuntime.jsxs("div", { className: 'flex items-center text-sm font-medium gap-x-3', children: [jsxRuntime.jsxs("div", { className: 'flex items-center text-sm font-medium gap-x-3', children: [getStepIcon(index), step.label] }), index + 1 < array.length && (jsxRuntime.jsx("div", { className: 'w-10', children: jsxRuntime.jsx(Separator, {}) }))] }, step.id))) }));
+};
+
 const FormInputSwitch = ({ control, name, label, subLabel, helpText, className, disabled, onCheckedChange }) => {
     const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
     return (jsxRuntime.jsx(FormField, { control: control, name: name, render: ({ field }) => (jsxRuntime.jsxs(FormItem, { className: cn('flex items-top gap-x-2', className), children: [jsxRuntime.jsx(FormControl, { children: jsxRuntime.jsx(Switch, { ...field, checked: field.value, onCheckedChange: (checked) => {
@@ -3492,6 +3502,7 @@ exports.SidebarSubmenuType = SidebarSubmenuType;
 exports.SidebarTrigger = SidebarTrigger;
 exports.Skeleton = Skeleton;
 exports.Slider = Slider;
+exports.StepNewForm = StepNewForm;
 exports.Switch = Switch;
 exports.Table = Table;
 exports.TableBody = TableBody;