@monolith-forensics/monolith-ui 1.8.1-dev.4 → 1.8.1

package/dist/RichTextEditor/Toolbar/Toolbar.js

@@ -23,11 +23,7 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                     return (_jsx(Button, Object.assign({}, item.options, { children: (_a = item === null || item === void 0 ? void 0 : item.options) === null || _a === void 0 ? void 0 : _a.label }), index));
                 }
                 else if (item.type === "menu") {
-                    return (_jsx(DropDownMenu, Object.assign({ dropDownProps: {
-                            style: {
-                                width: 135,
-                            },
-                        } }, item.options, { children: (_b = item === null || item === void 0 ? void 0 : item.options) === null || _b === void 0 ? void 0 : _b.label }), index));
+                    return (_jsx(DropDownMenu, Object.assign({}, item.options, { children: (_b = item === null || item === void 0 ? void 0 : item.options) === null || _b === void 0 ? void 0 : _b.label }), index));
                 }
             }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.FONT)) && (_jsx(DropDownMenu, { data: Object.values(Fonts).map((font) => ({
                     label: font,
@@ -35,11 +31,7 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                     onClick: () => {
                         setFont(font);
                     },
-                })), size: "xxs", variant: "outlined", arrow: true, dropDownProps: {
-                    style: {
-                        width: 135,
-                    },
-                }, buttonProps: {
+                })), size: "xxs", variant: "outlined", arrow: true, buttonProps: {
                     title: "Select Font",
                 }, children: (font || Fonts.DEFAULT) })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDO)) && _jsx(UndoControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.REDO)) && _jsx(RedoControl, { editor: editor })] }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.COLOR)) && (_jsx(DropDownMenu, { data: [
                     {
@@ -68,10 +60,6 @@ export const Toolbar = styled(({ className, editor, toolbarOptions }) => {
                                 borderRadius: "3px",
                             } }), item.label] })), size: "xxs", variant: "outlined", arrow: true, buttonProps: {
                     title: "Select Color",
-                }, dropDownProps: {
-                    style: {
-                        width: 100,
-                    },
                 }, children: "Color" })), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BOLD)) && _jsx(BoldControl, { editor: editor }), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ITALIC)) && (_jsx(ItalicControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.UNDERLINE)) && (_jsx(UnderlineControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.STRIKE)) && (_jsx(StrikeThroughControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_1)) && (_jsx(Heading1Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_2)) && (_jsx(Heading2Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_3)) && (_jsx(Heading3Control, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.HEADING_4)) && (_jsx(Heading4Control, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.BULLET_LIST)) && (_jsx(BulletListControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.ORDERED_LIST)) && (_jsx(OrderedListControl, { editor: editor }))] }), _jsxs(ControlsGroup, { children: [(controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_LEFT)) && (_jsx(AlignLeftControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_CENTER)) && (_jsx(AlignCenterControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_RIGHT)) && (_jsx(AlignRightControl, { editor: editor })), (controls === null || controls === void 0 ? void 0 : controls.includes(Controls.TEXT_ALIGN_JUSTIFIED)) && (_jsx(AlignJustifiedControl, { editor: editor }))] })] }));
 }) `
   display: flex;

package/dist/RichTextEditor/Utils/codeBlockUtils.d.ts

@@ -0,0 +1,20 @@
+import { Editor } from "@tiptap/react";
+export type CodeBlockLanguage = {
+    label: string;
+    value: string;
+};
+export declare const DEFAULT_CODE_BLOCK_LANGUAGE = "plaintext";
+export declare const CODE_BLOCK_LANGUAGES: CodeBlockLanguage[];
+export declare const getCodeBlockLanguage: (editor: Editor | null) => string;
+export declare const getCodeBlockLanguageOption: (language?: string) => CodeBlockLanguage;
+export declare const canFormatCodeBlockLanguage: (language?: string) => boolean;
+export declare const formatCodeBlockText: (text: string, language?: string) => Promise<string>;
+export declare const hasSyntaxHighlightedCodeBlock: (editor: Editor | null) => boolean;
+export declare const setCodeBlockLanguage: (editor: Editor | null, language: string) => void;
+export declare const getCodeBlockWrap: (editor: Editor | null) => boolean;
+export declare const toggleCodeBlockWrap: (editor: Editor | null) => void;
+export declare const toggleCodeBlock: (editor: Editor | null) => void;
+export declare const getActiveCodeBlockText: (editor: Editor | null) => string;
+export declare const replaceCodeBlockContent: (editor: Editor, from: number, to: number, text: string) => boolean;
+export declare const formatActiveCodeBlock: (editor: Editor | null) => Promise<void>;
+export declare const copyCodeBlockText: (text: string) => Promise<void>;

package/dist/RichTextEditor/Utils/codeBlockUtils.js

@@ -0,0 +1,137 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import prettier from "prettier/standalone";
+import * as prettierBabelPlugin from "prettier/plugins/babel";
+import * as prettierEstreePlugin from "prettier/plugins/estree";
+import * as prettierHtmlPlugin from "prettier/plugins/html";
+import * as prettierMarkdownPlugin from "prettier/plugins/markdown";
+import * as prettierPostcssPlugin from "prettier/plugins/postcss";
+import * as prettierTypescriptPlugin from "prettier/plugins/typescript";
+import * as prettierYamlPlugin from "prettier/plugins/yaml";
+export const DEFAULT_CODE_BLOCK_LANGUAGE = "plaintext";
+export const CODE_BLOCK_LANGUAGES = [
+    { label: "Plain Text", value: DEFAULT_CODE_BLOCK_LANGUAGE },
+    { label: "JavaScript", value: "javascript" },
+    { label: "TypeScript", value: "typescript" },
+    { label: "JSX", value: "jsx" },
+    { label: "TSX", value: "tsx" },
+    { label: "HTML", value: "html" },
+    { label: "CSS", value: "css" },
+    { label: "JSON", value: "json" },
+    { label: "Markdown", value: "markdown" },
+    { label: "Bash", value: "bash" },
+    { label: "Python", value: "python" },
+    { label: "SQL", value: "sql" },
+    { label: "YAML", value: "yaml" },
+    { label: "XML", value: "xml" },
+];
+const PRETTIER_PARSERS = {
+    javascript: "babel",
+    jsx: "babel",
+    typescript: "typescript",
+    tsx: "typescript",
+    html: "html",
+    css: "css",
+    json: "json",
+    markdown: "markdown",
+    yaml: "yaml",
+};
+const PRETTIER_PLUGINS = [
+    prettierBabelPlugin,
+    prettierEstreePlugin,
+    prettierHtmlPlugin,
+    prettierMarkdownPlugin,
+    prettierPostcssPlugin,
+    prettierTypescriptPlugin,
+    prettierYamlPlugin,
+];
+export const getCodeBlockLanguage = (editor) => {
+    var _a;
+    return (((_a = editor === null || editor === void 0 ? void 0 : editor.getAttributes("codeBlock")) === null || _a === void 0 ? void 0 : _a.language) ||
+        DEFAULT_CODE_BLOCK_LANGUAGE);
+};
+export const getCodeBlockLanguageOption = (language) => {
+    return (CODE_BLOCK_LANGUAGES.find((item) => item.value === language) ||
+        CODE_BLOCK_LANGUAGES[0]);
+};
+export const canFormatCodeBlockLanguage = (language) => {
+    return Boolean(language && PRETTIER_PARSERS[language]);
+};
+export const formatCodeBlockText = (text, language) => __awaiter(void 0, void 0, void 0, function* () {
+    const parser = language ? PRETTIER_PARSERS[language] : undefined;
+    if (!parser) {
+        throw new Error("Code formatting is not supported for this language.");
+    }
+    const formatted = yield prettier.format(text, {
+        parser,
+        plugins: PRETTIER_PLUGINS,
+    });
+    return formatted.replace(/\n$/, "");
+});
+export const hasSyntaxHighlightedCodeBlock = (editor) => {
+    return Boolean(editor === null || editor === void 0 ? void 0 : editor.extensionManager.extensions.find((extension) => { var _a; return extension.name === "codeBlock" && ((_a = extension.options) === null || _a === void 0 ? void 0 : _a.lowlight); }));
+};
+export const setCodeBlockLanguage = (editor, language) => {
+    if (!(editor === null || editor === void 0 ? void 0 : editor.isActive("codeBlock")))
+        return;
+    editor.chain().focus().updateAttributes("codeBlock", { language }).run();
+};
+export const getCodeBlockWrap = (editor) => {
+    var _a;
+    return Boolean((_a = editor === null || editor === void 0 ? void 0 : editor.getAttributes("codeBlock")) === null || _a === void 0 ? void 0 : _a.wrap);
+};
+export const toggleCodeBlockWrap = (editor) => {
+    if (!(editor === null || editor === void 0 ? void 0 : editor.isActive("codeBlock")))
+        return;
+    editor
+        .chain()
+        .focus()
+        .updateAttributes("codeBlock", { wrap: !getCodeBlockWrap(editor) })
+        .run();
+};
+export const toggleCodeBlock = (editor) => {
+    if (!editor)
+        return;
+    editor
+        .chain()
+        .focus()
+        .toggleCodeBlock({ language: DEFAULT_CODE_BLOCK_LANGUAGE })
+        .run();
+};
+export const getActiveCodeBlockText = (editor) => {
+    if (!(editor === null || editor === void 0 ? void 0 : editor.isActive("codeBlock")))
+        return "";
+    return editor.state.selection.$from.parent.textContent;
+};
+export const replaceCodeBlockContent = (editor, from, to, text) => {
+    return editor.commands.command(({ state, tr }) => {
+        if (text.length) {
+            tr.replaceWith(from, to, state.schema.text(text));
+        }
+        else {
+            tr.delete(from, to);
+        }
+        return true;
+    });
+};
+export const formatActiveCodeBlock = (editor) => __awaiter(void 0, void 0, void 0, function* () {
+    if (!(editor === null || editor === void 0 ? void 0 : editor.isActive("codeBlock")))
+        return;
+    const language = getCodeBlockLanguage(editor);
+    const formatted = yield formatCodeBlockText(getActiveCodeBlockText(editor), language);
+    replaceCodeBlockContent(editor, editor.state.selection.$from.start(), editor.state.selection.$from.end(), formatted);
+});
+export const copyCodeBlockText = (text) => __awaiter(void 0, void 0, void 0, function* () {
+    var _a;
+    if (!((_a = navigator.clipboard) === null || _a === void 0 ? void 0 : _a.writeText)) {
+        throw new Error("Clipboard copying is not supported by this browser.");
+    }
+    yield navigator.clipboard.writeText(text);
+});

package/dist/RichTextEditor/Utils/codeUtils.d.ts

@@ -0,0 +1,3 @@
+import { Editor } from "@tiptap/react";
+export declare const hasInlineCode: (editor: Editor | null) => boolean;
+export declare const toggleInlineCode: (editor: Editor | null) => void;

package/dist/RichTextEditor/Utils/codeUtils.js

@@ -0,0 +1,12 @@
+export const hasInlineCode = (editor) => {
+    return Boolean(editor === null || editor === void 0 ? void 0 : editor.extensionManager.extensions.find((extension) => extension.name === "code"));
+};
+export const toggleInlineCode = (editor) => {
+    if (!editor || !hasInlineCode(editor))
+        return;
+    if (editor.isActive("code")) {
+        editor.chain().focus().unsetCode().run();
+        return;
+    }
+    editor.chain().focus().unsetAllMarks().setCode().run();
+};

package/dist/RichTextEditor/Utils/linkUtils.d.ts

@@ -0,0 +1,19 @@
+import { EditorState } from "@tiptap/pm/state";
+export declare const LINK_TARGET = "_blank";
+export declare const LINK_REL = "noopener noreferrer nofollow";
+export type NormalizedLink = {
+    href: string;
+    isValid: boolean;
+};
+export declare const normalizeLinkUrl: (value?: string | null) => NormalizedLink;
+export declare const getLinkAttributes: (href: string) => {
+    href: string;
+    target: string;
+    rel: string;
+    class: string;
+};
+export declare const openLink: (href?: string | null) => void;
+export declare const getLinkRangeAtPosition: (state: EditorState, pos: number) => void | import("@tiptap/core").Range;
+export declare const getLinkAttributesAtPosition: (state: EditorState, pos: number) => {
+    href?: string;
+} | undefined;

package/dist/RichTextEditor/Utils/linkUtils.js

@@ -0,0 +1,57 @@
+import { getMarkRange } from "@tiptap/core";
+export const LINK_TARGET = "_blank";
+export const LINK_REL = "noopener noreferrer nofollow";
+export const normalizeLinkUrl = (value) => {
+    const trimmedValue = (value === null || value === void 0 ? void 0 : value.trim()) || "";
+    if (!trimmedValue) {
+        return { href: "", isValid: false };
+    }
+    const href = /^[a-z][a-z0-9+.-]*:/i.test(trimmedValue)
+        ? trimmedValue
+        : `https://${trimmedValue}`;
+    try {
+        const url = new URL(href);
+        const isValid = url.protocol === "http:" || url.protocol === "https:";
+        return {
+            href,
+            isValid,
+        };
+    }
+    catch (_a) {
+        return {
+            href,
+            isValid: false,
+        };
+    }
+};
+export const getLinkAttributes = (href) => ({
+    href,
+    target: LINK_TARGET,
+    rel: LINK_REL,
+    class: "editor-link",
+});
+export const openLink = (href) => {
+    if (!href)
+        return;
+    const normalizedLink = normalizeLinkUrl(href);
+    if (!normalizedLink.isValid)
+        return;
+    window.open(normalizedLink.href, "_blank", "noopener,noreferrer");
+};
+export const getLinkRangeAtPosition = (state, pos) => {
+    const linkMark = state.schema.marks.link;
+    if (!linkMark)
+        return;
+    return getMarkRange(state.doc.resolve(pos), linkMark);
+};
+export const getLinkAttributesAtPosition = (state, pos) => {
+    const linkMark = state.schema.marks.link;
+    if (!linkMark)
+        return;
+    const $pos = state.doc.resolve(pos);
+    const nextNode = $pos.parent.childAfter($pos.parentOffset).node;
+    const previousNode = $pos.parent.childBefore($pos.parentOffset).node;
+    const mark = (nextNode === null || nextNode === void 0 ? void 0 : nextNode.marks.find((mark) => mark.type === linkMark)) ||
+        (previousNode === null || previousNode === void 0 ? void 0 : previousNode.marks.find((mark) => mark.type === linkMark));
+    return mark === null || mark === void 0 ? void 0 : mark.attrs;
+};

