ekm-ui 0.3.78 → 0.3.81

package/dist/product-picker/product-drawer.mjs

@@ -1,60 +0,0 @@
-export { f as ProductPicker } from '../chunk-PEODF7PL.mjs';
-import '../chunk-SFSA2WUE.mjs';
-import '../chunk-YJINOUZ7.mjs';
-import '../chunk-EHJJX6ZZ.mjs';
-import '../chunk-2OTVEVU7.mjs';
-import '../chunk-D3VRYN5H.mjs';
-import '../chunk-7MH2LXFV.mjs';
-import '../chunk-FVUORQJX.mjs';
-import '../chunk-RGCO6BCU.mjs';
-import '../chunk-W3XYS7M3.mjs';
-import '../chunk-LVJYP46A.mjs';
-import '../chunk-35VEFUPA.mjs';
-import '../chunk-HOCKBMTF.mjs';
-import '../chunk-AYH56CFA.mjs';
-import '../chunk-PJZVMYPN.mjs';
-import '../chunk-ATNP3Z6G.mjs';
-import '../chunk-P7TACBB4.mjs';
-import '../chunk-QMFUWXJJ.mjs';
-import '../chunk-BK5RX7N5.mjs';
-import '../chunk-OG6UBKMG.mjs';
-import '../chunk-QFECX4D6.mjs';
-import '../chunk-3TAXDPV6.mjs';
-import '../chunk-ECOC3JRK.mjs';
-import '../chunk-6K6D4X6D.mjs';
-import '../chunk-ZO5NWKNY.mjs';
-import '../chunk-6F3XKP3G.mjs';
-import '../chunk-3AGRJPPN.mjs';
-import '../chunk-Z5YZVKS5.mjs';
-import '../chunk-DBTYTFGU.mjs';
-import '../chunk-CZC4EJOD.mjs';
-import '../chunk-76V2THLN.mjs';
-import '../chunk-MPIWXVKP.mjs';
-import '../chunk-R4A5DO7E.mjs';
-import '../chunk-ZT7KDTGF.mjs';
-import '../chunk-2PW7KHXJ.mjs';
-import '../chunk-JPF3K5TD.mjs';
-import '../chunk-PJMH47GY.mjs';
-import '../chunk-NJC2WLYK.mjs';
-import '../chunk-SM4TG5VI.mjs';
-import '../chunk-CIUW5YZ7.mjs';
-import '../chunk-PT4DPY4L.mjs';
-import '../chunk-X2JENUDV.mjs';
-import '../chunk-G5A3E5IG.mjs';
-import '../chunk-6UK5Y6KZ.mjs';
-import '../chunk-UPAA75QA.mjs';
-import '../chunk-K2G6O2LX.mjs';
-import '../chunk-XBWUYKZW.mjs';
-import '../chunk-7GLTVVKS.mjs';
-import '../chunk-PT4IH2KW.mjs';
-import '../chunk-S3J72WZM.mjs';
-import '../chunk-EX5FMSQL.mjs';
-import '../chunk-EH3ZVEVT.mjs';
-import '../chunk-E6KQBM7F.mjs';
-import '../chunk-SAXGEQRG.mjs';
-import '../chunk-QHJF4QWW.mjs';
-import '../chunk-GBY2NNWZ.mjs';
-import '../chunk-PUJZGK7Y.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=product-drawer.mjs.map

package/dist/product-picker/product-listing.mjs

@@ -1,7 +0,0 @@
-export { a as Listing } from '../chunk-35VEFUPA.mjs';
-import '../chunk-NJC2WLYK.mjs';
-import '../chunk-GBY2NNWZ.mjs';
-import '../chunk-PUJZGK7Y.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=product-listing.mjs.map

package/dist/progress-bar.mjs

@@ -1,5 +0,0 @@
-export { a as ProgressBar } from './chunk-OG6UBKMG.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=progress-bar.mjs.map

package/dist/radio.mjs

@@ -1,5 +0,0 @@
-export { a as Radio } from './chunk-QFECX4D6.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=radio.mjs.map

package/dist/rich-text-editor/index.d.ts

