@monolith-forensics/monolith-ui 1.1.28 → 1.1.29

package/dist/Flyout/Flyout.js

@@ -1,111 +0,0 @@
-"use strict";
-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 react_1 = require("@floating-ui/react");
-const lucide_react_1 = require("lucide-react");
-const styled_components_1 = __importDefault(require("styled-components"));
-const ANIMATION_TIME = 300;
-const StyledOverlay = (0, styled_components_1.default)(react_1.FloatingOverlay) `
-  background-color: rgba(0, 0, 0, 0.3);
-  position: fixed;
-  inset: 0;
-  z-index: 1400;
-
-  @keyframes overlayShow {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-`;
-const StyledClose = styled_components_1.default.div `
-  position: absolute;
-  top: 20px;
-  right: 20px;
-
-  color: ${(props) => props.theme.palette.text.secondary};
-`;
-const StyledButton = styled_components_1.default.button `
-  background-color: transparent;
-  border: none;
-  outline: none;
-  cursor: pointer;
-  padding: 0;
-
-  color: ${(props) => props.theme.palette.text.primary};
-
-  &:hover {
-    background-color: ${(props) => props.theme.palette.action.hover};
-  }
-`;
-const StyledContent = styled_components_1.default.div `
-  background-color: ${({ theme }) => theme.name === "DARK"
-    ? theme.palette.background.alt
-    : theme.palette.background.default};
-  border-radius: 6px;
-  border: 1px solid ${(props) => props.theme.palette.divider};
-  position: fixed;
-  margin: 10px;
-
-  top: 0px;
-  right: 0px;
-  width: 50vw;
-  height: calc(100vh - 20px);
-
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 16px 70px;
-
-  display: flex;
-  flex-direction: column;
-  flex: 1 1 auto;
-
-  overflow-y: hidden;
-
-  &:focus {
-    outline: none;
-  }
-
-  animation: contentShow ${ANIMATION_TIME}ms cubic-bezier(0.16, 1, 0.3, 1);
-
-  // slide in from right to left
-  @keyframes contentShow {
-    from {
-      transform: translate(100%, 0);
-    }
-    to {
-      transform: translate(0, 0);
-    }
-  }
-`;
-const StyledInnerContent = styled_components_1.default.div `
-  display: flex;
-  flex-direction: column;
-  flex: 1 1 auto;
-
-  overflow-y: auto;
-  padding: 25px;
-`;
-const Flyout = ({ children, open = false, onClose = () => { }, style = {}, closeOnOutsideClick = true, showCloseButton = true, }) => {
-    const { refs, floatingStyles, context } = (0, react_1.useFloating)({
-        open,
-        onOpenChange: (isOpen) => {
-            if (!isOpen) {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
-            }
-        },
-    });
-    const handleMouseDown = (event) => {
-        var _a, _b;
-        const target = event.target;
-        if (((_b = (_a = target === null || target === void 0 ? void 0 : target.className) === null || _a === void 0 ? void 0 : _a.includes) === null || _b === void 0 ? void 0 : _b.call(_a, "mf-ModalOverlay")) &&
-            closeOnOutsideClick) {
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)(react_1.FloatingPortal, { preserveTabOrder: true, children: open && ((0, jsx_runtime_1.jsx)(StyledOverlay, { className: "mf-ModalOverlay", lockScroll: true, onMouseDown: handleMouseDown, children: (0, jsx_runtime_1.jsx)(react_1.FloatingFocusManager, { context: context, modal: true, children: (0, jsx_runtime_1.jsxs)(StyledContent, Object.assign({ style: style, className: `mf-Modal mf-Flyout`, ref: refs.setFloating }, floatingStyles, { translate: undefined, children: [showCloseButton && ((0, jsx_runtime_1.jsx)(StyledClose, { children: (0, jsx_runtime_1.jsx)(StyledButton, { onMouseDown: () => onClose === null || onClose === void 0 ? void 0 : onClose(), children: (0, jsx_runtime_1.jsx)(lucide_react_1.XIcon, { size: 18 }) }) })), (0, jsx_runtime_1.jsx)(StyledInnerContent, { className: "mf-Flyout inner-content", children: children })] })) }) })) }));
-};
-exports.default = Flyout;

