@flexiui/svelte-rich-text 0.0.62 → 0.0.64

package/dist/RichText.svelte

@@ -91,9 +91,10 @@
       docTextColor?: string;
       buttonStyle?: "accent-soft" | "accent-solid";
     };
-    contentWrapperAs?: T;
-    inlineNodeMode?: boolean;
-  }
+    contentWrapperAs?: T;
+    inlineNodeMode?: boolean;
+    trailingNode?: boolean;
+  }
 
   type ToolbarButton =
     | string
@@ -147,9 +148,10 @@
       onPaste: () => {},
     },
     config,
-    contentWrapperAs = "div" as T,
-    inlineNodeMode = false,
-  }: Props = $props();
+    contentWrapperAs = "div" as T,
+    inlineNodeMode = false,
+    trailingNode = true,
+  }: Props = $props();
 
   let editor = $state() as Readable<Editor>;
 
@@ -276,9 +278,10 @@
     "rgb(255, 102, 142)",
   ];
 
-  const extensions = getRichTextExtensions({
-    editable: true,
-    customExtensions: [
+  const extensions = getRichTextExtensions({
+    editable: true,
+    trailingNode,
+    customExtensions: [
       Mathematics.configure({
         inlineOptions: {
           onClick: (node, pos) => {
@@ -712,7 +715,7 @@
     </header>
   {/if}
 
-  <EditorContent as={contentWrapperAs} editor={$editor} class="fl-rich-text-content a" data-fl-editable="true" />
+  <EditorContent as={contentWrapperAs} editor={$editor} class="fl-rich-text-content" data-fl-editable="true" />
 
   <!-- Warning message for node limit -->
   {#if showLimitWarning && nodesLimit}

package/dist/extensions/MediaGrid/MediaGrid.js

@@ -56,8 +56,7 @@ export const MediaGridExtension = Node.create({
             insertGrid: (options) => ({ tr, state, dispatch }) => {
                 const { schema } = state;
                 const cols = options?.cols || 2;
-                const items = Array.from({ length: cols }, () => schema.nodes.gridItem.create() // 👈 sin contenido
-                );
+                const items = Array.from({ length: cols }, () => schema.nodes.gridItem.create());
                 const grid = this.type.create({ cols }, items);
                 if (dispatch) {
                     tr.replaceSelectionWith(grid).scrollIntoView();
@@ -84,6 +83,31 @@ export const MediaGridExtension = Node.create({
             },
         };
     },
+    addKeyboardShortcuts() {
+        return {
+            Enter: () => {
+                const { state } = this.editor;
+                const { $from } = state.selection;
+                let gridPos = null;
+                let gridNode = null;
+                for (let depth = $from.depth; depth > 0; depth--) {
+                    if ($from.node(depth).type === this.type) {
+                        gridPos = $from.before(depth);
+                        gridNode = $from.node(depth);
+                        break;
+                    }
+                }
+                if (gridPos === null || !gridNode)
+                    return false;
+                const insertPos = gridPos + gridNode.nodeSize;
+                this.editor.chain()
+                    .insertContentAt(insertPos, { type: 'paragraph' })
+                    .setTextSelection(insertPos + 1)
+                    .run();
+                return true;
+            },
+        };
+    },
     addNodeView() {
         return SvelteNodeViewRenderer(MediaGridComponent);
     },

package/dist/getExtensions.d.ts

@@ -7,5 +7,6 @@ declare module '@tiptap/core' {
 }
 export declare function getRichTextExtensions(options?: {
     editable?: boolean;
+    trailingNode?: boolean;
     customExtensions?: any[];
 }): any[];

package/dist/getExtensions.js

@@ -28,7 +28,7 @@ const DocHeading = Heading.extend({
     },
 }).configure({ levels: [1] });
 export function getRichTextExtensions(options) {
-    const { editable = false, customExtensions = [] } = options ?? {};
+    const { editable = false, trailingNode = true, customExtensions = [] } = options ?? {};
     return [
         DocHeading,
         Heading.configure({ levels: [2, 3, 4, 5, 6] }),
@@ -37,7 +37,7 @@ export function getRichTextExtensions(options) {
         // fontSize: false
         }),
         StarterKit.configure({
-            trailingNode: false,
+            ...(!trailingNode && { trailingNode: false }),
             link: false,
             bulletList: false,
             listItem: false,

package/dist/styles.css

@@ -127,7 +127,8 @@
     display: flex;
     gap: 5px;
     position: relative;
-    z-index: 9;
+    z-index: var(--fl-toolbar-sticky-position, 10);
+
 
     .fl-bubble-menu-mark-button {
       border-radius: 9px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flexiui/svelte-rich-text",
-  "version": "0.0.62",
+  "version": "0.0.64",
   "description": "A lightweight and flexible rich text editor component for Svelte",
   "keywords": [
     "svelte",