@monolith-forensics/monolith-ui 1.1.30 → 1.1.31

package/dist/SelectBox/SelectBox.js

@@ -1,4 +1,3 @@
-"use strict";
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -10,19 +9,14 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.StyledInputContainer = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importDefault(require("styled-components"));
-const react_1 = require("@floating-ui/react");
-const react_2 = require("react");
-const __1 = require("..");
-const use_debounce_1 = require("use-debounce");
-const core_1 = require("../core");
-exports.StyledInputContainer = styled_components_1.default.div `
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import styled from "styled-components";
+import { useFloating, flip, offset, FloatingPortal, } from "@floating-ui/react";
+import { useCallback, useEffect, useRef, useState, } from "react";
+import { Input, FieldLabel, Tooltip } from "..";
+import { useDebouncedCallback } from "use-debounce";
+import { StyledContent, StyledFloatContainer, ArrowButton, ClearButton, } from "../core";
+export const StyledInputContainer = styled.div `
   font-family: ${({ theme }) => theme.typography.fontFamily};
 
   position: relative;
@@ -43,16 +37,16 @@ exports.StyledInputContainer = styled_components_1.default.div `
         return `${width}px`;
 }};
 `;
-const StyledInnerItemContainer = styled_components_1.default.div `
+const StyledInnerItemContainer = styled.div `
   overflow-y: auto;
 
   &[data-scroll-active="true"] {
     padding-right: 5px;
   }
 `;
-const GroupTitle = (0, styled_components_1.default)((_a) => {
+const GroupTitle = styled((_a) => {
     var { className, children } = _a, props = __rest(_a, ["className", "children"]);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: className }, props, { children: [(0, jsx_runtime_1.jsx)("div", { className: "group-line" }), (0, jsx_runtime_1.jsx)("div", { className: "group-label", children: children }), (0, jsx_runtime_1.jsx)("div", { className: "group-line" })] })));
+    return (_jsxs("div", Object.assign({ className: className }, props, { children: [_jsx("div", { className: "group-line" }), _jsx("div", { className: "group-label", children: children }), _jsx("div", { className: "group-line" })] })));
 }) `
   display: flex;
   flex-direction: row;
