@team-monolith/cds 1.119.2 → 1.119.3

package/dist/patterns/LexicalEditor/plugins/ComponentAdderPlugin/useContextMenuOptions.js

@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
 /**
  * Context Menu (:: 버튼)
  */
-import { $createParagraphNode, $createTextNode, $isElementNode, ParagraphNode, } from "lexical";
+import { $createParagraphNode, ParagraphNode, } from "lexical";
 import { ComponentPickerOption, getBaseOptions, } from "../ComponentPickerMenuPlugin";
 import { $createHeadingNode, $createQuoteNode, HeadingNode, } from "@lexical/rich-text";
 import { $setBlocksType } from "@lexical/selection";
@@ -12,16 +12,15 @@ import { H1Icon, H2Icon, H3Icon, CloseFillIcon, ListUnorderedIcon, ListOrderedIc
 import { $isColoredQuoteNode, } from "../../nodes/ColoredQuoteNode";
 import { useTheme } from "@emotion/react";
 import { css } from "@emotion/css";
-import { $unwrapNode } from "@lexical/utils";
-import { $isFileNode, $isImageNode, $isVideoNode, $isProblemInputNode, $isToggleContainerNode, $isToggleTitleNode, $isToggleContentNode, } from "../../nodes";
+import { $isFileNode, $isImageNode, $isVideoNode, $isProblemInputNode, } from "../../nodes";
 import { $isProblemSelectNode, } from "../../nodes/ProblemSelectNode";
 import { $isSheetInputNode } from "../../nodes/SheetInputNode";
 import { $isSheetSelectNode, } from "../../nodes/SheetSelectNode";
 import { $isSelfEvaluationNode, } from "../../nodes/SelfEvaluationNode";
-import { i18n } from "../../../../i18n/i18n";
-function getParagraphContextMenuOptions(editor, node) {
+import { useTranslation } from "react-i18next";
+function getParagraphContextMenuOptions(editor, node, t) {
     return [
-        new ComponentPickerOption(i18n.t("본문", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("본문", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(TextIcon, {}),
             // eslint-disable-next-line i18next/no-literal-string
             keywords: ["normal", "paragraph", "p", "text", "본문", "단락", "내용"],
@@ -32,9 +31,9 @@ function getParagraphContextMenuOptions(editor, node) {
         }),
         ...[1, 2, 3].map((n) => {
             const titleMap = {
-                1: i18n.t("큰 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                2: i18n.t("중간 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                3: i18n.t("작은 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                1: t("큰 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                2: t("중간 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                3: t("작은 제목", { context: "렉시컬 드롭다운 메뉴" }),
             };
             const iconMap = {
                 1: _jsx(H1Icon, {}),
@@ -50,7 +49,7 @@ function getParagraphContextMenuOptions(editor, node) {
                 }),
             });
         }),
-        new ComponentPickerOption(i18n.t("일반 목록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("일반 목록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(ListUnorderedIcon, {}),
             keywords: ["bulleted list", "unordered list", "ul"],
             onSelect: () => {
@@ -58,7 +57,7 @@ function getParagraphContextMenuOptions(editor, node) {
                 editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, undefined);
             },
         }),
-        new ComponentPickerOption(i18n.t("숫자 목록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("숫자 목록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(ListOrderedIcon, {}),
             keywords: ["numbered list", "ordered list", "ol"],
             onSelect: () => {
@@ -66,7 +65,7 @@ function getParagraphContextMenuOptions(editor, node) {
                 editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, undefined);
             },
         }),
-        new ComponentPickerOption(i18n.t("인용 블록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("인용 블록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(DoubleQuotesLIcon, {}),
             keywords: ["block quote"],
             onSelect: () => editor.update(() => {
@@ -74,7 +73,7 @@ function getParagraphContextMenuOptions(editor, node) {
                 $setBlocksType(selection, () => $createQuoteNode());
             }),
         }),
-        new ComponentPickerOption(i18n.t("코드 블록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("코드 블록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(CodeViewIcon, {}),
             keywords: ["javascript", "python", "js", "codeblock"],
             onSelect: () => editor.update(() => {
@@ -91,7 +90,7 @@ function getParagraphContextMenuOptions(editor, node) {
                 }
             }),
         }),
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -102,13 +101,13 @@ function getParagraphContextMenuOptions(editor, node) {
         }),
     ];
 }
-function getHeadingContextMenuOptions(editor, node) {
+function getHeadingContextMenuOptions(editor, node, t) {
     return [
         ...[1, 2, 3].map((n) => {
             const titleMap = {
-                1: i18n.t("큰 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                2: i18n.t("중간 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                3: i18n.t("작은 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                1: t("큰 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                2: t("중간 제목", { context: "렉시컬 드롭다운 메뉴" }),
+                3: t("작은 제목", { context: "렉시컬 드롭다운 메뉴" }),
             };
             const iconMap = {
                 1: _jsx(H1Icon, {}),
@@ -124,7 +123,7 @@ function getHeadingContextMenuOptions(editor, node) {
                 }),
             });
         }),
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -135,9 +134,9 @@ function getHeadingContextMenuOptions(editor, node) {
         }),
     ];
 }
-function getListContextMenuOptions(editor, theme, node) {
+function getListContextMenuOptions(editor, theme, node, t) {
     return [
-        new ComponentPickerOption(i18n.t("일반 목록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("일반 목록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(ListUnorderedIcon, {}),
             keywords: ["bulleted list", "unordered list", "ul"],
             onSelect: () => {
@@ -145,7 +144,7 @@ function getListContextMenuOptions(editor, theme, node) {
                 editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, undefined);
             },
         }),
-        new ComponentPickerOption(i18n.t("숫자 목록", { context: "렉시컬 드롭다운 메뉴" }), {
+        new ComponentPickerOption(t("숫자 목록", { context: "렉시컬 드롭다운 메뉴" }), {
             icon: _jsx(ListOrderedIcon, {}),
             keywords: ["numbered list", "ordered list", "ol"],
             onSelect: () => {
@@ -153,7 +152,7 @@ function getListContextMenuOptions(editor, theme, node) {
                 editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, undefined);
             },
         }),
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -164,63 +163,9 @@ function getListContextMenuOptions(editor, theme, node) {
         }),
     ];
 }
-function convertToggleTitleToHeading(container, tag) {
-    const titleNode = container.getFirstChild();
-    if (!$isToggleTitleNode(titleNode)) {
-        return;
-    }
-    const contentNode = titleNode.getNextSibling();
-    if (!$isToggleContentNode(contentNode)) {
-        return;
-    }
-    const headingNode = $createHeadingNode(tag);
-    const nodesForHeading = titleNode
-        .getChildren()
-        .flatMap((child) => $isElementNode(child) ? child.getChildren() : [child]);
-    if (nodesForHeading.length > 0) {
-        headingNode.append(...nodesForHeading);
-    }
-    if (headingNode.getChildrenSize() === 0) {
-        headingNode.append($createTextNode(""));
-    }
-    titleNode.replace(headingNode);
-    $unwrapNode(contentNode);
-    $unwrapNode(container);
-    headingNode.selectStart();
-}
-function getToggleContextMenuOptions(editor, container) {
-    return [
-        ...[1, 2, 3].map((n) => {
-            const titleMap = {
-                1: i18n.t("큰 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                2: i18n.t("중간 제목", { context: "렉시컬 드롭다운 메뉴" }),
-                3: i18n.t("작은 제목", { context: "렉시컬 드롭다운 메뉴" }),
-            };
-            const iconMap = {
-                1: _jsx(H1Icon, {}),
-                2: _jsx(H2Icon, {}),
-                3: _jsx(H3Icon, {}),
-            };
-            return new ComponentPickerOption(titleMap[n], {
-                icon: iconMap[n],
-                keywords: ["heading", "header", `h${n}`, titleMap[n]],
-                onSelect: () => editor.update(() => {
-                    convertToggleTitleToHeading(container, `h${n}`);
-                }),
-            });
-        }),
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
-            icon: _jsx(CloseFillIcon, {}),
-            keywords: [],
-            onSelect: () => {
-                container.remove();
-            },
-        }),
-    ];
-}
-function getProblemInputContextMenuOptions(node) {
+function getProblemInputContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -229,9 +174,9 @@ function getProblemInputContextMenuOptions(node) {
         }),
     ];
 }
-function getProblemSelectContextMenuOptions(node) {
+function getProblemSelectContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -240,9 +185,9 @@ function getProblemSelectContextMenuOptions(node) {
         }),
     ];
 }
-function getSheetInputContextMenuOptions(node) {
+function getSheetInputContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -251,9 +196,9 @@ function getSheetInputContextMenuOptions(node) {
         }),
     ];
 }
