eai-frontend-components 2.0.14 → 2.0.16

package/dist/components/ui/custom/form/multi-select.js

@@ -0,0 +1,66 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { cva } from 'class-variance-authority';
+import { CheckIcon, ChevronDown, X } from 'lucide-react';
+import * as React from 'react';
+import { cn } from '../../../../lib/utils';
+import { Badge } from '../../badge';
+import { Button } from '../../button';
+import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from '../../command';
+import * as FormComponents from '../../form';
+import { Popover, PopoverContent, PopoverTrigger } from '../../popover';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+const multiSelectVariants = cva('m-1 rounded-[6px]', {
+    variants: {
+        variant: {
+            default: 'text-foreground bg-background-secondary dark:bg-popover hover:bg-background-secondary',
+            secondary: 'border-foreground/10 bg-secondary text-secondary-foreground hover:bg-secondary/80',
+            destructive: 'border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80',
+            inverted: 'inverted',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+export const MultiSelect = React.forwardRef(({ control, name, label, subLabel, helpText, options, variant, placeholder, maxCount = 2, modalPopover = false, asChild = false, className, required, ...props }, ref) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);
+    const DEFAULT_PLACEHOLDER_FILTER = 'Digite para buscar...';
+    const DEFAULT_PLACEHOLDER = 'Selecione';
+    const toggleOption = (option, field) => {
+        const prevValue = field.value || [];
+        const newValue = prevValue?.some((item) => item.value === option.value)
+            ? prevValue.filter((item) => item.value !== option.value)
+            : [...prevValue, option];
+        field.onChange(newValue);
+    };
+    const handleClear = (field) => {
+        field.onChange([]);
+    };
+    const handleTogglePopover = () => {
+        setIsPopoverOpen((prev) => !prev);
+    };
+    const toggleAll = (field) => {
+        if (field.value?.length === options.length) {
+            handleClear(field);
+        }
+        else {
+            const allValues = options.map((option) => option);
+            field.onChange(allValues);
+        }
+    };
+    return (_jsx(FormField, { control: control, name: name, render: ({ field }) => (_jsxs(FormItem, { children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsxs(Popover, { open: isPopoverOpen, onOpenChange: setIsPopoverOpen, modal: modalPopover, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { ref: ref, ...props, onClick: handleTogglePopover, className: cn('flex w-full p-1 rounded-md border min-h-10 h-auto items-center justify-between bg-background hover:bg-background [&_svg]:size-3.5', className), children: field.value?.length > 0 ? (_jsxs("div", { className: 'flex justify-between items-center w-full', children: [_jsxs("div", { className: 'flex items-center', children: [_jsx("div", { className: `grid grid-cols-${maxCount}`, children: field.value.slice(0, maxCount).map((option) => {
+                                                        return (_jsxs(Badge, { className: cn(multiSelectVariants({ variant })), onClick: (event) => {
+                                                                event.stopPropagation();
+                                                                toggleOption(option, field);
+                                                            }, children: [_jsx("div", { className: 'truncate', children: option?.label }), _jsx(X, { className: 'ml-2 cursor-pointer text-zinc-500' })] }, `msoptlbl-${option.value}`));
+                                                    }) }), field.value?.length > maxCount && (_jsx(Badge, { variant: 'surface', children: `+${field.value?.length - maxCount}` }))] }), _jsx("div", { className: 'flex items-center justify-between', children: _jsx(ChevronDown, { className: 'h-4 mx-2 cursor-pointer text-muted-foreground' }) })] })) : (_jsxs("div", { className: 'flex items-center justify-between w-full mx-auto', children: [_jsx("span", { className: 'text-sm text-muted-foreground mx-3', children: placeholder ?? DEFAULT_PLACEHOLDER }), _jsx(ChevronDown, { className: 'h-4 cursor-pointer text-muted-foreground mx-2' })] })) }) }), _jsx(PopoverContent, { className: cn('w-auto p-0', 'w-[--radix-popover-trigger-width]'), align: 'start', onEscapeKeyDown: () => setIsPopoverOpen(false), children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: DEFAULT_PLACEHOLDER_FILTER }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "Nenhum resultado encontrado" }), _jsxs(CommandGroup, { children: [_jsxs(CommandItem, { onSelect: () => toggleAll(field), className: 'cursor-pointer', children: [_jsx("div", { className: cn('mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary', field.value?.length === options.length
+                                                                    ? 'bg-primary text-primary-foreground'
+                                                                    : 'opacity-50 [&_svg]:invisible'), children: _jsx(CheckIcon, { className: 'h-4 w-4' }) }), _jsx("span", { children: "(Selecionar Todos)" })] }, 'all'), options.map((option) => {
+                                                        const isSelected = field.value?.some((item) => item.value === option.value);
+                                                        return (_jsxs(CommandItem, { onSelect: () => toggleOption(option, field), className: 'cursor-pointer', children: [_jsx("div", { className: cn('mr-2 flex h-4 w-4 items-center justify-center rounded-sm border border-primary', isSelected ? 'bg-primary text-primary-foreground' : 'opacity-50 [&_svg]:invisible'), children: _jsx(CheckIcon, { className: 'h-4 w-4' }) }), _jsx("span", { children: option.label })] }, `msopt-${option.value}`));
+                                                    })] })] })] }) })] }), formMessage(FormMessage)] })) }));
+});
+MultiSelect.displayName = 'MultiSelect';