@@ -101,8 +95,8 @@ const GroupTitle = (0, styled_components_1.default)((_a) => {
     width: 100%;
   }
 `;
-const ActionMenu = styled_components_1.default.div ``;
-const StyledItem = styled_components_1.default.div `
+const ActionMenu = styled.div ``;
+const StyledItem = styled.div `
   color: ${(props) => props.theme.palette.text.primary};
   border-radius: 3px;
   display: flex;
@@ -156,18 +150,18 @@ const StyledItem = styled_components_1.default.div `
     color: ${(props) => props.theme.palette.text.primary};
   }
 `;
-const SelectBox = (0, styled_components_1.default)(({ className, data = [], placeholder = "Select...", arrow = true, onChange, onSearch, searchFn, onScroll, loading, defaultValue, onItemAdded, size = "sm", variant = "outlined", width = "100%", allowCustomValue = false, searchable = false, clearable = false, label, description, required = false, error, openOnFocus = true, renderOption, actionComponent, focused, grouped, TooltipContent, DropDownProps = {}, }) => {
+const SelectBox = styled(({ className, data = [], placeholder = "Select...", arrow = true, onChange, onSearch, searchFn, onScroll, loading, defaultValue, onItemAdded, size = "sm", variant = "outlined", width = "100%", allowCustomValue = false, searchable = false, clearable = false, label, description, required = false, error, openOnFocus = true, renderOption, actionComponent, focused, grouped, TooltipContent, DropDownProps = {}, }) => {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     const isObjectArray = (_a = Object.keys((data === null || data === void 0 ? void 0 : data[0]) || {})) === null || _a === void 0 ? void 0 : _a.includes("label");
-    const [isOpen, setIsOpen] = (0, react_2.useState)(false);
-    const [selected, setSelected] = (0, react_2.useState)(null);
-    const [searchValue, setSearchValue] = (0, react_2.useState)("");
-    const [customItems, setCustomItems] = (0, react_2.useState)([]);
-    const [placement, setPlacement] = (0, react_2.useState)("bottom-start");
-    const [dropDownHeight, setDropDownHeight] = (0, react_2.useState)(null);
-    const inputRef = (0, react_2.useRef)(null);
-    const containerRef = (0, react_2.useRef)(null);
-    const scrollContainerRef = (0, react_2.useRef)(null);
+    const [isOpen, setIsOpen] = useState(false);
+    const [selected, setSelected] = useState(null);
+    const [searchValue, setSearchValue] = useState("");
+    const [customItems, setCustomItems] = useState([]);
+    const [placement, setPlacement] = useState("bottom-start");
+    const [dropDownHeight, setDropDownHeight] = useState(null);
+    const inputRef = useRef(null);
+    const containerRef = useRef(null);
+    const scrollContainerRef = useRef(null);
     const filteredItems = data
         .concat(customItems) // Add custom items to the list
         .filter((item) => {
@@ -205,13 +199,13 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         }))
             .sort((a, b) => a.label.localeCompare(b.label))
         : [];
-    const { refs, floatingStyles, update } = (0, react_1.useFloating)({
+    const { refs, floatingStyles, update } = useFloating({
         open: isOpen,
         onOpenChange: setIsOpen,
         placement,
         strategy: "absolute",
         // Handle collisions with the viewport
-        middleware: [(0, react_1.flip)(), (0, react_1.offset)(5)],
+        middleware: [flip(), offset(5)],
     });
     const toggleOpen = () => {
         setIsOpen((prev) => {
@@ -240,11 +234,11 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         handleChangeSelection(item);
         setIsOpen(false);
     };
-    const handleChangeSelection = (0, react_2.useCallback)((option) => {
+    const handleChangeSelection = useCallback((option) => {
         setSelected(option);
         onChange === null || onChange === void 0 ? void 0 : onChange((option === null || option === void 0 ? void 0 : option.value) || option, option);
     }, [onChange]);
-    const handleAddItem = (0, react_2.useCallback)((newItem) => {
+    const handleAddItem = useCallback((newItem) => {
         const isNewItem = data.every((item) => item.label.toLowerCase() !==
             newItem.toLowerCase());
         if (isNewItem) {
@@ -351,14 +345,14 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
             update();
         }
     };
-    const debouncedHandleOnChange = (0, use_debounce_1.useDebouncedCallback)(handleOnChange, 300);
+    const debouncedHandleOnChange = useDebouncedCallback(handleOnChange, 300);
     const handleFocus = () => {
         if (openOnFocus) {
             setIsOpen(true);
         }
     };
     // Close on outside click
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         const close = (e) => {
             var _a, _b;
             const target = e.target;
@@ -376,7 +370,7 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         return () => document.removeEventListener("click", close);
     }, [refs.floating, refs.reference]);
     // Handle default value
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         if (defaultValue) {
             const isOption = defaultValue.value !== undefined;
             const searchPattern = isOption
@@ -388,7 +382,7 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         }
     }, [data, defaultValue, isObjectArray]);
     // handle input value change
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         if (inputRef.current) {
             if (!selected) {
                 inputRef.current.value = "";
@@ -401,7 +395,7 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         }
     }, [selected]);
     // handle scroll item into view
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         var _a, _b;
         const item = (_b = (_a = containerRef === null || containerRef === void 0 ? void 0 : containerRef.current) === null || _a === void 0 ? void 0 : _a.querySelector) === null || _b === void 0 ? void 0 : _b.call(_a, ".mfFloatingItem[data-selected=true]");
         if (item) {
@@ -409,7 +403,7 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
         }
     }, [selected]);
     // make calls to onSearch callback
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         if (searchable) {
             update();
             onSearch === null || onSearch === void 0 ? void 0 : onSearch(searchValue);
@@ -426,7 +420,7 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
     // get height between top of the floating container and the top of the viewport
     const topHeight = (((_g = referenceEl === null || referenceEl === void 0 ? void 0 : referenceEl.getBoundingClientRect()) === null || _g === void 0 ? void 0 : _g.top) -
         10);
-    (0, react_2.useEffect)(() => {
+    useEffect(() => {
         if (bottomHeight < 250) {
             setPlacement("top-start");
             setDropDownHeight(topHeight);
@@ -440,38 +434,38 @@ const SelectBox = (0, styled_components_1.default)(({ className, data = [], plac
             setDropDownHeight(bottomHeight);
         };
     }, [topHeight, bottomHeight, isOpen]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: className, children: [label && ((0, jsx_runtime_1.jsx)(__1.FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), (0, jsx_runtime_1.jsxs)(exports.StyledInputContainer, { ref: refs.setReference, onMouseDown: () => setIsOpen(true), width: width, onKeyDown: handleKeyDown, "data-open": isOpen, children: [(0, jsx_runtime_1.jsx)(__1.Input, { ref: inputRef, onChange: debouncedHandleOnChange, onFocus: handleFocus, autoFocus: focused, placeholder: placeholder, size: size, readOnly: !searchable, "data-button-right": arrow || clearable }), clearable && (selected || !!((_h = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _h === void 0 ? void 0 : _h.value)) ? ((0, jsx_runtime_1.jsx)(core_1.ClearButton, { className: "input-btn", onClick: handleClear })) : arrow ? ((0, jsx_runtime_1.jsx)(core_1.ArrowButton, { onClick: (e) => {
+    return (_jsxs("div", { className: className, children: [label && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), _jsxs(StyledInputContainer, { ref: refs.setReference, onMouseDown: () => setIsOpen(true), width: width, onKeyDown: handleKeyDown, "data-open": isOpen, children: [_jsx(Input, { ref: inputRef, onChange: debouncedHandleOnChange, onFocus: handleFocus, autoFocus: focused, placeholder: placeholder, size: size, readOnly: !searchable, "data-button-right": arrow || clearable }), clearable && (selected || !!((_h = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _h === void 0 ? void 0 : _h.value)) ? (_jsx(ClearButton, { className: "input-btn", onClick: handleClear })) : arrow ? (_jsx(ArrowButton, { onClick: (e) => {
                             e.preventDefault();
                             // e.stopPropagation();
                         }, onMouseDown: (e) => {
                             e.preventDefault();
                             e.stopPropagation();
                             toggleOpen();
-                        } })) : null] }), isOpen && ((0, jsx_runtime_1.jsx)(react_1.FloatingPortal, { preserveTabOrder: true, children: (0, jsx_runtime_1.jsx)(core_1.StyledFloatContainer, { ref: (ref) => {
+                        } })) : null] }), isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(StyledFloatContainer, { ref: (ref) => {
                         containerRef.current = ref;
                         refs.setFloating(ref);
-                    }, style: floatingStyles, className: "mfFloating", children: (0, jsx_runtime_1.jsxs)(core_1.StyledContent, Object.assign({ className: "mfFloatingContent", style: {
+                    }, style: floatingStyles, className: "mfFloating", children: _jsxs(StyledContent, Object.assign({ className: "mfFloatingContent", style: {
                             width: contentWidth,
                             maxWidth: contentWidth,
                             maxHeight: DropDownProps.autoHeight
                                 ? (dropDownHeight || 250) - 10
                                 : "",
-                        }, variant: variant, "data-empty": filteredItems.length === 0 }, DropDownProps, { children: [actionComponent && (0, jsx_runtime_1.jsx)(ActionMenu, { children: actionComponent }), (0, jsx_runtime_1.jsxs)(StyledInnerItemContainer, { ref: scrollContainerRef, "data-scroll-active": scrollActive, onScroll: onScroll, children: [loading && (0, jsx_runtime_1.jsx)("div", { children: "Loading..." }), !loading && grouped
-                                        ? groups.map((group, index) => ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(GroupTitle, { size: size, children: group.label }), group.items.map((item, index) => {
-                                                    return ((0, jsx_runtime_1.jsx)(__1.Tooltip, { content: TooltipContent ? ((0, jsx_runtime_1.jsx)(TooltipContent, { data: item.data })) : null, side: "left", children: (0, jsx_runtime_1.jsx)(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": isObjectArray
+                        }, variant: variant, "data-empty": filteredItems.length === 0 }, DropDownProps, { children: [actionComponent && _jsx(ActionMenu, { children: actionComponent }), _jsxs(StyledInnerItemContainer, { ref: scrollContainerRef, "data-scroll-active": scrollActive, onScroll: onScroll, children: [loading && _jsx("div", { children: "Loading..." }), !loading && grouped
+                                        ? groups.map((group, index) => (_jsxs("div", { children: [_jsx(GroupTitle, { size: size, children: group.label }), group.items.map((item, index) => {
+                                                    return (_jsx(Tooltip, { content: TooltipContent ? (_jsx(TooltipContent, { data: item.data })) : null, side: "left", children: _jsx(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": isObjectArray
                                                                 ? (selected === null || selected === void 0 ? void 0 : selected.value) ===
                                                                     item.value
-                                                                : selected === item, size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (item === null || item === void 0 ? void 0 : item.label) || item })) }, index) }, index));
+                                                                : selected === item, size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || (_jsx(_Fragment, { children: (item === null || item === void 0 ? void 0 : item.label) || item })) }, index) }, index));
                                                 })] }, group.label)))
                                         : filteredItems.map((item, index) => {
-                                            return ((0, jsx_runtime_1.jsx)(__1.Tooltip, { content: TooltipContent ? ((0, jsx_runtime_1.jsx)(TooltipContent, { data: item.data })) : null, side: "left", children: (0, jsx_runtime_1.jsx)(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": isObjectArray
+                                            return (_jsx(Tooltip, { content: TooltipContent ? (_jsx(TooltipContent, { data: item.data })) : null, side: "left", children: _jsx(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": isObjectArray
                                                         ? (selected === null || selected === void 0 ? void 0 : selected.value) ===
                                                             (item === null || item === void 0 ? void 0 : item.value)
-                                                        : selected === item, size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (item === null || item === void 0 ? void 0 : item.label) || item })) }, index) }, index));
+                                                        : selected === item, size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || (_jsx(_Fragment, { children: (item === null || item === void 0 ? void 0 : item.label) || item })) }, index) }, index));
                                         })] })] })) }) }))] }));
 }) `
   position: relative;
   cursor: pointer;
   width: 100%;
 `;
-exports.default = SelectBox;
+export default SelectBox;

package/dist/SelectBox/index.js

@@ -1,8 +1 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var SelectBox_1 = require("./SelectBox");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(SelectBox_1).default; } });
+export { default } from "./SelectBox";

package/dist/Switch/Switch.js

@@ -1,27 +1,3 @@
-"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 __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -33,15 +9,11 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = __importDefault(require("styled-components"));
-const RadixSwitch = __importStar(require("@radix-ui/react-switch"));
-const __1 = require("..");
-const StyledRoot = (0, styled_components_1.default)(RadixSwitch.Root) `
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import styled from "styled-components";
+import * as RadixSwitch from "@radix-ui/react-switch";
+import { FieldLabel } from "..";
+const StyledRoot = styled(RadixSwitch.Root) `
   all: unset;
   cursor: pointer;
 
@@ -98,7 +70,7 @@ const StyledRoot = (0, styled_components_1.default)(RadixSwitch.Root) `
     opacity: 0.5;
   }
 `;
-const StyledThumb = (0, styled_components_1.default)(RadixSwitch.Thumb) `
+const StyledThumb = styled(RadixSwitch.Thumb) `
   display: block;
   width: ${({ size }) => size === "xs"
     ? "9px"
@@ -145,13 +117,13 @@ const StyledThumb = (0, styled_components_1.default)(RadixSwitch.Thumb) `
                     : "translateX(17px)"};
   }
 `;
-const Switch = (0, styled_components_1.default)((_a) => {
+const Switch = styled((_a) => {
     var { className, onChange, size = "xs", label, labelPosition = "right", description, error, required, disabled = false, defaultValue, value, style = {} } = _a, other = __rest(_a, ["className", "onChange", "size", "label", "labelPosition", "description", "error", "required", "disabled", "defaultValue", "value", "style"]);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: className, children: [label && labelPosition === "left" && ((0, jsx_runtime_1.jsx)(__1.FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), (0, jsx_runtime_1.jsx)(StyledRoot, Object.assign({ size: size, className: "SwitchRoot", onCheckedChange: onChange, defaultChecked: defaultValue, checked: value, disabled: disabled, style: style }, other, { children: (0, jsx_runtime_1.jsx)(StyledThumb, { size: size, className: "SwitchThumb" }) })), label && labelPosition === "right" && ((0, jsx_runtime_1.jsx)(__1.FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label }))] }));
+    return (_jsxs("div", { className: className, children: [label && labelPosition === "left" && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label })), _jsx(StyledRoot, Object.assign({ size: size, className: "SwitchRoot", onCheckedChange: onChange, defaultChecked: defaultValue, checked: value, disabled: disabled, style: style }, other, { children: _jsx(StyledThumb, { size: size, className: "SwitchThumb" }) })), label && labelPosition === "right" && (_jsx(FieldLabel, { error: error, asterisk: required, size: size, description: description, children: label }))] }));
 }) `
   display: flex;
   flex-direction: row;
   align-items: center;
   gap: 10px;
 `;
-exports.default = Switch;
+export default Switch;

package/dist/Switch/index.js

@@ -1,8 +1 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = void 0;
-var Switch_1 = require("./Switch");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Switch_1).default; } });
+export { default } from "./Switch";