@codezee/sixtify-brahma 0.2.24 → 0.2.26

package/packages/shared-components/dist/FormFields/CheckBox/Skeleton.d.ts

@@ -0,0 +1,2 @@
+export declare const Skeleton: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Skeleton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/FormFields/CheckBox/Skeleton.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,+CASpB,CAAC"}

package/packages/shared-components/dist/FormFields/CheckBox/Skeleton.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const Skeleton = () => {
+    return ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 30, height: 30, sx: { borderRadius: "4px" }, variant: "rectangular" }));
+};
+exports.Skeleton = Skeleton;

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

@@ -0,0 +1,2 @@
+export * from "./CheckBox";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/FormFields/CheckBox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+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("./CheckBox"), exports);

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

@@ -0,0 +1,27 @@
+import type { DatePickerProps as MuiDatePickerProps } from "@mui/x-date-pickers/DatePicker";
+import type { PickerValidDate } from "@mui/x-date-pickers/models";
+import React from "react";
+import type { FieldError, FieldValues, UseControllerProps } from "react-hook-form";
+export type DatePickerProps<P extends FieldValues> = UseControllerProps<P> & MuiDatePickerProps<PickerValidDate> & Partial<{
+    label?: string;
+    required: boolean;
+    disabled: boolean;
+    format: string;
+    error: boolean;
+    helperText: string;
+    loading: boolean;
+    clearable?: boolean;
+    disableKeyboardInput?: boolean;
+    setError: (name: keyof P, error: FieldError | {
+        type: string;
+        message?: string;
+    }) => void;
+}>;
+export declare const dateFormats: {
+    dateWithISO8601: string;
+    dateWithEuropean: string;
+};
+export declare const LeftArrowIcon: React.FC;
+export declare const RightArrowIcon: React.FC;
+export declare function DatePicker<P extends FieldValues>({ setError, control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, clearable, rules, disableKeyboardInput, format, ...restProps }: DatePickerProps<P>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DatePicker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DatePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DatePicker/DatePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,IAAI,kBAAkB,EAAE,MAAM,gCAAgC,CAAC;AAE5F,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAGlE,OAAO,KAAmB,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAKzB,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GACxE,kBAAkB,CAAC,eAAe,CAAC,GACnC,OAAO,CAAC;IACN,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,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,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,QAAQ,EAAE,CACR,IAAI,EAAE,MAAM,CAAC,EACb,KAAK,EAAE,UAAU,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KACnD,IAAI,CAAC;CACX,CAAC,CAAC;AAEL,eAAO,MAAM,WAAW;;;CAGvB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAcjC,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAclC,CAAC;AAEF,wBAAgB,UAAU,CAAC,CAAC,SAAS,WAAW,EAAE,EAChD,QAAQ,EACR,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,SAAgB,EAChB,KAAK,EACL,oBAA4B,EAC5B,MAAqC,EACrC,GAAG,SAAS,EACb,EAAE,eAAe,CAAC,CAAC,CAAC,2CA8HpB"}

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

@@ -0,0 +1,136 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RightArrowIcon = exports.LeftArrowIcon = exports.dateFormats = void 0;
+exports.DatePicker = DatePicker;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ChevronLeft_1 = __importDefault(require("@mui/icons-material/ChevronLeft"));
+const ChevronRight_1 = __importDefault(require("@mui/icons-material/ChevronRight"));
+const material_1 = require("@mui/material");
+const DatePicker_1 = require("@mui/x-date-pickers/DatePicker");
+const lodash_1 = require("lodash");
+const luxon_1 = require("luxon");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const Actions_1 = require("../../Actions");
+const Skeleton_1 = require("./Skeleton");
+exports.dateFormats = {
+    dateWithISO8601: "yyyy-MM-dd",
+    dateWithEuropean: "dd-MM-yyyy",
+};
+const LeftArrowIcon = () => {
+    const theme = (0, material_1.useTheme)();
+    const { iron } = theme.palette.app.color;
+    return ((0, jsx_runtime_1.jsx)(ChevronLeft_1.default, { sx: {
+            border: `1px solid ${iron[800]}`,
+            borderRadius: "5px",
+            p: "4px",
+        } }));
+};
+exports.LeftArrowIcon = LeftArrowIcon;
+const RightArrowIcon = () => {
+    const theme = (0, material_1.useTheme)();
+    const { iron } = theme.palette.app.color;
+    return ((0, jsx_runtime_1.jsx)(ChevronRight_1.default, { sx: {
+            border: `1px solid ${iron[800]}`,
+            borderRadius: "5px",
+            p: "4px",
+        } }));
+};
+exports.RightArrowIcon = RightArrowIcon;
+function DatePicker({ setError, control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, clearable = true, rules, disableKeyboardInput = false, format = exports.dateFormats.dateWithEuropean, ...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 theme = (0, material_1.useTheme)();
+    const { iron, butterflyBlue, mirage } = theme.palette.app.color;
+    const finalValue = value ? luxon_1.DateTime.fromISO(value) : null;
+    if (loading) {
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label });
+    }
+    const EmptyIcon = () => null;
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && (0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, children: label }), (0, jsx_runtime_1.jsx)(DatePicker_1.DatePicker, { ...restField, ...restProps, disabled: disabled, format: format, value: finalValue, readOnly: readOnly, open: open && !readOnly, onOpen: () => setOpen(true), onClose: () => setOpen(false), slotProps: {
+                    field: {
+                        clearable,
+                        onClear: () => onChange(null),
+                        readOnly: disableKeyboardInput,
+                    },
+                    clearButton: {
+                        tabIndex: -1, // This will make the clear button skipped in the tab order
+                    },
+                    textField: {
+                        disabled,
+                        helperText,
+                        error,
+                        InputProps: {
+                            endAdornment: ((0, jsx_runtime_1.jsx)(Actions_1.CalendarAction, { disabled: disabled, onClick: () => setOpen(true) })),
+                            sx: {
+                                "& .MuiInputAdornment-root": {
+                                    width: "30px",
+                                },
+                            },
+                        },
+                        onKeyDown: (event) => {
+                            if (!clearable && event.key === "Backspace") {
+                                event.preventDefault();
+                            }
+                        },
+                    },
+                    day: {
+                        sx: {
+                            "&.MuiPickersDay-root": {
+                                borderRadius: "5px",
+                                borderColor: butterflyBlue[900],
+                                fontWeight: 500,
+                                color: mirage[900],
+                            },
+                            "&.MuiPickersDay-root.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                                color: iron[600],
+                            },
+                            "&.MuiPickersDay-today": {
+                                color: butterflyBlue[900],
+                                backgroundColor: iron[600],
+                            },
+                        },
+                    },
+                    calendarHeader: {
+                        sx: {
+                            "& .MuiPickersCalendarHeader-label": {
+                                fontWeight: "bold",
+                            },
+                        },
+                    },
+                    yearButton: {
+                        sx: {
+                            "&.MuiPickersYear-yearButton.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                            },
+                        },
+                    },
+                    monthButton: {
+                        sx: {
+                            "&.MuiPickersMonth-monthButton.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                            },
+                        },
+                    },
+                }, slots: {
+                    leftArrowIcon: exports.LeftArrowIcon,
+                    rightArrowIcon: exports.RightArrowIcon,
+                    switchViewIcon: EmptyIcon,
+                }, dayOfWeekFormatter: (weekday) => `${weekday.toFormat("ccc")}`, onChange: (value, details) => {
+                    if (details.validationError) {
+                        if ((0, lodash_1.isFunction)(setError)) {
+                            setError(name, {
+                                type: "manual",
+                                message: "common.date.invalid",
+                            });
+                        }
+                    }
+                    else if (value) {
+                        onChange(value.toISODate());
+                    }
+                } })] }));
+}

