@gustavo-valsechi/client 1.4.358 → 1.4.359

package/dist/src/components/types/form/index.js

@@ -93,7 +93,10 @@ function Form(props) {
     const values = getValues();
     if (!Object.keys(defaultValues).length) {
       const modalContainer = document.getElementById("modal-context-container");
-      import_lodash.default.forEach(props.inputs, (data) => defaultValues[data.name] = "");
+      import_lodash.default.forEach(props.inputs, (data) => {
+        if (import_lodash.default.isArray(data)) return import_lodash.default.forEach(data, (input) => defaultValues[input.name] = "");
+        defaultValues[data.name] = "";
+      });
       setTimeout(() => reset({ ...defaultValues, ...values }, { keepErrors: false }), ((_a = modalContainer == null ? void 0 : modalContainer.contains) == null ? void 0 : _a.call(modalContainer, formRef.current)) ? 300 : 0);
       return;
     }
@@ -115,7 +118,7 @@ function Form(props) {
     reset(defaultValues, { keepErrors: false });
   }, [props.defaultValues, props.inputs, props.clearWhen]);
   const component = (data) => {
-    var _a;
+    var _a, _b, _c, _d;
     let inputType = "";
     inputType = import_lodash.default.upperFirst(import_lodash.default.camelCase(data.type));
     inputType = import_lodash.default.includes(inputType, "Input") ? inputType : `Input${inputType}`;
@@ -132,7 +135,8 @@ function Form(props) {
         setValue,
         getValues,
         setError,
-        watch
+        watch,
+        optional: !!((_d = (_c = (_b = data.validation) == null ? void 0 : _b.safeParse) == null ? void 0 : _c.call(_b, void 0)) == null ? void 0 : _d.success)
       }
     );
   };
@@ -142,12 +146,24 @@ function Form(props) {
     await props.onSubmit(data);
     setSubmitting(false);
   };
+  const setFlexWidth = (inputs, input) => {
+    if (import_lodash.default.some(inputs, (data) => !data.maxLength)) return 1;
+    const minLength = import_lodash.default.min(import_lodash.default.map(inputs, (data) => data.maxLength));
+    return input.maxLength / minLength;
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styles.Container, { ref: formRef, onSubmit: handleSubmit(onSubmit), children: [
     import_lodash.default.map(
       props.inputs,
       (data, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react.default.Fragment, { children: import_lodash.default.isArray(data) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "form-content", children: import_lodash.default.map(
         data,
-        (input, index2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "form-input", children: component(input) }, index2)
+        (input, index2) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_styles.FormInput,
+          {
+            flex: setFlexWidth(data, input),
+            children: component(input)
+          },
+          index2
+        )
       ) }) : component(data) }, index)
     ),
     import_lodash.default.isArray(props.buttons) && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "form-buttons", children: import_lodash.default.map(

package/dist/src/components/types/form/index.mjs

@@ -2,7 +2,7 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import React, { useEffect, useRef, useState } from "react";
-import { Container } from "./styles";
+import { Container, FormInput } from "./styles";
 import { z } from "zod";
 import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -59,7 +59,10 @@ function Form(props) {
     const values = getValues();
     if (!Object.keys(defaultValues).length) {
       const modalContainer = document.getElementById("modal-context-container");
-      _.forEach(props.inputs, (data) => defaultValues[data.name] = "");
+      _.forEach(props.inputs, (data) => {
+        if (_.isArray(data)) return _.forEach(data, (input) => defaultValues[input.name] = "");
+        defaultValues[data.name] = "";
+      });
       setTimeout(() => reset({ ...defaultValues, ...values }, { keepErrors: false }), ((_a = modalContainer == null ? void 0 : modalContainer.contains) == null ? void 0 : _a.call(modalContainer, formRef.current)) ? 300 : 0);
       return;
     }
@@ -81,7 +84,7 @@ function Form(props) {
     reset(defaultValues, { keepErrors: false });
   }, [props.defaultValues, props.inputs, props.clearWhen]);
   const component = (data) => {
-    var _a;
+    var _a, _b, _c, _d;
     let inputType = "";
     inputType = _.upperFirst(_.camelCase(data.type));
     inputType = _.includes(inputType, "Input") ? inputType : `Input${inputType}`;
@@ -98,7 +101,8 @@ function Form(props) {
         setValue,
         getValues,
         setError,
-        watch
+        watch,
+        optional: !!((_d = (_c = (_b = data.validation) == null ? void 0 : _b.safeParse) == null ? void 0 : _c.call(_b, void 0)) == null ? void 0 : _d.success)
       }
     );
   };