package/dist/components/ui/custom/form/password.d.ts

@@ -0,0 +1,16 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    placeholder?: string;
+    maxLength?: number;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+export declare const FormInputPassWord: React.FC<Props>;
+export {};
+//# sourceMappingURL=password.d.ts.map

package/dist/components/ui/custom/form/password.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"password.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/password.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CAChE;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+C7C,CAAC"}

package/dist/components/ui/custom/form/password.js

@@ -0,0 +1,14 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Eye, EyeOff } from 'lucide-react';
+import { useState } from 'react';
+import * as FormComponents from '../../form';
+import { InputText } from '../../input';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormInputPassWord = ({ control, name, label, subLabel, helpText, placeholder, maxLength, className, disabled, required, }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    const [showPassword, setShowPassword] = useState(true);
+    const togglePasswordVisibility = () => setShowPassword((prev) => !prev);
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsxs("div", { className: 'relative w-full', children: [_jsx(InputText, { ...field, type: showPassword ? 'password' : 'text', name: name, maxLength: maxLength, className: className, placeholder: placeholder, disabled: disabled || formState.isSubmitting }), _jsx("button", { type: 'button', onClick: togglePasswordVisibility, className: 'absolute inset-y-0 right-2 flex items-center', children: showPassword ? _jsx(EyeOff, { className: 'w-5 h-5 text-slate-500' }) : _jsx(Eye, { className: 'w-5 h-5 text-slate-500' }) })] }) }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/percent.d.ts

@@ -0,0 +1,14 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+export declare const FormInputPercent: React.FC<Props>;
+export {};
+//# sourceMappingURL=percent.d.ts.map

package/dist/components/ui/custom/form/percent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"percent.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/percent.tsx"],"names":[],"mappings":"AAOA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CAChE;AAED,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAgC5C,CAAC"}

package/dist/components/ui/custom/form/percent.js

@@ -0,0 +1,15 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import * as FormComponents from '../../form';
+import { MaskInputDecimal } from '../../input';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormInputPercent = ({ control, name, label, subLabel, helpText, className, disabled, required, onChange }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsx(MaskInputDecimal, { ...field, symbol: '%', className: `${className}`, disabled: disabled || formState.isSubmitting, onChange: (e) => {
+                            field.onChange(e);
+                            if (onChange) {
+                                onChange(e);
+                            }
+                        } }) }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/phone.d.ts

@@ -0,0 +1,16 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onKeyUp?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+}
+export declare const FormInputPhone: React.FC<Props>;
+export {};
+//# sourceMappingURL=phone.d.ts.map

package/dist/components/ui/custom/form/phone.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"phone.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/phone.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAChE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CACjE;AAID,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAsD1C,CAAC"}

package/dist/components/ui/custom/form/phone.js

