@monolith-forensics/monolith-ui 1.0.12 → 1.1.1

package/dist/Modal/index.js

@@ -0,0 +1,8 @@
+"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; } });

package/dist/Pill/Pill.d.ts

@@ -0,0 +1,11 @@
+import { ReactNode } from "react";
+import { Size } from "../core";
+interface PillProps {
+    className?: string;
+    children?: ReactNode;
+    size?: Size;
+    showRemoveIcon?: boolean;
+    onRemove?: () => void;
+}
+declare const Pill: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<PillProps, never>> & string & Omit<({ className, children, size, showRemoveIcon, onRemove, }: PillProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export default Pill;

package/dist/Pill/Pill.js

@@ -0,0 +1,146 @@
+"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 StyledButton = styled_components_1.default.button `
+  background-color: transparent;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  margin: 0;
+  outline: none;
+  transition: color 0.2s;
+  padding-inline-end: 5px;
+`;
+const Pill = (0, styled_components_1.default)(({ className, children, size = "md", showRemoveIcon = true, onRemove, }) => {
+    const handleRemove = (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        onRemove === null || onRemove === void 0 ? void 0 : onRemove();
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", { className: className, children: [(0, jsx_runtime_1.jsx)("span", { className: "pill-content", children: children }), showRemoveIcon && ((0, jsx_runtime_1.jsx)(StyledButton, { onClick: handleRemove, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, {}) }))] }));
+}) `
+  user-select: none;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  flex-direction: row;
+  width: fit-content;
+  max-width: 250px;
+  gap: 5px;
+  flex: 0;
+
+  font-weight: 500;
+  color: ${({ theme }) => theme.palette.text.primary};
+
+  padding-inline-end: ${({ size, showRemoveIcon }) => {
+    if (showRemoveIcon) {
+        return "0px";
+    }
+    switch (size) {
+        case "xs":
+            return "8px";
+        case "sm":
+            return "10px";
+        case "md":
+            return "12px";
+        case "lg":
+            return "14px";
+        case "xl":
+            return "16px";
+        default:
+            return "10px";
+    }
+}};
+
+  padding-inline-start: ${({ size }) => {
+    switch (size) {
+        case "xs":
+            return "8px";
+        case "sm":
+            return "10px";
+        case "md":
+            return "12px";
+        case "lg":
+            return "14px";
+        case "xl":
+            return "16px";
+        default:
+            return "10px";
+    }
+}};
+
+  height: ${({ size }) => {
+    switch (size) {
+        case "xs":
+            return "20px";
+        case "sm":
+            return "22px";
+        case "md":
+            return "24px";
+        case "lg":
+            return "26px";
+        case "xl":
+            return "28px";
+        default:
+            return "22px";
+    }
+}};
+
+  border: 1px solid ${({ theme }) => theme.palette.divider};
+  border-radius: 1000px;
+
+  background-color: ${({ theme }) => theme.palette.background.secondary};
+
+  .pill-content {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+
+    font-size: ${({ size }) => {
+    switch (size) {
+        case "xs":
+            return "10px";
+        case "sm":
+            return "12px";
+        case "md":
+            return "14px";
+        case "lg":
+            return "16px";
+        case "xl":
+            return "18px";
+        default:
+            return "12px";
+    }
+}};
+  }
+
+  svg {
+    color: ${({ theme }) => theme.palette.text.primary};
+
+    width: ${({ size }) => {
+    switch (size) {
+        case "xs":
+            return "12px";
+        case "sm":
+            return "14px";
+        case "md":
+            return "16px";
+        case "lg":
+            return "18px";
+        case "xl":
+            return "20px";
+        default:
+            return "14px";
+    }
+}};
+  }
+`;
+exports.default = Pill;

package/dist/Pill/index.js

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

package/dist/SelectBox/SelectBox.d.ts

@@ -0,0 +1,45 @@
+import { ReactNode } from "react";
+import { Size, Variant } from "../core";
+export declare const StyledInputContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    width?: string | number | null;
+}>> & string;
+type Option = {
+    label: string;
+    value: any;
+    group?: string;
+    data: any;
+};
+interface SelectBoxProps {
+    className?: string;
+    defaultValue?: Option | string;
+    data?: Option[] | string[];
+    placeholder?: string;
+    arrow?: boolean;
+    onChange?: (value: any, item: any) => void;
+    onSearch?: (value: string) => void;
+    searchFn?: (value: string) => void;
+    onScroll?: (e: any) => void;
+    loading?: boolean;
+    onItemAdded?: (item: any) => void;
+    size?: Size;
+    variant?: Variant;
+    width?: string | number | null;
+    allowCustomValue?: boolean;
+    searchable?: boolean;
+    clearable?: boolean;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    error?: string;
+    openOnFocus?: boolean;
+    renderOption?: (item: Option | string) => ReactNode;
+    actionComponent?: JSX.Element;
+    focused?: boolean;
+    grouped?: boolean;
+    TooltipContent?: React.FC<{
+        data: any;
+    }>;
+    DropDownProps?: any;
+}
+declare const SelectBox: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<SelectBoxProps, never>> & string & Omit<({ className, data, placeholder, arrow, onChange, onSearch, searchFn, onScroll, loading, defaultValue, onItemAdded, size, variant, width, allowCustomValue, searchable, clearable, label, description, required, error, openOnFocus, renderOption, actionComponent, focused, grouped, TooltipContent, DropDownProps, }: SelectBoxProps) => import("react/jsx-runtime").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export default SelectBox;