package/dist/RichTextEditor/Utils/tableUtils.d.ts

@@ -0,0 +1 @@
+export declare const TABLE_CELL_MIN_WIDTH = 120;

package/dist/RichTextEditor/Utils/tableUtils.js

@@ -0,0 +1 @@
+export const TABLE_CELL_MIN_WIDTH = 120;

package/dist/SegmentedControl/SegmentedControl.utils.d.ts

@@ -4,8 +4,8 @@ export declare const resolveActiveColor: (theme: any, activeColor?: string) => {
     main: any;
     contrastText: any;
 };
-export declare const getSegmentHeight: (size?: Size) => number;
-export declare const getSegmentFontSize: (size?: Size) => string;
+export declare const getSegmentHeight: (size?: Size) => 32 | 38 | 22 | 26 | 46 | 56;
+export declare const getSegmentFontSize: (size?: Size) => "11px" | "12px" | "14px" | "16px" | "18px" | "20px";
 export declare const normalizeSegmentedData: (data: SegmentedControlDataItem[]) => NormalizedSegmentedItem[];
 export declare const getFirstEnabledIndex: (data: NormalizedSegmentedItem[]) => number;
 export declare const getNextEnabledIndex: (data: NormalizedSegmentedItem[], startIndex: number, direction: 1 | -1) => number;

