@pathscale/ui 1.1.55 → 1.1.56

package/dist/components/form/FormField.js

@@ -1,88 +1,78 @@
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
 import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
-import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
 import * as __WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__ from "../input/index.js";
-import * as __WEBPACK_EXTERNAL_MODULE__label_index_js_2049cd83__ from "../label/index.js";
-import * as __WEBPACK_EXTERNAL_MODULE__hooks_form_FormContext_js_e27dc1c5__ from "../../hooks/form/FormContext.js";
-import * as __WEBPACK_EXTERNAL_MODULE__hooks_form_getFirstFieldError_js_b4e4d106__ from "../../hooks/form/getFirstFieldError.js";
-import * as __WEBPACK_EXTERNAL_MODULE__FieldErrorMessage_js_821323c5__ from "./FieldErrorMessage.js";
-var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>");
+import * as __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__ from "./ValidatedForm.js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__Label_js_56960635__ from "./Label.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<p>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="text-error ml-1">*');
 const FormField = (props)=>{
-    const [local, _rest] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
-        "name",
+    const { errors, touched } = (0, __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__.useFormValidation)();
+    const [local, inputProps] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
         "label",
-        "inputProps",
+        "required",
+        "labelClass",
+        "errorClass",
+        "containerClass",
+        "description",
+        "descriptionClass",
         "class",
-        "className",
-        "form"
+        "className"
     ]);
-    const resolveForm = ()=>{
-        if (null != local.form) return local.form;
-        return (0, __WEBPACK_EXTERNAL_MODULE__hooks_form_FormContext_js_e27dc1c5__.useFormContext)();
-    };
-    const form = resolveForm();
-    const tsForm = form._tsForm;
-    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(tsForm.Field, {
-        get name () {
-            return local.name;
-        },
-        children: (field)=>{
-            const errorMessage = ()=>field().state.meta.isTouched ? (0, __WEBPACK_EXTERNAL_MODULE__hooks_form_getFirstFieldError_js_b4e4d106__.getFirstFieldError)(field().state.meta.errors ?? []) : void 0;
-            return (()=>{
-                var _el$ = _tmpl$();
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>({
-                        class: (0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("flex flex-col gap-1", local.class, local.className)
-                    }), {
-                    "data-slot": "form-field"
-                }), false, true);
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
-                    get when () {
-                        return local.label;
-                    },
-                    get children () {
-                        return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__label_index_js_2049cd83__["default"], {
-                            get ["for"] () {
-                                return local.name;
-                            },
-                            get ["data-invalid"] () {
-                                return Boolean(errorMessage()) ? "true" : void 0;
-                            },
-                            get children () {
-                                return local.label;
-                            }
-                        });
-                    }
-                }), null);
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__["default"].Field, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(()=>local.inputProps, {
-                    get id () {
-                        return local.name;
-                    },
-                    get name () {
-                        return local.name;
-                    },
-                    get value () {
-                        return String(field().state.value ?? "");
-                    },
-                    onInput: (e)=>{
-                        field().handleChange(e.currentTarget.value);
-                    },
-                    onBlur: ()=>field().handleBlur(),
-                    get ["aria-invalid"] () {
-                        return Boolean(errorMessage()) ? true : void 0;
-                    },
-                    get isInvalid () {
-                        return Boolean(errorMessage());
-                    }
-                })), null);
-                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__FieldErrorMessage_js_821323c5__.FieldErrorMessage, {
-                    get message () {
-                        return errorMessage();
-                    }
-                }), null);
-                return _el$;
-            })();
-        }
-    });
+    const containerClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("flex flex-col gap-2", local.containerClass));
+    const descriptionClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-sm text-base-content/70", local.descriptionClass));
+    const errorClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-error text-sm", local.errorClass));
+    const inputClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(local.class, local.className));
+    const hasError = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>touched(props.name) && !!errors(props.name));
+    return (()=>{
+        var _el$ = _tmpl$2();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__Label_js_56960635__["default"], {
+            get title () {
+                return local.label;
+            },
+            get ["class"] () {
+                return local.labelClass;
+            },
+            get children () {
+                return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.required)() && _tmpl$3();
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.description);
+            return ()=>_c$() && (()=>{
+                    var _el$4 = _tmpl$();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, ()=>local.description);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$4, descriptionClasses()));
+                    return _el$4;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get id () {
+                return props.name;
+            },
+            get ["aria-invalid"] () {
+                return hasError();
+            },
+            get ["aria-required"] () {
+                return local.required;
+            },
+            get ["class"] () {
+                return inputClasses();
+            }
+        }, inputProps)), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return hasError();
+            },
+            get children () {
+                var _el$2 = _tmpl$();
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>errors(props.name));
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$2, errorClasses()));
+                return _el$2;
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, containerClasses()));
+        return _el$;
+    })();
 };
 const form_FormField = FormField;
 export { FormField, form_FormField as default };