package/dist/Flyout/FlyoutHeader.d.ts

@@ -1,5 +0,0 @@
-interface FlyoutHeaderProps {
-    hasBorder?: boolean;
-}
-declare const FlyoutHeader: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, FlyoutHeaderProps>> & string;
-export default FlyoutHeader;

package/dist/Flyout/FlyoutHeader.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const styled_components_1 = __importDefault(require("styled-components"));
-const FlyoutHeader = styled_components_1.default.div `
-  border-bottom: ${({ theme, hasBorder }) => hasBorder ? `1px solid ${theme.palette.divider}` : "none"};
-
-  min-height: 50px;
-`;
-exports.default = FlyoutHeader;

package/dist/Flyout/FlyoutTitle.d.ts

@@ -1,2 +0,0 @@
-declare const FlyoutTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
-export default FlyoutTitle;

package/dist/Flyout/FlyoutTitle.js

@@ -1,13 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const styled_components_1 = __importDefault(require("styled-components"));
-const FlyoutTitle = styled_components_1.default.h1 `
-  font-size: 24px;
-  font-weight: 600;
-  margin: 0px;
-  color: ${(props) => props.theme.palette.text.primary};
-`;
-exports.default = FlyoutTitle;

package/dist/Flyout/index.d.ts

@@ -1,3 +0,0 @@
-export { default } from "./Flyout";
-export { default as FlyoutHeader } from "./FlyoutHeader";
-export { default as FlyoutTitle } from "./FlyoutTitle";

package/dist/Flyout/index.js

@@ -1,12 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.FlyoutTitle = exports.FlyoutHeader = exports.default = void 0;
-var Flyout_1 = require("./Flyout");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Flyout_1).default; } });
-var FlyoutHeader_1 = require("./FlyoutHeader");
-Object.defineProperty(exports, "FlyoutHeader", { enumerable: true, get: function () { return __importDefault(FlyoutHeader_1).default; } });
-var FlyoutTitle_1 = require("./FlyoutTitle");
-Object.defineProperty(exports, "FlyoutTitle", { enumerable: true, get: function () { return __importDefault(FlyoutTitle_1).default; } });

package/dist/FormSection/FormSection.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from "react";
-interface FormSectionProps {
-    children?: ReactNode;
-    className?: string;
-    title?: string;
-    defaultOpen?: boolean;
-}
-declare const FormSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<FormSectionProps, never>> & string & Omit<({ className, title, children, defaultOpen }: FormSectionProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export default FormSection;

package/dist/FormSection/FormSection.js

@@ -1,51 +0,0 @@
-"use strict";
-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 lucide_react_1 = require("lucide-react");
-const react_1 = require("react");
-const styled_components_1 = __importDefault(require("styled-components"));
-const FormSection = (0, styled_components_1.default)(({ className, title, children, defaultOpen = true }) => {
-    const [open, setOpen] = (0, react_1.useState)(defaultOpen);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: className, children: [(0, jsx_runtime_1.jsxs)("div", { className: "section-header", onClick: (e) => setOpen((prev) => !prev), children: [(0, jsx_runtime_1.jsx)("h3", { children: title }), (0, jsx_runtime_1.jsx)("div", { className: "section-line" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDownIcon, { size: 18, className: open ? "open" : "" })] }), (0, jsx_runtime_1.jsx)("div", { className: "section-content", "data-open": open, children: children })] }));
-}) `
-  h3 {
-    margin: 0;
-  }
-
-  .section-header {
-    user-select: none;
-    cursor: pointer;
-    margin-bottom: 10px;
-
-    display: flex;
-    flex-direction: row;
-    gap: 10px;
-    align-items: center;
-
-    .section-line {
-      flex: 1;
-      height: 1px;
-      background-color: ${({ theme }) => theme.palette.divider};
-    }
-
-    svg {
-      transition: transform 0.2s;
-      color: ${({ theme }) => theme.palette.text.secondary};
-
-      &.open {
-        transform: rotate(180deg);
-      }
-    }
-  }
-
-  .section-content {
-    padding: 10px 0px;
-    &[data-open="false"] {
-      display: none;
-    }
-  }
-`;
-exports.default = FormSection;

