akeyless-client-commons 1.0.153 → 1.0.155

package/dist/components/index.d.mts

@@ -15,13 +15,15 @@ interface CheckBoxProps {
     elementClassName?: string;
     setChecked?: (v: boolean) => void;
     checked?: boolean;
+    defaultChecked?: boolean;
     className?: string;
     name?: string;
     id?: string;
     props?: ComponentProps<"label">;
+    inputProps?: ComponentProps<"input">;
     title?: string;
 }
-declare const Checkbox: ({ id, checked, setChecked, rotate, className, circleClassName, containerClassName, elementClassName, name, props, title, }: CheckBoxProps) => react_jsx_runtime.JSX.Element;
+declare const Checkbox: ({ id, checked, setChecked, rotate, className, circleClassName, containerClassName, elementClassName, name, props, title, defaultChecked, inputProps, }: CheckBoxProps) => react_jsx_runtime.JSX.Element;
 
 interface ErrorBoundaryProps {
     fallback?: React__default.ReactNode;
@@ -321,6 +323,7 @@ interface ModularFormProps {
     errorClassName?: string;
     onLoad?: (e: EventTarget & HTMLFormElement) => void;
     autoFixLabelsWidth?: boolean;
+    autoFixLabelsWidthDeps?: any[];
     loaderProps?: LoaderProps;
     elementsContainerClassName?: string;
     className?: string;
@@ -548,7 +551,7 @@ declare const TableProvider: (props: TableProps & {
 }) => react_jsx_runtime.JSX.Element;
 declare const Table: React__default.MemoExoticComponent<(props: TableProps) => react_jsx_runtime.JSX.Element>;
 
-declare const ModularForm: ({ submitFunction, elements, headerContent, buttonContent, className, elementsContainerClassName, headerClassName, direction, buttonClassName, submitRef, footerClassName, errorClassName, labelsCommonClassName, autoFixLabelsWidth, loaderProps, onLoad, }: ModularFormProps) => react_jsx_runtime.JSX.Element;
+declare const ModularForm: ({ submitFunction, elements, headerContent, buttonContent, className, elementsContainerClassName, headerClassName, direction, buttonClassName, submitRef, footerClassName, errorClassName, labelsCommonClassName, autoFixLabelsWidth, loaderProps, autoFixLabelsWidthDeps, onLoad, }: ModularFormProps) => react_jsx_runtime.JSX.Element;
 
 declare function InternationalPhonePicker({ setPhoneValue, phoneValue, placeholder, className, containerClassName, defaultCountry, flagContainerClassName, inputClassName, defaultValue, name, style, onEnter, labelContent, labelClassName, required, direction, defaultFocus, labelsCommonClassName, }: InternationalInputProps): react_jsx_runtime.JSX.Element;
 
@@ -561,7 +564,7 @@ declare function MultiSelect({ onChange, selectedOptions, emptyOptionsElement, u
 declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, buttonClassName, buttonFocusClassName, sortDirection, sortAsNumber, disabled, direction, createNewOptionLabel, createNewOptionContainerClassName, labelWithDots, labelsCommonClassName, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
 declare const TextAreaContainer: ({ name, labelContent, defaultValue, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, labelWithDots, labelsCommonClassName, }: TextAreaContainerProps) => react_jsx_runtime.JSX.Element;
 declare const FormSeparator: ({ props, children }: FormSeparatorProps) => react_jsx_runtime.JSX.Element;
-declare const CheckboxContainer: ({ id, checked, setChecked, circleClassName, className, containerClassName, elementClassName, name, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, props, rotate, title, required, }: CheckboxContainerProps) => react_jsx_runtime.JSX.Element;
+declare const CheckboxContainer: ({ id, checked, setChecked, circleClassName, className, containerClassName, elementClassName, name, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, props, rotate, title, defaultChecked, inputProps, required, }: CheckboxContainerProps) => react_jsx_runtime.JSX.Element;
 declare const FormElementContainer: ({ containerClassName, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, name, required, children, defaultContainerClassName, }: BaseElementProps & {
     children: ReactNode;
     defaultContainerClassName?: boolean;

package/dist/components/index.d.ts

@@ -15,13 +15,15 @@ interface CheckBoxProps {
     elementClassName?: string;
     setChecked?: (v: boolean) => void;
     checked?: boolean;
+    defaultChecked?: boolean;
     className?: string;
     name?: string;
     id?: string;
     props?: ComponentProps<"label">;
+    inputProps?: ComponentProps<"input">;
     title?: string;
 }
-declare const Checkbox: ({ id, checked, setChecked, rotate, className, circleClassName, containerClassName, elementClassName, name, props, title, }: CheckBoxProps) => react_jsx_runtime.JSX.Element;
+declare const Checkbox: ({ id, checked, setChecked, rotate, className, circleClassName, containerClassName, elementClassName, name, props, title, defaultChecked, inputProps, }: CheckBoxProps) => react_jsx_runtime.JSX.Element;
 
 interface ErrorBoundaryProps {
     fallback?: React__default.ReactNode;
@@ -321,6 +323,7 @@ interface ModularFormProps {
     errorClassName?: string;
     onLoad?: (e: EventTarget & HTMLFormElement) => void;
     autoFixLabelsWidth?: boolean;
+    autoFixLabelsWidthDeps?: any[];
     loaderProps?: LoaderProps;
     elementsContainerClassName?: string;
     className?: string;
@@ -548,7 +551,7 @@ declare const TableProvider: (props: TableProps & {
 }) => react_jsx_runtime.JSX.Element;
 declare const Table: React__default.MemoExoticComponent<(props: TableProps) => react_jsx_runtime.JSX.Element>;
 
-declare const ModularForm: ({ submitFunction, elements, headerContent, buttonContent, className, elementsContainerClassName, headerClassName, direction, buttonClassName, submitRef, footerClassName, errorClassName, labelsCommonClassName, autoFixLabelsWidth, loaderProps, onLoad, }: ModularFormProps) => react_jsx_runtime.JSX.Element;
+declare const ModularForm: ({ submitFunction, elements, headerContent, buttonContent, className, elementsContainerClassName, headerClassName, direction, buttonClassName, submitRef, footerClassName, errorClassName, labelsCommonClassName, autoFixLabelsWidth, loaderProps, autoFixLabelsWidthDeps, onLoad, }: ModularFormProps) => react_jsx_runtime.JSX.Element;
 
 declare function InternationalPhonePicker({ setPhoneValue, phoneValue, placeholder, className, containerClassName, defaultCountry, flagContainerClassName, inputClassName, defaultValue, name, style, onEnter, labelContent, labelClassName, required, direction, defaultFocus, labelsCommonClassName, }: InternationalInputProps): react_jsx_runtime.JSX.Element;
 
@@ -561,7 +564,7 @@ declare function MultiSelect({ onChange, selectedOptions, emptyOptionsElement, u
 declare const SelectWithSearch: ({ options, labelClassName, labelContent, name, onChange, value, placeholder, required, defaultValue, notFoundLabel, searchPlaceholder, containerClassName, dropdownClassName, dropdownOptionClassName, elementClassName, notFoundLabelClassName, searchClassName, buttonClassName, buttonFocusClassName, sortDirection, sortAsNumber, disabled, direction, createNewOptionLabel, createNewOptionContainerClassName, labelWithDots, labelsCommonClassName, }: SelectWithSearchProps) => react_jsx_runtime.JSX.Element;
 declare const TextAreaContainer: ({ name, labelContent, defaultValue, containerClassName, labelClassName, elementClassName, required, placeholder, props, minLength, onKeyDown, onChange, direction, labelWithDots, labelsCommonClassName, }: TextAreaContainerProps) => react_jsx_runtime.JSX.Element;
 declare const FormSeparator: ({ props, children }: FormSeparatorProps) => react_jsx_runtime.JSX.Element;
-declare const CheckboxContainer: ({ id, checked, setChecked, circleClassName, className, containerClassName, elementClassName, name, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, props, rotate, title, required, }: CheckboxContainerProps) => react_jsx_runtime.JSX.Element;
+declare const CheckboxContainer: ({ id, checked, setChecked, circleClassName, className, containerClassName, elementClassName, name, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, props, rotate, title, defaultChecked, inputProps, required, }: CheckboxContainerProps) => react_jsx_runtime.JSX.Element;
 declare const FormElementContainer: ({ containerClassName, direction, labelClassName, labelContent, labelWithDots, labelsCommonClassName, name, required, children, defaultContainerClassName, }: BaseElementProps & {
     children: ReactNode;
     defaultContainerClassName?: boolean;

package/dist/components/index.js

@@ -1132,7 +1132,7 @@ var callCenterDomain = isLocal ? "http://localhost:9003/api/call-center" : baseD
 var import_react2 = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var Checkbox = function(param) {
-    var _param_id = param.id, id = _param_id === void 0 ? Math.random().toString() : _param_id, _param_checked = param.checked, checked = _param_checked === void 0 ? false : _param_checked, setChecked = param.setChecked, _param_rotate = param.rotate, rotate = _param_rotate === void 0 ? true : _param_rotate, className = param.className, circleClassName = param.circleClassName, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, props = param.props, title = param.title;
+    var _param_id = param.id, id = _param_id === void 0 ? Math.random().toString() : _param_id, _param_checked = param.checked, checked = _param_checked === void 0 ? false : _param_checked, setChecked = param.setChecked, _param_rotate = param.rotate, rotate = _param_rotate === void 0 ? true : _param_rotate, className = param.className, circleClassName = param.circleClassName, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, props = param.props, title = param.title, _param_defaultChecked = param.defaultChecked, defaultChecked = _param_defaultChecked === void 0 ? false : _param_defaultChecked, inputProps = param.inputProps;
     var _ref = _sliced_to_array((0, import_react2.useState)(checked), 2), isChecked = _ref[0], setIsChecked = _ref[1];
     var toggleChecked = function() {
         setIsChecked(!isChecked);
@@ -1141,14 +1141,15 @@ var Checkbox = function(param) {
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
         className: containerClassName,
         children: [
-            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", {
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("input", _object_spread_props(_object_spread({}, inputProps), {
                 name: name,
+                defaultChecked: defaultChecked,
                 type: "checkbox",
                 id: id,
                 className: "hidden",
                 checked: isChecked,
                 onChange: toggleChecked
-            }),
+            })),
             /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", _object_spread_props(_object_spread({
                 title: title
             }, props), {
@@ -5487,7 +5488,7 @@ var NumberUI = function(param) {
     });
 };
 // src/components/forms/ModularForm/ModularForm.tsx
-var import_react14 = require("react");
+var import_react15 = require("react");
 // src/components/forms/ModularForm/formElements.tsx
 var import_react13 = require("react");
 // src/components/forms/ModularForm/InternationalPhonePicker.tsx
@@ -5969,7 +5970,7 @@ var FormSeparator = function(param) {
     }));
 };
 var CheckboxContainer = function(param) {
-    var id = param.id, checked = param.checked, setChecked = param.setChecked, circleClassName = param.circleClassName, className = param.className, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, direction = param.direction, labelClassName = param.labelClassName, labelContent = param.labelContent, labelWithDots = param.labelWithDots, labelsCommonClassName = param.labelsCommonClassName, props = param.props, rotate = param.rotate, title = param.title, required = param.required;
+    var id = param.id, checked = param.checked, setChecked = param.setChecked, circleClassName = param.circleClassName, className = param.className, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, direction = param.direction, labelClassName = param.labelClassName, labelContent = param.labelContent, labelWithDots = param.labelWithDots, labelsCommonClassName = param.labelsCommonClassName, props = param.props, rotate = param.rotate, title = param.title, _param_defaultChecked = param.defaultChecked, defaultChecked = _param_defaultChecked === void 0 ? false : _param_defaultChecked, inputProps = param.inputProps, required = param.required;
     var containerProps = (0, import_react13.useMemo)(function() {
         return {
             containerClassName: containerClassName,
@@ -6003,7 +6004,9 @@ var CheckboxContainer = function(param) {
             className: className,
             containerClassName: containerClassName,
             elementClassName: elementClassName,
-            title: title
+            title: title,
+            defaultChecked: defaultChecked,
+            inputProps: inputProps
         })
     }));
 };
@@ -6047,6 +6050,18 @@ var ElementLabel = function(param) {
         ]
     });
 };
+// src/hooks/react.ts
+var import_lodash5 = require("lodash");
+var import_react14 = require("react");
+function useDeepCompareEffect(effect, dependencies) {
+    var previousDepsRef = (0, import_react14.useRef)();
+    if (!(0, import_lodash5.isEqual)(previousDepsRef.current, dependencies)) {
+        previousDepsRef.current = dependencies;
+    }
+    (0, import_react14.useEffect)(effect, [
+        previousDepsRef.current
+    ]);
+}
 // src/components/forms/ModularForm/ModularForm.tsx
 var import_jsx_runtime21 = require("react/jsx-runtime");
 var ModularForm = function(param) {
@@ -6061,11 +6076,11 @@ var ModularForm = function(param) {
         return function(form) {
             return _ref.apply(this, arguments);
         };
-    }() : _param_submitFunction, _param_elements = param.elements, elements = _param_elements === void 0 ? [] : _param_elements, headerContent = param.headerContent, buttonContent = param.buttonContent, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_elementsContainerClassName = param.elementsContainerClassName, elementsContainerClassName = _param_elementsContainerClassName === void 0 ? "" : _param_elementsContainerClassName, _param_headerClassName = param.headerClassName, headerClassName = _param_headerClassName === void 0 ? "" : _param_headerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "rtl" : _param_direction, _param_buttonClassName = param.buttonClassName, buttonClassName = _param_buttonClassName === void 0 ? "" : _param_buttonClassName, submitRef = param.submitRef, _param_footerClassName = param.footerClassName, footerClassName = _param_footerClassName === void 0 ? "" : _param_footerClassName, _param_errorClassName = param.errorClassName, errorClassName = _param_errorClassName === void 0 ? "" : _param_errorClassName, labelsCommonClassName = param.labelsCommonClassName, _param_autoFixLabelsWidth = param.autoFixLabelsWidth, autoFixLabelsWidth = _param_autoFixLabelsWidth === void 0 ? true : _param_autoFixLabelsWidth, loaderProps = param.loaderProps, onLoad = param.onLoad;
-    var _ref = _sliced_to_array((0, import_react14.useState)(""), 2), errorMsg = _ref[0], setErrorMsg = _ref[1];
-    var _ref1 = _sliced_to_array((0, import_react14.useState)(false), 2), isLoading = _ref1[0], setIsLoading = _ref1[1];
-    var formRef = (0, import_react14.useRef)(null);
-    (0, import_react14.useEffect)(function() {
+    }() : _param_submitFunction, _param_elements = param.elements, elements = _param_elements === void 0 ? [] : _param_elements, headerContent = param.headerContent, buttonContent = param.buttonContent, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_elementsContainerClassName = param.elementsContainerClassName, elementsContainerClassName = _param_elementsContainerClassName === void 0 ? "" : _param_elementsContainerClassName, _param_headerClassName = param.headerClassName, headerClassName = _param_headerClassName === void 0 ? "" : _param_headerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "rtl" : _param_direction, _param_buttonClassName = param.buttonClassName, buttonClassName = _param_buttonClassName === void 0 ? "" : _param_buttonClassName, submitRef = param.submitRef, _param_footerClassName = param.footerClassName, footerClassName = _param_footerClassName === void 0 ? "" : _param_footerClassName, _param_errorClassName = param.errorClassName, errorClassName = _param_errorClassName === void 0 ? "" : _param_errorClassName, labelsCommonClassName = param.labelsCommonClassName, _param_autoFixLabelsWidth = param.autoFixLabelsWidth, autoFixLabelsWidth = _param_autoFixLabelsWidth === void 0 ? true : _param_autoFixLabelsWidth, loaderProps = param.loaderProps, _param_autoFixLabelsWidthDeps = param.autoFixLabelsWidthDeps, autoFixLabelsWidthDeps = _param_autoFixLabelsWidthDeps === void 0 ? [] : _param_autoFixLabelsWidthDeps, onLoad = param.onLoad;
+    var _ref = _sliced_to_array((0, import_react15.useState)(""), 2), errorMsg = _ref[0], setErrorMsg = _ref[1];
+    var _ref1 = _sliced_to_array((0, import_react15.useState)(false), 2), isLoading = _ref1[0], setIsLoading = _ref1[1];
+    var formRef = (0, import_react15.useRef)(null);
+    useDeepCompareEffect(function() {
         if (formRef.current && autoFixLabelsWidth) {
             var labels = formRef.current.getElementsByClassName("form-label");
             var max_width = 0;
@@ -6079,8 +6094,8 @@ var ModularForm = function(param) {
                 label.style.minWidth = "".concat(max_width, "px");
             });
         }
-    }, []);
-    (0, import_react14.useEffect)(function() {
+    }, autoFixLabelsWidthDeps);
+    (0, import_react15.useEffect)(function() {
         if (formRef.current) {
             onLoad === null || onLoad === void 0 ? void 0 : onLoad(formRef.current);
         }
@@ -6211,7 +6226,7 @@ var ModularForm = function(param) {
                             }), index2);
                         case "custom":
                             var _element_element;
-                            return typeof ((_element_element = element.element) === null || _element_element === void 0 ? void 0 : _element_element.type) !== "string" && (0, import_react14.cloneElement)(element.element, {
+                            return typeof ((_element_element = element.element) === null || _element_element === void 0 ? void 0 : _element_element.type) !== "string" && (0, import_react15.cloneElement)(element.element, {
                                 key: index2
                             });
                         default:
@@ -6244,7 +6259,7 @@ var ModularForm = function(param) {
 };
 var ModularForm_default = ModularForm;
 // src/components/forms/index.tsx
-var import_react15 = require("react");
+var import_react17 = require("react");
 var import_moment2 = __toESM(require("moment"));
 var import_jsx_runtime22 = require("react/jsx-runtime");
 var ConfirmForm = function(param) {
@@ -6289,7 +6304,7 @@ var DatePicker = function(param) {
             return _ref.apply(this, arguments);
         };
     }() : _param_submit, _param_formClassName = param.formClassName, formClassName = _param_formClassName === void 0 ? "" : _param_formClassName, _param_labelsClassName = param.labelsClassName, labelsClassName = _param_labelsClassName === void 0 ? "" : _param_labelsClassName, _param_inputsClassName = param.inputsClassName, inputsClassName = _param_inputsClassName === void 0 ? "" : _param_inputsClassName, _param_buttonClassName = param.buttonClassName, buttonClassName = _param_buttonClassName === void 0 ? "" : _param_buttonClassName, _param_buttonStyle = param.buttonStyle, buttonStyle = _param_buttonStyle === void 0 ? {} : _param_buttonStyle, defaultFrom = param.defaultFrom, defaultTo = param.defaultTo, _param_direction = param.direction, direction = _param_direction === void 0 ? "rtl" : _param_direction, _param_fromText = param.fromText, fromText = _param_fromText === void 0 ? "From date" : _param_fromText, _param_toText = param.toText, toText = _param_toText === void 0 ? "To date" : _param_toText, _param_buttonText = param.buttonText, buttonText = _param_buttonText === void 0 ? "Search" : _param_buttonText;
-    var _ref = _sliced_to_array((0, import_react15.useState)(false), 2), isLoading = _ref[0], setIsLoading = _ref[1];
+    var _ref = _sliced_to_array((0, import_react17.useState)(false), 2), isLoading = _ref[0], setIsLoading = _ref[1];
     var onSubmit = /*#__PURE__*/ function() {
         var _ref = _async_to_generator(function(e) {
             return _ts_generator(this, function(_state) {
@@ -6363,12 +6378,12 @@ var DatePicker = function(param) {
 };
 // src/components/CodeInput.tsx
 var import_input_otp = require("input-otp");
-var import_react16 = require("react");
+var import_react18 = require("react");
 var import_jsx_runtime23 = require("react/jsx-runtime");
 function CodeInput(param) {
     var codeValue = param.codeValue, setCodeValue = param.setCodeValue, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_slotContainerClassName = param.slotContainerClassName, slotContainerClassName = _param_slotContainerClassName === void 0 ? "" : _param_slotContainerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "ltr" : _param_direction;
-    var firstInputRef = (0, import_react16.useRef)(null);
-    (0, import_react16.useEffect)(function() {
+    var firstInputRef = (0, import_react18.useRef)(null);
+    (0, import_react18.useEffect)(function() {
         if (firstInputRef.current) {
             firstInputRef.current.focus();
         }

package/dist/components/index.mjs

@@ -919,7 +919,7 @@ var callCenterDomain = isLocal ? "http://localhost:9003/api/call-center" : baseD
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Checkbox = function(param) {
-    var _param_id = param.id, id = _param_id === void 0 ? Math.random().toString() : _param_id, _param_checked = param.checked, checked = _param_checked === void 0 ? false : _param_checked, setChecked = param.setChecked, _param_rotate = param.rotate, rotate = _param_rotate === void 0 ? true : _param_rotate, className = param.className, circleClassName = param.circleClassName, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, props = param.props, title = param.title;
+    var _param_id = param.id, id = _param_id === void 0 ? Math.random().toString() : _param_id, _param_checked = param.checked, checked = _param_checked === void 0 ? false : _param_checked, setChecked = param.setChecked, _param_rotate = param.rotate, rotate = _param_rotate === void 0 ? true : _param_rotate, className = param.className, circleClassName = param.circleClassName, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, props = param.props, title = param.title, _param_defaultChecked = param.defaultChecked, defaultChecked = _param_defaultChecked === void 0 ? false : _param_defaultChecked, inputProps = param.inputProps;
     var _useState = _sliced_to_array(useState(checked), 2), isChecked = _useState[0], setIsChecked = _useState[1];
     var toggleChecked = function() {
         setIsChecked(!isChecked);
@@ -928,14 +928,15 @@ var Checkbox = function(param) {
     return /* @__PURE__ */ jsxs("div", {
         className: containerClassName,
         children: [
-            /* @__PURE__ */ jsx("input", {
+            /* @__PURE__ */ jsx("input", _object_spread_props(_object_spread({}, inputProps), {
                 name: name,
+                defaultChecked: defaultChecked,
                 type: "checkbox",
                 id: id,
                 className: "hidden",
                 checked: isChecked,
                 onChange: toggleChecked
-            }),
+            })),
             /* @__PURE__ */ jsxs("label", _object_spread_props(_object_spread({
                 title: title
             }, props), {
@@ -5274,7 +5275,7 @@ var NumberUI = function(param) {
     });
 };
 // src/components/forms/ModularForm/ModularForm.tsx
-import { cloneElement, useEffect as useEffect7, useRef as useRef5, useState as useState9 } from "react";
+import { cloneElement, useEffect as useEffect8, useRef as useRef6, useState as useState9 } from "react";
 // src/components/forms/ModularForm/formElements.tsx
 import { useCallback as useCallback6, useMemo as useMemo8, useState as useState8 } from "react";
 // src/components/forms/ModularForm/InternationalPhonePicker.tsx
@@ -5756,7 +5757,7 @@ var FormSeparator = function(param) {
     }));
 };
 var CheckboxContainer = function(param) {
-    var id = param.id, checked = param.checked, setChecked = param.setChecked, circleClassName = param.circleClassName, className = param.className, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, direction = param.direction, labelClassName = param.labelClassName, labelContent = param.labelContent, labelWithDots = param.labelWithDots, labelsCommonClassName = param.labelsCommonClassName, props = param.props, rotate = param.rotate, title = param.title, required = param.required;
+    var id = param.id, checked = param.checked, setChecked = param.setChecked, circleClassName = param.circleClassName, className = param.className, containerClassName = param.containerClassName, elementClassName = param.elementClassName, name = param.name, direction = param.direction, labelClassName = param.labelClassName, labelContent = param.labelContent, labelWithDots = param.labelWithDots, labelsCommonClassName = param.labelsCommonClassName, props = param.props, rotate = param.rotate, title = param.title, _param_defaultChecked = param.defaultChecked, defaultChecked = _param_defaultChecked === void 0 ? false : _param_defaultChecked, inputProps = param.inputProps, required = param.required;
     var containerProps = useMemo8(function() {
         return {
             containerClassName: containerClassName,
@@ -5790,7 +5791,9 @@ var CheckboxContainer = function(param) {
             className: className,
             containerClassName: containerClassName,
             elementClassName: elementClassName,
-            title: title
+            title: title,
+            defaultChecked: defaultChecked,
+            inputProps: inputProps
         })
     }));
 };
@@ -5834,6 +5837,18 @@ var ElementLabel = function(param) {
         ]
     });
 };
+// src/hooks/react.ts
+import { isEqual as isEqual5 } from "lodash";
+import { useEffect as useEffect7, useMemo as useMemo9, useRef as useRef5 } from "react";
+function useDeepCompareEffect(effect, dependencies) {
+    var previousDepsRef = useRef5();
+    if (!isEqual5(previousDepsRef.current, dependencies)) {
+        previousDepsRef.current = dependencies;
+    }
+    useEffect7(effect, [
+        previousDepsRef.current
+    ]);
+}
 // src/components/forms/ModularForm/ModularForm.tsx
 import { jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 var ModularForm = function(param) {
@@ -5848,11 +5863,11 @@ var ModularForm = function(param) {
         return function(form) {
             return _ref.apply(this, arguments);
         };
-    }() : _param_submitFunction, _param_elements = param.elements, elements = _param_elements === void 0 ? [] : _param_elements, headerContent = param.headerContent, buttonContent = param.buttonContent, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_elementsContainerClassName = param.elementsContainerClassName, elementsContainerClassName = _param_elementsContainerClassName === void 0 ? "" : _param_elementsContainerClassName, _param_headerClassName = param.headerClassName, headerClassName = _param_headerClassName === void 0 ? "" : _param_headerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "rtl" : _param_direction, _param_buttonClassName = param.buttonClassName, buttonClassName = _param_buttonClassName === void 0 ? "" : _param_buttonClassName, submitRef = param.submitRef, _param_footerClassName = param.footerClassName, footerClassName = _param_footerClassName === void 0 ? "" : _param_footerClassName, _param_errorClassName = param.errorClassName, errorClassName = _param_errorClassName === void 0 ? "" : _param_errorClassName, labelsCommonClassName = param.labelsCommonClassName, _param_autoFixLabelsWidth = param.autoFixLabelsWidth, autoFixLabelsWidth = _param_autoFixLabelsWidth === void 0 ? true : _param_autoFixLabelsWidth, loaderProps = param.loaderProps, onLoad = param.onLoad;
+    }() : _param_submitFunction, _param_elements = param.elements, elements = _param_elements === void 0 ? [] : _param_elements, headerContent = param.headerContent, buttonContent = param.buttonContent, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_elementsContainerClassName = param.elementsContainerClassName, elementsContainerClassName = _param_elementsContainerClassName === void 0 ? "" : _param_elementsContainerClassName, _param_headerClassName = param.headerClassName, headerClassName = _param_headerClassName === void 0 ? "" : _param_headerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "rtl" : _param_direction, _param_buttonClassName = param.buttonClassName, buttonClassName = _param_buttonClassName === void 0 ? "" : _param_buttonClassName, submitRef = param.submitRef, _param_footerClassName = param.footerClassName, footerClassName = _param_footerClassName === void 0 ? "" : _param_footerClassName, _param_errorClassName = param.errorClassName, errorClassName = _param_errorClassName === void 0 ? "" : _param_errorClassName, labelsCommonClassName = param.labelsCommonClassName, _param_autoFixLabelsWidth = param.autoFixLabelsWidth, autoFixLabelsWidth = _param_autoFixLabelsWidth === void 0 ? true : _param_autoFixLabelsWidth, loaderProps = param.loaderProps, _param_autoFixLabelsWidthDeps = param.autoFixLabelsWidthDeps, autoFixLabelsWidthDeps = _param_autoFixLabelsWidthDeps === void 0 ? [] : _param_autoFixLabelsWidthDeps, onLoad = param.onLoad;
     var _useState9 = _sliced_to_array(useState9(""), 2), errorMsg = _useState9[0], setErrorMsg = _useState9[1];
     var _useState91 = _sliced_to_array(useState9(false), 2), isLoading = _useState91[0], setIsLoading = _useState91[1];
-    var formRef = useRef5(null);
-    useEffect7(function() {
+    var formRef = useRef6(null);
+    useDeepCompareEffect(function() {
         if (formRef.current && autoFixLabelsWidth) {
             var labels = formRef.current.getElementsByClassName("form-label");
             var max_width = 0;
@@ -5866,8 +5881,8 @@ var ModularForm = function(param) {
                 label.style.minWidth = "".concat(max_width, "px");
             });
         }
-    }, []);
-    useEffect7(function() {
+    }, autoFixLabelsWidthDeps);
+    useEffect8(function() {
         if (formRef.current) {
             onLoad === null || onLoad === void 0 ? void 0 : onLoad(formRef.current);
         }
@@ -6150,12 +6165,12 @@ var DatePicker = function(param) {
 };
 // src/components/CodeInput.tsx
 import { OTPInput } from "input-otp";
-import { useEffect as useEffect8, useRef as useRef6 } from "react";
+import { useEffect as useEffect9, useRef as useRef7 } from "react";
 import { jsx as jsx22 } from "react/jsx-runtime";
 function CodeInput(param) {
     var codeValue = param.codeValue, setCodeValue = param.setCodeValue, _param_className = param.className, className = _param_className === void 0 ? "" : _param_className, _param_slotContainerClassName = param.slotContainerClassName, slotContainerClassName = _param_slotContainerClassName === void 0 ? "" : _param_slotContainerClassName, _param_direction = param.direction, direction = _param_direction === void 0 ? "ltr" : _param_direction;
-    var firstInputRef = useRef6(null);
-    useEffect8(function() {
+    var firstInputRef = useRef7(null);
+    useEffect9(function() {
         if (firstInputRef.current) {
             firstInputRef.current.focus();
         }

package/dist/types/index.d.mts

@@ -124,10 +124,12 @@ interface CheckBoxProps {
     elementClassName?: string;
     setChecked?: (v: boolean) => void;
     checked?: boolean;
+    defaultChecked?: boolean;
     className?: string;
     name?: string;
     id?: string;
     props?: ComponentProps<"label">;
+    inputProps?: ComponentProps<"input">;
     title?: string;
 }
 
@@ -284,6 +286,7 @@ interface ModularFormProps {
     errorClassName?: string;
     onLoad?: (e: EventTarget & HTMLFormElement) => void;
     autoFixLabelsWidth?: boolean;
+    autoFixLabelsWidthDeps?: any[];
     loaderProps?: LoaderProps;
     elementsContainerClassName?: string;
     className?: string;

package/dist/types/index.d.ts

@@ -124,10 +124,12 @@ interface CheckBoxProps {
     elementClassName?: string;
     setChecked?: (v: boolean) => void;
     checked?: boolean;
+    defaultChecked?: boolean;
     className?: string;
     name?: string;
     id?: string;
     props?: ComponentProps<"label">;
+    inputProps?: ComponentProps<"input">;
     title?: string;
 }
 
@@ -284,6 +286,7 @@ interface ModularFormProps {
     errorClassName?: string;
     onLoad?: (e: EventTarget & HTMLFormElement) => void;
     autoFixLabelsWidth?: boolean;
+    autoFixLabelsWidthDeps?: any[];
     loaderProps?: LoaderProps;
     elementsContainerClassName?: string;
     className?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "akeyless-client-commons",
-    "version": "1.0.153",
+    "version": "1.0.155",
     "scripts": {
         "build": "tsup",
         "deploy": "npm run build && npm version patch --no-git-tag-version && npm publish",