package/dist/components/form/Label.d.ts

@@ -0,0 +1,7 @@
+import { type JSX, type ParentComponent } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type LabelProps = Omit<JSX.HTMLAttributes<HTMLLabelElement>, "ref"> & IComponentBaseProps & {
+    title?: string;
+};
+declare const Label: ParentComponent<LabelProps>;
+export default Label;

package/dist/components/form/Label.js

@@ -0,0 +1,31 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<label><span class="label-text cursor-pointer">');
+const Label = (props)=>{
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "title",
+        "dataTheme",
+        "class",
+        "className"
+    ]);
+    const resolvedChildren = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.children)(()=>local.children);
+    const classes = ()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("label", local.class, local.className);
+    return (()=>{
+        var _el$ = _tmpl$(), _el$2 = _el$.firstChild;
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.spread)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+            get ["data-theme"] () {
+                return local.dataTheme;
+            },
+            get ["class"] () {
+                return classes();
+            }
+        }), false, true);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>local.title);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, resolvedChildren, null);
+        return _el$;
+    })();
+};
+const form_Label = Label;
+export { form_Label as default };

package/dist/components/form/NumberField.d.ts

@@ -0,0 +1,20 @@
+import { type Component } from "solid-js";
+import type { InputProps } from "../input";
+export interface NumberFieldProps extends Omit<InputProps, "type" | "ref"> {
+    label?: string;
+    name: string;
+    required?: boolean;
+    labelClass?: string;
+    errorClass?: string;
+    containerClass?: string;
+    description?: string;
+    descriptionClass?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    allowDecimals?: boolean;
+    formatter?: (value: string) => string;
+    onInput?: (event: InputEvent) => void;
+}
+export declare const NumberField: Component<NumberFieldProps>;
+export default NumberField;

package/dist/components/form/NumberField.js

@@ -0,0 +1,109 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__ from "../input/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__ from "./ValidatedForm.js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__Label_js_56960635__ from "./Label.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<p>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="text-error ml-1">*');
+const NumberField = (props)=>{
+    const { errors, touched } = (0, __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__.useFormValidation)();
+    const [local, inputProps] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "label",
+        "required",
+        "labelClass",
+        "errorClass",
+        "containerClass",
+        "description",
+        "descriptionClass",
+        "min",
+        "max",
+        "step",
+        "allowDecimals",
+        "formatter",
+        "class",
+        "className",
+        "onInput"
+    ]);
+    const containerClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("flex flex-col gap-2", local.containerClass));
+    const descriptionClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-sm text-base-content/70", local.descriptionClass));
+    const errorClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-error text-sm", local.errorClass));
+    const inputClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(local.class, local.className));
+    const hasError = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>touched(props.name) && !!errors(props.name));
+    const stepValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>local.step || (false !== local.allowDecimals ? "any" : 1));
+    const handleInput = (event)=>{
+        const target = event.target;
+        let value = target.value;
+        if (false === local.allowDecimals && value.includes(".")) {
+            value = value.replace(/\./g, "");
+            target.value = value;
+        }
+        if (local.formatter) target.value = local.formatter(value);
+        if ("function" == typeof local.onInput) local.onInput(event);
+    };
+    return (()=>{
+        var _el$ = _tmpl$2();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.label);
+            return ()=>_c$() && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__Label_js_56960635__["default"], {
+                    get title () {
+                        return local.label;
+                    },
+                    get ["class"] () {
+                        return local.labelClass;
+                    },
+                    get children () {
+                        return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.required)() && _tmpl$3();
+                    }
+                });
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$2 = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.description);
+            return ()=>_c$2() && (()=>{
+                    var _el$4 = _tmpl$();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, ()=>local.description);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$4, descriptionClasses()));
+                    return _el$4;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get id () {
+                return props.name;
+            },
+            type: "number",
+            get min () {
+                return local.min;
+            },
+            get max () {
+                return local.max;
+            },
+            get step () {
+                return stepValue();
+            },
+            get ["aria-invalid"] () {
+                return hasError();
+            },
+            get ["aria-required"] () {
+                return local.required;
+            },
+            onInput: handleInput,
+            get ["class"] () {
+                return inputClasses();
+            }
+        }, inputProps)), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return hasError();
+            },
+            get children () {
+                var _el$2 = _tmpl$();
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>errors(props.name));
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$2, errorClasses()));
+                return _el$2;
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, containerClasses()));
+        return _el$;
+    })();
+};
+const form_NumberField = NumberField;
+export { NumberField, form_NumberField as default };

