alinea 2.0.0-preview.11 → 2.0.0-preview.13

package/dist/field/richtext/RichTextField.view.js

@@ -1,10 +1,10 @@
+import {
+  Placeholder
+} from "../../chunks/chunk-AC5ATYI3.js";
 import {
   EditorContent,
   useEditor
 } from "../../chunks/chunk-NP4M2257.js";
-import {
-  Placeholder
-} from "../../chunks/chunk-AC5ATYI3.js";
 import "../../chunks/chunk-A3XXZBOQ.js";
 import {
   useAtomValueRaw,
@@ -68,12 +68,12 @@ import {
 
 // src/field/richtext/RichTextField.module.css
 var RichTextField_default = {
-  "RichTextFieldView-unsupportedBlock": "alinea-RichTextFieldView-unsupportedBlock",
-  "RichTextFieldViewUnsupportedBlock": "alinea-RichTextFieldView-unsupportedBlock",
-  "RichTextFieldView": "alinea-RichTextFieldView",
+  "RichTextFieldCompactView": "alinea-RichTextFieldCompactView",
   "RichTextFieldView-empty": "alinea-RichTextFieldView-empty",
   "RichTextFieldViewEmpty": "alinea-RichTextFieldView-empty",
-  "RichTextFieldCompactView": "alinea-RichTextFieldCompactView"
+  "RichTextFieldView": "alinea-RichTextFieldView",
+  "RichTextFieldView-unsupportedBlock": "alinea-RichTextFieldView-unsupportedBlock",
+  "RichTextFieldViewUnsupportedBlock": "alinea-RichTextFieldView-unsupportedBlock"
 };
 
 // src/field/richtext/RichTextField.view.tsx
@@ -362,6 +362,11 @@ function RichTextBlockPortals({
     if (typeof position !== "number") return;
     editor.commands.deleteRange({ from: position, to: position + 1 });
   }
+  function select(host) {
+    const position = host.getPos();
+    if (typeof position !== "number") return;
+    editor.commands.setNodeSelection(position);
+  }
   function duplicate(host, part) {
     const position = host.getPos();
     if (typeof position !== "number") return;
@@ -391,7 +396,8 @@ function RichTextBlockPortals({
             type,
             readOnly,
             onDelete: () => remove(host),
-            onDuplicate: () => duplicate(host, part)
+            onDuplicate: () => duplicate(host, part),
+            onDragStart: () => select(host)
           }
         )
       ] }),

package/dist/field/richtext/RichTextInsertMenu.js

@@ -29,18 +29,15 @@ import {
 import "../../chunks/chunk-CQ52GEHY.js";
 
 // src/field/richtext/RichTextInsertMenu.tsx
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger
-} from "alinea/components";
+import { Popover, PopoverContent, PopoverTrigger } from "alinea/components";
 import { createId } from "alinea/core/Id";
-import { getType } from "alinea/core/Internal";
 import { BlockNode, Node } from "alinea/core/TextDoc";
 import { Type } from "alinea/core/Type";
 import { entries } from "alinea/core/util/Objects";
 import { IcRoundAddCircle } from "alinea/dashboard/icons";
+import {
+  ListFieldTypeCommand
+} from "alinea/field/list/ListField.view";
 
 // node_modules/@tiptap/extension-bubble-menu/dist/index.js
 function combineDOMRects(rect1, rect2) {
@@ -742,11 +739,14 @@ var FloatingMenu = React.forwardRef(({ pluginKey, editor, updateDelay, resizeDel
   return createPortal(children, menuEl.current);
 });
 
+// src/field/richtext/RichTextInsertMenu.tsx
+import { useMemo, useState as useState2 } from "react";
+
 // src/field/richtext/RichTextInsertMenu.module.css
 var RichTextInsertMenu_default = {
-  "RichTextInsertMenu": "alinea-RichTextInsertMenu",
-  "RichTextInsertMenu-label": "alinea-RichTextInsertMenu-label",
-  "RichTextInsertMenuLabel": "alinea-RichTextInsertMenu-label"
+  "RichTextInsertMenu-popover": "alinea-RichTextInsertMenu-popover",
+  "RichTextInsertMenuPopover": "alinea-RichTextInsertMenu-popover",
+  "RichTextInsertMenu": "alinea-RichTextInsertMenu"
 };
 
 // src/field/richtext/RichTextInsertMenu.tsx
@@ -757,6 +757,15 @@ function RichTextInsertMenu({
   schema,
   onInsert
 }) {
+  const [open, setOpen] = useState2(false);
+  const items = useMemo(
+    () => entries(schema).map(([id, type]) => ({
+      id,
+      label: Type.label(type),
+      type
+    })),
+    [schema]
+  );
   return /* @__PURE__ */ jsx(
     FloatingMenu,
     {
@@ -766,24 +775,31 @@ function RichTextInsertMenu({
         const { selection } = state;
         return editor2.isFocused && selection.empty && selection.$from.depth === 1 && selection.$from.parent.isTextblock && selection.$from.parent.content.size === 0;
       },
-      children: /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger, { variant: "ghost", icon: IcRoundAddCircle, children: "Insert block" }),
-        /* @__PURE__ */ jsx(DropdownMenuContent, { "aria-label": "Insert block", children: entries(schema).map(([name, type]) => /* @__PURE__ */ jsx(
-          DropdownMenuItem,
+      children: /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+        /* @__PURE__ */ jsx(PopoverTrigger, { variant: "ghost", icon: IcRoundAddCircle, children: "Insert block" }),
+        /* @__PURE__ */ jsx(
+          PopoverContent,
           {
-            icon: getType(type).icon ?? IcRoundAddCircle,
-            textValue: Type.label(type),
-            onSelect: () => {
-              onInsert({
-                [Node.type]: name,
-                [BlockNode.id]: createId(),
-                ...Type.initialValue(type)
-              });
-            },
-            children: /* @__PURE__ */ jsx("span", { className: styles.RichTextInsertMenu.label(), children: Type.label(type) })
-          },
-          name
-        )) })
+            "aria-label": "Insert block",
+            align: "start",
+            className: styles.RichTextInsertMenu.popover(),
+            children: /* @__PURE__ */ jsx(
+              ListFieldTypeCommand,
+              {
+                items,
+                label: "Insert block",
+                onSelect: (item) => {
+                  setOpen(false);
+                  onInsert({
+                    [Node.type]: item.id,
+                    [BlockNode.id]: createId(),
+                    ...Type.initialValue(item.type)
+                  });
+                }
+              }
+            )
+          }
+        )
       ] })
     }
   );

package/dist/field/views.js

@@ -19,6 +19,7 @@ import { ListFieldView } from "./list/ListField.view.js";
 import {
   MetadataDetailsView,
   MetadataFieldView,
+  MetadataPreviewsView,
   MetadataTimestampFieldView,
   MetadataUserFieldView
 } from "./metadata/MetadataField.view.js";
@@ -49,6 +50,7 @@ var views = {
   [viewKeys.NumberInput]: NumberFieldView,
   [viewKeys.MetadataInput]: MetadataFieldView,
   [viewKeys.MetadataDetailsView]: MetadataDetailsView,
+  [viewKeys.MetadataPreviewsView]: MetadataPreviewsView,
   [viewKeys.MetadataTimestampInput]: MetadataTimestampFieldView,
   [viewKeys.MetadataUserInput]: MetadataUserFieldView,
   [viewKeys.PathInput]: PathFieldView,