package/dist/SegmentedControl/SegmentedControl.utils.js

@@ -1,4 +1,3 @@
-import { getControlSizeTokens } from "../core";
 export const resolveActiveColor = (theme, activeColor) => {
     var _a;
     const fallback = {
@@ -22,10 +21,38 @@ export const resolveActiveColor = (theme, activeColor) => {
     };
 };
 export const getSegmentHeight = (size) => {
-    return getControlSizeTokens(size).segmentedHeight;
+    switch (size) {
+        case "xxs":
+            return 22;
+        case "xs":
+            return 26;
+        case "md":
+            return 38;
+        case "lg":
+            return 46;
+        case "xl":
+            return 56;
+        case "sm":
+        default:
+            return 32;
+    }
 };
 export const getSegmentFontSize = (size) => {
-    return `${getControlSizeTokens(size).segmentedFontSize}px`;
+    switch (size) {
+        case "xxs":
+            return "11px";
+        case "xs":
+            return "12px";
+        case "md":
+            return "16px";
+        case "lg":
+            return "18px";
+        case "xl":
+            return "20px";
+        case "sm":
+        default:
+            return "14px";
+    }
 };
 export const normalizeSegmentedData = (data) => data.map((item) => {
     var _a;

package/dist/SelectBox/SelectBox.js

@@ -10,7 +10,7 @@ import { StyledInputContainer, StyledInnerItemContainer, EmptyComponent, GroupTi
 // Re-export for backward compatibility
 export { StyledInputContainer };
 export const SelectBox = ({ className, data = [], placeholder = "Select...", arrow = true, onChange, onSearch, searchFn, onScroll, loading, defaultValue, value, size = "sm", variant = "outlined", width = "100%", allowCustomValue = false, searchable = false, clearable = false, label, description, required = false, error, openOnFocus = true, renderOption, actionComponent, focused, grouped, OptionTooltip, // Custom tooltip component for search menu items
-DropDownProps = {}, debounceTime = 175, sort = false, disabled = false, dynamicOptionHeight, 
+DropDownProps = {}, debounceTime = 175, sort = false, disabled = false, 
 // Enhanced focus control props
 triggerFocus = false, triggerOpen = false, onFocused, onOpened, }) => {
     var _a, _b, _c, _d, _e, _f;
@@ -276,16 +276,16 @@ triggerFocus = false, triggerOpen = false, onFocused, onOpened, }) => {
     // ============================================================================
     // Render Helper Functions
     // ============================================================================
-    const renderOptionItem = (item, index) => (_jsx(Tooltip, { content: OptionTooltip ? _jsx(OptionTooltip, { data: item.data }) : null, side: "left", children: _jsx(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": (_value === null || _value === void 0 ? void 0 : _value.value) === item.value, "data-disabled": item.disabled, "$dynamicHeight": dynamicOptionHeight !== null && dynamicOptionHeight !== void 0 ? dynamicOptionHeight : Boolean(renderOption), size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || _jsx(_Fragment, { children: item === null || item === void 0 ? void 0 : item.label }) }, index) }, index));
+    const renderOptionItem = (item, index) => (_jsx(Tooltip, { content: OptionTooltip ? _jsx(OptionTooltip, { data: item.data }) : null, side: "left", children: _jsx(StyledItem, { className: "mfFloatingItem", onClick: (e) => handleItemClick(e, item), "data-selected": (_value === null || _value === void 0 ? void 0 : _value.value) === item.value, "data-disabled": item.disabled, size: size, children: (renderOption === null || renderOption === void 0 ? void 0 : renderOption(item)) || _jsx(_Fragment, { children: item === null || item === void 0 ? void 0 : item.label }) }, index) }, index));
     const renderActionButton = () => {
         if (clearable && (_value || !!inputValue)) {
-            return (_jsx(ClearButton, { size: size, className: "input-btn", onClick: handleClear, onMouseDown: (e) => {
+            return (_jsx(ClearButton, { className: "input-btn", onClick: handleClear, onMouseDown: (e) => {
                     e.preventDefault();
                     e.stopPropagation();
                 } }));
         }
         if (arrow) {
-            return (_jsx(ArrowButton, { size: size, onClick: (e) => {
+            return (_jsx(ArrowButton, { onClick: (e) => {
                     e.preventDefault();
                 }, onMouseDown: (e) => {
                     e.preventDefault();
@@ -393,7 +393,7 @@ triggerFocus = false, triggerOpen = false, onFocused, onOpened, }) => {
                                 : "",
                         }, variant: variant, "data-empty": filteredItems.length === 0 }, DropDownProps, { children: [loading && _jsx(Loader, {}), !loading && actionComponent && (_jsx(ActionMenu, { onClick: () => {
                                     setIsOpen(false);
-                                }, children: actionComponent })), !loading && filteredItems.length === 0 && (_jsx(EmptyComponent, { size: size, children: getEmptyMessage(allowCustomValue, searchValue) })), !loading && (_jsx(StyledInnerItemContainer, { ref: scrollContainerRef, "data-scroll-active": scrollActive, onScroll: onScroll, children: grouped
+                                }, children: actionComponent })), !loading && filteredItems.length === 0 && (_jsx(EmptyComponent, { children: getEmptyMessage(allowCustomValue, searchValue) })), !loading && (_jsx(StyledInnerItemContainer, { ref: scrollContainerRef, "data-scroll-active": scrollActive, onScroll: onScroll, children: grouped
                                     ? groups.map((group, index) => (_jsxs("div", { children: [_jsx(GroupTitle, { size: size, children: group.label }), group.items.map((item, index) => renderOptionItem(item, index))] }, group.label)))
                                     : filteredItems.map((item, index) => renderOptionItem(item, index)) }))] })) }) }))] }));
 };

package/dist/SelectBox/select-box.styled-components.d.ts

@@ -4,9 +4,7 @@ export declare const StyledInputContainer: import("styled-components/dist/types"
     width?: string | number | null;
 }>> & string;
 export declare const StyledInnerItemContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const EmptyComponent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
-    size?: Size;
-}>> & string;
+export declare const EmptyComponent: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 interface GroupTitleProps {
     className?: string;
     children?: ReactNode;
@@ -16,7 +14,6 @@ export declare const GroupTitle: import("styled-components/dist/types").IStyledC
 export declare const ActionMenu: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     size: Size;
-    $dynamicHeight?: boolean;
 }>> & string;
 export declare const StyledContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export {};

package/dist/SelectBox/select-box.styled-components.js

@@ -11,7 +11,6 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled from "styled-components";
-import { getControlSizeTokens } from "../core";
 export const StyledInputContainer = styled.div `
   font-family: ${({ theme }) => theme.typography.fontFamily};
 
@@ -59,7 +58,7 @@ export const EmptyComponent = styled.div `
   align-items: center;
   justify-content: center;
   padding: 5px;
-  font-size: ${({ size = "sm" }) => `${getControlSizeTokens(size).supportingFontSize}px`};
+  font-size: 12px;
   font-weight: 500;
   color: ${(props) => props.theme.palette.text.secondary};
 `;
@@ -75,8 +74,17 @@ export const GroupTitle = styled((_a) => {
 
   color: ${(props) => props.theme.palette.text.secondary};
 
-  min-height: ${({ size = "sm" }) => `${getControlSizeTokens(size).menuRowHeight}px`};
-  padding: ${({ size = "sm" }) => `0px ${getControlSizeTokens(size).menuItemPaddingX}px`};
+  padding: ${({ size }) => size === "xs"
+    ? "2px 8px"
+    : size === "sm"
+        ? "4px 10px"
+        : size === "md"
+            ? "4px 12px"
+            : size === "lg"
+                ? "5px 14px"
+                : size === "xl"
+                    ? "6px 16px"
+                    : "2px 8px"};
 
   .group-label {
     white-space: nowrap;
@@ -87,7 +95,17 @@ export const GroupTitle = styled((_a) => {
 
     font-weight: 500;
 
-    font-size: ${({ size = "sm" }) => `${getControlSizeTokens(size).menuGroupFontSize}px`};
+    font-size: ${({ size }) => size === "xs"
+    ? "11px"
+    : size === "sm"
+        ? "13px"
+        : size === "md"
+            ? "15px"
+            : size === "lg"
+                ? "17px"
+                : size === "xl"
+                    ? "19px"
+                    : "11px"};
   }
 
   .group-line {
@@ -99,11 +117,10 @@ export const ActionMenu = styled.div ``;
 export const StyledItem = styled.div `
   color: ${(props) => props.theme.palette.text.primary};
   border-radius: 3px;
-  box-sizing: border-box;
   display: flex;
   align-items: center;
-  min-height: ${({ size }) => `${getControlSizeTokens(size).menuRowHeight}px`};
-  height: ${({ size, $dynamicHeight }) => $dynamicHeight ? "auto" : `${getControlSizeTokens(size).menuRowHeight}px`};
+  min-height: 25px;
+  padding: 7px 10px;
   position: relative;
   user-select: none;
   outline: none;
@@ -112,9 +129,29 @@ export const StyledItem = styled.div `
 
   font-family: ${({ theme }) => theme.typography.fontFamily};
 
-  font-size: ${({ size }) => `${getControlSizeTokens(size).fontSize}px`};
-
-  padding: ${({ size, $dynamicHeight }) => `${$dynamicHeight ? 6 : 0}px ${getControlSizeTokens(size).menuItemPaddingX}px`};
+  font-size: ${({ size }) => size === "xs"
+    ? "11px"
+    : size === "sm"
+        ? "13px"
+        : size === "md"
+            ? "15px"
+            : size === "lg"
+                ? "17px"
+                : size === "xl"
+                    ? "19px"
+                    : "11px"};
+
+  padding: ${({ size }) => size === "xs"
+    ? "2px 8px"
+    : size === "sm"
+        ? "4px 10px"
+        : size === "md"
+            ? "4px 12px"
+            : size === "lg"
+                ? "5px 14px"
+                : size === "xl"
+                    ? "6px 16px"
+                    : "2px 8px"};
 
   &:hover {
     background-color: ${(props) => props.theme.palette.action.hover};

package/dist/SelectBox/types.d.ts

@@ -34,7 +34,6 @@ export type SelectBoxProps = {
     debounceTime?: number;
     sort?: boolean;
     disabled?: boolean;
-    dynamicOptionHeight?: boolean;
     renderOption?: (item: Option | string) => React.ReactNode;
     OptionTooltip?: (props: {
         data: any;

package/dist/Switch/Switch.d.ts

@@ -2,8 +2,8 @@ import { CSSProperties, ReactNode } from "react";
 import { Size } from "../core";
 export type SwitchProps = {
     className?: string;
-    onChange: (checked: boolean) => void;
-    size?: Size;
+    onChange: (e: any) => void;
+    size?: Exclude<Size, "xxs">;
     label?: string;
     labelPosition?: "left" | "right";
     description?: ReactNode;