package/dist/components/form/PasswordField.d.ts

@@ -0,0 +1,16 @@
+import { type Component, type JSX } from "solid-js";
+import type { InputProps } from "../input";
+export interface PasswordFieldProps extends Omit<InputProps, "type" | "ref"> {
+    label?: string;
+    name: string;
+    required?: boolean;
+    labelClass?: string;
+    errorClass?: string;
+    containerClass?: string;
+    description?: string;
+    descriptionClass?: string;
+    showPasswordIcon?: JSX.Element;
+    hidePasswordIcon?: JSX.Element;
+}
+export declare const PasswordField: Component<PasswordFieldProps>;
+export default PasswordField;

package/dist/components/form/PasswordField.js

@@ -0,0 +1,113 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__ from "../input/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__icon_index_js_1f7a158c__ from "../icon/index.js";
+import * as __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__ from "./ValidatedForm.js";
+import * as __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__ from "tailwind-merge";
+import * as __WEBPACK_EXTERNAL_MODULE__Label_js_56960635__ from "./Label.js";
+var _tmpl$ = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<p>"), _tmpl$2 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<div>"), _tmpl$3 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)('<span class="text-error ml-1">*'), _tmpl$4 = /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.template)("<span class=cursor-pointer role=button>");
+const PasswordField = (props)=>{
+    const [showPassword, setShowPassword] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createSignal)(false);
+    const { errors, touched } = (0, __WEBPACK_EXTERNAL_MODULE__ValidatedForm_js_56b86c0b__.useFormValidation)();
+    const [local, inputProps] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "label",
+        "required",
+        "labelClass",
+        "errorClass",
+        "containerClass",
+        "description",
+        "descriptionClass",
+        "showPasswordIcon",
+        "hidePasswordIcon",
+        "class",
+        "className"
+    ]);
+    const togglePassword = ()=>setShowPassword(!showPassword());
+    const containerClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("flex flex-col gap-2", local.containerClass));
+    const descriptionClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-sm text-base-content/70", local.descriptionClass));
+    const errorClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)("text-error text-sm", local.errorClass));
+    const inputClasses = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>(0, __WEBPACK_EXTERNAL_MODULE_tailwind_merge_e05e3e95__.twMerge)(local.class, local.className));
+    const hasError = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>touched(props.name) && !!errors(props.name));
+    const passwordIcon = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>{
+        if (showPassword()) return local.hidePasswordIcon || (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__icon_index_js_1f7a158c__["default"], {
+            name: "icon-[mdi-light--eye-off]",
+            width: 20,
+            height: 20
+        });
+        return local.showPasswordIcon || (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__icon_index_js_1f7a158c__["default"], {
+            name: "icon-[mdi-light--eye]",
+            width: 20,
+            height: 20
+        });
+    });
+    return (()=>{
+        var _el$ = _tmpl$2();
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$ = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.label);
+            return ()=>_c$() && (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__Label_js_56960635__["default"], {
+                    get title () {
+                        return local.label;
+                    },
+                    get ["class"] () {
+                        return local.labelClass;
+                    },
+                    get children () {
+                        return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.required)() && _tmpl$3();
+                    }
+                });
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (()=>{
+            var _c$2 = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>!!local.description);
+            return ()=>_c$2() && (()=>{
+                    var _el$4 = _tmpl$();
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$4, ()=>local.description);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$4, descriptionClasses()));
+                    return _el$4;
+                })();
+        })(), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__input_index_js_00da0e74__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)({
+            get id () {
+                return props.name;
+            },
+            get type () {
+                return showPassword() ? "text" : "password";
+            },
+            get ["aria-invalid"] () {
+                return hasError();
+            },
+            get ["aria-required"] () {
+                return local.required;
+            },
+            get ["class"] () {
+                return inputClasses();
+            },
+            get endContent () {
+                return (()=>{
+                    var _el$5 = _tmpl$4();
+                    _el$5.$$click = togglePassword;
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$5, passwordIcon);
+                    (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.setAttribute)(_el$5, "aria-label", showPassword() ? "Hide password" : "Show password"));
+                    return _el$5;
+                })();
+            }
+        }, inputProps)), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$, (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.Show, {
+            get when () {
+                return hasError();
+            },
+            get children () {
+                var _el$2 = _tmpl$();
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.insert)(_el$2, ()=>errors(props.name));
+                (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$2, errorClasses()));
+                return _el$2;
+            }
+        }), null);
+        (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.effect)(()=>(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.className)(_el$, containerClasses()));
+        return _el$;
+    })();
+};
+const form_PasswordField = PasswordField;
+(0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.delegateEvents)([
+    "click"
+]);
+export { PasswordField, form_PasswordField as default };