@@ -1,16 +0,0 @@
-import { CKEditor } from '@ckeditor/ckeditor5-react';
-import react__default from 'react';
-import DecoupledEditorBase from '@ckeditor/ckeditor5-editor-decoupled/src/decouplededitor';
-
-declare class HeadlessEditor extends DecoupledEditorBase {
-}
-
-type AdditionalProps = {
-    onDataChange?: (data: string) => void;
-    selectedText?: string | null;
-    onSelectedTextChange?: (text: string | null) => void;
-    additionalToolbarItems?: react__default.ReactNode;
-};
-declare function RichTextEditor(props: Omit<CKEditor<HeadlessEditor>["props"], "editor"> & AdditionalProps): JSX.Element;
-
-export { RichTextEditor };

package/dist/rich-text-editor/index.mjs

@@ -1,4 +0,0 @@
-export { a as RichTextEditor } from '../chunk-SFSA2WUE.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=index.mjs.map

package/dist/search/search.mjs

@@ -1,5 +0,0 @@
-export { a as Search } from '../chunk-YJINOUZ7.mjs';
-import '../chunk-PUJZGK7Y.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=search.mjs.map

package/dist/select.mjs

@@ -1,5 +0,0 @@
-export { a as Select } from './chunk-G5A3E5IG.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=select.mjs.map

package/dist/sidebar/sidebar.mjs

@@ -1,4 +0,0 @@
-export { b as Sidebar } from '../chunk-EHJJX6ZZ.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=sidebar.mjs.map

package/dist/sort/sort.mjs

@@ -1,5 +0,0 @@
-export { a as Sort } from '../chunk-2OTVEVU7.mjs';
-import '../chunk-PUJZGK7Y.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=sort.mjs.map

package/dist/spinner.mjs

@@ -1,4 +0,0 @@
-export { a as Spinner } from './chunk-3TAXDPV6.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=spinner.mjs.map

package/dist/stacked-list-item.mjs

@@ -1,60 +0,0 @@
-export { a as StackedListItem } from './chunk-PEODF7PL.mjs';
-import './chunk-SFSA2WUE.mjs';
-import './chunk-YJINOUZ7.mjs';
-import './chunk-EHJJX6ZZ.mjs';
-import './chunk-2OTVEVU7.mjs';
-import './chunk-D3VRYN5H.mjs';
-import './chunk-7MH2LXFV.mjs';
-import './chunk-FVUORQJX.mjs';
-import './chunk-RGCO6BCU.mjs';
-import './chunk-W3XYS7M3.mjs';
-import './chunk-LVJYP46A.mjs';
-import './chunk-35VEFUPA.mjs';
-import './chunk-HOCKBMTF.mjs';
-import './chunk-AYH56CFA.mjs';
-import './chunk-PJZVMYPN.mjs';
-import './chunk-ATNP3Z6G.mjs';
-import './chunk-P7TACBB4.mjs';
-import './chunk-QMFUWXJJ.mjs';
-import './chunk-BK5RX7N5.mjs';
-import './chunk-OG6UBKMG.mjs';
-import './chunk-QFECX4D6.mjs';
-import './chunk-3TAXDPV6.mjs';
-import './chunk-ECOC3JRK.mjs';
-import './chunk-6K6D4X6D.mjs';
-import './chunk-ZO5NWKNY.mjs';
-import './chunk-6F3XKP3G.mjs';
-import './chunk-3AGRJPPN.mjs';
-import './chunk-Z5YZVKS5.mjs';
-import './chunk-DBTYTFGU.mjs';
-import './chunk-CZC4EJOD.mjs';
-import './chunk-76V2THLN.mjs';
-import './chunk-MPIWXVKP.mjs';
-import './chunk-R4A5DO7E.mjs';
-import './chunk-ZT7KDTGF.mjs';
-import './chunk-2PW7KHXJ.mjs';
-import './chunk-JPF3K5TD.mjs';
-import './chunk-PJMH47GY.mjs';
-import './chunk-NJC2WLYK.mjs';
-import './chunk-SM4TG5VI.mjs';
-import './chunk-CIUW5YZ7.mjs';
-import './chunk-PT4DPY4L.mjs';
-import './chunk-X2JENUDV.mjs';
-import './chunk-G5A3E5IG.mjs';
-import './chunk-6UK5Y6KZ.mjs';
-import './chunk-UPAA75QA.mjs';
-import './chunk-K2G6O2LX.mjs';
-import './chunk-XBWUYKZW.mjs';
-import './chunk-7GLTVVKS.mjs';
-import './chunk-PT4IH2KW.mjs';
-import './chunk-S3J72WZM.mjs';
-import './chunk-EX5FMSQL.mjs';
-import './chunk-EH3ZVEVT.mjs';
-import './chunk-E6KQBM7F.mjs';
-import './chunk-SAXGEQRG.mjs';
-import './chunk-QHJF4QWW.mjs';
-import './chunk-GBY2NNWZ.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=stacked-list-item.mjs.map

