Update tiptap-php, fix non-breaking-spaces, fix custom classes

Author: medienbaecker

composer.json

@@ -11,6 +11,11 @@
 	],
 	"require": {
 		"getkirby/composer-installer": "^1.1",
-		"ueberdosis/tiptap-php": "^1.4"
+		"ueberdosis/tiptap-php": "^2.0"
+	},
+	"config": {
+		"allow-plugins": {
+			"getkirby/composer-installer": true
+		}
 	}
 }

composer.lock

@@ -38,6 +38,11 @@
 	],
 	'fieldMethods' => [
 		'tiptapText' => function ($field, array $options = []) {
+			// Add custom buttons from plugin configuration
+			if (!isset($options['customButtons'])) {
+				$options['customButtons'] = option('medienbaecker.tiptap.buttons', []);
+			}
+			
 			return convertTiptapToHtml(
 				$field->value,
 				$field->parent(),

index.css

@@ -0,0 +1,69 @@
+<?php
+
+namespace Medienbaecker\Tiptap\Extensions;
+
+use Tiptap\Core\Extension;
+use Tiptap\Utils\HTML;
+
+/**
+ * Extension for adding custom attributes to any node type
+ */
+class CustomAttributes extends Extension
+{
+    public static $name = 'customAttributes';
+
+    public function addOptions()
+    {
+        return [
+            'customButtons' => [], // Custom button configurations from field options
+        ];
+    }
+
+    public function addGlobalAttributes()
+    {
+        $globalAttributes = [];
+        
+        // Process each custom button configuration
+        foreach ($this->options['customButtons'] as $buttonName => $buttonConfig) {
+            if (!isset($buttonConfig['attributes']) || !isset($buttonConfig['nodes'])) {
+                continue;
+            }
+
+            // Get the node types this button applies to
+            $nodeTypes = $buttonConfig['nodes'];
+            
+            // Create attribute definitions for each attribute in the button
+            $attributeDefinitions = [];
+            foreach ($buttonConfig['attributes'] as $attributeName => $defaultValue) {
+                $attributeDefinitions[$attributeName] = [
+                    'default' => null,
+                    'parseHTML' => function ($DOMNode) use ($attributeName) {
+                        return $DOMNode->getAttribute($attributeName) ?: null;
+                    },
+                    'renderHTML' => function ($attributes) use ($attributeName) {
+                        if (!isset($attributes->{$attributeName}) || $attributes->{$attributeName} === null) {
+                            return null;
+                        }
+                        
+                        // Handle potential object serialization issues
+                        $value = $attributes->{$attributeName};
+                        if (is_object($value) || is_array($value)) {
+                            // Skip invalid values to prevent [object Object] issues
+                            return null;
+                        }
+                        
+                        return [$attributeName => $value];
+                    },
+                ];
+            }
+
+            // Add global attributes for these node types
+            $globalAttributes[] = [
+                'types' => $nodeTypes,
+                'attributes' => $attributeDefinitions,
+            ];
+        }
+
+        return $globalAttributes;
+    }
+}

index.js

@@ -5,7 +5,7 @@
 use Tiptap\Editor;
 use Medienbaecker\Tiptap\Nodes\KirbyTagNode;
 use Medienbaecker\Tiptap\Nodes\ConditionalTextNode;
-use Medienbaecker\Tiptap\Nodes\ParagraphWithClass;
+use Medienbaecker\Tiptap\Extensions\CustomAttributes;
 
 /**
  * Converts Tiptap JSON content to HTML
@@ -25,7 +25,8 @@ public static function convert($json, $parent, array $options = [])
 		// Set default options
 		$options = array_merge([
 			'offsetHeadings' => 0,
-			'allowHtml' => false
+			'allowHtml' => false,
+			'customButtons' => []
 		], $options);
 
 		// Handle invalid input
@@ -75,16 +76,20 @@ public static function convert($json, $parent, array $options = [])
 
 		// Convert to HTML
 		try {
+			$extensions = [
+				new \Tiptap\Extensions\StarterKit([
+					'text' => false, // Disable default text node
+				]),
+				new ConditionalTextNode($options['allowHtml']), // Use our custom text handler
+				new KirbyTagNode()
+			];
+
+			$extensions[] = new CustomAttributes([
+				'customButtons' => $options['customButtons']
+			]);
+
 			$html = (new Editor([
-				'extensions' => [
-					new \Tiptap\Extensions\StarterKit([
-						'text' => false, // Disable default text node
-						'paragraph' => false, // Disable default paragraph node
-					]),
-					new ConditionalTextNode($options['allowHtml']), // Use our custom text handler
-					new KirbyTagNode(),
-					new ParagraphWithClass()
-				]
+				'extensions' => $extensions
 			]))->setContent($json)->getHTML();
 
 			// Handle Smartypants

index.php

@@ -21,7 +21,7 @@
 });
 
 /**
- * Legacy function wrapper for Tiptap to HTML conversion
+ * Convert Tiptap JSON to HTML
  * @param mixed $json Tiptap JSON content
  * @param object $parent Parent page/model for KirbyTag context
  * @param array $options Conversion options

lib/Extensions/CustomAttributes.php

@@ -256,7 +256,7 @@ p.is-editor-empty:first-child::before {
 }
 
 .Tiptap-invisible-character--non-breaking-space::before {
-	content: ' ';
+	content: ' ';
 	position: absolute;
 	height: 1px;
 	background-color: currentColor;

lib/HtmlConverter.php

@@ -82,9 +82,7 @@ export default {
 					return { type: '|' }
 				}
 
-				// Handle object-style buttons (headings, paragraphClass, etc.)
 				if (typeof button === 'object') {
-					// Legacy headings format
 					if (button.headings) {
 						return {
 							type: 'headings',