package/dist/components/form/ValidatedForm.d.ts

@@ -0,0 +1,26 @@
+import { type JSX } from "solid-js";
+import type { z } from "zod";
+import type { ObjectSetter, Paths } from "@felte/common";
+import { type FormProps } from "./FormBase";
+export type ValidatedFormProps<T extends z.ZodTypeAny> = Omit<FormProps, "onSubmit"> & {
+    schema: T;
+    onSubmit: (values: z.infer<T>) => void | Promise<void>;
+    initialValues?: z.infer<T>;
+    children?: JSX.Element | (() => JSX.Element);
+};
+interface FormValidationContext<T extends z.ZodTypeAny = z.ZodTypeAny> {
+    errors: (path?: string | ((data: any) => any)) => any;
+    touched: (path?: string | ((data: any) => any)) => any;
+    data: (path?: string | ((data: any) => any)) => any;
+    isValid: () => boolean;
+    isSubmitting: () => boolean;
+    setData: ObjectSetter<z.infer<T>, Paths<z.infer<T>>>;
+    setErrors: (errors: any) => void;
+    setWarnings: (warnings: any) => void;
+    setTouched: (touched: any) => void;
+    reset: () => void;
+}
+declare const FormValidationContext: import("solid-js").Context<FormValidationContext<z.ZodTypeAny> | undefined>;
+export declare function useFormValidation<T extends z.ZodTypeAny = z.ZodTypeAny>(): FormValidationContext<T>;
+declare function ValidatedForm<T extends z.ZodTypeAny>(props: ValidatedFormProps<T>): JSX.Element;
+export default ValidatedForm;

package/dist/components/form/ValidatedForm.js

@@ -0,0 +1,55 @@
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__ from "solid-js/web";
+import * as __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__ from "solid-js";
+import * as __WEBPACK_EXTERNAL_MODULE__felte_solid_6a709b1d__ from "@felte/solid";
+import * as __WEBPACK_EXTERNAL_MODULE__felte_validator_zod_bb07151a__ from "@felte/validator-zod";
+import * as __WEBPACK_EXTERNAL_MODULE__FormBase_js_90e50c3a__ from "./FormBase.js";
+const FormValidationContext = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createContext)();
+function useFormValidation() {
+    const context = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.useContext)(FormValidationContext);
+    if (!context) throw new Error("useFormValidation must be used within a ValidatedForm");
+    return context;
+}
+function ValidatedForm(props) {
+    const [local, others] = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.splitProps)(props, [
+        "children",
+        "schema",
+        "onSubmit",
+        "initialValues"
+    ]);
+    const { form, errors, touched, data, isValid, isSubmitting, setData, setErrors, setWarnings, setTouched, reset } = (0, __WEBPACK_EXTERNAL_MODULE__felte_solid_6a709b1d__.createForm)({
+        initialValues: local.initialValues,
+        extend: [
+            (0, __WEBPACK_EXTERNAL_MODULE__felte_validator_zod_bb07151a__.validator)({
+                schema: local.schema
+            })
+        ],
+        onSubmit: local.onSubmit
+    });
+    const contextValue = (0, __WEBPACK_EXTERNAL_MODULE_solid_js_aeefcc6d__.createMemo)(()=>({
+            errors,
+            touched,
+            data,
+            isValid,
+            isSubmitting,
+            setData,
+            setErrors,
+            setWarnings,
+            setTouched,
+            reset
+        }));
+    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(FormValidationContext.Provider, {
+        get value () {
+            return contextValue();
+        },
+        get children () {
+            return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.createComponent)(__WEBPACK_EXTERNAL_MODULE__FormBase_js_90e50c3a__["default"], (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.mergeProps)(others, {
+                ref: form,
+                get children () {
+                    return (0, __WEBPACK_EXTERNAL_MODULE_solid_js_web_35d951b7__.memo)(()=>"function" == typeof local.children)() ? local.children() : local.children;
+                }
+            }));
+        }
+    });
+}
+const form_ValidatedForm = ValidatedForm;
+export { form_ValidatedForm as default, useFormValidation };

