@tulip-systems/core 0.5.0 → 0.5.1

package/src/components/editor/components/{block-dropdown.tsx → menu-nodes.client.tsx}

@@ -5,7 +5,6 @@ import {
   DropdownMenuItem,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
-import { Separator } from "@/components/ui/separator";
 import { Editor } from "@tiptap/react";
 import {
   ChevronDown,
@@ -81,7 +80,7 @@ const blocks = [
   },
 ];
 
-export function BlockDropdown() {
+export function EditorMenuNodes() {
   const { editor, extensions } = useContext(EditorContext);
 
   const selectedBlock = blocks.find((block) => block.selected(editor));
@@ -92,34 +91,30 @@ export function BlockDropdown() {
   if (filteredBlocks.length === 0) return null;
 
   return (
-    <>
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <Button variant="outline" size="sm" className="flex items-center gap-8 p-2">
-            <span className="flex items-center gap-2">
-              {Icon && <Icon className="size-3.5" />}
-              {selectedBlock?.label ?? "Select a block"}
-            </span>
+    <DropdownMenu>
+      <DropdownMenuTrigger asChild>
+        <Button variant="outline" size="sm" className="flex items-center gap-8 p-2">
+          <span className="flex items-center gap-2">
+            {Icon && <Icon className="size-3.5" />}
+            {selectedBlock?.label ?? "Select a block"}
+          </span>
 
-            <ChevronDown className="size-3.5" />
-          </Button>
-        </DropdownMenuTrigger>
+          <ChevronDown className="size-3.5" />
+        </Button>
+      </DropdownMenuTrigger>
 
-        <DropdownMenuContent>
-          {filteredBlocks.map(({ label, icon: Icon, handler }, index) => (
-            <DropdownMenuItem
-              key={index}
-              onClick={() => handler(editor)}
-              className="flex items-center gap-2"
-            >
-              {Icon && <Icon className="size-3.5" />}
-              {label}
-            </DropdownMenuItem>
-          ))}
-        </DropdownMenuContent>
-      </DropdownMenu>
-
-      <Separator orientation="vertical" className="h-8" />
-    </>
+      <DropdownMenuContent>
+        {filteredBlocks.map(({ label, icon: Icon, handler }, index) => (
+          <DropdownMenuItem
+            key={index}
+            onClick={() => handler(editor)}
+            className="flex items-center gap-2"
+          >
+            {Icon && <Icon className="size-3.5" />}
+            {label}
+          </DropdownMenuItem>
+        ))}
+      </DropdownMenuContent>
+    </DropdownMenu>
   );
 }

package/src/components/editor/components/menu.client.tsx

@@ -0,0 +1,214 @@
+import { Button } from "@/components/ui/button";
+import { ColorPicker } from "@/components/ui/color-picker.client";
+import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
+import { cn } from "@/lib/entry";
+import { BubbleMenu } from "@tiptap/react/menus";
+import {
+  BaselineIcon,
+  BoldIcon,
+  EraserIcon,
+  ItalicIcon,
+  PaintBucketIcon,
+  RedoIcon,
+  StrikethroughIcon,
+  UnderlineIcon,
+  UndoIcon,
+} from "lucide-react";
+import { ComponentProps, PropsWithChildren, useContext } from "react";
+import { EditorContext } from "./editor.client";
+import { EditorMenuNodes } from "./menu-nodes.client";
+
+export function EditorMenuFixed(props: React.ComponentProps<"div">) {
+  return (
+    <div
+      {...props}
+      className={cn("border-input bg-muted/30 z-10 overflow-auto border-b p-2", props.className)}
+    >
+      <EditorMenuContent>
+        <EditorMenuUndoRedo />
+        <EditorMenuNodes />
+        <EditorMenuMarks />
+        <EditorMenuColor />
+      </EditorMenuContent>
+    </div>
+  );
+}
+
+export function EditorMenuBubble(props: ComponentProps<typeof BubbleMenu>) {
+  const { editor } = useContext(EditorContext);
+
+  return (
+    <BubbleMenu
+      {...props}
+      editor={editor}
+      options={{ ...props.options, strategy: "fixed" }}
+      className={cn("border-input bg-muted z-10 rounded-lg border p-2", props.className)}
+    >
+      <EditorMenuContent>
+        <EditorMenuMarks />
+      </EditorMenuContent>
+    </BubbleMenu>
+  );
+}
+
+function EditorMenuContent(props: PropsWithChildren) {
+  return <div className="flex items-center gap-6">{props.children}</div>;
+}
+
+/**
+ * Editor menu undo/redo
+ */
+function EditorMenuUndoRedo() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.undoRedo) return null;
+
+  return (
+    <div className="flex items-center gap-1">
+      <Button
+        onClick={() => editor.commands.undo()}
+        disabled={!editor?.can().undo()}
+        type="button"
+        aria-label="Undo"
+        size="icon"
+        className="p-2"
+        variant="outline"
+      >
+        <UndoIcon className="size-3.5" />
+      </Button>
+
+      <Button
+        onClick={() => editor.commands.redo()}
+        disabled={!editor?.can().redo()}
+        type="button"
+        aria-label="Redo"
+        size="icon"
+        className="p-2"
+        variant="outline"
+      >
+        <RedoIcon className="size-3.5" />
+      </Button>
+    </div>
+  );
+}
+
+/**
+ * Editor menu marks
+ */
+function EditorMenuMarks() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.bold && !extensions.italic && !extensions.underline && !extensions.strike) {
+    return null;
+  }
+
+  return (
+    <div className="flex items-center gap-1">
+      {extensions.bold && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("bold") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleBold().run()}
+          className="border"
+        >
+          <BoldIcon className="h-3.5 w-3.5" />
+        </Button>
+      )}
+
+      {extensions.italic && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("italic") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleItalic().run()}
+          className="border"
+        >
+          <ItalicIcon className="size-3.5" />
+        </Button>
+      )}
+
+      {extensions.underline && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("underline") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleUnderline().run()}
+          className="border"
+        >
+          <UnderlineIcon className="size-3.5" />
+        </Button>
+      )}
+
+      {extensions.strike && (
+        <Button
+          type="button"
+          size="icon"
+          variant={editor?.isActive("strike") ? "secondary" : "outline"}
+          onClick={() => editor.chain().focus().toggleStrike().run()}
+          className="border"
+        >
+          <StrikethroughIcon className="size-3.5" />
+        </Button>
+      )}
+    </div>
+  );
+}
+
+/**
+ * Editor menu alignment
+ */
+function EditorMenuColor() {
+  const { editor, extensions } = useContext(EditorContext);
+
+  if (!extensions.color && !extensions.highlight) {
+    return null;
+  }
+
+  return (
+    <div className="flex items-center gap-1">
+      {extensions.color && (
+        <Popover>
+          <PopoverTrigger asChild>
+            <Button size="icon" variant="outline">
+              <BaselineIcon className="size-3.5" />
+            </Button>
+          </PopoverTrigger>
+
+          <PopoverContent className="w-fit p-0">
+            <ColorPicker onValueChange={(color) => editor.chain().focus().setColor(color).run()} />
+          </PopoverContent>
+        </Popover>
+      )}
+
+      {extensions.highlight && (
+        <Popover>
+          <PopoverTrigger asChild>
+            <Button size="icon" variant="outline" disabled={!editor?.can().setHighlight()}>
+              <PaintBucketIcon className="size-3.5" />
+            </Button>
+          </PopoverTrigger>
+
+          <PopoverContent className="w-fit p-0">
+            <ColorPicker
+              onValueChange={(color) => editor.chain().focus().setHighlight({ color }).run()}
+            />
+          </PopoverContent>
+        </Popover>
+      )}
+
+      <Button
+        type="button"
+        size="icon"
+        variant="outline"
+        className="border"
+        onClick={() => {
+          editor.commands.unsetColor();
+          editor.commands.unsetHighlight();
+        }}
+      >
+        <EraserIcon className="h-4 w-4" />
+      </Button>
+    </div>
+  );
+}

