@codezee/sixtify-brahma 0.2.175 → 0.2.177

package/packages/shared-components/dist/FormFields/TextField/TextField.js

@@ -6,7 +6,7 @@ const material_1 = require("@mui/material");
 const react_hook_form_1 = require("react-hook-form");
 const icons_material_1 = require("@mui/icons-material");
 const Tooltip_1 = require("../../Tooltip");
-const hooks_1 = require("../../utils/hooks");
+const useFormFieldFocus_1 = require("../../utils/hooks/useFormFieldFocus");
 const commonStyles_1 = require("../commonStyles");
 const Skeleton_1 = require("./Skeleton");
 const characterTypeMessages = {
@@ -20,13 +20,14 @@ const characterTypeMessages = {
 function TextField({ control, name, defaultValue, label = "", rules, type, required, disabled, loading = false, placeholder = "", isCapitalize = false, isTrimStartDisabled = false, rows, characterType = "string-number-special", letterCase = "mixed", setError, containerProps, styling = "custom", infoMessage, regexExpression = {
     message: null,
     regex: /^[\s\S]*$/,
-}, customOnChange, multiline, ...inputFieldProps }) {
+}, navigationKey = "tab", customOnChange, ...inputFieldProps }) {
     const { field: { value, onChange, ...restField }, fieldState: { error }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
-    const { inputRef, maintainFocus } = (0, hooks_1.useFormFieldFocus)();
+    const { inputRef, maintainFocus, handleKeyDown: handleNavigationKeyDown, } = (0, useFormFieldFocus_1.useFormFieldFocus)({ navigationKey });
     const handleKeyDown = (event) => {
         if (event.key === "-" && type === "number") {
             event.preventDefault();
         }
+        handleNavigationKeyDown(event, undefined, false);
     };
     const getCharacterRegex = (type) => {
         switch (type) {
@@ -68,9 +69,9 @@ function TextField({ control, name, defaultValue, label = "", rules, type, requi
         ? characterTypeMessages[characterType]
         : message;
     if (loading) {
-        return ((0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label, rows: multiline && !rows ? 2 : rows, styling: styling }));
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label, rows: rows, styling: styling });
     }
-    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { ...containerProps, gap: "5px", children: [label && styling === "custom" && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, disabled: disabled, children: label }), infoMessage && ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { toolTipLabel: infoMessage, children: (0, jsx_runtime_1.jsx)(icons_material_1.InfoOutlined, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { ...containerProps, gap: "5px", children: [label && styling === "custom" && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { sx: { fontSize: { xs: "14px", md: "16px" } }, required: required, disabled: disabled, children: label }), infoMessage && ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { toolTipLabel: infoMessage, children: (0, jsx_runtime_1.jsx)(icons_material_1.InfoOutlined, { sx: {
                                 fontSize: 13,
                             } }) }))] })), (0, jsx_runtime_1.jsx)(material_1.TextField, { disabled: disabled, required: required, fullWidth: true, inputRef: inputRef, onKeyDown: handleKeyDown, placeholder: styling === "default" ? placeholder : placeholder || label, type: type, label: styling === "default" ? label : undefined, sx: (0, commonStyles_1.getDefaultTextFieldSx)(styling), InputLabelProps: (0, commonStyles_1.getDefaultInputLabelProps)(styling), inputProps: {
                     min: 0,
@@ -108,5 +109,5 @@ function TextField({ control, name, defaultValue, label = "", rules, type, requi
                         }
                         maintainFocus();
                     });
-                }, value: typeof value === "string" ? value.trimStart() : (value ?? ""), multiline: multiline, ...restField, ...inputFieldProps })] }));
+                }, value: typeof value === "string" ? value.trimStart() : (value ?? ""), ...restField, ...inputFieldProps })] }));
 }

package/packages/shared-components/dist/FormFields/TimeField/TimeField.d.ts

@@ -1,6 +1,7 @@
 import type { PickerValidDate } from "@mui/x-date-pickers/models";
 import { type TimeFieldProps as MuiTimeFieldProps } from "@mui/x-date-pickers/TimeField";
 import type { FieldValues, UseControllerProps } from "react-hook-form";