package/dist/components/form/index.d.ts

@@ -1,4 +1,4 @@
-export { default, Form, FormRoot, FormWithContext, type FormProps, type FormRootProps, type FormWithContextProps, } from "./Form";
-export { FormField, type FormFieldProps } from "./FormField";
-export { FormSubmitButton, type FormSubmitButtonProps } from "./FormSubmitButton";
-export { FieldErrorMessage, type FieldErrorMessageProps } from "./FieldErrorMessage";
+export { default } from "./Form";
+export { type FormProps, type ValidatedFormProps, type FormFieldProps, type PasswordFieldProps, type NumberFieldProps, useFormValidation, } from "./Form";
+export type { LabelProps } from "./Label";
+export { default as FormDropdown, type FormDropdownProps, type DropdownOption, } from "./FormDropdown";

package/dist/components/form/index.js

@@ -1,12 +1,6 @@
 import * as __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__ from "./Form.js";
-import * as __WEBPACK_EXTERNAL_MODULE__FormField_js_940fe8a4__ from "./FormField.js";
-import * as __WEBPACK_EXTERNAL_MODULE__FormSubmitButton_js_5c732699__ from "./FormSubmitButton.js";
-import * as __WEBPACK_EXTERNAL_MODULE__FieldErrorMessage_js_821323c5__ from "./FieldErrorMessage.js";
-var __webpack_exports__FieldErrorMessage = __WEBPACK_EXTERNAL_MODULE__FieldErrorMessage_js_821323c5__.FieldErrorMessage;
-var __webpack_exports__Form = __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__.Form;
-var __webpack_exports__FormField = __WEBPACK_EXTERNAL_MODULE__FormField_js_940fe8a4__.FormField;
-var __webpack_exports__FormRoot = __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__.FormRoot;
-var __webpack_exports__FormSubmitButton = __WEBPACK_EXTERNAL_MODULE__FormSubmitButton_js_5c732699__.FormSubmitButton;
-var __webpack_exports__FormWithContext = __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__.FormWithContext;
+import * as __WEBPACK_EXTERNAL_MODULE__FormDropdown_js_0063c469__ from "./FormDropdown.js";
+var __webpack_exports__FormDropdown = __WEBPACK_EXTERNAL_MODULE__FormDropdown_js_0063c469__["default"];
 var __webpack_exports__default = __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__["default"];
-export { __webpack_exports__FieldErrorMessage as FieldErrorMessage, __webpack_exports__Form as Form, __webpack_exports__FormField as FormField, __webpack_exports__FormRoot as FormRoot, __webpack_exports__FormSubmitButton as FormSubmitButton, __webpack_exports__FormWithContext as FormWithContext, __webpack_exports__default as default };
+var __webpack_exports__useFormValidation = __WEBPACK_EXTERNAL_MODULE__Form_js_cf7aa139__.useFormValidation;
+export { __webpack_exports__FormDropdown as FormDropdown, __webpack_exports__default as default, __webpack_exports__useFormValidation as useFormValidation };

package/dist/components/form-actions/FormActions.d.ts

@@ -0,0 +1,14 @@
+import { type JSX } from "solid-js";
+import type { IComponentBaseProps } from "../types";
+export type FormActionsLayout = "single" | "split" | "center";
+export type FormActionsProps = IComponentBaseProps & {
+    submitText?: string;
+    cancelText?: string;
+    isLoading?: boolean;
+    isValid?: boolean;
+    onCancel?: () => void;
+    layout?: FormActionsLayout;
+    children?: JSX.Element;
+} & Omit<JSX.HTMLAttributes<HTMLDivElement>, "children">;
+declare const FormActions: (props: FormActionsProps) => JSX.Element;
+export default FormActions;