package/dist/table-header/table-header.mjs

@@ -1,8 +0,0 @@
-export { a as TableHeader } from '../chunk-D3VRYN5H.mjs';
-import '../chunk-FVUORQJX.mjs';
-import '../chunk-NJC2WLYK.mjs';
-import '../chunk-GBY2NNWZ.mjs';
-import '../chunk-PUJZGK7Y.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=table-header.mjs.map

package/dist/table-result-block.mjs

@@ -1,60 +0,0 @@
-export { e as TableResultBlock } from './chunk-PEODF7PL.mjs';
-import './chunk-SFSA2WUE.mjs';
-import './chunk-YJINOUZ7.mjs';
-import './chunk-EHJJX6ZZ.mjs';
-import './chunk-2OTVEVU7.mjs';
-import './chunk-D3VRYN5H.mjs';
-import './chunk-7MH2LXFV.mjs';
-import './chunk-FVUORQJX.mjs';
-import './chunk-RGCO6BCU.mjs';
-import './chunk-W3XYS7M3.mjs';
-import './chunk-LVJYP46A.mjs';
-import './chunk-35VEFUPA.mjs';
-import './chunk-HOCKBMTF.mjs';
-import './chunk-AYH56CFA.mjs';
-import './chunk-PJZVMYPN.mjs';
-import './chunk-ATNP3Z6G.mjs';
-import './chunk-P7TACBB4.mjs';
-import './chunk-QMFUWXJJ.mjs';
-import './chunk-BK5RX7N5.mjs';
-import './chunk-OG6UBKMG.mjs';
-import './chunk-QFECX4D6.mjs';
-import './chunk-3TAXDPV6.mjs';
-import './chunk-ECOC3JRK.mjs';
-import './chunk-6K6D4X6D.mjs';
-import './chunk-ZO5NWKNY.mjs';
-import './chunk-6F3XKP3G.mjs';
-import './chunk-3AGRJPPN.mjs';
-import './chunk-Z5YZVKS5.mjs';
-import './chunk-DBTYTFGU.mjs';
-import './chunk-CZC4EJOD.mjs';
-import './chunk-76V2THLN.mjs';
-import './chunk-MPIWXVKP.mjs';
-import './chunk-R4A5DO7E.mjs';
-import './chunk-ZT7KDTGF.mjs';
-import './chunk-2PW7KHXJ.mjs';
-import './chunk-JPF3K5TD.mjs';
-import './chunk-PJMH47GY.mjs';
-import './chunk-NJC2WLYK.mjs';
-import './chunk-SM4TG5VI.mjs';
-import './chunk-CIUW5YZ7.mjs';
-import './chunk-PT4DPY4L.mjs';
-import './chunk-X2JENUDV.mjs';
-import './chunk-G5A3E5IG.mjs';
-import './chunk-6UK5Y6KZ.mjs';
-import './chunk-UPAA75QA.mjs';
-import './chunk-K2G6O2LX.mjs';
-import './chunk-XBWUYKZW.mjs';
-import './chunk-7GLTVVKS.mjs';
-import './chunk-PT4IH2KW.mjs';
-import './chunk-S3J72WZM.mjs';
-import './chunk-EX5FMSQL.mjs';
-import './chunk-EH3ZVEVT.mjs';
-import './chunk-E6KQBM7F.mjs';
-import './chunk-SAXGEQRG.mjs';
-import './chunk-QHJF4QWW.mjs';
-import './chunk-GBY2NNWZ.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=table-result-block.mjs.map