package/packages/shared-components/dist/FormFields/DatePicker/Skeleton.d.ts

@@ -0,0 +1,6 @@
+type SkeletonProps = {
+    label?: string;
+};
+export declare const Skeleton: ({ label }: SkeletonProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Skeleton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DatePicker/Skeleton.tsx"],"names":[],"mappings":"AAEA,KAAK,aAAa,GAAG;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,QAAQ,GAAI,WAAW,aAAa,4CAqBhD,CAAC"}

package/packages/shared-components/dist/FormFields/DatePicker/Skeleton.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const Skeleton = ({ label }) => {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 120, height: "23px", sx: {
+                    transform: "scale(1)",
+                } })), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { height: "40px", sx: {
+                    transform: "scale(1)",
+                } })] }));
+};
+exports.Skeleton = Skeleton;

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

@@ -0,0 +1,2 @@
+export * from "./DatePicker";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DatePicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+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("./DatePicker"), exports);

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

@@ -0,0 +1,13 @@
+import type { FieldValues, UseControllerProps } from "react-hook-form";
+export type DateRangePickerProps<P extends FieldValues> = UseControllerProps<P> & {
+    label?: string;
+    required?: boolean;
+    disabled?: boolean;
+    error?: boolean;
+    helperText?: string;
+    loading?: boolean;
+    minDate?: Date;
+    maxDate?: Date;
+};
+export declare function DateRangePicker<P extends FieldValues>({ control, defaultValue, disabled, label, name, error, helperText, loading, required, rules, }: DateRangePickerProps<P>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DateRangePicker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DateRangePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAKvE,MAAM,MAAM,oBAAoB,CAAC,CAAC,SAAS,WAAW,IACpD,kBAAkB,CAAC,CAAC,CAAC,GAAG;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;CAChB,CAAC;AAEJ,wBAAgB,eAAe,CAAC,CAAC,SAAS,WAAW,EAAE,EACrD,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,KAAK,GACN,EAAE,oBAAoB,CAAC,CAAC,CAAC,2CAiEzB"}

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

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateRangePicker = DateRangePicker;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const react_date_range_1 = require("react-date-range");
+const react_hook_form_1 = require("react-hook-form");
+const Skeleton_1 = require("./Skeleton");
+const react_1 = require("react");
+function DateRangePicker({ control, defaultValue, disabled = false, label, name, error = false, helperText, loading = false, required = false, rules, }) {
+    const { field: { onChange }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
+    const [range, setRange] = (0, react_1.useState)([
+        {
+            startDate: new Date(),
+            endDate: new Date(),
+            key: "selection",
+        },
+    ]);
+    if (loading) {
+        return (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, {});
+    }
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && ((0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, disabled: disabled, children: label })), (0, jsx_runtime_1.jsx)(react_date_range_1.DateRangePicker, { ranges: range, onChange: (ranges) => {
+                    const selectedRange = ranges.selection;
+                    if (selectedRange?.endDate &&
+                        selectedRange?.startDate &&
+                        selectedRange?.key) {
+                        setRange([
+                            {
+                                startDate: selectedRange.startDate,
+                                endDate: selectedRange.endDate,
+                                key: selectedRange.key,
+                            },
+                        ]);
+                        const startDate = new Date(selectedRange.startDate.toUTCString()).toISOString();
+                        const endDate = new Date(selectedRange.endDate.toUTCString()).toISOString();
+                        onChange([startDate, endDate]);
+                    }
+                }, months: 2, direction: "horizontal", calendarFocus: "backwards", staticRanges: [], inputRanges: [], moveRangeOnFirstSelection: false, preventSnapRefocus: true }), error && (0, jsx_runtime_1.jsx)("span", { style: { color: "red" }, children: helperText })] }));
+}