@@ -108,12 +112,24 @@ function Form(props) {
     await props.onSubmit(data);
     setSubmitting(false);
   };
+  const setFlexWidth = (inputs, input) => {
+    if (_.some(inputs, (data) => !data.maxLength)) return 1;
+    const minLength = _.min(_.map(inputs, (data) => data.maxLength));
+    return input.maxLength / minLength;
+  };
   return /* @__PURE__ */ jsxs(Container, { ref: formRef, onSubmit: handleSubmit(onSubmit), children: [
     _.map(
       props.inputs,
       (data, index) => /* @__PURE__ */ jsx(React.Fragment, { children: _.isArray(data) ? /* @__PURE__ */ jsx("div", { className: "form-content", children: _.map(
         data,
-        (input, index2) => /* @__PURE__ */ jsx("div", { className: "form-input", children: component(input) }, index2)
+        (input, index2) => /* @__PURE__ */ jsx(
+          FormInput,
+          {
+            flex: setFlexWidth(data, input),
+            children: component(input)
+          },
+          index2
+        )
       ) }) : component(data) }, index)
     ),
     _.isArray(props.buttons) && /* @__PURE__ */ jsx("div", { className: "form-buttons", children: _.map(

package/dist/src/components/types/form/styles.d.ts

@@ -1 +1,2 @@
 export declare const Container: any;
+export declare const FormInput: any;

package/dist/src/components/types/form/styles.js

@@ -30,7 +30,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var styles_exports = {};
 __export(styles_exports, {
-  Container: () => Container
+  Container: () => Container,
+  FormInput: () => FormInput
 });
 module.exports = __toCommonJS(styles_exports);
 var import_styled_components = __toESM(require("styled-components"));
@@ -45,10 +46,6 @@ const Container = import_styled_components.default.form`
         display: flex;
         gap: .5rem;
         flex-wrap: wrap;
-        
-        .form-input {
-            flex: 1 1 10rem;
-        }
     }
 
     .form-buttons {
@@ -61,7 +58,11 @@ const Container = import_styled_components.default.form`
         }
     }
 `;
+const FormInput = import_styled_components.default.div`
+    flex: ${({ flex }) => flex} 1 8rem;
+`;
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  Container
+  Container,
+  FormInput
 });

package/dist/src/components/types/form/styles.mjs

@@ -12,10 +12,6 @@ const Container = styled.form`
         display: flex;
         gap: .5rem;
         flex-wrap: wrap;
-        
-        .form-input {
-            flex: 1 1 10rem;
-        }
     }
 
     .form-buttons {
@@ -28,6 +24,10 @@ const Container = styled.form`
         }
     }
 `;
+const FormInput = styled.div`
+    flex: ${({ flex }) => flex} 1 8rem;
+`;
 export {
-  Container
+  Container,
+  FormInput
 };

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

@@ -17,7 +17,7 @@ export interface IForm {
     formRef?: any;
     onSubmit: (values: any, actions?: any) => void;
     clearWhen?: boolean;
-    inputs: Array<IFormInput>;
+    inputs: Array<IFormInput | Array<IFormInput>>;
     buttons?: Array<IButton>;
 }
 export interface IInputBase {
@@ -29,6 +29,7 @@ export interface IInputBase {
     error?: string;
     disabled?: boolean;
     optional?: boolean;
+    maxLength?: number;
     register?: UseFormRegister<any>;
     validation?: z.ZodTypeAny;
     watch?: (...args: any[]) => string;

package/dist/src/interfaces/components/form/select/index.d.ts

@@ -7,5 +7,4 @@ export interface IInputSelect extends IInputBase {
     } & {
         length?: never;
     };
-    maxLength?: number;
 }

package/dist/src/interfaces/components/form/text/index.d.ts

@@ -2,5 +2,4 @@ import { IInputBase } from "../index";
 export interface IInputText extends IInputBase {
     type: "text" | "password" | undefined;
     mask?: (value: string) => void;
-    maxLength?: number;
 }

package/dist/src/interfaces/components/form/textarea/index.d.ts

@@ -2,6 +2,5 @@ import { IInputBase } from "../index";
 export interface IInputTextarea extends IInputBase {
     type: "textarea";
     mask?: (value: string) => void;
-    maxLength?: number;
     rows?: number;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gustavo-valsechi/client",
-  "version": "1.4.358",
+  "version": "1.4.359",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",