-function getSheetSelectContextMenuOptions(node) {
+function getSheetSelectContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -262,9 +207,9 @@ function getSheetSelectContextMenuOptions(node) {
         }),
     ];
 }
-function getSelfEvaluationContextMenuOptions(node) {
+function getSelfEvaluationContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -273,9 +218,9 @@ function getSelfEvaluationContextMenuOptions(node) {
         }),
     ];
 }
-function getImageContextMenuOptions(node) {
+function getImageContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -284,9 +229,9 @@ function getImageContextMenuOptions(node) {
         }),
     ];
 }
-function getVideoContextMenuOptions(node) {
+function getVideoContextMenuOptions(node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -295,9 +240,9 @@ function getVideoContextMenuOptions(node) {
         }),
     ];
 }
-function getColoredQuoteContextMenuOptions(editor, theme, node) {
+function getColoredQuoteContextMenuOptions(editor, theme, node, t) {
     return [
-        new ComponentPickerOption(i18n.t("회색"), {
+        new ComponentPickerOption(t("회색"), {
             icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.marbleOnContainer })),
             iconContainerClassName: css `
         background: ${theme.color.container.marbleContainer};
@@ -309,7 +254,7 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
                 });
             },
         }),
-        new ComponentPickerOption(i18n.t("빨간색"), {
+        new ComponentPickerOption(t("빨간색"), {
             icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.redOnContainer })),
             iconContainerClassName: css `
         background: ${theme.color.container.redContainer};
@@ -321,7 +266,7 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
                 });
             },
         }),