+import { type NavigationKey } from "../../utils/hooks/useFormFieldFocus";
 export type TimeFieldProps<P extends FieldValues> = UseControllerProps<P> & MuiTimeFieldProps<PickerValidDate> & Partial<{
     label: string;
     required: boolean;
@@ -12,6 +13,7 @@ export type TimeFieldProps<P extends FieldValues> = UseControllerProps<P> & MuiT
     isReturnLocalTime: boolean;
     isReturnDateWithTime: boolean;
     styling?: "custom" | "default";
+    navigationKey?: NavigationKey;
 }>;
-export declare function TimeField<P extends FieldValues>({ control, defaultValue, disabled, label, name, error, helperText, loading, required, rules, format, isReturnLocalTime, isReturnDateWithTime, styling, ...restProps }: TimeFieldProps<P>): import("react/jsx-runtime").JSX.Element;
+export declare function TimeField<P extends FieldValues>({ control, defaultValue, disabled, label, name, error, helperText, loading, required, rules, format, isReturnLocalTime, isReturnDateWithTime, styling, navigationKey, ...restProps }: TimeFieldProps<P>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=TimeField.d.ts.map

package/packages/shared-components/dist/FormFields/TimeField/TimeField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/FormFields/TimeField/TimeField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAEL,KAAK,cAAc,IAAI,iBAAiB,EACzC,MAAM,+BAA+B,CAAC;AAEvC,OAAO,KAAK,EACV,WAAW,EAGX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AASzB,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACvE,iBAAiB,CAAC,eAAe,CAAC,GAClC,OAAO,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,OAAO,CAAC;IAC3B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAChC,CAAC,CAAC;AAEL,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,EAAE,EAC/C,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,IAAI,EACJ,KAAK,EACL,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,KAAK,EACL,MAAgB,EAChB,iBAAyB,EACzB,oBAA4B,EAC5B,OAAkB,EAClB,GAAG,SAAS,EACb,EAAE,cAAc,CAAC,CAAC,CAAC,2CAyFnB"}
+{"version":3,"file":"TimeField.d.ts","sourceRoot":"","sources":["../../../src/FormFields/TimeField/TimeField.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAEL,KAAK,cAAc,IAAI,iBAAiB,EACzC,MAAM,+BAA+B,CAAC;AAEvC,OAAO,KAAK,EACV,WAAW,EAGX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAEL,KAAK,aAAa,EACnB,MAAM,qCAAqC,CAAC;AAO7C,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACvE,iBAAiB,CAAC,eAAe,CAAC,GAClC,OAAO,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,CAAC;IACf,iBAAiB,EAAE,OAAO,CAAC;IAC3B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC/B,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B,CAAC,CAAC;AAEL,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,EAAE,EAC/C,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,IAAI,EACJ,KAAK,EACL,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,KAAK,EACL,MAAgB,EAChB,iBAAyB,EACzB,oBAA4B,EAC5B,OAAkB,EAClB,aAAqB,EACrB,GAAG,SAAS,EACb,EAAE,cAAc,CAAC,CAAC,CAAC,2CAgGnB"}

package/packages/shared-components/dist/FormFields/TimeField/TimeField.js

@@ -6,12 +6,12 @@ const material_1 = require("@mui/material");
 const TimeField_1 = require("@mui/x-date-pickers/TimeField");
 const luxon_1 = require("luxon");
 const react_hook_form_1 = require("react-hook-form");
-const hooks_1 = require("../../utils/hooks");
+const useFormFieldFocus_1 = require("../../utils/hooks/useFormFieldFocus");
 const commonStyles_1 = require("../commonStyles");
 const Skeleton_1 = require("./Skeleton");
-function TimeField({ control, defaultValue, disabled = false, label, name, error, helperText, loading = false, required = false, rules, format = "HH:mm", isReturnLocalTime = false, isReturnDateWithTime = false, styling = "custom", ...restProps }) {
+function TimeField({ control, defaultValue, disabled = false, label, name, error, helperText, loading = false, required = false, rules, format = "HH:mm", isReturnLocalTime = false, isReturnDateWithTime = false, styling = "custom", navigationKey = "tab", ...restProps }) {
     const { field: { value, onChange, ...restField }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
-    const { inputRef, maintainFocus } = (0, hooks_1.useFormFieldFocus)();
+    const { inputRef, maintainFocus, handleKeyDown: handleNavigationKeyDown, } = (0, useFormFieldFocus_1.useFormFieldFocus)({ navigationKey });
     const theme = (0, material_1.useTheme)();
     const { butterflyBlue } = theme.palette.app.color;
     if (error && value && typeof value === "object") {
@@ -51,6 +51,9 @@ function TimeField({ control, defaultValue, disabled = false, label, name, error
                         required: styling === "default" ? required : undefined,
                         inputRef,
                         InputLabelProps: (0, commonStyles_1.getDefaultInputLabelProps)(styling),
+                        onKeyDown: (event) => {
+                            handleNavigationKeyDown(event, undefined, false);
+                        },
                         sx: {
                             ...(0, commonStyles_1.getDefaultTextFieldSx)(styling),
                             backgroundColor: "white",

package/packages/shared-components/dist/FormFields/TimePicker/TimePicker.d.ts

@@ -3,6 +3,7 @@ import type { TimePickerProps as MuiTimePickerProps } from "@mui/x-date-pickers/
 import type { PickerValidDate } from "@mui/x-date-pickers/models";
 import { type ReactElement } from "react";
 import type { FieldValues, UseControllerProps } from "react-hook-form";
+import { type NavigationKey } from "../../utils/hooks/useFormFieldFocus";
 export type TimePickerProps<P extends FieldValues> = UseControllerProps<P> & MuiTimePickerProps<PickerValidDate> & Partial<{
     label: string;
     required: boolean;
@@ -18,6 +19,7 @@ export type TimePickerProps<P extends FieldValues> = UseControllerProps<P> & Mui
     timeStepsMinutes?: number;
     containerProps?: StackProps;
     styling?: "custom" | "default";
+    navigationKey?: NavigationKey;
 }>;
-export declare function TimePicker<P extends FieldValues>({ control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, rules, format, isReturnLocalTime, isReturnDateWithTime, timeStepsMinutes, helperIcon, toolTipText, containerProps, styling, ...restProps }: TimePickerProps<P>): import("react/jsx-runtime").JSX.Element;
+export declare function TimePicker<P extends FieldValues>({ control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, rules, format, isReturnLocalTime, isReturnDateWithTime, timeStepsMinutes, helperIcon, toolTipText, containerProps, styling, navigationKey, ...restProps }: TimePickerProps<P>): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=TimePicker.d.ts.map

package/packages/shared-components/dist/FormFields/TimePicker/TimePicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/TimePicker/TimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,OAAO,KAAK,EAAE,eAAe,IAAI,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAE5F,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,OAAO,EAAE,KAAK,YAAY,EAAY,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,EACV,WAAW,EAGX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AASzB,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACxE,kBAAkB,CAAC,eAAe,CAAC,GACnC,OAAO,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,OAAO,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;CAChC,CAAC,CAAC;AAEL,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,EAChD,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,KAAK,EACL,MAAgB,EAChB,iBAAyB,EACzB,oBAA4B,EAC5B,gBAAoB,EACpB,UAAU,EACV,WAAW,EACX,cAAc,EACd,OAAkB,EAClB,GAAG,SAAS,EACb,EAAE,eAAe,CAAC,CAAC,CAAC,2CA2IpB"}
+{"version":3,"file":"TimePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/TimePicker/TimePicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,OAAO,KAAK,EAAE,eAAe,IAAI,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAE5F,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,OAAO,EAAY,KAAK,YAAY,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,KAAK,EACV,WAAW,EAGX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAEzB,OAAO,EAEL,KAAK,aAAa,EACnB,MAAM,qCAAqC,CAAC;AAO7C,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACxE,kBAAkB,CAAC,eAAe,CAAC,GACnC,OAAO,CAAC;IACN,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,OAAO,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,UAAU,CAAC;IAC5B,OAAO,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAC;IAC/B,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B,CAAC,CAAC;AAEL,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,EAChD,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,KAAK,EACL,MAAgB,EAChB,iBAAyB,EACzB,oBAA4B,EAC5B,gBAAoB,EACpB,UAAU,EACV,WAAW,EACX,cAAc,EACd,OAAkB,EAClB,aAAqB,EACrB,GAAG,SAAS,EACb,EAAE,eAAe,CAAC,CAAC,CAAC,2CAwMpB"}

package/packages/shared-components/dist/FormFields/TimePicker/TimePicker.js

@@ -7,13 +7,13 @@ const TimePicker_1 = require("@mui/x-date-pickers/TimePicker");
 const luxon_1 = require("luxon");
 const react_1 = require("react");
 const react_hook_form_1 = require("react-hook-form");
-const hooks_1 = require("../../utils/hooks");
+const useFormFieldFocus_1 = require("../../utils/hooks/useFormFieldFocus");
 const commonStyles_1 = require("../commonStyles");
 const Skeleton_1 = require("./Skeleton");
-function TimePicker({ control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, rules, format = "HH:mm", isReturnLocalTime = false, isReturnDateWithTime = false, timeStepsMinutes = 1, helperIcon, toolTipText, containerProps, styling = "custom", ...restProps }) {
+function TimePicker({ control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, rules, format = "HH:mm", isReturnLocalTime = false, isReturnDateWithTime = false, timeStepsMinutes = 1, helperIcon, toolTipText, containerProps, styling = "custom", navigationKey = "tab", ...restProps }) {
     const { field: { value, onChange, ...restField }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
     const [open, setOpen] = (0, react_1.useState)(false);
-    const { setInputRef, maintainFocus, maintainFocusAfterClose, handleKeyDown } = (0, hooks_1.useFormFieldFocus)(open);
+    const { setInputRef, maintainFocus, maintainFocusAfterClose, handleKeyDown, handleEnterNavigation, } = (0, useFormFieldFocus_1.useFormFieldFocus)({ isOpen: open, navigationKey });
     if (error && value && typeof value === "object") {
         helperText = "Invalid time";
     }
@@ -46,9 +46,46 @@ function TimePicker({ control, defaultValue, disabled = false, label, readOnly =
                             },
                         },
                         onKeyDown: (event) => {
+                            if (navigationKey === "enter") {
+                                if (event.key === " " && !open && !disabled && !readOnly) {
+                                    event.preventDefault();
+                                    event.stopPropagation();
+                                    setOpen(true);
+                                    return;
+                                }
+                                if (event.key === "Enter" && !open) {
+                                    event.preventDefault();
+                                    event.stopPropagation();
+                                    handleEnterNavigation(event);
+                                    return;
+                                }
+                                if (event.key === "Enter" && open) {
+                                    event.preventDefault();
+                                    event.stopPropagation();
+                                    setOpen(false);
+                                    maintainFocusAfterClose();
+                                    requestAnimationFrame(() => {
+                                        handleEnterNavigation(event);
+                                    });
+                                    return;
+                                }
+                            }
                             handleKeyDown(event, () => setOpen(false), open);
                         },
                     },
+                    openPickerButton: {
+                        ...(navigationKey === "enter"
+                            ? {
+                                onKeyDown: (event) => {
+                                    if (event.key === "Enter") {
+                                        event.preventDefault();
+                                        event.stopPropagation();
+                                        handleEnterNavigation(event);
+                                    }
+                                },
+                            }
+                            : {}),
+                    },
                     popper: {
                         sx: {
                             "& .MuiMultiSectionDigitalClockSection-root::after": {
@@ -81,6 +118,17 @@ function TimePicker({ control, defaultValue, disabled = false, label, readOnly =
                                 borderRadius: "5px",
                             },
                         },
+                        onKeyDown: (event) => {
+                            if (navigationKey === "enter" && event.key === "Enter" && open) {
+                                event.preventDefault();
+                                event.stopPropagation();
+                                setOpen(false);
+                                maintainFocusAfterClose();
+                                requestAnimationFrame(() => {
+                                    handleEnterNavigation(event);
+                                });
+                            }
+                        },
                     },
                 }, onChange: (value) => {
                     if (value?.isValid) {

package/packages/shared-components/dist/FormFields/index.d.ts

@@ -4,6 +4,7 @@ export * from "./DatePicker";
 export * from "./DateRangePicker";
 export * from "./DateRangeSelector";
 export * from "./DateTimePicker";
+export * from "./DecimalTextField";
 export * from "./FileUpload";
 export * from "./ImageUpload";
 export * from "./ListItemButton";

package/packages/shared-components/dist/FormFields/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFields/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/FormFields/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,cAAc,CAAC;AAC7B,cAAc,mBAAmB,CAAC;AAClC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,oBAAoB,CAAC;AACnC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,aAAa,CAAC;AAC5B,cAAc,cAAc,CAAC"}

package/packages/shared-components/dist/FormFields/index.js

@@ -20,6 +20,7 @@ __exportStar(require("./DatePicker"), exports);
 __exportStar(require("./DateRangePicker"), exports);
 __exportStar(require("./DateRangeSelector"), exports);
 __exportStar(require("./DateTimePicker"), exports);
+__exportStar(require("./DecimalTextField"), exports);
 __exportStar(require("./FileUpload"), exports);
 __exportStar(require("./ImageUpload"), exports);
 __exportStar(require("./ListItemButton"), exports);

package/packages/shared-components/dist/RichTextEditor/RichTextEditor.d.ts

@@ -15,5 +15,5 @@ export declare const RichTextEditor: import("react").ForwardRefExoticComponent<{
     children?: (editor: import("@tiptap/core").Editor | null) => React.ReactNode;
     editorDependencies?: import("react").DependencyList;
     className?: string;
-} & import("react").RefAttributes<RichTextEditorRef>, "content" | "ref" | "editable" | "extensions"> & import("react").RefAttributes<RichTextEditorRef>>;
+} & import("react").RefAttributes<RichTextEditorRef>, "ref" | "content" | "editable" | "extensions"> & import("react").RefAttributes<RichTextEditorRef>>;
 //# sourceMappingURL=RichTextEditor.d.ts.map

package/packages/shared-components/dist/SmartGrid/Components/TableRowComponent.js

@@ -65,7 +65,7 @@ const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isS
         }
     }, [activePopupRowId]);
     const isPopupOpen = activePopupRowId === row.id;
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("tr", { ref: trRef, style: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("tr", { className: "sg-tbody-tr-row", ref: trRef, style: {
                     backgroundColor: getRowBackgroundColor(),
                     borderTop: `1px solid ${iron[700]}`,
                     display: "flex",
@@ -110,7 +110,7 @@ const TableRowComponent = ({ columnWidths, exportActions, exportData, index, isS
                                 ? butterflyBlue[600]
                                 : getRowBackgroundColor()
                         : cellBackgroundColor;
-                    return ((0, jsx_runtime_1.jsx)("td", { className: "sg-tbody-td-cell", onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, style: {
+                    return ((0, jsx_runtime_1.jsx)("td", { onMouseDown: handleMouseDown, onMouseEnter: handleMouseEnter, style: {
                             animation: cellAnimation,
                             backgroundColor: finalBackgroundColor,
                             boxSizing: "border-box",

package/packages/shared-components/dist/utils/context/NavigationKeyContext.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+import type { NavigationKey } from "../hooks/useFormFieldFocus";
+type NavigationKeyContextValue = {
+    navigationKey: NavigationKey;
+};
+type NavigationKeyProviderProps = {
+    children: ReactNode;
+    navigationKey?: NavigationKey;
+};
+export declare function NavigationKeyProvider({ children, navigationKey, }: Readonly<NavigationKeyProviderProps>): import("react/jsx-runtime").JSX.Element;
+export declare function useNavigationKeyContext(): NavigationKeyContextValue;
+export {};
+//# sourceMappingURL=NavigationKeyContext.d.ts.map

package/packages/shared-components/dist/utils/context/NavigationKeyContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NavigationKeyContext.d.ts","sourceRoot":"","sources":["../../../src/utils/context/NavigationKeyContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAEhE,KAAK,yBAAyB,GAAG;IAC/B,aAAa,EAAE,aAAa,CAAC;CAC9B,CAAC;AAMF,KAAK,0BAA0B,GAAG;IAChC,QAAQ,EAAE,SAAS,CAAC;IACpB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EACpC,QAAQ,EACR,aAAqB,GACtB,EAAE,QAAQ,CAAC,0BAA0B,CAAC,2CAQtC;AAED,wBAAgB,uBAAuB,IAAI,yBAAyB,CAEnE"}

package/packages/shared-components/dist/utils/context/NavigationKeyContext.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NavigationKeyProvider = NavigationKeyProvider;
+exports.useNavigationKeyContext = useNavigationKeyContext;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const NavigationKeyContext = (0, react_1.createContext)({
+    navigationKey: "tab",
+});
+function NavigationKeyProvider({ children, navigationKey = "tab", }) {
+    return ((0, jsx_runtime_1.jsx)(NavigationKeyContext.Provider, { value: (0, react_1.useMemo)(() => ({ navigationKey }), [navigationKey]), children: children }));
+}
+function useNavigationKeyContext() {
+    return (0, react_1.useContext)(NavigationKeyContext);
+}

package/packages/shared-components/dist/utils/context/index.d.ts

@@ -0,0 +1,2 @@
+export { NavigationKeyProvider, useNavigationKeyContext, } from "./NavigationKeyContext";
+//# sourceMappingURL=index.d.ts.map

package/packages/shared-components/dist/utils/context/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/context/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,wBAAwB,CAAC"}

package/packages/shared-components/dist/utils/context/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useNavigationKeyContext = exports.NavigationKeyProvider = void 0;
+var NavigationKeyContext_1 = require("./NavigationKeyContext");
+Object.defineProperty(exports, "NavigationKeyProvider", { enumerable: true, get: function () { return NavigationKeyContext_1.NavigationKeyProvider; } });
+Object.defineProperty(exports, "useNavigationKeyContext", { enumerable: true, get: function () { return NavigationKeyContext_1.useNavigationKeyContext; } });

package/packages/shared-components/dist/utils/hooks/useFormFieldFocus.d.ts

@@ -1,8 +1,15 @@
-export declare function useFormFieldFocus(isOpen?: boolean | undefined): {
+export type NavigationKey = "tab" | "enter";
+type UseFormFieldFocusArgs = {
+    isOpen?: boolean;
+    navigationKey?: NavigationKey;
+};
+export declare function useFormFieldFocus({ isOpen, navigationKey: navigationKeyProp, }: UseFormFieldFocusArgs): {
     inputRef: import("react").MutableRefObject<HTMLInputElement | null>;
     setInputRef: (ref: HTMLDivElement | HTMLInputElement | null) => void;
     maintainFocus: () => void;
     maintainFocusAfterClose: () => void;
     handleKeyDown: <T extends HTMLElement = HTMLElement>(event: React.KeyboardEvent<T>, onClose?: () => void, isPopupOpen?: boolean) => void;
+    handleEnterNavigation: <T extends HTMLElement = HTMLElement>(event: React.KeyboardEvent<T>) => void;
 };
+export {};
 //# sourceMappingURL=useFormFieldFocus.d.ts.map

package/packages/shared-components/dist/utils/hooks/useFormFieldFocus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFormFieldFocus.d.ts","sourceRoot":"","sources":["../../../src/utils/hooks/useFormFieldFocus.ts"],"names":[],"mappings":"AAEA,wBAAgB,iBAAiB,CAAC,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS;;uBAgHpD,cAAc,GAAG,gBAAgB,GAAG,IAAI;;;oBAhB7C,CAAC,SAAS,WAAW,uBACb,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,YACnB,MAAM,IAAI,gBACN,OAAO;EAsD1B"}
+{"version":3,"file":"useFormFieldFocus.d.ts","sourceRoot":"","sources":["../../../src/utils/hooks/useFormFieldFocus.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,aAAa,GAAG,KAAK,GAAG,OAAO,CAAC;AAE5C,KAAK,qBAAqB,GAAG;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;CAC/B,CAAC;AAEF,wBAAgB,iBAAiB,CAAC,EAChC,MAAM,EACN,aAAa,EAAE,iBAAiB,GACjC,EAAE,qBAAqB;;uBAgPd,cAAc,GAAG,gBAAgB,GAAG,IAAI;;;oBAtB7C,CAAC,SAAS,WAAW,uBACb,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,YACnB,MAAM,IAAI,gBACN,OAAO;4BA5EtB,CAAC,SAAS,WAAW,uBAAuB,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC;EAyItE"}

package/packages/shared-components/dist/utils/hooks/useFormFieldFocus.js

@@ -2,7 +2,10 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useFormFieldFocus = useFormFieldFocus;
 const react_1 = require("react");
-function useFormFieldFocus(isOpen) {
+const NavigationKeyContext_1 = require("../context/NavigationKeyContext");
+function useFormFieldFocus({ isOpen, navigationKey: navigationKeyProp, }) {
+    const { navigationKey: navigationKeyFromContext } = (0, NavigationKeyContext_1.useNavigationKeyContext)();
+    const navigationKey = navigationKeyProp ?? navigationKeyFromContext;
     const inputRef = (0, react_1.useRef)(null);
     const shouldMaintainFocusRef = (0, react_1.useRef)(false);
     const wasFocusedRef = (0, react_1.useRef)(false);
@@ -75,14 +78,102 @@ function useFormFieldFocus(isOpen) {
     const maintainFocusAfterClose = (0, react_1.useCallback)(() => {
         shouldMaintainFocusRef.current = true;
     }, []);
+    const getFocusableElements = (0, react_1.useCallback)(() => {
+        const selector = [
+            "a[href]",
+            "button:not([disabled])",
+            "textarea:not([disabled])",
+            "input:not([disabled])",
+            "select:not([disabled])",
+            "[tabindex]:not([tabindex='-1'])",
+        ].join(", ");
+        return Array.from(document.querySelectorAll(selector)).filter((el) => {
+            const style = window.getComputedStyle(el);
+            return (style.display !== "none" &&
+                style.visibility !== "hidden" &&
+                !el.hasAttribute("disabled") &&
+                (el.getAttribute("tabindex") === null ||
+                    el.getAttribute("tabindex") !== "-1"));
+        });
+    }, []);
+    const findActualInputElement = (0, react_1.useCallback)((element) => {
+        if (element.tagName === "INPUT" ||
+            element.tagName === "TEXTAREA" ||
+            element.tagName === "SELECT") {
+            return element;
+        }
+        const input = element.querySelector("input, textarea, select");
+        return input || element;
+    }, []);
+    const handleEnterNavigation = (0, react_1.useCallback)(
+    // eslint-disable-next-line sonarjs/cognitive-complexity
+    (event) => {
+        const target = event.target;
+        if (target.tagName === "TEXTAREA") {
+            return;
+        }
+        if (event.ctrlKey || event.metaKey || event.altKey) {
+            return;
+        }
+        event.preventDefault();
+        event.stopPropagation();
+        const activeElement = document.activeElement || inputRef.current || target;
+        if (!activeElement) {
+            return;
+        }
+        const focusableElements = getFocusableElements();
+        const findWrapperElement = (input) => {
+            for (const el of focusableElements) {
+                if (el === input || el.contains(input)) {
+                    return el;
+                }
+            }
+            return null;
+        };
+        const currentWrapper = findWrapperElement(activeElement);
+        if (!currentWrapper) {
+            return;
+        }
+        const currentIndex = focusableElements.indexOf(currentWrapper);
+        if (currentIndex === -1) {
+            return;
+        }
+        let targetWrapper = null;
+        if (event.shiftKey) {
+            if (currentIndex > 0) {
+                targetWrapper = focusableElements[currentIndex - 1] || null;
+            }
+        }
+        else if (currentIndex < focusableElements.length - 1) {
+            targetWrapper = focusableElements[currentIndex + 1] || null;
+        }
+        if (targetWrapper) {
+            const targetInput = findActualInputElement(targetWrapper);
+            if (targetInput) {
+                setTimeout(() => {
+                    targetInput.focus();
+                }, 0);
+            }
+            else {
+                targetWrapper.focus();
+            }
+        }
+        else {
+            activeElement.blur();
+        }
+    }, [getFocusableElements, findActualInputElement]);
     const handleKeyDown = (0, react_1.useCallback)((event, onClose, isPopupOpen) => {
         if (isPopupOpen && (event.key === "Tab" || event.key === "Escape")) {
             event.preventDefault();
             event.stopPropagation();
             onClose?.();
             maintainFocusAfterClose();
+            return;
+        }
+        if (navigationKey === "enter" && event.key === "Enter" && !isPopupOpen) {
+            handleEnterNavigation(event);
         }
-    }, [maintainFocusAfterClose]);
+    }, [maintainFocusAfterClose, navigationKey, handleEnterNavigation]);
     const setInputRef = (0, react_1.useCallback)((ref) => {
         if (ref) {
             const wasInputFocused = document.activeElement === ref ||
@@ -115,5 +206,6 @@ function useFormFieldFocus(isOpen) {
         maintainFocus,
         maintainFocusAfterClose,
         handleKeyDown,
+        handleEnterNavigation,
     };
 }

package/packages/shared-components/dist/utils/index.d.ts

@@ -1,14 +1,15 @@
+export * from "./CheckboxInput";
 export * from "./colorVariant";
+export * from "./context";
 export * from "./date";
 export * from "./download";
 export * from "./downloadPrintHtml";
 export * from "./file";
 export * from "./helper";
+export * from "./hooks";
 export * from "./regex";
 export * from "./theme/colorPaletteUI";
 export * from "./theme/theme";
 export * from "./types";
 export * from "./urlToNestedObject";
-export * from "./hooks";
-export * from "./CheckboxInput";
 //# sourceMappingURL=index.d.ts.map

package/packages/shared-components/dist/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,qBAAqB,CAAC;AACpC,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,QAAQ,CAAC;AACvB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,wBAAwB,CAAC;AACvC,cAAc,eAAe,CAAC;AAC9B,cAAc,SAAS,CAAC;AACxB,cAAc,qBAAqB,CAAC"}

package/packages/shared-components/dist/utils/index.js

@@ -14,16 +14,17 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./CheckboxInput"), exports);
 __exportStar(require("./colorVariant"), exports);
+__exportStar(require("./context"), exports);
 __exportStar(require("./date"), exports);
 __exportStar(require("./download"), exports);
 __exportStar(require("./downloadPrintHtml"), exports);
 __exportStar(require("./file"), exports);
 __exportStar(require("./helper"), exports);
+__exportStar(require("./hooks"), exports);
 __exportStar(require("./regex"), exports);
 __exportStar(require("./theme/colorPaletteUI"), exports);
 __exportStar(require("./theme/theme"), exports);
 __exportStar(require("./types"), exports);
 __exportStar(require("./urlToNestedObject"), exports);
-__exportStar(require("./hooks"), exports);
-__exportStar(require("./CheckboxInput"), exports);

package/packages/shared-components/dist/utils/regex.d.ts

@@ -6,4 +6,5 @@ export declare const timeRegex: RegExp;
 export declare const accessorFnRegex: RegExp;
 export declare const hslaRegex: RegExp;
 export declare const highlightWordsRegex: RegExp;
+export declare const numericRegex: RegExp;
 //# sourceMappingURL=regex.d.ts.map

package/packages/shared-components/dist/utils/regex.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"regex.d.ts","sourceRoot":"","sources":["../../src/utils/regex.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,QAAkB,CAAC;AAE9C,eAAO,MAAM,YAAY,QAAwB,CAAC;AAElD,eAAO,MAAM,uBAAuB,QAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,QACmvB,CAAC;AAE3wB,eAAO,MAAM,SAAS,QAA6B,CAAC;AAEpD,eAAO,MAAM,eAAe,QACqD,CAAC;AAElF,eAAO,MAAM,SAAS,QAAqD,CAAC;AAE5E,eAAO,MAAM,mBAAmB,QAAwB,CAAC"}
+{"version":3,"file":"regex.d.ts","sourceRoot":"","sources":["../../src/utils/regex.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,QAAkB,CAAC;AAE9C,eAAO,MAAM,YAAY,QAAwB,CAAC;AAElD,eAAO,MAAM,uBAAuB,QAAoB,CAAC;AAEzD,eAAO,MAAM,UAAU,QACmvB,CAAC;AAE3wB,eAAO,MAAM,SAAS,QAA6B,CAAC;AAEpD,eAAO,MAAM,eAAe,QACqD,CAAC;AAElF,eAAO,MAAM,SAAS,QAAqD,CAAC;AAE5E,eAAO,MAAM,mBAAmB,QAAwB,CAAC;AAEzD,eAAO,MAAM,YAAY,QAAkB,CAAC"}

package/packages/shared-components/dist/utils/regex.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.highlightWordsRegex = exports.hslaRegex = exports.accessorFnRegex = exports.timeRegex = exports.emailRegex = exports.noSpecialCharacterRegex = exports.isoDateRegex = exports.monthYearRegex = void 0;
+exports.numericRegex = exports.highlightWordsRegex = exports.hslaRegex = exports.accessorFnRegex = exports.timeRegex = exports.emailRegex = exports.noSpecialCharacterRegex = exports.isoDateRegex = exports.monthYearRegex = void 0;
 /* eslint-disable sonarjs/unnecessary-character-escapes */
 /* eslint-disable no-useless-escape */
 /* eslint-disable sonarjs/single-character-alternation */
@@ -17,3 +17,4 @@ exports.timeRegex = /^\d{1,3}:\d{2}(:\d{2})?$/;
 exports.accessorFnRegex = /([a-zA-Z0-9_$.\[\]]+)\s*!==\s*null\s*&&\s*\1\s*!==\s*void 0\s*\?\s*\1\s*:\s*/g;
 exports.hslaRegex = /hsla?\((\d+),\s*(\d+)%,\s*(\d+)%,?\s*([\d.]+)?\)/;
 exports.highlightWordsRegex = /[.*+?^${}()|[\]\\]/g;
+exports.numericRegex = /^-?\d*\.?\d*$/;