package/src/components/editor/lib/extensions.ts

@@ -48,9 +48,9 @@ export type EditorExtensionsConfig = {
   paragraph: Partial<ParagraphOptions> | boolean;
   text: Partial<TextStyleOptions> | boolean;
   image: Partial<ImageOptions> | boolean;
-  // /**
-  //  * Marks
-  //  */
+  /**
+   * Marks
+   */
   bold: Partial<BoldOptions> | boolean;
   italic: Partial<ItalicOptions> | boolean;
   link: Partial<LinkOptions> | boolean;

package/src/components/entry.client.ts

@@ -3,7 +3,7 @@
  */
 export * from "./editor/components/content.client";
 export * from "./editor/components/editor.client";
-export * from "./editor/components/menu-fixed.client";
+export * from "./editor/components/menu.client";
 
 /**
  * Components headers

package/src/modules/storage/lib/router.server.ts

@@ -141,6 +141,12 @@ export function createDriveBaseProcedures() {
         /**
          * Validate
          */
+        if (node?.readonly) {
+          throw new ServerError("BAD_REQUEST", {
+            message: "Deze node is alleen leesbaar en kan niet worden gewijzigd",
+          });
+        }
+
         if (input.parentId && !parent)
           throw new ServerError("BAD_REQUEST", { message: "Parent not found" });
         if (!node) throw new ServerError("BAD_REQUEST", { message: "Node not found" });

package/src/modules/storage/lib/service.server.ts

@@ -105,7 +105,6 @@ export class StorageService<TSchema extends TDatabaseSchema> {
       ContentLength: input.size,
       Metadata: {
         nodeId: input.id,
-        filename: input.name,
       },
     });
   }
