kelt-ui-kit-react 1.5.6 → 1.5.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "kelt-ui-kit-react",
   "type": "module",
-  "version": "1.5.6",
+  "version": "1.5.7",
   "private": false,
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/form/Form.tsx

@@ -16,6 +16,7 @@ import { TextArea } from "./textArea/TextArea";
 export type FormProps<
   T extends { [key: string]: string | number | boolean | Date | string[] }
 > = {
+  id?: string;
   className?: string;
   title?: string;
   hideSubmit?: boolean;
@@ -33,6 +34,7 @@ export const DynamicForm = forwardRef(
       initialForm,
       title,
       onSubmit,
+      id,
       children,
       autoComplete,
       onChange,
@@ -204,7 +206,7 @@ export const DynamicForm = forwardRef(
 
                 {v.type === "select" ? (
                   <Select
-                    id={v.name}
+                    id={v.id ?? v.name}
                     label={undefined}
                     name={v.name}
                     options={v.options ?? []}
@@ -223,7 +225,7 @@ export const DynamicForm = forwardRef(
                   />
                 ) : v.type === "textarea" ? (
                   <TextArea
-                    id={v.name}
+                    id={v.id ?? v.name}
                     name={v.name}
                     className="textarea-input"
                     placeholder={v.placeholder ?? ""}
@@ -236,7 +238,7 @@ export const DynamicForm = forwardRef(
                   />
                 ) : (
                   <Input
-                    id={v.name}
+                    id={v.id ?? v.name}
                     ref={(el) => (inputRefs.current[v.name] = el)}
                     name={v.name}
                     type={v.type}
@@ -264,7 +266,11 @@ export const DynamicForm = forwardRef(
         </div>
         <div className="d-flex justify-content-end form-footer">
           {!hideSubmit && (
-            <Button disabled={btnDisabledSubmit} title={title || "submit"} />
+            <Button
+              id={`button-${id}`}
+              disabled={btnDisabledSubmit}
+              title={title || "submit"}
+            />
           )}
         </div>
       </form>