package/dist/text-row.mjs

@@ -1,4 +0,0 @@
-export { a as TextRow } from './chunk-ECOC3JRK.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=text-row.mjs.map

package/dist/textarea.mjs

@@ -1,5 +0,0 @@
-export { a as TextArea } from './chunk-HOCKBMTF.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=textarea.mjs.map

package/dist/textinput.mjs

@@ -1,5 +0,0 @@
-export { a as TextInput } from './chunk-6F3XKP3G.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=textinput.mjs.map

package/dist/toggleswitch.mjs

@@ -1,5 +0,0 @@
-export { a as ToggleSwitch } from './chunk-XBWUYKZW.mjs';
-import './chunk-PUJZGK7Y.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=toggleswitch.mjs.map

package/dist/tooltip/tooltip.mjs

@@ -1,4 +0,0 @@
-export { a as ToolTip } from '../chunk-FVUORQJX.mjs';
-import '../chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=tooltip.mjs.map

package/dist/video-dashboard-notification.mjs

@@ -1,4 +0,0 @@
-export { a as VideoDashboardNotification } from './chunk-AYH56CFA.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=video-dashboard-notification.mjs.map

package/dist/video-modal.mjs

@@ -1,4 +0,0 @@
-export { a as VideoModal } from './chunk-PJZVMYPN.mjs';
-import './chunk-23SJGKDR.mjs';
-//# sourceMappingURL=out.js.map
-//# sourceMappingURL=video-modal.mjs.map

package/src/rich-text-editor/headless-editor.ts

@@ -1,96 +0,0 @@
-// https://github.com/ckeditor/ckeditor5-demos/blob/master/headless/index.js
-
-import DecoupledEditorBase from "@ckeditor/ckeditor5-editor-decoupled/src/decouplededitor";
-
-import Alignment from "@ckeditor/ckeditor5-alignment/src/alignment";
-import Autoformat from "@ckeditor/ckeditor5-autoformat/src/autoformat";
-import Bold from "@ckeditor/ckeditor5-basic-styles/src/bold";
-import Code from "@ckeditor/ckeditor5-basic-styles/src/code";
-import Italic from "@ckeditor/ckeditor5-basic-styles/src/italic";
-import Strikethrough from "@ckeditor/ckeditor5-basic-styles/src/strikethrough";
-import Underline from "@ckeditor/ckeditor5-basic-styles/src/underline";
-import BlockQuote from "@ckeditor/ckeditor5-block-quote/src/blockquote";
-import CodeBlock from "@ckeditor/ckeditor5-code-block/src/codeblock";
-import Essentials from "@ckeditor/ckeditor5-essentials/src/essentials";
-import Heading from "@ckeditor/ckeditor5-heading/src/heading";
-import Image from "@ckeditor/ckeditor5-image/src/image";
-import ImageCaption from "@ckeditor/ckeditor5-image/src/imagecaption";
-import ImageResize from "@ckeditor/ckeditor5-image/src/imageresize";
-import ImageStyle from "@ckeditor/ckeditor5-image/src/imagestyle";
-import ImageToolbar from "@ckeditor/ckeditor5-image/src/imagetoolbar";
-import PictureEditing from "@ckeditor/ckeditor5-image/src/pictureediting";
-import Indent from "@ckeditor/ckeditor5-indent/src/indent";
-import IndentBlock from "@ckeditor/ckeditor5-indent/src/indentblock";
-import Link from "@ckeditor/ckeditor5-link/src/link";
-import List from "@ckeditor/ckeditor5-list/src/list";
-import ListProperties from "@ckeditor/ckeditor5-list/src/listproperties";
-import Paragraph from "@ckeditor/ckeditor5-paragraph/src/paragraph";
-import PasteFromOffice from "@ckeditor/ckeditor5-paste-from-office/src/pastefromoffice";
-import RemoveFormat from "@ckeditor/ckeditor5-remove-format/src/removeformat";
-import Table from "@ckeditor/ckeditor5-table/src/table";
-import TableToolbar from "@ckeditor/ckeditor5-table/src/tabletoolbar";
-import TextTransformation from "@ckeditor/ckeditor5-typing/src/texttransformation";
-
-class HeadlessEditor extends DecoupledEditorBase {}
-
-HeadlessEditor.builtinPlugins = [
-  Alignment,
-  Autoformat,
-  BlockQuote,
-  Bold,
-  Code,
-  CodeBlock,
-  Essentials,
-  Heading,
-  Image,
-  ImageCaption,
-  ImageResize,
-  ImageStyle,
-  ImageToolbar,
-  Indent,
-  IndentBlock,
-  Italic,
-  Link,
-  List,
-  ListProperties,
-  Paragraph,
-  PasteFromOffice,
-  PictureEditing,
-  RemoveFormat,
-  Strikethrough,
-  Table,
-  TableToolbar,
-  TextTransformation,
-  Underline,
-];
-
-// Editor configuration.
-HeadlessEditor.defaultConfig = {
-  // TODO: Figure out why typescript doesn't like these properties.
-  // @ts-ignore
-  codeBlock: {
-    languages: [
-      { language: "css", label: "CSS" },
-      { language: "html", label: "HTML" },
-      { language: "javascript", label: "JavaScript" },
-      { language: "php", label: "PHP" },
-    ],
-  },
-  image: {
-    resizeUnit: "px",
-    toolbar: [
-      "imageStyle:inline",
-      "imageStyle:wrapText",
-      "imageStyle:breakText",
-      "|",
-      "toggleImageCaption",
-      "imageTextAlternative",
-    ],
-  },
-  table: {
-    contentToolbar: ["tableColumn", "tableRow", "mergeTableCells"],
-  },
-  language: "en",
-};
-
-export default HeadlessEditor;