@@ -411,6 +410,15 @@ export class StorageService<TSchema extends TDatabaseSchema> {
    * Update a node
    */
   async updateNode(input: { id: string; data: UpdateNodeSchema }) {
+    const [node] = await this.#db
+      .select({ readonly: nodes.readonly })
+      .from(nodes)
+      .where(eq(nodes.id, input.id));
+
+    if (node?.readonly) {
+      throw new ServerError("BAD_REQUEST", { message: "Node is readonly" });
+    }
+
     const [result] = await this.#db
       .update(nodes)
       .set(input.data)
@@ -431,10 +439,15 @@ export class StorageService<TSchema extends TDatabaseSchema> {
    */
   async deleteNodes(input: BulkActionSchema) {
     const items = await this.#db
-      .select({ id: nodes.id, type: nodes.type })
+      .select({ id: nodes.id, type: nodes.type, readonly: nodes.readonly })
       .from(nodes)
       .where(inArray(nodes.id, input.ids));
 
+    // Check if the nodes are readonly
+    if (items.some((item) => item.readonly)) {
+      throw new ServerError("BAD_REQUEST", { message: "Nodes are readonly" });
+    }
+
     // Split the nodes into folders and files
     const folders = items.filter(isFolder).map((folder) => folder.id);
     const files = items.filter(isFile).map((file) => file.id);

package/dist/components/editor/components/block-dropdown.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"block-dropdown.mjs","names":["Icon"],"sources":["../../../../src/components/editor/components/block-dropdown.tsx"],"sourcesContent":["import { Button } from \"@/components/ui/button\";\nimport {\n  DropdownMenu,\n  DropdownMenuContent,\n  DropdownMenuItem,\n  DropdownMenuTrigger,\n} from \"@/components/ui/dropdown-menu\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { Editor } from \"@tiptap/react\";\nimport {\n  ChevronDown,\n  Heading1Icon,\n  Heading2Icon,\n  Heading3Icon,\n  Heading4Icon,\n  Heading5Icon,\n  ListIcon,\n  ListOrderedIcon,\n  TextIcon,\n} from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { EditorExtensionsConfigResult } from \"../lib/extensions\";\nimport { EditorContext } from \"./editor.client\";\n\nconst blocks = [\n  {\n    label: \"Paragraaf\",\n    icon: TextIcon,\n    selected: (editor: Editor) => editor.isActive(\"paragraph\"),\n    handler: (editor: Editor) => editor.commands.setParagraph(),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.paragraph,\n  },\n  {\n    label: \"Titel 1\",\n    icon: Heading1Icon,\n    selected: (editor: Editor) => editor.isActive(\"heading\", { level: 1 }),\n    handler: (editor: Editor) => editor.commands.setHeading({ level: 1 }),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,\n  },\n  {\n    label: \"Titel 2\",\n    icon: Heading2Icon,\n    selected: (editor: Editor) => editor.isActive(\"heading\", { level: 2 }),\n    handler: (editor: Editor) => editor.commands.setHeading({ level: 2 }),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,\n  },\n  {\n    label: \"Titel 3\",\n    icon: Heading3Icon,\n    selected: (editor: Editor) => editor.isActive(\"heading\", { level: 3 }),\n    handler: (editor: Editor) => editor.commands.setHeading({ level: 3 }),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,\n  },\n  {\n    label: \"Titel 4\",\n    icon: Heading4Icon,\n    selected: (editor: Editor) => editor.isActive(\"heading\", { level: 4 }),\n    handler: (editor: Editor) => editor.commands.setHeading({ level: 4 }),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,\n  },\n  {\n    label: \"Titel 5\",\n    icon: Heading5Icon,\n    selected: (editor: Editor) => editor.isActive(\"heading\", { level: 5 }),\n    handler: (editor: Editor) => editor.commands.setHeading({ level: 5 }),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.heading,\n  },\n  {\n    label: \"Numbered List\",\n    icon: ListOrderedIcon,\n    selected: (editor: Editor) => editor.isActive(\"orderedList\"),\n    handler: (editor: Editor) => editor.commands.toggleOrderedList(),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.orderedList,\n  },\n  {\n    label: \"Bulleted List\",\n    icon: ListIcon,\n    selected: (editor: Editor) => editor.isActive(\"bulletList\"),\n    handler: (editor: Editor) => editor.commands.toggleBulletList(),\n    hidden: (extensions: EditorExtensionsConfigResult) => !extensions.bulletList,\n  },\n];\n\nexport function BlockDropdown() {\n  const { editor, extensions } = useContext(EditorContext);\n\n  const selectedBlock = blocks.find((block) => block.selected(editor));\n  const Icon = selectedBlock?.icon;\n\n  const filteredBlocks = blocks.filter((block) => !block.hidden(extensions));\n\n  if (filteredBlocks.length === 0) return null;\n\n  return (\n    <>\n      <DropdownMenu>\n        <DropdownMenuTrigger asChild>\n          <Button variant=\"outline\" size=\"sm\" className=\"flex items-center gap-8 p-2\">\n            <span className=\"flex items-center gap-2\">\n              {Icon && <Icon className=\"size-3.5\" />}\n              {selectedBlock?.label ?? \"Select a block\"}\n            </span>\n\n            <ChevronDown className=\"size-3.5\" />\n          </Button>\n        </DropdownMenuTrigger>\n\n        <DropdownMenuContent>\n          {filteredBlocks.map(({ label, icon: Icon, handler }, index) => (\n            <DropdownMenuItem\n              key={index}\n              onClick={() => handler(editor)}\n              className=\"flex items-center gap-2\"\n            >\n              {Icon && <Icon className=\"size-3.5\" />}\n              {label}\n            </DropdownMenuItem>\n          ))}\n        </DropdownMenuContent>\n      </DropdownMenu>\n\n      <Separator orientation=\"vertical\" className=\"h-8\" />\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;AAwBA,MAAM,SAAS;CACb;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,YAAY;EAC1D,UAAU,WAAmB,OAAO,SAAS,cAAc;EAC3D,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACtE,UAAU,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACrE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACtE,UAAU,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACrE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACtE,UAAU,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACrE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACtE,UAAU,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACrE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACtE,UAAU,WAAmB,OAAO,SAAS,WAAW,EAAE,OAAO,GAAG,CAAC;EACrE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,cAAc;EAC5D,UAAU,WAAmB,OAAO,SAAS,mBAAmB;EAChE,SAAS,eAA6C,CAAC,WAAW;EACnE;CACD;EACE,OAAO;EACP,MAAM;EACN,WAAW,WAAmB,OAAO,SAAS,aAAa;EAC3D,UAAU,WAAmB,OAAO,SAAS,kBAAkB;EAC/D,SAAS,eAA6C,CAAC,WAAW;EACnE;CACF;AAED,SAAgB,gBAAgB;CAC9B,MAAM,EAAE,QAAQ,eAAe,WAAW,cAAc;CAExD,MAAM,gBAAgB,OAAO,MAAM,UAAU,MAAM,SAAS,OAAO,CAAC;CACpE,MAAM,OAAO,eAAe;CAE5B,MAAM,iBAAiB,OAAO,QAAQ,UAAU,CAAC,MAAM,OAAO,WAAW,CAAC;AAE1E,KAAI,eAAe,WAAW,EAAG,QAAO;AAExC,QACE,4CACE,qBAAC,2BACC,oBAAC;EAAoB;YACnB,qBAAC;GAAO,SAAQ;GAAU,MAAK;GAAK,WAAU;cAC5C,qBAAC;IAAK,WAAU;eACb,QAAQ,oBAAC,QAAK,WAAU,aAAa,EACrC,eAAe,SAAS;KACpB,EAEP,oBAAC,eAAY,WAAU,aAAa;IAC7B;GACW,EAEtB,oBAAC,iCACE,eAAe,KAAK,EAAE,OAAO,MAAMA,QAAM,WAAW,UACnD,qBAAC;EAEC,eAAe,QAAQ,OAAO;EAC9B,WAAU;aAETA,UAAQ,oBAACA,UAAK,WAAU,aAAa,EACrC;IALI,MAMY,CACnB,GACkB,IACT,EAEf,oBAAC;EAAU,aAAY;EAAW,WAAU;GAAQ,IACnD"}

package/dist/components/editor/components/menu-fixed.client.d.mts

@@ -1,7 +0,0 @@
-import * as react_jsx_runtime222 from "react/jsx-runtime";
-
-//#region src/components/editor/components/menu-fixed.client.d.ts
-declare function EditorMenuFixed(): react_jsx_runtime222.JSX.Element;
-//#endregion
-export { EditorMenuFixed };
-//# sourceMappingURL=menu-fixed.client.d.mts.map

package/dist/components/editor/components/menu-fixed.client.d.mts.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-fixed.client.d.mts","names":[],"sources":["../../../../src/components/editor/components/menu-fixed.client.tsx"],"sourcesContent":[],"mappings":";;;iBAmBgB,eAAA,CAAA,GAAe,oBAAA,CAAA,GAAA,CAAA"}

package/dist/components/editor/components/menu-fixed.client.mjs

@@ -1,128 +0,0 @@
-import { Button } from "../../ui/button.mjs";
-import { Popover, PopoverContent, PopoverTrigger } from "../../ui/popover.mjs";
-import { Separator } from "../../ui/separator.mjs";
-import { EditorContext } from "./editor.client.mjs";
-import { ColorPicker } from "../../ui/color-picker.client.mjs";
-import { BlockDropdown } from "./block-dropdown.mjs";
-import { BaselineIcon, BoldIcon, EraserIcon, ItalicIcon, PaintBucketIcon, RedoIcon, StrikethroughIcon, UnderlineIcon, UndoIcon } from "lucide-react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useContext } from "react";
-
-//#region src/components/editor/components/menu-fixed.client.tsx
-function EditorMenuFixed() {
-	const { editor, extensions } = useContext(EditorContext);
-	return /* @__PURE__ */ jsxs("div", {
-		className: "border-input bg-muted/30 z-10 flex items-center gap-3 overflow-auto border-b p-2",
-		children: [
-			extensions.undoRedo && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-1",
-				children: [/* @__PURE__ */ jsx(Button, {
-					onClick: () => editor.commands.undo(),
-					disabled: !editor?.can().undo(),
-					type: "button",
-					"aria-label": "Undo",
-					size: "icon",
-					className: "p-2",
-					variant: "outline",
-					children: /* @__PURE__ */ jsx(UndoIcon, { className: "size-3.5" })
-				}), /* @__PURE__ */ jsx(Button, {
-					onClick: () => editor.commands.redo(),
-					disabled: !editor?.can().redo(),
-					type: "button",
-					"aria-label": "Redo",
-					size: "icon",
-					className: "p-2",
-					variant: "outline",
-					children: /* @__PURE__ */ jsx(RedoIcon, { className: "size-3.5" })
-				})]
-			}), /* @__PURE__ */ jsx(Separator, {
-				orientation: "vertical",
-				className: "h-8"
-			})] }),
-			/* @__PURE__ */ jsx(BlockDropdown, {}),
-			extensions.bold || extensions.italic || extensions.underline || extensions.strike ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-1",
-				children: [
-					extensions.bold && /* @__PURE__ */ jsx(Button, {
-						type: "button",
-						size: "icon",
-						variant: editor?.isActive("bold") ? "secondary" : "outline",
-						onClick: () => editor.chain().focus().toggleBold().run(),
-						className: "border",
-						children: /* @__PURE__ */ jsx(BoldIcon, { className: "h-3.5 w-3.5" })
-					}),
-					extensions.italic && /* @__PURE__ */ jsx(Button, {
-						type: "button",
-						size: "icon",
-						variant: editor?.isActive("italic") ? "secondary" : "outline",
-						onClick: () => editor.chain().focus().toggleItalic().run(),
-						className: "border",
-						children: /* @__PURE__ */ jsx(ItalicIcon, { className: "size-3.5" })
-					}),
-					extensions.underline && /* @__PURE__ */ jsx(Button, {
-						type: "button",
-						size: "icon",
-						variant: editor?.isActive("underline") ? "secondary" : "outline",
-						onClick: () => editor.chain().focus().toggleUnderline().run(),
-						className: "border",
-						children: /* @__PURE__ */ jsx(UnderlineIcon, { className: "size-3.5" })
-					}),
-					extensions.strike && /* @__PURE__ */ jsx(Button, {
-						type: "button",
-						size: "icon",
-						variant: editor?.isActive("strike") ? "secondary" : "outline",
-						onClick: () => editor.chain().focus().toggleStrike().run(),
-						className: "border",
-						children: /* @__PURE__ */ jsx(StrikethroughIcon, { className: "size-3.5" })
-					})
-				]
-			}), /* @__PURE__ */ jsx(Separator, {
-				orientation: "vertical",
-				className: "h-8"
-			})] }) : null,
-			extensions.color || extensions.highlight ? /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-1",
-				children: [
-					extensions.color && /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
-						asChild: true,
-						children: /* @__PURE__ */ jsx(Button, {
-							size: "icon",
-							variant: "outline",
-							children: /* @__PURE__ */ jsx(BaselineIcon, { className: "size-3.5" })
-						})
-					}), /* @__PURE__ */ jsx(PopoverContent, {
-						className: "w-fit p-0",
-						children: /* @__PURE__ */ jsx(ColorPicker, { onValueChange: (color) => editor.chain().focus().setColor(color).run() })
-					})] }),
-					extensions.highlight && /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
-						asChild: true,
-						children: /* @__PURE__ */ jsx(Button, {
-							size: "icon",
-							variant: "outline",
-							disabled: !editor?.can().setHighlight(),
-							children: /* @__PURE__ */ jsx(PaintBucketIcon, { className: "size-3.5" })
-						})
-					}), /* @__PURE__ */ jsx(PopoverContent, {
-						className: "w-fit p-0",
-						children: /* @__PURE__ */ jsx(ColorPicker, { onValueChange: (color) => editor.chain().focus().setHighlight({ color }).run() })
-					})] }),
-					/* @__PURE__ */ jsx(Button, {
-						type: "button",
-						size: "icon",
-						variant: "outline",
-						className: "border",
-						onClick: () => {
-							editor.commands.unsetColor();
-							editor.commands.unsetHighlight();
-						},
-						children: /* @__PURE__ */ jsx(EraserIcon, { className: "h-4 w-4" })
-					})
-				]
-			}) : null
-		]
-	});
-}
-
-//#endregion
-export { EditorMenuFixed };
-//# sourceMappingURL=menu-fixed.client.mjs.map