package/dist/FormSection/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./FormSection";

package/dist/FormSection/index.js

@@ -1,8 +0,0 @@
-"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 FormSection_1 = require("./FormSection");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(FormSection_1).default; } });

package/dist/Grid/Grid.d.ts

@@ -1,8 +0,0 @@
-interface GridProps {
-    className?: string;
-    children: React.ReactNode;
-    col?: number;
-    width?: string | number;
-}
-declare const Grid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<GridProps, never>> & string & Omit<({ className, children }: GridProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
-export default Grid;

package/dist/Grid/Grid.js

@@ -1,18 +0,0 @@
-"use strict";
-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 Grid = (0, styled_components_1.default)(({ className, children }) => {
-    return (0, jsx_runtime_1.jsx)("div", { className: className, children: children });
-}) `
-  display: grid;
-  grid-template-columns: repeat(${({ col }) => col || 1}, minmax(0, 1fr));
-  gap: 20px;
-
-  width: ${({ width }) => Number.isInteger(width) ? `${width}px` : width || "100%"};
-  height: auto;
-`;
-exports.default = Grid;

package/dist/Grid/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./Grid";

package/dist/Grid/index.js

@@ -1,8 +0,0 @@
-"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 Grid_1 = require("./Grid");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Grid_1).default; } });

package/dist/IconButton/IconButton.d.ts

@@ -1,5 +0,0 @@
-import { ButtonProps } from "../Button/Button.js";
-declare const IconButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<ButtonProps & import("react").RefAttributes<HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, ButtonProps>> & string & Omit<import("react").ForwardRefExoticComponent<ButtonProps & import("react").RefAttributes<HTMLButtonElement>>, keyof import("react").Component<any, {}, any>>;
-export default IconButton;

package/dist/IconButton/IconButton.js

@@ -1,30 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const styled_components_1 = __importDefault(require("styled-components"));
-const __1 = require("..");
-const IconButton = (0, styled_components_1.default)(__1.Button) `
-  padding: ${({ size, variant }) => {
-    if (variant === "text")
-        return `0px 0px`;
-    switch (size) {
-        case "xxs":
-            return `0px 4px`;
-        case "xs":
-            return `0px 4px`;
-        case "sm":
-            return `0px 6px`;
-        case "md":
-            return `0px 8px`;
-        case "lg":
-            return `0px 10px`;
-        case "xl":
-            return `0px 12px`;
-        default:
-            return `0px 6px`;
-    }
-}};
-`;
-exports.default = IconButton;

package/dist/IconButton/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./IconButton";

package/dist/IconButton/index.js

@@ -1,8 +0,0 @@
-"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 IconButton_1 = require("./IconButton");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(IconButton_1).default; } });

package/dist/Input/Input.d.ts

@@ -1,21 +0,0 @@
-import { Size, Variant } from "../core";
-export interface InputProps {
-    ref?: React.Ref<HTMLInputElement>;
-    className?: string;
-    size?: Size;
-    variant?: Variant;
-    width?: string | number | null | undefined;
-    style?: React.CSSProperties;
-    placeholder?: string;
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => void;
-    onKeyUp?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
-    onKeyDown?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
-    onFocus?: (e: React.FocusEvent<HTMLInputElement>) => void;
-    onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
-    autoFocus?: boolean;
-    readOnly?: boolean;
-}
-declare const Input: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<InputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
-    ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
-}, never>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<InputProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>, keyof import("react").Component<any, {}, any>>;
-export default Input;

package/dist/Input/Input.js