package/packages/shared-components/dist/FormFields/DateRangePicker/Skeleton.d.ts

@@ -0,0 +1,2 @@
+export declare const Skeleton: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Skeleton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateRangePicker/Skeleton.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,+CAmCpB,CAAC"}

package/packages/shared-components/dist/FormFields/DateRangePicker/Skeleton.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const Skeleton = () => {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { direction: "row", gap: "10px", children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 120, height: "23px", sx: {
+                            transform: "scale(1)",
+                        } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { height: "40px", sx: {
+                            transform: "scale(1)",
+                        } })] }), (0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [(0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 120, height: "23px", sx: {
+                            transform: "scale(1)",
+                        } }), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { height: "40px", sx: {
+                            transform: "scale(1)",
+                        } })] })] }));
+};
+exports.Skeleton = Skeleton;

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

@@ -0,0 +1,2 @@
+export * from "./DateRangePicker";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateRangePicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,mBAAmB,CAAC"}

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+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("./DateRangePicker"), exports);

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

@@ -0,0 +1,23 @@
+import type { DateTimePickerProps as MuiDateTimePickerProps } from "@mui/x-date-pickers/DateTimePicker";
+import type { PickerValidDate } from "@mui/x-date-pickers/models";
+import { type ReactElement } from "react";
+import type { FieldError, FieldValues, UseControllerProps } from "react-hook-form";
+export type DateTimePickerProps<P extends FieldValues> = UseControllerProps<P> & MuiDateTimePickerProps<PickerValidDate> & Partial<{
+    label: string;
+    required: boolean;
+    disabled: boolean;
+    format: string;
+    error: boolean;
+    helperText: string;
+    loading: boolean;
+    clearable?: boolean;
+    helperIcon?: ReactElement;
+    toolTipText?: string;
+    timeStepsMinutes?: number;
+    setError: (name: keyof P, error: FieldError | {
+        type: string;
+        message?: string;
+    }) => void;
+}>;
+export declare function DateTimePicker<P extends FieldValues>({ control, defaultValue, disabled, label, readOnly, name, error, helperText, loading, required, clearable, rules, format, helperIcon, toolTipText, timeStepsMinutes, ...restProps }: DateTimePickerProps<P>): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DateTimePicker.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DateTimePicker.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateTimePicker/DateTimePicker.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,IAAI,sBAAsB,EAAE,MAAM,oCAAoC,CAAC;AAExG,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAElE,OAAc,EAAE,KAAK,YAAY,EAAY,MAAM,OAAO,CAAC;AAC3D,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EAGX,kBAAkB,EACnB,MAAM,iBAAiB,CAAC;AAKzB,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,WAAW,IAAI,kBAAkB,CAAC,CAAC,CAAC,GAC5E,sBAAsB,CAAC,eAAe,CAAC,GACvC,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,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,YAAY,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,EAAE,CACR,IAAI,EAAE,MAAM,CAAC,EACb,KAAK,EAAE,UAAU,GAAG;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,KACnD,IAAI,CAAC;CACX,CAAC,CAAC;AAkCL,wBAAgB,cAAc,CAAC,CAAC,SAAS,WAAW,EAAE,EACpD,OAAO,EACP,YAAY,EACZ,QAAgB,EAChB,KAAK,EACL,QAAgB,EAChB,IAAI,EACJ,KAAa,EACb,UAAU,EACV,OAAe,EACf,QAAgB,EAChB,SAAgB,EAChB,KAAK,EACL,MAA2B,EAC3B,UAAU,EACV,WAAW,EACX,gBAAoB,EACpB,GAAG,SAAS,EACb,EAAE,mBAAmB,CAAC,CAAC,CAAC,2CAgKxB"}

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

