Choose menu anchors, link targets in plugin settings and existing post terms

A menu entry picks its anchor from the linked page, link settings of plugins and own menu
links get page and PDF choice next to the address, and the post settings offer existing
categories and tags to click.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

templates/admin/content-results.html.twig

@@ -66,11 +66,11 @@
                             </div>
                             <div>
                                 <label for="categories-{{ page.id }}">Kategorien</label>
-                                <input id="categories-{{ page.id }}" name="categories" value="{{ page.terms.category }}" placeholder="Projekte, Referenzen">
+                                <input id="categories-{{ page.id }}" name="categories" value="{{ page.terms.category }}" placeholder="Projekte, Referenzen" data-term-input="{{ termNames.category|default([])|json_encode|e('html_attr') }}">
                             </div>
                             <div>
                                 <label for="tags-{{ page.id }}">Schlagwörter</label>
-                                <input id="tags-{{ page.id }}" name="tags" value="{{ page.terms.tag }}" placeholder="WordPress, Migration">
+                                <input id="tags-{{ page.id }}" name="tags" value="{{ page.terms.tag }}" placeholder="WordPress, Migration" data-term-input="{{ termNames.tag|default([])|json_encode|e('html_attr') }}">
                                 <p class="field-help">Mehrere durch Komma trennen. Unbekannte Namen werden angelegt.</p>
                             </div>
                             <div>

templates/admin/menu-entry.html.twig

@@ -10,7 +10,7 @@
                 {% include 'admin/content-picker.html.twig' with {id: 'menu-target-' ~ n, name: 'items[' ~ n ~ '][pageId]', label: 'Verknüpfter Inhalt', selected: row.page} %}
                 <label for="menu-anchor-{{ n }}">Sprungziel (optional)</label><input id="menu-anchor-{{ n }}" data-key="anchor" name="items[{{ n }}][anchor]" maxlength="65" value="{{ row.anchor }}" placeholder="kontakt">
             {% else %}
-                <label for="menu-url-{{ n }}">Adresse</label><input id="menu-url-{{ n }}" data-key="url" name="items[{{ n }}][url]" maxlength="2048" required value="{{ row.url }}" placeholder="https://… oder /kontakt">
+                <label for="menu-url-{{ n }}">Adresse</label><div class="link-field" data-link-field><input id="menu-url-{{ n }}" data-key="url" data-link-input name="items[{{ n }}][url]" maxlength="2048" required value="{{ row.url }}" placeholder="https://… oder /kontakt"></div>
             {% endif %}
             <label class="check-label" for="menu-newTab-{{ n }}"><input id="menu-newTab-{{ n }}" type="checkbox" data-key="newTab" name="items[{{ n }}][newTab]" value="1"{{ row.newTab|default(false) ? ' checked' : '' }}> In neuem Tab öffnen</label>
             <div class="menu-icon-fields"><div><label for="menu-icon-{{ n }}">Icon</label><select id="menu-icon-{{ n }}" data-key="icon" name="items[{{ n }}][icon]"><option value="">Kein Icon</option>{% for icon in menuIcons %}<option value="{{ icon }}"{{ row.icon|default('') == icon ? ' selected' : '' }}>{{ icon }}</option>{% endfor %}</select></div><div><label for="menu-iconPosition-{{ n }}">Icon-Position</label><select id="menu-iconPosition-{{ n }}" data-key="iconPosition" name="items[{{ n }}][iconPosition]"><option value="before"{{ row.iconPosition|default('before') == 'before' ? ' selected' : '' }}>Vor dem Text</option><option value="after"{{ row.iconPosition|default('before') == 'after' ? ' selected' : '' }}>Nach dem Text</option></select></div></div>

templates/admin/menus.html.twig

@@ -3,6 +3,7 @@
 {% block title %}Menüs{% endblock %}
 {% block heading %}Menüs{% endblock %}
 {% block lead %}Inhalte suchen und hinzufügen. Rechts bestimmst du Beschriftung, Reihenfolge und Unterpunkte.{% endblock %}
+{% block styles %}<link rel="stylesheet" href="/assets/media-dialog.css?v={{ kant_version() }}">{% endblock %}
 {% block scripts %}<script type="module" src="/assets/menu-editor.js?v={{ kant_version() }}"></script>{% endblock %}
 {% block content %}
 {% include 'admin/menu-icons.html.twig' %}