@@ -0,0 +1,23 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import * as FormComponents from '../../form';
+import { MaskInputFone } from '../../input';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+const masks = ['(99) 9999-99999', '(99) 9 9999-9999'];
+export const FormInputPhone = ({ control, name, label, subLabel, helpText, placeholder, className, disabled, required, onChange, onKeyUp, }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    const [mask, setMask] = useState(masks[0]);
+    const getMask = (val) => (val.replace(/\D/g, '').length > 10 ? masks[1] : masks[0]);
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => {
+            useEffect(() => {
+                setMask(getMask(field.value || ''));
+            }, [field.value]);
+            return (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsx(MaskInputFone, { ...field, className: className, placeholder: placeholder ?? '(00) 0 0000-0000', disabled: disabled || formState.isSubmitting, mask: mask, onChange: (e) => {
+                                onChange?.(e);
+                                field.onChange(e);
+                                setMask(getMask(e.target.value));
+                            }, onKeyUp: (e) => onKeyUp?.(e) }) }), formMessage(FormMessage)] }));
+        } }));
+};

package/dist/components/ui/custom/form/radio-group.d.ts

@@ -0,0 +1,23 @@
+export interface RadioOption {
+    value: string;
+    label: string;
+    description?: string;
+    disabled?: boolean;
+}
+interface Props {
+    control: any;
+    name: string;
+    value?: string;
+    label?: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    className?: string;
+    classNameOptions?: string;
+    disabled?: boolean;
+    required?: boolean;
+    options?: RadioOption[];
+    onChange?: (value: string) => void;
+}
+export declare const FormRadioGroup: React.FC<Props>;
+export {};
+//# sourceMappingURL=radio-group.d.ts.map

package/dist/components/ui/custom/form/radio-group.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/radio-group.tsx"],"names":[],"mappings":"AASA,MAAM,WAAW,WAAW;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AACD,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC;AAED,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+D1C,CAAC"}

package/dist/components/ui/custom/form/radio-group.js

@@ -0,0 +1,15 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { cn } from '../../../../lib/utils';
+import * as FormComponents from '../../form';
+import { Label } from '../../label';
+import { RadioGroup, RadioGroupItem } from '../../radio-group';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormRadioGroup = ({ control, name, value, label, subLabel, helpText, className, classNameOptions, disabled, required, options, onChange, }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { children: [_jsxs("div", { className: cn('flex items-center space-x-1.5 mb-2', className), children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsx(RadioGroup, { onValueChange: (value) => {
+                            field?.onChange?.(value);
+                            onChange?.(value);
+                        }, defaultValue: field.value, disabled: disabled || formState.isSubmitting, className: `${className}`, children: _jsx("div", { className: cn('flex flex-grow gap-6', classNameOptions), children: options?.map((option, index) => (_jsxs("div", { className: 'flex flex-col', children: [_jsxs("div", { className: 'flex items-center space-x-2', children: [_jsx(RadioGroupItem, { value: option.value, id: `r${option.value}`, checked: field.value === option.value, disabled: option.disabled }), _jsx(Label, { htmlFor: `r${option.value}`, className: option.disabled ? 'opacity-50' : '', children: option.label })] }, `radio-${name}-${index}`), option.description && (_jsx("div", { className: cn('pl-6 text-zinc-500', { 'opacity-50': option.disabled }), children: option.description }))] }, `radio-${name}-${index}`))) }) }) }), formMessage(FormMessage)] })) }, value));
+};

package/dist/components/ui/custom/form/select.d.ts

@@ -0,0 +1,20 @@
+export interface SelectOption {
+    value: string;
+    label: string;
+    default?: boolean;
+}
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    options: SelectOption[];
+}
+export declare const FormSelect: React.FC<Props>;
+export {};
+//# sourceMappingURL=select.d.ts.map

package/dist/components/ui/custom/form/select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/select.tsx"],"names":[],"mappings":"AAQA,MAAM,WAAW,YAAY;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,EAAE,YAAY,EAAE,CAAC;CACxB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAkCtC,CAAC"}

package/dist/components/ui/custom/form/select.js