package/src/rich-text-editor/index.tsx

@@ -1,215 +0,0 @@
-import { CKEditor } from "@ckeditor/ckeditor5-react";
-import React, { useEffect, useState } from "react";
-import {
-  FaBold,
-  FaItalic,
-  FaRemoveFormat,
-  FaStrikethrough,
-  FaUnderline,
-} from "react-icons/fa";
-import HeadlessEditor from "./headless-editor";
-
-type AdditionalProps = {
-  onDataChange?: (data: string) => void;
-  selectedText?: string | null;
-  onSelectedTextChange?: (text: string | null) => void;
-  additionalToolbarItems?: React.ReactNode;
-};
-
-export function RichTextEditor(
-  props: Omit<CKEditor<HeadlessEditor>["props"], "editor"> & AdditionalProps
-) {
-  const [editor, setEditor] = useState<HeadlessEditor | null>(null);
-
-  useEffect(() => {
-    editor?.listenTo(editor?.model.document.selection, "change:range", (e) => {
-      const selectedText = editor?.model.document.selection;
-      const range = selectedText?.getFirstRange();
-      if (range) {
-        let text = "";
-        for (const item of range.getItems()) {
-          // @ts-ignore
-          text += item.data;
-        }
-        if (props.onSelectedTextChange) {
-          props.onSelectedTextChange(text);
-        }
-      }
-    });
-
-    editor?.model.document.on("change:data", () => {
-      if (props.onDataChange) {
-        props.onDataChange(editor?.getData() || "");
-      }
-    });
-  }, [editor, props.onDataChange, props.onSelectedTextChange]);
-
-  return (
-    <div className="mb-4 w-full rounded-lg border border-gray-200 bg-gray-50 dark:border-gray-600 dark:bg-gray-700">
-      <Toolbar editor={editor} additionalItems={props.additionalToolbarItems} />
-      <CKEditor
-        editor={HeadlessEditor}
-        {...props}
-        onReady={(editor) => {
-          setEditor(editor);
-          // @ts-ignore
-          window.editor = editor;
-          const className =
-            "px-4 py-2 bg-white rounded-b-lg dark:bg-gray-800 block w-full text-sm text-gray-800 bg-white border-0 dark:bg-gray-800 focus:ring-0 dark:text-white dark:placeholder-gray-400";
-
-          editor.editing.view.change((writer) => {
-            const root = editor.editing.view.document.getRoot();
-            if (root) {
-              writer.removeClass(
-                [
-                  "ck-content",
-                  "ck-editor__editable",
-                  "ck-rounded-corners",
-                  "ck-editor__editable_inline",
-                ],
-                root
-              );
-              writer.addClass(className, root);
-            }
-          });
-        }}
-      />
-    </div>
-  );
-}
-
-function Toolbar({
-  editor,
-  additionalItems,
-}: {
-  editor: HeadlessEditor | null;
-  additionalItems?: React.ReactNode;
-}) {
-  return (
-    <div className="flex items-center justify-between border-b px-3 py-2 dark:border-gray-600">
-      <div className="flex flex-wrap items-center divide-gray-200 dark:divide-gray-600 sm:divide-x">
-        <div className="flex items-center space-x-2 sm:pr-4">
-          {additionalItems}
-          <EditorToolbarButton
-            commandName="bold"
-            label="Bold"
-            editor={editor}
-          />
-          <EditorToolbarButton
-            commandName="italic"
-            label="Italic"
-            editor={editor}
-          />
-          <EditorToolbarButton
-            commandName="underline"
-            label="Underline"
-            editor={editor}
-          />
-          <EditorToolbarButton
-            commandName="strikethrough"
-            label="Strikethrough"
-            editor={editor}
-          />
-          <EditorToolbarButton
-            commandName="removeFormat"
-            label="Remove format"
-            editor={editor}
-          />
-        </div>
-      </div>
-    </div>
-  );
-}
-
-function EditorToolbarButton({
-  editor,
-  commandName,
-  commandValue = null,
-  label,
-}: {
-  editor: HeadlessEditor | null;
-  commandName: keyof typeof iconMap;
-  commandValue?: string | null;
-  label: string;
-}) {
-  const command = editor ? editor.commands.get(commandName) : null;
-  const [isOn, setIsOn] = useState(false);
-  const [isEnabled, setIsEnabled] = useState(true);
-
-  useEffect(() => {
-    if (!command) {
-      return;
-    }
-
-    function handleValueChange() {
-      if (typeof command?.value === "boolean") {
-        setIsOn(!!command.value);
-      } else {
-        setIsOn(commandValue === command?.value);
-      }
-    }
-
-    function handleIsEnabledChange() {
-      setIsEnabled(command?.isEnabled || false);
-    }
-
-    command.on("change:value", handleValueChange);
-    command.on("change:isEnabled", handleIsEnabledChange);
-
-    handleValueChange();
-    handleIsEnabledChange();
-
-    return function cleanup() {
-      command.off("change:value", handleValueChange);
-      command.off("change:isEnabled", handleIsEnabledChange);
-    };
-  }, [command]);
-
-  const classNames = ["custom-editor-button"];
-
-  if (isEnabled) {
-    classNames.push(
-      isOn
-        ? "custom-editor-button--fill bg-gray-100 text-gray-900 dark:bg-gray-600 dark:text-white"
-        : ""
-    );
-  } else {
-    classNames.push("custom-editor-button--disabled");
-  }
-
-  classNames.push(
-    "mr-2 cursor-pointer rounded p-2 text-gray-500 hover:bg-gray-100 hover:text-gray-900 dark:text-gray-400 dark:hover:bg-gray-600 dark:hover:text-white"
-  );
-
-  return (
-    <div className="border-r">
-      <button
-        className={classNames.join(" ")}
-        onClick={() => {
-          if (!editor) {
-            return;
-          }
-          if (commandValue) {
-            editor.execute(commandName, { value: commandValue });
-          } else {
-            editor.execute(commandName);
-          }
-
-          editor.editing.view.focus();
-        }}
-      >
-        <span className="sr-only">{label}</span>
-        {iconMap[commandName]}
-      </button>
-    </div>
-  );
-}
-
-// Icon map to map from the command name to the icon
-const iconMap = {
-  bold: <FaBold />,
-  italic: <FaItalic />,
-  underline: <FaUnderline />,
-  strikethrough: <FaStrikethrough />,
-  removeFormat: <FaRemoveFormat />,
-};