@@ -16,7 +17,7 @@
         </section>
         <details class="card"><summary>Eigener Link</summary><div class="card-body">
             <label for="link-label">Beschriftung</label><input id="link-label" maxlength="80" placeholder="Kontakt">
-            <label for="link-url">Adresse</label><input id="link-url" maxlength="2048" placeholder="https://… oder /kontakt">
+            <label for="link-url">Adresse</label><div class="link-field" data-link-field><input id="link-url" maxlength="2048" placeholder="https://… oder /kontakt" data-link-input></div>
             <p class="field-help">Auch mailto: und tel: sind möglich.</p>
             <label class="check-label" for="link-new-tab"><input id="link-new-tab" type="checkbox"> In neuem Tab öffnen</label>
             <button type="button" class="secondary" id="menu-add-url">Link hinzufügen</button>

templates/admin/pages.html.twig

@@ -5,7 +5,7 @@
 {% block title %}{{ plural }}{% endblock %}
 {% block heading %}{{ plural }}{% endblock %}
 {% block styles %}<link rel="stylesheet" href="/assets/media-dialog.css?v={{ kant_version() }}">{% endblock %}
-{% block scripts %}<script type="module" src="/assets/live-search.js?v={{ kant_version() }}"></script><script type="module" src="/assets/media-field.js?v={{ kant_version() }}"></script>{% endblock %}
+{% block scripts %}<script type="module" src="/assets/live-search.js?v={{ kant_version() }}"></script><script type="module" src="/assets/media-field.js?v={{ kant_version() }}"></script><script type="module" src="/assets/term-chips.js?v={{ kant_version() }}"></script>{% endblock %}
 {% block lead %}{{ plural }} suchen, bearbeiten und veröffentlichen. Entwürfe bleiben bis zur Veröffentlichung privat.{% endblock %}
 {% block content %}
 

templates/admin/plugins.html.twig

@@ -3,7 +3,7 @@
 {% block title %}Plugins{% endblock %}
 {% block heading %}Plugins{% endblock %}
 {% block styles %}<link rel="stylesheet" href="/assets/media-dialog.css?v={{ kant_version() }}">{% endblock %}
-{% block scripts %}<script type="module" src="/assets/media-field.js?v={{ kant_version() }}"></script>{% endblock %}
+{% block scripts %}<script type="module" src="/assets/media-field.js?v={{ kant_version() }}"></script><script type="module" src="/assets/link-field.js?v={{ kant_version() }}"></script>{% endblock %}
 {% block lead %}Erweiterungen bringen eigene Bausteine, Vorlagen und Adressen mit. Sie liegen als Ordner unter <code>plugins/</code>; hier schaltest du sie ein und aus und stellst sie ein. Ein ausgeschaltetes Plugin lässt seine Bausteine in den Seiten stehen, zeigt sie aber nicht mehr.{% endblock %}
 
 {# Ein Feld aus dem Schema eines Plugins - dieselben sieben Arten wie im Editor. #}
@@ -19,6 +19,7 @@
     <label for="{{ id }}">{{ schema.label }}</label>
     {% if schema.kind == 'textarea' %}<textarea id="{{ id }}" name="{{ name }}" rows="3" maxlength="{{ schema.maxLength }}">{{ value }}</textarea>
     {% elseif schema.kind == 'select' %}<select id="{{ id }}" name="{{ name }}">{% for wert, text in schema.choices %}<option value="{{ wert }}"{{ value == wert ? ' selected' : '' }}>{{ text }}</option>{% endfor %}</select>
+    {% elseif schema.kind == 'url' %}<div class="link-field" data-link-field><input id="{{ id }}" name="{{ name }}" value="{{ value }}" maxlength="{{ schema.maxLength }}" placeholder="/kontakt oder https://…" data-link-input></div>
     {% elseif schema.kind == 'number' %}<input id="{{ id }}" name="{{ name }}" type="number" step="any" min="{{ schema.min }}" max="{{ schema.max }}" value="{{ value }}">
     {% else %}<input id="{{ id }}" name="{{ name }}" value="{{ value }}" maxlength="{{ schema.maxLength }}">{% endif %}
     {% if schema.help %}<p class="field-help">{{ schema.help }}</p>{% endif %}