@@ -0,0 +1,147 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateTimePicker = DateTimePicker;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ChevronLeft_1 = __importDefault(require("@mui/icons-material/ChevronLeft"));
+const ChevronRight_1 = __importDefault(require("@mui/icons-material/ChevronRight"));
+const material_1 = require("@mui/material");
+const DateTimePicker_1 = require("@mui/x-date-pickers/DateTimePicker");
+const luxon_1 = require("luxon");
+const react_1 = require("react");
+const react_hook_form_1 = require("react-hook-form");
+const Actions_1 = require("../../Actions");
+const Skeleton_1 = require("./Skeleton");
+const LeftArrowIcon = () => {
+    const theme = (0, material_1.useTheme)();
+    const { iron } = theme.palette.app.color;
+    return ((0, jsx_runtime_1.jsx)(ChevronLeft_1.default, { sx: {
+            border: `1px solid ${iron[800]}`,
+            borderRadius: "5px",
+            p: "4px",
+        } }));
+};
+const RightArrowIcon = () => {
+    const theme = (0, material_1.useTheme)();
+    const { iron } = theme.palette.app.color;
+    return ((0, jsx_runtime_1.jsx)(ChevronRight_1.default, { sx: {
+            border: `1px solid ${iron[800]}`,
+            borderRadius: "5px",
+            p: "4px",
+        } }));
+};
+function DateTimePicker({ control, defaultValue, disabled = false, label, readOnly = false, name, error = false, helperText, loading = false, required = false, clearable = true, rules, format = "dd-MM-yyyy HH:mm", helperIcon, toolTipText, timeStepsMinutes = 1, ...restProps }) {
+    const { field: { value, onChange, ...restField }, } = (0, react_hook_form_1.useController)({ name, control, defaultValue, rules });
+    const [open, setOpen] = (0, react_1.useState)(false);
+    if (error && value && typeof value === "object") {
+        helperText = "Invalid time";
+    }
+    const theme = (0, material_1.useTheme)();
+    const { iron, butterflyBlue, mirage } = theme.palette.app.color;
+    const pickerValue = value
+        ? // eslint-disable-next-line sonarjs/no-nested-conditional
+            luxon_1.DateTime.fromISO(value)
+        : null;
+    if (loading) {
+        return ((0, jsx_runtime_1.jsx)(material_1.Box, { sx: { width: "350px" }, children: (0, jsx_runtime_1.jsx)(Skeleton_1.Skeleton, { label: label }) }));
+    }
+    const EmptyIcon = () => null;
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", children: [label && ((0, jsx_runtime_1.jsxs)(material_1.Stack, { alignItems: "center", flexDirection: "row", gap: "5px", children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { required: required, disabled: disabled, children: label }), helperIcon && toolTipText && ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { title: toolTipText, placement: "bottom", children: helperIcon }))] })), (0, jsx_runtime_1.jsx)(DateTimePicker_1.DateTimePicker, { ...restField, ...restProps, disabled: disabled, readOnly: readOnly, open: open, ampm: false, value: pickerValue, timeSteps: { minutes: timeStepsMinutes }, format: format, onOpen: () => setOpen(true), onClose: () => setOpen(false), slotProps: {
+                    field: {
+                        clearable,
+                        onClear: () => onChange(null),
+                    },
+                    textField: {
+                        disabled,
+                        helperText,
+                        error,
+                        InputProps: {
+                            endAdornment: (0, jsx_runtime_1.jsx)(Actions_1.CalendarAction, { onClick: () => setOpen(true) }),
+                            sx: {
+                                "& .MuiInputAdornment-root": {
+                                    width: "30px",
+                                },
+                            },
+                        },
+                    },
+                    popper: {
+                        sx: {
+                            "& .MuiMultiSectionDigitalClockSection-root::after": {
+                                display: "unset",
+                            },
+                            "& .MuiList-padding": {
+                                padding: "10px",
+                            },
+                            "& .MuiMultiSectionDigitalClockSection-item": {
+                                padding: "4px",
+                            },
+                            "& .MuiMultiSectionDigitalClockSection-item.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                                borderRadius: "5px",
+                            },
+                            "& .MuiMultiSectionDigitalClockSection-item.Mui-selected:hover": {
+                                backgroundColor: butterflyBlue[900],
+                                borderRadius: "5px",
+                            },
+                            "& .Mui-selected:hover": {
+                                backgroundColor: butterflyBlue[900],
+                                borderRadius: "5px",
+                            },
+                            "& .MuiMultiSectionDigitalClockSection-item.Mui-selected:focus-visible": {
+                                backgroundColor: butterflyBlue[900],
+                                borderRadius: "5px",
+                            },
+                            "& .Mui-selected:focus-visible": {
+                                backgroundColor: butterflyBlue[900],
+                                borderRadius: "5px",
+                            },
+                        },
+                    },
+                    day: {
+                        sx: {
+                            "&.MuiPickersDay-root": {
+                                borderRadius: "5px",
+                                borderColor: butterflyBlue[900],
+                                fontWeight: 500,
+                                color: mirage[900],
+                            },
+                            "&.MuiPickersDay-root.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                                color: iron[600],
+                            },
+                            "&.MuiPickersDay-today": {
+                                color: butterflyBlue[900],
+                                backgroundColor: iron[600],
+                            },
+                            ":focus": {
+                                backgroundColor: "transparent",
+                            },
+                        },
+                    },
+                    calendarHeader: {
+                        sx: {
+                            "& .MuiPickersCalendarHeader-label": {
+                                fontWeight: "bold",
+                            },
+                        },
+                    },
+                    yearButton: {
+                        sx: {
+                            "&.MuiPickersYear-yearButton.Mui-selected": {
+                                backgroundColor: butterflyBlue[900],
+                            },
+                        },
+                    },
+                }, slots: {
+                    leftArrowIcon: LeftArrowIcon,
+                    rightArrowIcon: RightArrowIcon,
+                    switchViewIcon: EmptyIcon,
+                }, shouldDisableTime: () => !pickerValue, onChange: (value) => {
+                    if (value?.isValid) {
+                        return onChange(value.toUTC().toISO());
+                    }
+                    onChange(value);
+                } })] }));
+}