package/dist/components/editor/components/menu-fixed.client.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"menu-fixed.client.mjs","names":[],"sources":["../../../../src/components/editor/components/menu-fixed.client.tsx"],"sourcesContent":["import { Button } from \"@/components/ui/button\";\nimport { ColorPicker } from \"@/components/ui/color-picker.client\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"@/components/ui/popover\";\nimport { Separator } from \"@/components/ui/separator\";\nimport {\n  BaselineIcon,\n  BoldIcon,\n  EraserIcon,\n  ItalicIcon,\n  PaintBucketIcon,\n  RedoIcon,\n  StrikethroughIcon,\n  UnderlineIcon,\n  UndoIcon,\n} from \"lucide-react\";\nimport { useContext } from \"react\";\nimport { BlockDropdown } from \"./block-dropdown\";\nimport { EditorContext } from \"./editor.client\";\n\nexport function EditorMenuFixed() {\n  const { editor, extensions } = useContext(EditorContext);\n\n  return (\n    <div className=\"border-input bg-muted/30 z-10 flex items-center gap-3 overflow-auto border-b p-2\">\n      {extensions.undoRedo && (\n        <>\n          <div className=\"flex items-center gap-1\">\n            <Button\n              onClick={() => editor.commands.undo()}\n              disabled={!editor?.can().undo()}\n              type=\"button\"\n              aria-label=\"Undo\"\n              size=\"icon\"\n              className=\"p-2\"\n              variant=\"outline\"\n            >\n              <UndoIcon className=\"size-3.5\" />\n            </Button>\n\n            <Button\n              onClick={() => editor.commands.redo()}\n              disabled={!editor?.can().redo()}\n              type=\"button\"\n              aria-label=\"Redo\"\n              size=\"icon\"\n              className=\"p-2\"\n              variant=\"outline\"\n            >\n              <RedoIcon className=\"size-3.5\" />\n            </Button>\n          </div>\n\n          <Separator orientation=\"vertical\" className=\"h-8\" />\n        </>\n      )}\n\n      <BlockDropdown />\n\n      {extensions.bold || extensions.italic || extensions.underline || extensions.strike ? (\n        <>\n          <div className=\"flex items-center gap-1\">\n            {extensions.bold && (\n              <Button\n                type=\"button\"\n                size=\"icon\"\n                variant={editor?.isActive(\"bold\") ? \"secondary\" : \"outline\"}\n                onClick={() => editor.chain().focus().toggleBold().run()}\n                className=\"border\"\n              >\n                <BoldIcon className=\"h-3.5 w-3.5\" />\n              </Button>\n            )}\n\n            {extensions.italic && (\n              <Button\n                type=\"button\"\n                size=\"icon\"\n                variant={editor?.isActive(\"italic\") ? \"secondary\" : \"outline\"}\n                onClick={() => editor.chain().focus().toggleItalic().run()}\n                className=\"border\"\n              >\n                <ItalicIcon className=\"size-3.5\" />\n              </Button>\n            )}\n\n            {extensions.underline && (\n              <Button\n                type=\"button\"\n                size=\"icon\"\n                variant={editor?.isActive(\"underline\") ? \"secondary\" : \"outline\"}\n                onClick={() => editor.chain().focus().toggleUnderline().run()}\n                className=\"border\"\n              >\n                <UnderlineIcon className=\"size-3.5\" />\n              </Button>\n            )}\n\n            {extensions.strike && (\n              <Button\n                type=\"button\"\n                size=\"icon\"\n                variant={editor?.isActive(\"strike\") ? \"secondary\" : \"outline\"}\n                onClick={() => editor.chain().focus().toggleStrike().run()}\n                className=\"border\"\n              >\n                <StrikethroughIcon className=\"size-3.5\" />\n              </Button>\n            )}\n          </div>\n\n          <Separator orientation=\"vertical\" className=\"h-8\" />\n        </>\n      ) : null}\n\n      {extensions.color || extensions.highlight ? (\n        <div className=\"flex items-center gap-1\">\n          {extensions.color && (\n            <Popover>\n              <PopoverTrigger asChild>\n                <Button size=\"icon\" variant=\"outline\">\n                  <BaselineIcon className=\"size-3.5\" />\n                </Button>\n              </PopoverTrigger>\n\n              <PopoverContent className=\"w-fit p-0\">\n                <ColorPicker\n                  onValueChange={(color) => editor.chain().focus().setColor(color).run()}\n                />\n              </PopoverContent>\n            </Popover>\n          )}\n\n          {extensions.highlight && (\n            <Popover>\n              <PopoverTrigger asChild>\n                <Button size=\"icon\" variant=\"outline\" disabled={!editor?.can().setHighlight()}>\n                  <PaintBucketIcon className=\"size-3.5\" />\n                </Button>\n              </PopoverTrigger>\n\n              <PopoverContent className=\"w-fit p-0\">\n                <ColorPicker\n                  onValueChange={(color) => editor.chain().focus().setHighlight({ color }).run()}\n                />\n              </PopoverContent>\n            </Popover>\n          )}\n\n          <Button\n            type=\"button\"\n            size=\"icon\"\n            variant=\"outline\"\n            className=\"border\"\n            onClick={() => {\n              editor.commands.unsetColor();\n              editor.commands.unsetHighlight();\n            }}\n          >\n            <EraserIcon className=\"h-4 w-4\" />\n          </Button>\n        </div>\n      ) : null}\n    </div>\n  );\n}\n"],"mappings":"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"}