@@ -1,149 +0,0 @@
-"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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    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 react_1 = require("react");
-const Input = (0, styled_components_1.default)((0, react_1.forwardRef)((_a, ref) => {
-    var { className, size = "sm", variant = "outlined", width } = _a, rest = __rest(_a, ["className", "size", "variant", "width"]);
-    return (0, jsx_runtime_1.jsx)("input", Object.assign({ ref: ref, className: className }, rest));
-})) `
-  font-family: ${({ theme }) => theme.typography.fontFamily};
-  pointer-events: "all";
-  user-select: "all";
-  outline: none;
-  box-sizing: border-box;
-
-  color: ${({ theme }) => theme.palette.text.primary};
-  font-size: ${({ size }) => size === "xs"
-    ? "11px"
-    : size === "sm"
-        ? "13px"
-        : size === "md"
-            ? "15px"
-            : size === "lg"
-                ? "17px"
-                : size === "xl"
-                    ? "19px"
-                    : "13px"};
-
-  height: ${({ size }) => size === "xs"
-    ? "26px"
-    : size === "sm"
-        ? "30px"
-        : size === "md"
-            ? "36px"
-            : size === "lg"
-                ? "42px"
-                : size === "xl"
-                    ? "50px"
-                    : "30px"};
-
-  min-height: ${({ size }) => size === "xs"
-    ? "26px"
-    : size === "sm"
-        ? "30px"
-        : size === "md"
-            ? "36px"
-            : size === "lg"
-                ? "42px"
-                : size === "xl"
-                    ? "50px"
-                    : "30px"};
-
-  transition: border 0.1s ease-in-out;
-  border-radius: 4px;
-  border: 1px solid
-    ${({ theme, variant }) => {
-    switch (variant) {
-        case "contained":
-            return "transparent";
-        case "filled":
-            return "transparent";
-        case "outlined":
-            return theme.palette.input.border;
-        case "text":
-            return "transparent";
-        default:
-            return theme.palette.input.border;
-    }
-}};
-
-  padding: ${({ size }) => size === "xs"
-    ? "0px 8px"
-    : size === "sm"
-        ? "0px 10px"
-        : size === "md"
-            ? "0px 12px"
-            : size === "lg"
-                ? "0px 14px"
-                : size === "xl"
-                    ? "0px 16px"
-                    : "0px 10px"};
-
-  width: ${({ width }) => {
-    if (typeof width === "undefined")
-        return "100%";
-    if (width === null)
-        return "100%";
-    if (typeof width === "string")
-        return width;
-    if (typeof width === "number")
-        return `${width}px`;
-}};
-
-  background-color: ${({ theme, variant }) => {
-    switch (variant) {
-        case "contained":
-            return theme.palette.input.background;
-        case "filled":
-            return theme.palette.input.background;
-        case "outlined":
-            return theme.palette.input.background;
-        case "text":
-            return "transparent";
-        default:
-            return theme.palette.input.background;
-    }
-}};
-
-  ::placeholder {
-    font-size: ${({ size }) => size === "xs"
-    ? "10px"
-    : size === "sm"
-        ? "12px"
-        : size === "md"
-            ? "14px"
-            : size === "lg"
-                ? "16px"
-                : size === "xl"
-                    ? "18px"
-                    : "12px"};
-  }
-
-  &:focus {
-    border: 1px solid ${({ theme }) => theme.palette.primary.main};
-  }
-
-  &[data-button-right="true"] {
-    padding-right: 36px;
-  }
-
-  &[readOnly] {
-    cursor: pointer;
-  }
-`;
-exports.default = Input;

package/dist/Input/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./Input";

package/dist/Input/index.js

@@ -1,8 +0,0 @@
-"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 Input_1 = require("./Input");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Input_1).default; } });

package/dist/Modal/Modal.d.ts

@@ -1,14 +0,0 @@
-interface ModalProps {
-    children: React.ReactNode;
-    open?: boolean;
-    onClose?: () => void;
-    style?: React.CSSProperties;
-    showCloseButton?: boolean;
-    FocusProps?: any;
-}
-declare const Modal: {
-    ({ children, open, onClose, style, showCloseButton, FocusProps, }: ModalProps): import("react/jsx-runtime").JSX.Element;
-    Title: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
-    SubTitle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>, never>> & string;
-};
-export default Modal;

package/dist/Modal/Modal.js