@@ -0,0 +1,12 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { Select } from '@radix-ui/react-select';
+import { cn } from '../../../../lib/utils';
+import * as FormComponents from '../../form';
+import { SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from '../../select';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormSelect = ({ control, name, label, subLabel, helpText, placeholder, className, disabled, required, options }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsxs(Select, { onValueChange: field.onChange, defaultValue: field.value, disabled: disabled, children: [_jsx(SelectTrigger, { className: cn('', formState.errors[name] ? 'border-red-600' : '', className), children: _jsx(SelectValue, { className: 'text-slate-400', placeholder: placeholder }) }), _jsx(SelectContent, { className: 'bg-white cursor-pointer', children: _jsx(SelectGroup, { children: options.map((option) => (_jsx(SelectItem, { value: option.value, children: option.label }, option.value))) }) })] }) }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/step-new-form.d.ts

@@ -0,0 +1,10 @@
+interface PropsStepNewForm {
+    steps: {
+        id: string;
+        label: string;
+    }[];
+    currentIndex: number;
+}
+declare const StepNewForm: ({ steps, currentIndex }: PropsStepNewForm) => import("react/jsx-runtime").JSX.Element;
+export default StepNewForm;
+//# sourceMappingURL=step-new-form.d.ts.map

package/dist/components/ui/custom/form/step-new-form.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-new-form.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/step-new-form.tsx"],"names":[],"mappings":"AAGA,UAAU,gBAAgB;IACzB,KAAK,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;IACvC,YAAY,EAAE,MAAM,CAAC;CACrB;AAED,QAAA,MAAM,WAAW,GAAI,yBAAyB,gBAAgB,4CAsC7D,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/components/ui/custom/form/step-new-form.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Check } from 'lucide-react';
+import { Separator } from '../../separator';
+const StepNewForm = ({ steps, currentIndex }) => {
+    const getStepIcon = (index) => {
+        if (index < currentIndex) {
+            return (_jsx("div", { className: 'flex w-6 h-6 rounded-md items-center justify-center bg-background-secondary border', children: _jsx(Check, { size: 16, className: 'stroke-2 stroke-primary' }) }));
+        }
+        return (_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 (_jsx("div", { className: 'flex flex-row gap-x-3 my-2.5', children: steps.map((step, index, array) => (_jsxs("div", { className: 'flex items-center text-sm font-medium gap-x-3', children: [_jsxs("div", { className: 'flex items-center text-sm font-medium gap-x-3', children: [getStepIcon(index), step.label] }), index + 1 < array.length && (_jsx("div", { className: 'w-10', children: _jsx(Separator, {}) }))] }, step.id))) }));
+};
+export default StepNewForm;

package/dist/components/ui/custom/form/switch.d.ts

@@ -0,0 +1,13 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    className?: string;
+    disabled?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+}
+export declare const FormInputSwitch: React.FC<Props>;
+export {};
+//# sourceMappingURL=switch.d.ts.map

package/dist/components/ui/custom/form/switch.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/switch.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC7C;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+B3C,CAAC"}

package/dist/components/ui/custom/form/switch.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../../../lib/utils';
+import * as FormComponents from '../../form';
+import { Switch } from '../../switch';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormInputSwitch = ({ control, name, label, subLabel, helpText, className, disabled, onCheckedChange }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field }) => (_jsxs(FormItem, { className: cn('flex items-top gap-x-2', className), children: [_jsx(FormControl, { children: _jsx(Switch, { ...field, checked: field.value, onCheckedChange: (checked) => {
+                            field.onChange(checked);
+                            if (onCheckedChange) {
+                                onCheckedChange(checked);
+                            }
+                        }, disabled: disabled }) }), _jsxs("div", { className: 'flex h-full items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, false, 'pb-0'), helpText && formHelpText(helpText)] }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/text.d.ts

@@ -0,0 +1,18 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    placeholder?: string;
+    maxLength?: number;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    inputRef?: React.Ref<HTMLInputElement>;
+    onKeyUp?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+export declare const FormInputText: React.FC<Props>;
+export {};
+//# sourceMappingURL=text.d.ts.map

package/dist/components/ui/custom/form/text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/text.tsx"],"names":[],"mappings":"AAOA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IACvC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IACjE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;CAChE;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CA+CzC,CAAC"}

package/dist/components/ui/custom/form/text.js

@@ -0,0 +1,14 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import * as FormComponents from '../../form';
+import { InputText } from '../../input';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormInputText = ({ control, name, label, subLabel, helpText, placeholder, maxLength, className, disabled, required, inputRef, onKeyUp, onChange, }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsx(InputText, { ...field, maxLength: maxLength, placeholder: placeholder, disabled: disabled || formState.isSubmitting, value: field.value || '', onKeyUp: (e) => {
+                            if (onKeyUp) {
+                                onKeyUp(e);
+                            }
+                        }, ref: inputRef }) }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/textarea.d.ts

@@ -0,0 +1,16 @@
+interface Props {
+    control: any;
+    name: string;
+    label: string;
+    subLabel?: string;
+    helpText?: JSX.Element;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    required?: boolean;
+    onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    onKeyUp?: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;
+}
+export declare const FormTextarea: React.FC<Props>;
+export {};
+//# sourceMappingURL=textarea.d.ts.map

package/dist/components/ui/custom/form/textarea.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"textarea.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/textarea.tsx"],"names":[],"mappings":"AAOA,UAAU,KAAK;IACd,OAAO,EAAE,GAAG,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAC;IACnE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,aAAa,CAAC,mBAAmB,CAAC,KAAK,IAAI,CAAC;CACpE;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAiDxC,CAAC"}

package/dist/components/ui/custom/form/textarea.js

@@ -0,0 +1,19 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import * as FormComponents from '../../form';
+import { Textarea } from '../../textarea';
+import { formHelpText } from './form-help-text';
+import { formLabelAndSubLabel } from './form-label';
+import { formMessage } from './form-message';
+export const FormTextarea = ({ control, name, label, subLabel, helpText, placeholder, className, disabled, required, onChange, onKeyUp, }) => {
+    const { FormField, FormItem, FormLabel, FormControl, FormMessage } = FormComponents;
+    return (_jsx(FormField, { control: control, name: name, render: ({ field, formState }) => (_jsxs(FormItem, { className: className, children: [_jsxs("div", { className: 'flex items-center space-x-1.5', children: [label && formLabelAndSubLabel(FormLabel, label, subLabel, required), helpText && formHelpText(helpText)] }), _jsx(FormControl, { children: _jsx(Textarea, { ...field, className: 'resize-none outline-none focus:outline-none', placeholder: placeholder, disabled: disabled || formState.isSubmitting, onChange: (e) => {
+                            field.onChange(e);
+                            if (onChange) {
+                                onChange(e);
+                            }
+                        }, onKeyUp: (e) => {
+                            if (onKeyUp) {
+                                onKeyUp(e);
+                            }
+                        } }) }), formMessage(FormMessage)] })) }));
+};

package/dist/components/ui/custom/form/utils.d.ts

@@ -0,0 +1,18 @@
+export type RGB = {
+    r: number;
+    g: number;
+    b: number;
+};
+type HSL = {
+    h: number;
+    s: number;
+    l: number;
+};
+export declare const rgbToHex: ({ r, g, b }: RGB) => string;
+export declare const hexToRgb: (hex: string) => RGB | null;
+export declare const rgbToHsl: ({ r, g, b }: RGB) => HSL;
+export declare const hslToRgb: ({ h, s, l }: HSL) => RGB;
+export declare const formatRgba: (rgb: RGB, a?: number) => string;
+export declare const formatHsla: (hsl: HSL, a?: number) => string;
+export {};
+//# sourceMappingURL=utils.d.ts.map

package/dist/components/ui/custom/form/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/components/ui/custom/form/utils.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,GAAG,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AACtD,KAAK,GAAG,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE/C,eAAO,MAAM,QAAQ,GAAI,aAAa,GAAG,KAAG,MAG3C,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,KAAK,MAAM,KAAG,GAAG,GAAG,IAS5C,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,aAAa,GAAG,KAAG,GAmC3C,CAAC;AAYF,eAAO,MAAM,QAAQ,GAAI,aAAa,GAAG,KAAG,GAyB3C,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,KAAK,GAAG,EAAE,UAAK,KAAG,MAE5C,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,KAAK,GAAG,EAAE,UAAK,KAAG,MAE5C,CAAC"}

package/dist/components/ui/custom/form/utils.js

@@ -0,0 +1,88 @@
+export const rgbToHex = ({ r, g, b }) => {
+    const toHex = (n) => Math.max(0, Math.min(255, n)).toString(16).padStart(2, '0').toUpperCase();
+    return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
+};
+export const hexToRgb = (hex) => {
+    const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+    return result
+        ? {
+            r: Number.parseInt(result[1], 16),
+            g: Number.parseInt(result[2], 16),
+            b: Number.parseInt(result[3], 16),
+        }
+        : null;
+};
+export const rgbToHsl = ({ r, g, b }) => {
+    r /= 255;
+    g /= 255;
+    b /= 255;
+    const max = Math.max(r, g, b);
+    const min = Math.min(r, g, b);
+    let h = 0;
+    let s = 0;
+    const l = (max + min) / 2;
+    if (max !== min) {
+        const d = max - min;
+        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+        switch (max) {
+            case r:
+                h = (g - b) / d + (g < b ? 6 : 0);
+                break;
+            case g:
+                h = (b - r) / d + 2;
+                break;
+            case b:
+                h = (r - g) / d + 4;
+                break;
+        }
+        h /= 6;
+    }
+    return {
+        h: Math.round(h * 360),
+        s: Math.round(s * 100),
+        l: Math.round(l * 100),
+    };
+};
+const hue2rgb = (p, q, t) => {
+    let tempT = t;
+    if (tempT < 0)
+        tempT += 1;
+    if (tempT > 1)
+        tempT -= 1;
+    if (tempT < 1 / 6)
+        return p + (q - p) * 6 * tempT;
+    if (tempT < 1 / 2)
+        return q;
+    if (tempT < 2 / 3)
+        return p + (q - p) * (2 / 3 - tempT) * 6;
+    return p;
+};
+export const hslToRgb = ({ h, s, l }) => {
+    h /= 360;
+    s /= 100;
+    l /= 100;
+    let r;
+    let g;
+    let b;
+    if (s === 0) {
+        r = g = b = l;
+    }
+    else {
+        const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+        const p = 2 * l - q;
+        r = hue2rgb(p, q, h + 1 / 3);
+        g = hue2rgb(p, q, h);
+        b = hue2rgb(p, q, h - 1 / 3);
+    }
+    return {
+        r: Math.round(r * 255),
+        g: Math.round(g * 255),
+        b: Math.round(b * 255),
+    };
+};
+export const formatRgba = (rgb, a = 1) => {
+    return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${a})`;
+};
+export const formatHsla = (hsl, a = 1) => {
+    return `hsla(${hsl.h}, ${hsl.s}%, ${hsl.l}%, ${a})`;
+};

package/dist/components/ui/custom/header.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from 'react';
+import { Module, SidebarPage } from './sidebar/types/sidebar';
+declare const Header: ({ splittedPath, modules, pages, isLoading, combobox, }: {
+    splittedPath: string[];
+    modules: Module[];
+    pages: SidebarPage[];
+    isLoading: boolean;
+    combobox: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export default Header;
+//# sourceMappingURL=header.d.ts.map

package/dist/components/ui/custom/header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../../src/components/ui/custom/header.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAqB,MAAM,OAAO,CAAC;AAMrD,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAG9D,QAAA,MAAM,MAAM,GAAI,wDAMb;IAAE,YAAY,EAAE,MAAM,EAAE,CAAC;IAAC,OAAO,EAAE,MAAM,EAAE,CAAC;IAAC,KAAK,EAAE,WAAW,EAAE,CAAC;IAAC,SAAS,EAAE,OAAO,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAE,4CA8G9G,CAAC;AAEF,eAAe,MAAM,CAAC"}