-        new ComponentPickerOption(i18n.t("노란색"), {
+        new ComponentPickerOption(t("노란색"), {
             icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.yellowOnContainer })),
             iconContainerClassName: css `
         background: ${theme.color.container.yellowContainer};
@@ -333,7 +278,7 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
                 });
             },
         }),
-        new ComponentPickerOption(i18n.t("파란색"), {
+        new ComponentPickerOption(t("파란색"), {
             icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.blueOnContainer })),
             iconContainerClassName: css `
         background: ${theme.color.container.blueContainer};
@@ -345,7 +290,7 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
                 });
             },
         }),
-        new ComponentPickerOption(i18n.t("초록색"), {
+        new ComponentPickerOption(t("초록색"), {
             icon: (_jsx(InputMethodLineIcon, { color: theme.color.container.greenOnContainer })),
             iconContainerClassName: css `
         background: ${theme.color.container.greenContainer};
@@ -357,7 +302,7 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
                 });
             },
         }),
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -368,9 +313,9 @@ function getColoredQuoteContextMenuOptions(editor, theme, node) {
         }),
     ];
 }
-function getUploadFileContextMenuOptions(editor, node) {
+function getUploadFileContextMenuOptions(editor, node, t) {
     return [
-        new ComponentPickerOption(i18n.t("블록 삭제"), {
+        new ComponentPickerOption(t("블록 삭제"), {
             icon: _jsx(CloseFillIcon, {}),
             keywords: [],
             onSelect: () => {
@@ -384,58 +329,50 @@ function getUploadFileContextMenuOptions(editor, node) {
 export function useContextMenuOptions(props) {
     const { isSheetEnabled, isQuizEnabled, showFileUpload } = props;
     const theme = useTheme();
+    const { t } = useTranslation();
     return (editor, node, setImageOpen, setVideoOpen, setFileOpen) => {
         if ($isProblemInputNode(node)) {
-            return getProblemInputContextMenuOptions(node);
+            return getProblemInputContextMenuOptions(node, t);
         }
         else if ($isProblemSelectNode(node)) {
-            return getProblemSelectContextMenuOptions(node);
+            return getProblemSelectContextMenuOptions(node, t);
         }
         else if ($isSheetInputNode(node)) {
-            return getSheetInputContextMenuOptions(node);
+            return getSheetInputContextMenuOptions(node, t);
         }
         else if ($isSheetSelectNode(node)) {
-            return getSheetSelectContextMenuOptions(node);
+            return getSheetSelectContextMenuOptions(node, t);
         }
         else if ($isSelfEvaluationNode(node)) {
-            return getSelfEvaluationContextMenuOptions(node);
+            return getSelfEvaluationContextMenuOptions(node, t);
         }
         else if ($isImageNode(node)) {
-            return getImageContextMenuOptions(node);
+            return getImageContextMenuOptions(node, t);
         }
         else if ($isVideoNode(node)) {
-            return getVideoContextMenuOptions(node);
+            return getVideoContextMenuOptions(node, t);
         }
         else if (node instanceof ParagraphNode) {
-            return getParagraphContextMenuOptions(editor, node);
+            return getParagraphContextMenuOptions(editor, node, t);
         }
         else if (node instanceof HeadingNode) {
-            return getHeadingContextMenuOptions(editor, node);
+            return getHeadingContextMenuOptions(editor, node, t);
         }
         else if (node instanceof ListNode || node instanceof ListItemNode) {
-            return getListContextMenuOptions(editor, theme, node);
-        }
-        else if ($isToggleContainerNode(node)) {
-            return getToggleContextMenuOptions(editor, node);
-        }
-        else if ($isToggleTitleNode(node) || $isToggleContentNode(node)) {
-            const parent = node.getParent();
-            if (parent && $isToggleContainerNode(parent)) {
-                return getToggleContextMenuOptions(editor, parent);
-            }
-            return [];
+            return getListContextMenuOptions(editor, theme, node, t);
         }
         else if ($isColoredQuoteNode(node)) {
-            return getColoredQuoteContextMenuOptions(editor, theme, node);
+            return getColoredQuoteContextMenuOptions(editor, theme, node, t);
         }
         else if ($isFileNode(node)) {
-            return getUploadFileContextMenuOptions(editor, node);
+            return getUploadFileContextMenuOptions(editor, node, t);
         }
         else {
             return [
                 ...getBaseOptions({
                     editor,
                     theme,
+                    t,
                     setImageOpen,
                     setVideoOpen,
                     isSheetEnabled,
@@ -443,7 +380,7 @@ export function useContextMenuOptions(props) {
                     setFileOpen,
                     showFileUpload,
                 }),
-                new ComponentPickerOption(i18n.t("블록 삭제"), {
+                new ComponentPickerOption(t("블록 삭제"), {
                     icon: _jsx(CloseFillIcon, {}),
                     keywords: [],
                     onSelect: () => {

package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuItem.js

@@ -4,38 +4,38 @@ export function ComponentPickerMenuItem(props) {
     const { index, isSelected, onClick, onMouseEnter, option } = props;
     return (_jsxs(ItemContainer, { tabIndex: -1, ref: option.setRefElement, role: "option", "aria-selected": isSelected, id: "typeahead-item-" + index, onMouseEnter: onMouseEnter, onClick: onClick, isSelected: isSelected, children: [_jsx(IconContainer, { className: option.iconContainerClassName, children: option.icon }), _jsx(Title, { children: option.title })] }, option.key));
 }
-const ItemContainer = styled.li `
-  display: flex;
-  padding: 3px 2px;
-  align-items: center;
-  gap: 10px;
-  width: 100%;
-  cursor: pointer;
-
-  ${({ isSelected }) => isSelected && "background: #eee;"}
+const ItemContainer = styled.li `
+  display: flex;
+  padding: 3px 2px;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  cursor: pointer;
+
+  ${({ isSelected }) => isSelected && "background: #eee;"}
 `;
-const IconContainer = styled.div `
-  display: flex;
-  width: 26px;
-  height: 26px;
-  justify-content: center;
-  align-items: center;
-
-  border-radius: 5px;
-
-  background: ${({ theme }) => theme.color.foreground.neutralAlt};
-  box-shadow: 0px 0px 0px 1px rgba(201, 201, 204, 0.48);
-
-  svg {
-    width: 18px;
-    height: 18px;
-  }
+const IconContainer = styled.div `
+  display: flex;
+  width: 26px;
+  height: 26px;
+  justify-content: center;
+  align-items: center;
+
+  border-radius: 5px;
+
+  background: ${({ theme }) => theme.color.foreground.neutralAlt};
+  box-shadow: 0px 0px 0px 1px rgba(201, 201, 204, 0.48);
+
+  svg {
+    width: 18px;
+    height: 18px;
+  }
 `;
-const Title = styled.span `
-  color: ${({ theme }) => theme.color.foreground.neutralBase};
-  font-family: ${({ theme }) => theme.fontFamily.ui};
-  font-size: 14px;
-  font-style: normal;
-  font-weight: 500;
-  line-height: 20px; /* 142.857% */
+const Title = styled.span `
+  color: ${({ theme }) => theme.color.foreground.neutralBase};
+  font-family: ${({ theme }) => theme.fontFamily.ui};
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 20px; /* 142.857% */
 `;

package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuList.js

@@ -17,37 +17,37 @@ export function ComponentPickerMenuList(props) {
                     }, option: option }, option.key));
             }) }) }));
 }