@@ -1,110 +0,0 @@
-"use strict";
-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 lucide_react_1 = require("lucide-react");
-const react_1 = require("@floating-ui/react");
-const StyledOverlay = (0, styled_components_1.default)(react_1.FloatingOverlay) `
-  background-color: rgba(0, 0, 0, 0.3);
-  position: fixed;
-  inset: 0;
-  z-index: 1400;
-
-  @keyframes overlayShow {
-    from {
-      opacity: 0;
-    }
-    to {
-      opacity: 1;
-    }
-  }
-`;
-const StyledContent = styled_components_1.default.div `
-  background-color: ${({ theme }) => theme.name === "DARK"
-    ? theme.palette.background.default
-    : theme.palette.background.default};
-  border-radius: 6px;
-  border: 1px solid ${(props) => props.theme.palette.divider};
-  position: fixed;
-  top: 25px;
-  left: 50%;
-  transform: translate(-50%, 0px);
-  box-shadow: rgba(0, 0, 0, 0.5) 0px 16px 70px;
-
-  z-index: 2;
-
-  max-height: calc(100vh - 50px);
-  max-width: calc(100vw - 50px);
-
-  display: flex;
-  flex-direction: column;
-
-  overflow-y: hidden;
-
-  &:focus {
-    outline: none;
-  }
-
-  @keyframes contentShow {
-    from {
-      opacity: 0;
-      transform: translate(-50%, -48%) scale(0.96);
-    }
-    to {
-      opacity: 1;
-      transform: translate(-50%, -50%) scale(1);
-    }
-  }
-`;
-const StyledInnerContent = styled_components_1.default.div `
-  display: flex;
-  flex-direction: column;
-
-  overflow-y: auto;
-  padding: 25px;
-`;
-const StyledClose = styled_components_1.default.div `
-  position: absolute;
-  top: 15px;
-  right: 15px;
-
-  color: ${(props) => props.theme.palette.text.secondary};
-`;
-const StyledButton = styled_components_1.default.button `
-  background-color: transparent;
-  border: none;
-  outline: none;
-  cursor: pointer;
-  padding: 0;
-`;
-const Title = styled_components_1.default.h1 `
-  font-size: 20px;
-  font-weight: 600;
-  margin: 0px;
-`;
-const SubTitle = styled_components_1.default.h2 `
-  font-size: 14px;
-  font-weight: 500;
-  margin: 0px;
-  color: ${(props) => props.theme.palette.text.secondary};
-`;
-const Modal = ({ children, open = false, onClose, style = {}, showCloseButton = false, FocusProps = {}, }) => {
-    const { refs, floatingStyles, context } = (0, react_1.useFloating)({
-        open,
-        onOpenChange: (isOpen) => {
-            if (!isOpen) {
-                onClose === null || onClose === void 0 ? void 0 : onClose();
-            }
-        },
-    });
-    const handleMouseDown = () => {
-        onClose === null || onClose === void 0 ? void 0 : onClose();
-    };
-    return ((0, jsx_runtime_1.jsx)(react_1.FloatingPortal, { preserveTabOrder: true, children: open && ((0, jsx_runtime_1.jsx)(StyledOverlay, { className: "mf-ModalOverlay", lockScroll: true, children: (0, jsx_runtime_1.jsx)(react_1.FloatingFocusManager, Object.assign({ context: context, modal: true }, FocusProps, { children: (0, jsx_runtime_1.jsxs)(StyledContent, Object.assign({ style: style, className: "mf-Modal", ref: refs.setFloating }, floatingStyles, { children: [showCloseButton && ((0, jsx_runtime_1.jsx)(StyledClose, { children: (0, jsx_runtime_1.jsx)(StyledButton, { onMouseDown: handleMouseDown, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { size: 18 }) }) })), (0, jsx_runtime_1.jsx)(StyledInnerContent, { children: children })] })) })) })) }));
-};
-Modal.Title = Title;
-Modal.SubTitle = SubTitle;
-exports.default = Modal;

package/dist/Modal/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./Modal";

package/dist/Modal/index.js

@@ -1,8 +0,0 @@
-"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 Modal_1 = require("./Modal");
-Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Modal_1).default; } });