package/packages/shared-components/dist/FormFields/DateTimePicker/Skeleton.d.ts

@@ -0,0 +1,4 @@
+export declare const Skeleton: ({ label }: {
+    label?: string;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=Skeleton.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateTimePicker/Skeleton.tsx"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,GAAI,WAAW;IAAE,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,4CAqBrD,CAAC"}

package/packages/shared-components/dist/FormFields/DateTimePicker/Skeleton.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Skeleton = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+const Skeleton = ({ label }) => {
+    return ((0, jsx_runtime_1.jsxs)(material_1.Stack, { gap: "10px", flex: 1, children: [label && ((0, jsx_runtime_1.jsx)(material_1.Skeleton, { width: 120, height: "23px", sx: {
+                    transform: "scale(1)",
+                } })), (0, jsx_runtime_1.jsx)(material_1.Skeleton, { height: "40px", width: "100%", sx: {
+                    transform: "scale(1)",
+                } })] }));
+};
+exports.Skeleton = Skeleton;

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

@@ -0,0 +1,2 @@
+export * from "./DateTimePicker";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/FormFields/DateTimePicker/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC"}

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

@@ -0,0 +1,17 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+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("./DateTimePicker"), exports);

package/packages/shared-components/dist/FormFields/FileUpload/FileNames.d.ts

@@ -0,0 +1,7 @@
+type FileNamesProps = {
+    names: string[];
+    onDelete: (index: number) => void;
+};
+export declare const FileNames: ({ names, onDelete }: FileNamesProps) => import("react/jsx-runtime").JSX.Element[];
+export {};
+//# sourceMappingURL=FileNames.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FileNames.d.ts","sourceRoot":"","sources":["../../../src/FormFields/FileUpload/FileNames.tsx"],"names":[],"mappings":"AAKA,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACnC,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,qBAAqB,cAAc,8CAqB5D,CAAC"}