-const Container = styled.div `
-  position: absolute;
-
-  display: flex;
-  width: 200px;
-  padding: 4px;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 5px;
-
-  border-radius: 8px;
-  border: 1px solid #e8e8eb;
-  background: ${({ theme }) => theme.color.background.neutralBase};
-  box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
+const Container = styled.div `
+  position: absolute;
+
+  display: flex;
+  width: 200px;
+  padding: 4px;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 5px;
+
+  border-radius: 8px;
+  border: 1px solid #e8e8eb;
+  background: ${({ theme }) => theme.color.background.neutralBase};
+  box-shadow: 0px 3px 15px -3px rgba(13, 20, 33, 0.13);
 `;
-const ListContainer = styled.ul `
-  padding: 0;
-  list-style: none;
-  margin: 0;
-
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-  gap: 1px;
-  align-self: stretch;
-
-  overflow-y: scroll;
-
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-  &::-webkit-scrollbar {
-    display: none;
-  }
+const ListContainer = styled.ul `
+  padding: 0;
+  list-style: none;
+  margin: 0;
+
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 1px;
+  align-self: stretch;
+
+  overflow-y: scroll;
+
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  &::-webkit-scrollbar {
+    display: none;
+  }
 `;

package/dist/patterns/LexicalEditor/plugins/ComponentPickerMenuPlugin/ComponentPickerMenuPlugin.d.ts

@@ -10,6 +10,7 @@ import { MenuOption } from "@lexical/react/LexicalTypeaheadMenuPlugin";
 import { LexicalEditor } from "lexical";
 import { ReactElement } from "react";
 import { Theme } from "@emotion/react";
+import { TFunction } from "i18next";
 export declare class ComponentDrawerOption extends MenuOption {
     title: string;
     component: ReactElement;
@@ -33,6 +34,7 @@ export declare class ComponentPickerOption extends MenuOption {
 export declare function getBaseOptions(props: {
     editor: LexicalEditor;
     theme: Theme;
+    t: TFunction;
     setImageOpen: (open: boolean) => void;
     setVideoOpen: (open: boolean) => void;
     setFileOpen: (open: boolean) => void;