@meta-1/editor 1.0.5 → 1.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meta-1/editor",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "keywords": [
     "meta",
     "tailwindcss",

package/src/components/tiptap-node/image-node/image-node-view.css

@@ -1,5 +1,9 @@
 @reference "@meta-1/design/theme.css";
 
+.tiptap.ProseMirror[data-dragging="true"] .ProseMirror-selectednode .tiptap-image .tiptap-image-container {
+  outline: none !important;
+}
+
 .tiptap.ProseMirror .ProseMirror-selectednode .tiptap-image .tiptap-image-container {
   @apply rounded-sm;
   outline: 0.125rem solid transparent;

package/src/components/tiptap-node/image-node/image-node.css

@@ -13,6 +13,10 @@
   @apply outline-indigo-500;
 }
 
+.tiptap.ProseMirror[data-dragging="true"] img:not([data-type="emoji"] img).ProseMirror-selectednode {
+  outline: none !important;
+}
+
 /* Thread image handling */
 .tiptap.ProseMirror .tiptap-thread:has(> img) {
   @apply my-8;

package/src/components/tiptap-node/list-node/list-node.css

@@ -94,6 +94,9 @@
   @apply dark:border-gray-700 dark:bg-gray-800;
   @apply transition-[background-color,border-color] duration-[80ms] ease-out;
 }
+.dark .tiptap.ProseMirror ul[data-type="taskList"] li label span {
+  @apply border-gray-700 bg-gray-800;
+}
 
 .tiptap.ProseMirror ul[data-type="taskList"] li label span::before {
   @apply absolute;
@@ -112,11 +115,17 @@
     url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22currentColor%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20clip-rule%3D%22evenodd%22%20d%3D%22M21.4142%204.58579C22.1953%205.36683%2022.1953%206.63317%2021.4142%207.41421L10.4142%2018.4142C9.63317%2019.1953%208.36684%2019.1953%207.58579%2018.4142L2.58579%2013.4142C1.80474%2012.6332%201.80474%2011.3668%202.58579%2010.5858C3.36683%209.80474%204.63317%209.80474%205.41421%2010.5858L9%2014.1716L18.5858%204.58579C19.3668%203.80474%2020.6332%203.80474%2021.4142%204.58579Z%22%20fill%3D%22currentColor%22%2F%3E%3C%2Fsvg%3E")
     center / contain no-repeat;
 }
+.dark .tiptap.ProseMirror ul[data-type="taskList"] li label span::before {
+  @apply bg-black;
+}
 
 .tiptap.ProseMirror ul[data-type="taskList"] li label input[type="checkbox"]:checked + span {
   @apply bg-gray-900 border-gray-900;
   @apply dark:bg-gray-100 dark:border-gray-100;
 }
+.dark .tiptap.ProseMirror ul[data-type="taskList"] li label input[type="checkbox"]:checked + span {
+  @apply bg-gray-100 border-gray-100;
+}
 
 .tiptap.ProseMirror ul[data-type="taskList"] li label input[type="checkbox"]:checked + span::before {
   opacity: 1;

package/src/components/tiptap-node/table-node/styles/table-node.css

@@ -16,6 +16,10 @@
   transition: opacity 0.2s ease-in-out;
   z-index: 1;
 }
+.dark .tiptap [data-content-type="table"] .tableWrapper table::before,
+.dark .tiptap [data-content-type="table"] .tableWrapper table::after {
+  @apply bg-gray-800;
+}
 
 .tiptap [data-content-type="table"] .tableWrapper table::before {
   left: -4px;
@@ -41,6 +45,10 @@
 .tiptap td {
   @apply border border-gray-300 dark:border-gray-700 p-2;
 }
+.dark .tiptap th,
+.dark .tiptap td {
+  @apply border-gray-700;
+}
 .tiptap.ProseMirror .table-container td > * {
   @apply !mt-4;
 }
@@ -51,6 +59,9 @@
 .tiptap table th {
   @apply bg-gray-100 dark:bg-gray-800 font-bold text-left;
 }
+.dark .tiptap table th {
+  @apply bg-gray-800;
+}
 
 .ProseMirror .column-resize-handle {
   @apply absolute right-0 w-0.5 bg-indigo-500 cursor-col-resize z-[1] pointer-events-auto transition-colors duration-150 delay-50;

package/src/components/tiptap-ui/drag-context-menu/drag-context-menu.tsx

@@ -316,11 +316,15 @@ export const DragContextMenu: React.FC<DragContextMenuProps> = ({
   const onElementDragStart = useCallback(() => {
     if (!editor) return;
     editor.commands.setIsDragging(true);
+    // Add data attribute to hide selected outline in drag ghost
+    editor.view.dom.setAttribute("data-dragging", "true");
   }, [editor]);
 
   const onElementDragEnd = useCallback(() => {
     if (!editor) return;
     editor.commands.setIsDragging(false);
+    // Remove data attribute
+    editor.view.dom.removeAttribute("data-dragging");
 
     setTimeout(() => {
       editor.view.dom.blur();