@ecsplico/editor 3.1.0 → 3.2.0

package/dist/features/composites/components/CompositeChrome.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompositeChrome.js","names":["_unref","_openBlock","_createBlock","_Teleport","_createElementVNode","_createElementBlock","_Fragment","_renderList","_withCtx","_createVNode","CompositeDetails","_normalizeClass","_normalizeStyle","_withKeys","_withModifiers","_createCommentVNode","_createTextVNode","_toDisplayString","CompositeStatusMenu","CompositeTagsEditor"],"sources":["../../../../src/features/composites/components/CompositeChrome.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Editor } from '@tiptap/vue-3'\nimport { computed, shallowRef, watch } from 'vue'\nimport { startBlockDrag } from '../../../core'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { useStoreRef } from '../../../vue/store-ref'\nimport { useEditorSettings } from '../../../vue/settings'\nimport { compositeSectionOf } from '../anchors'\nimport { derivedChromeOf } from '../derived-chrome'\nimport { rowStatus } from '../meta-display'\nimport { compositeOfRow, type CompositeRow, setCompositeTags } from '../rows'\nimport { useCompositeAnchors } from '../use-composite-anchors'\nimport { useCompositeRows } from '../use-composite-rows'\nimport CompositeDetails from './CompositeDetails.vue'\nimport CompositeStatusMenu from './CompositeStatusMenu.vue'\nimport CompositeTagsEditor from './CompositeTagsEditor.vue'\n\n/**\n * Chrome of every composite, laid over the editor (mounted by the composites feature): on the title line the status\n * chip and one chip per tag (with a `+` chip to add tags), and on the front the kind icon. The icon is a button that\n * opens the details popover (kind with a confirmation before it changes, the kind's fields and the summary;\n * `CompositeDetails`) and, in an editable editor, the composite's drag handle: dragging it moves the composite\n * (`startBlockDrag`). A kind with `chrome.tags: false` shows no tag chips and no `+` chip. With `blocks.kindIcon: 'hover'` it shows only while the composite is hovered, its popover is\n * open or the icon has keyboard focus. Chips and popover also render in read-only editors, without edit affordances.\n * The node view's own description and tags rows are hidden by CSS; this overlay shows and edits them.\n */\nconst props = defineProps<{ editor: Editor }>()\n\nconst { Icon: UIcon, Popover: UPopover } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst { rows } = useCompositeRows(() => props.editor)\nconst { host, anchors, frame } = useCompositeAnchors(() => props.editor, rows)\n\n// `isEditable` is not reactive: follow it on every transaction (`EditorSurface` dispatches one after `setEditable`).\nconst editable = shallowRef(false)\nwatch(() => props.editor, (instance, _previous, onCleanup) => {\n  editable.value = !instance.isDestroyed && instance.isEditable\n  const sync = () => {\n    editable.value = !instance.isDestroyed && instance.isEditable\n  }\n  instance.on('transaction', sync)\n  onCleanup(() => instance.off('transaction', sync))\n}, { immediate: true })\n\nconst { settings } = useEditorSettings()\nconst iconOnHover = computed(() => settings.value.blocks.kindIcon === 'hover')\n\n// Hover state of `kindIcon: 'hover'`: the keys of the rows whose composite is under the pointer (that one and every\n// composite around it), plus the row whose chips the pointer is on (they sit outside the editor's DOM).\nconst hoveredKeys = shallowRef<ReadonlySet<string>>(new Set())\nconst chipsHoveredKey = shallowRef<string | null>(null)\nlet hoveredSection: Element | null = null\n\nfunction onEditorMouseover(event: MouseEvent) {\n  const section = event.target instanceof Element ? event.target.closest('.composite') : null\n  if (section === hoveredSection) return\n  hoveredSection = section\n  const chain = new Set<Element>()\n  for (let el = section; el; el = el.parentElement?.closest('.composite') ?? null) chain.add(el)\n  const { view, state } = props.editor\n  hoveredKeys.value = new Set(rows.value.filter((row) => {\n    const found = compositeOfRow(state.doc, row)\n    const dom = found ? view.nodeDOM(found.pos) : null\n    const section = dom instanceof Element ? compositeSectionOf(dom) : null\n    return section !== null && chain.has(section)\n  }).map(row => row.key))\n}\n\nfunction onEditorMouseleave() {\n  hoveredSection = null\n  hoveredKeys.value = new Set()\n}\n\nwatch([() => props.editor, iconOnHover], ([instance, hover], _previous, onCleanup) => {\n  onEditorMouseleave()\n  if (!hover || instance.isDestroyed) return\n  const { dom } = instance.view\n  dom.addEventListener('mouseover', onEditorMouseover)\n  dom.addEventListener('mouseleave', onEditorMouseleave)\n  onCleanup(() => {\n    dom.removeEventListener('mouseover', onEditorMouseover)\n    dom.removeEventListener('mouseleave', onEditorMouseleave)\n  })\n}, { immediate: true })\n\nfunction onIconDragStart(event: DragEvent, row: CompositeRow) {\n  const found = compositeOfRow(props.editor.state.doc, row)\n  if (!found || !startBlockDrag(props.editor, event, found.pos)) event.preventDefault()\n}\n\n/** Chips start right after the title's last character and run on to the editor's right edge. */\nconst ROW_HEIGHT = 24\n\nconst expanded = useStoreRef(() => props.editor.storage.composite.expanded)\n\nconst placed = computed(() => {\n  // End of the collapsed derived Baustein the rows being walked sit in: its clipped content shows no chrome.\n  let hiddenUntil = -1\n  return rows.value.flatMap((row) => {\n    if (row.pos < hiddenUntil) return []\n    const derived = derivedChromeOf(props.editor, row)\n    const open = !derived || !row.id || expanded.value.has(row.id)\n    if (!open) hiddenUntil = row.end\n    const anchor = anchors.value.get(row.key)\n    if (!anchor) return []\n    // An empty title shows a placeholder the anchor cannot measure: keep clear of it.\n    const left = anchor.lineEnd + (anchor.titleEmpty ? 116 : 12)\n    return [{\n      row,\n      anchor,\n      left,\n      top: anchor.lastCenter - ROW_HEIGHT / 2,\n      width: Math.max((frame.value?.right ?? anchor.right) - left, 120),\n      status: rowStatus(row, t),\n      derived: derived && { stale: derived.stale, open, toggleable: !!row.id },\n    }]\n  })\n})\n\nfunction toggleExpanded(row: CompositeRow) {\n  if (row.id) props.editor.commands.toggleCompositeExpanded(row.id)\n}\n\nfunction removeTag(row: CompositeRow, tag: string) {\n  setCompositeTags(props.editor, row, row.tags.filter(candidate => candidate !== tag))\n}\n\nconst chip = 'inline-flex h-5 shrink-0 items-center gap-1 rounded-sm px-1.5 text-xs leading-none whitespace-nowrap text-[var(--sk-muted)]'\nconst chipButton = `${chip} transition-colors duration-150 hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-[var(--sk-primary)]`\n\n/** Scale and fade in from the icon (`transform-origin` is Reka's), a bit longer than Nuxt UI's default; `composites.css` defines the keyframes and the reduced-motion override. */\nconst detailsPopoverUi = {\n  content: 'composite-popover data-[state=open]:animate-[composite-pop-in_160ms_var(--ease-out)] data-[state=closed]:animate-[composite-pop-out_120ms_var(--ease-out)]',\n}\n</script>\n\n<template>\n  <Teleport v-if=\"host\" :to=\"host\">\n    <div class=\"absolute left-0 top-0 h-0 w-0\">\n      <template v-for=\"item in placed\" :key=\"item.row.key\">\n        <UPopover\n          v-if=\"item.anchor.toggleSize\"\n          :content=\"{ side: 'bottom', align: 'start', sideOffset: 4 }\"\n          :ui=\"detailsPopoverUi\"\n        >\n          <!-- A span, not a `button`: Firefox does not start drags from buttons. -->\n          <span\n            role=\"button\"\n            tabindex=\"0\"\n            :draggable=\"editable\"\n            :class=\"[\n              'absolute z-10 flex items-center justify-center rounded-sm bg-[var(--sk-bg)] text-[var(--sk-muted)] transition-[color,background-color,opacity] duration-120 motion-reduce:transition-none hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-[var(--sk-primary)]',\n              editable ? 'cursor-grab active:cursor-grabbing' : 'cursor-pointer',\n              iconOnHover && !hoveredKeys.has(item.row.key) && chipsHoveredKey !== item.row.key && 'opacity-0 hover:opacity-100 focus-visible:opacity-100 data-[state=open]:opacity-100',\n            ]\"\n            :style=\"{ top: `${item.anchor.toggleTop}px`, left: `${item.anchor.toggleLeft}px`, width: `${item.anchor.toggleSize}px`, height: `${item.anchor.toggleSize}px` }\"\n            :aria-label=\"t('composites.chrome.details', { kind: item.row.kindLabel })\"\n            :title=\"editable ? t('composites.chrome.detailsDrag', { kind: item.row.kindLabel }) : t('composites.chrome.details', { kind: item.row.kindLabel })\"\n            @keydown.enter.space.prevent=\"($event.currentTarget as HTMLElement).click()\"\n            @dragstart=\"onIconDragStart($event, item.row)\"\n          >\n            <UIcon :key=\"item.row.icon\" :name=\"item.row.icon\" class=\"size-3.5\" />\n          </span>\n          <template #content>\n            <CompositeDetails :editor=\"editor\" :row=\"item.row\" :editable=\"editable\" />\n          </template>\n        </UPopover>\n\n        <div\n          v-if=\"item.status || item.derived || (item.row.tagsVisible && (item.row.tags.length || editable))\"\n          class=\"absolute z-10 flex items-center gap-px overflow-hidden rounded-md bg-[var(--sk-bg)]\"\n          :style=\"{ top: `${item.top}px`, left: `${item.left}px`, maxWidth: `${item.width}px`, height: `${ROW_HEIGHT}px` }\"\n          @mouseenter=\"chipsHoveredKey = item.row.key\"\n          @mouseleave=\"chipsHoveredKey = null\"\n        >\n          <template v-if=\"item.derived\">\n            <button\n              v-if=\"item.derived.toggleable\"\n              type=\"button\"\n              :class=\"chipButton\"\n              :aria-expanded=\"item.derived.open\"\n              :aria-label=\"t(item.derived.open ? 'composites.derivation.collapse' : 'composites.derivation.expand')\"\n              :title=\"t(item.derived.open ? 'composites.derivation.collapse' : 'composites.derivation.expand')\"\n              @click=\"toggleExpanded(item.row)\"\n            >\n              <UIcon :name=\"item.derived.open ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'\" class=\"size-3.5\" />\n            </button>\n            <span :class=\"chip\">\n              <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5\" />{{ t('composites.derivation.badge') }}\n            </span>\n            <span v-if=\"item.derived.stale\" :class=\"[chip, 'text-[var(--sk-warning)]']\">\n              <UIcon name=\"i-lucide-triangle-alert\" class=\"size-3.5\" />{{ t('composites.derivation.stale') }}\n            </span>\n          </template>\n\n          <template v-if=\"item.status\">\n            <CompositeStatusMenu v-if=\"editable\" :editor=\"editor\" :row=\"item.row\">\n              <button type=\"button\" :class=\"chipButton\" :aria-label=\"t('composites.status.label', { status: item.status.label })\">\n                <UIcon :name=\"item.status.icon\" :class=\"['size-3.5', item.status.color]\" />{{ item.status.label }}\n              </button>\n            </CompositeStatusMenu>\n            <span v-else :class=\"chip\">\n              <UIcon :name=\"item.status.icon\" :class=\"['size-3.5', item.status.color]\" />{{ item.status.label }}\n            </span>\n          </template>\n\n          <span v-for=\"tag in item.row.tagsVisible ? item.row.tags : []\" :key=\"tag\" :class=\"[chip, 'group max-w-40 gap-0']\">\n            <span class=\"truncate\">#{{ tag }}</span>\n            <button\n              v-if=\"editable\"\n              type=\"button\"\n              class=\"flex h-4 w-0 shrink-0 items-center justify-center overflow-hidden rounded-sm opacity-0 transition-all duration-150 group-hover:ml-1 group-hover:w-4 group-hover:opacity-100 hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:ml-1 focus-visible:w-4 focus-visible:opacity-100 focus-visible:outline-2 focus-visible:outline-[var(--sk-primary)]\"\n              :aria-label=\"t('composites.tag.remove', { tag })\"\n              @click=\"removeTag(item.row, tag)\"\n            >\n              <UIcon name=\"i-lucide-x\" class=\"size-3\" />\n            </button>\n          </span>\n\n          <UPopover\n            v-if=\"editable && item.row.tagsVisible\"\n            :content=\"{ side: 'bottom', align: 'start', sideOffset: 6, onCloseAutoFocus: (event: Event) => event.preventDefault() }\"\n          >\n            <button type=\"button\" :class=\"chipButton\" :aria-label=\"t('composites.tag.add')\" :title=\"t('composites.tag.add')\">\n              <UIcon name=\"i-lucide-plus\" class=\"size-3.5\" />\n            </button>\n            <template #content>\n              <div class=\"w-64 p-3\">\n                <CompositeTagsEditor :editor=\"editor\" :row=\"item.row\" />\n              </div>\n            </template>\n          </UPopover>\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"CompositeChrome.js","names":["_unref","_openBlock","_createBlock","_Teleport","_createElementVNode","_createElementBlock","_Fragment","_renderList","_withCtx","_createVNode","CompositeDetails","_normalizeClass","_normalizeStyle","_withKeys","_withModifiers","_createCommentVNode","CompositeBasketMenu","_createTextVNode","_toDisplayString","CompositeStatusMenu","CompositeTagsEditor"],"sources":["../../../../src/features/composites/components/CompositeChrome.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Editor } from '@tiptap/vue-3'\nimport { computed, shallowRef, watch } from 'vue'\nimport { startBlockDrag } from '../../../core'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { useStoreRef } from '../../../vue/store-ref'\nimport { useEditorSettings } from '../../../vue/settings'\nimport { compositeSectionOf } from '../anchors'\nimport { derivedChromeOf } from '../derived-chrome'\nimport { rowStatus } from '../meta-display'\nimport { basketById, basketOf, titleHiddenOf } from '../baskets'\nimport { compositeBasketsOf } from '../nodes'\nimport { compositeOfRow, type CompositeRow, setCompositeTags } from '../rows'\nimport { useCompositeAnchors } from '../use-composite-anchors'\nimport { useCompositeRows } from '../use-composite-rows'\nimport CompositeBasketMenu from './CompositeBasketMenu.vue'\nimport CompositeDetails from './CompositeDetails.vue'\nimport CompositeStatusMenu from './CompositeStatusMenu.vue'\nimport CompositeTagsEditor from './CompositeTagsEditor.vue'\n\n/**\n * Chrome of every composite, laid over the editor (mounted by the composites feature): on the title line the status\n * chip and one chip per tag (with a `+` chip to add tags), and on the front the kind icon. The icon is a button that\n * opens the details popover (kind with a confirmation before it changes, the kind's fields and the summary;\n * `CompositeDetails`) and, in an editable editor, the composite's drag handle: dragging it moves the composite\n * (`startBlockDrag`). A kind with `chrome.tags: false` shows no tag chips and no `+` chip. With `blocks.kindIcon: 'hover'` it shows only while the composite is hovered, its popover is\n * open or the icon has keyboard focus. Chips and popover also render in read-only editors, without edit affordances.\n * The node view's own description and tags rows are hidden by CSS; this overlay shows and edits them.\n */\nconst props = defineProps<{ editor: Editor }>()\n\nconst { Icon: UIcon, Popover: UPopover } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst { rows } = useCompositeRows(() => props.editor)\nconst { host, anchors, frame } = useCompositeAnchors(() => props.editor, rows)\n\n// `isEditable` is not reactive: follow it on every transaction (`EditorSurface` dispatches one after `setEditable`).\nconst editable = shallowRef(false)\nwatch(() => props.editor, (instance, _previous, onCleanup) => {\n  editable.value = !instance.isDestroyed && instance.isEditable\n  const sync = () => {\n    editable.value = !instance.isDestroyed && instance.isEditable\n  }\n  instance.on('transaction', sync)\n  onCleanup(() => instance.off('transaction', sync))\n}, { immediate: true })\n\nconst { settings } = useEditorSettings()\nconst iconOnHover = computed(() => settings.value.blocks.kindIcon === 'hover')\n\n// Hover state of `kindIcon: 'hover'`: the keys of the rows whose composite is under the pointer (that one and every\n// composite around it), plus the row whose chips the pointer is on (they sit outside the editor's DOM).\nconst hoveredKeys = shallowRef<ReadonlySet<string>>(new Set())\nconst chipsHoveredKey = shallowRef<string | null>(null)\nlet hoveredSection: Element | null = null\n\nfunction onEditorMouseover(event: MouseEvent) {\n  const section = event.target instanceof Element ? event.target.closest('.composite') : null\n  if (section === hoveredSection) return\n  hoveredSection = section\n  const chain = new Set<Element>()\n  for (let el = section; el; el = el.parentElement?.closest('.composite') ?? null) chain.add(el)\n  const { view, state } = props.editor\n  hoveredKeys.value = new Set(rows.value.filter((row) => {\n    const found = compositeOfRow(state.doc, row)\n    const dom = found ? view.nodeDOM(found.pos) : null\n    const section = dom instanceof Element ? compositeSectionOf(dom) : null\n    return section !== null && chain.has(section)\n  }).map(row => row.key))\n}\n\nfunction onEditorMouseleave() {\n  hoveredSection = null\n  hoveredKeys.value = new Set()\n}\n\nwatch([() => props.editor, iconOnHover], ([instance, hover], _previous, onCleanup) => {\n  onEditorMouseleave()\n  if (!hover || instance.isDestroyed) return\n  const { dom } = instance.view\n  dom.addEventListener('mouseover', onEditorMouseover)\n  dom.addEventListener('mouseleave', onEditorMouseleave)\n  onCleanup(() => {\n    dom.removeEventListener('mouseover', onEditorMouseover)\n    dom.removeEventListener('mouseleave', onEditorMouseleave)\n  })\n}, { immediate: true })\n\nfunction onIconDragStart(event: DragEvent, row: CompositeRow) {\n  const found = compositeOfRow(props.editor.state.doc, row)\n  if (!found || !startBlockDrag(props.editor, event, found.pos)) event.preventDefault()\n}\n\n/** Chips start right after the title's last character and run on to the editor's right edge. */\nconst ROW_HEIGHT = 24\n\nconst expanded = useStoreRef(() => props.editor.storage.composite.expanded)\nconst revealedTitles = useStoreRef(() => props.editor.storage.composite.revealedTitles)\n\nconst placed = computed(() => {\n  const baskets = compositeBasketsOf(props.editor)\n  // End of the collapsed derived Baustein the rows being walked sit in: its clipped content shows no chrome.\n  let hiddenUntil = -1\n  return rows.value.flatMap((row) => {\n    if (row.pos < hiddenUntil) return []\n    const derived = derivedChromeOf(props.editor, row)\n    const open = !derived || !row.id || expanded.value.has(row.id)\n    if (!open) hiddenUntil = row.end\n    const anchor = anchors.value.get(row.key)\n    if (!anchor) return []\n    const titleHidden = titleHiddenOf(row)\n    // A hidden title leaves nothing to measure: the chips sit in the strip beside the kind icon (`composites.css`).\n    const inStrip = titleHidden && !(row.id && revealedTitles.value.has(row.id)) && anchor.toggleSize > 0\n    // An empty title shows a placeholder the anchor cannot measure: keep clear of it.\n    const left = inStrip ? anchor.toggleLeft + anchor.toggleSize + 6 : anchor.lineEnd + (anchor.titleEmpty ? 116 : 12)\n    return [{\n      row,\n      anchor,\n      left,\n      top: (inStrip ? anchor.toggleTop + anchor.toggleSize / 2 : anchor.lastCenter) - ROW_HEIGHT / 2,\n      width: Math.max((frame.value?.right ?? anchor.right) - left, 120),\n      status: rowStatus(row, t),\n      derived: derived && { stale: derived.stale, open, toggleable: !!row.id },\n      basket: basketById(baskets, basketOf(row)) ?? null,\n      titleHidden,\n    }]\n  })\n})\n\nfunction toggleExpanded(row: CompositeRow) {\n  if (row.id) props.editor.commands.toggleCompositeExpanded(row.id)\n}\n\nfunction removeTag(row: CompositeRow, tag: string) {\n  setCompositeTags(props.editor, row, row.tags.filter(candidate => candidate !== tag))\n}\n\nfunction toggleTitleHidden(row: CompositeRow) {\n  const found = compositeOfRow(props.editor.state.doc, row)\n  if (found) props.editor.commands.setCompositeTitleHidden(!titleHiddenOf(row), found.pos)\n}\n\nconst chip = 'inline-flex h-5 shrink-0 items-center gap-1 rounded-sm px-1.5 text-xs leading-none whitespace-nowrap text-[var(--sk-muted)]'\nconst chipButton = `${chip} transition-colors duration-150 hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-[var(--sk-primary)]`\n\n/** Scale and fade in from the icon (`transform-origin` is Reka's), a bit longer than Nuxt UI's default; `composites.css` defines the keyframes and the reduced-motion override. */\nconst detailsPopoverUi = {\n  content: 'composite-popover data-[state=open]:animate-[composite-pop-in_160ms_var(--ease-out)] data-[state=closed]:animate-[composite-pop-out_120ms_var(--ease-out)]',\n}\n</script>\n\n<template>\n  <Teleport v-if=\"host\" :to=\"host\">\n    <div class=\"absolute left-0 top-0 h-0 w-0\">\n      <template v-for=\"item in placed\" :key=\"item.row.key\">\n        <UPopover\n          v-if=\"item.anchor.toggleSize\"\n          :content=\"{ side: 'bottom', align: 'start', sideOffset: 4 }\"\n          :ui=\"detailsPopoverUi\"\n        >\n          <!-- A span, not a `button`: Firefox does not start drags from buttons. -->\n          <span\n            role=\"button\"\n            tabindex=\"0\"\n            :draggable=\"editable\"\n            :class=\"[\n              'absolute z-10 flex items-center justify-center rounded-sm bg-[var(--sk-bg)] text-[var(--sk-muted)] transition-[color,background-color,opacity] duration-120 motion-reduce:transition-none hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-[var(--sk-primary)]',\n              editable ? 'cursor-grab active:cursor-grabbing' : 'cursor-pointer',\n              iconOnHover && !hoveredKeys.has(item.row.key) && chipsHoveredKey !== item.row.key && 'opacity-0 hover:opacity-100 focus-visible:opacity-100 data-[state=open]:opacity-100',\n            ]\"\n            :style=\"{ top: `${item.anchor.toggleTop}px`, left: `${item.anchor.toggleLeft}px`, width: `${item.anchor.toggleSize}px`, height: `${item.anchor.toggleSize}px` }\"\n            :aria-label=\"t('composites.chrome.details', { kind: item.row.kindLabel })\"\n            :title=\"editable ? t('composites.chrome.detailsDrag', { kind: item.row.kindLabel }) : t('composites.chrome.details', { kind: item.row.kindLabel })\"\n            @keydown.enter.space.prevent=\"($event.currentTarget as HTMLElement).click()\"\n            @dragstart=\"onIconDragStart($event, item.row)\"\n          >\n            <UIcon :key=\"item.row.icon\" :name=\"item.row.icon\" class=\"size-3.5\" />\n          </span>\n          <template #content>\n            <CompositeDetails :editor=\"editor\" :row=\"item.row\" :editable=\"editable\" />\n          </template>\n        </UPopover>\n\n        <div\n          v-if=\"editable || item.basket || item.status || item.derived || (item.row.tagsVisible && item.row.tags.length)\"\n          class=\"absolute z-10 flex items-center gap-px overflow-hidden rounded-md bg-[var(--sk-bg)]\"\n          :style=\"{ top: `${item.top}px`, left: `${item.left}px`, maxWidth: `${item.width}px`, height: `${ROW_HEIGHT}px` }\"\n          @mouseenter=\"chipsHoveredKey = item.row.key\"\n          @mouseleave=\"chipsHoveredKey = null\"\n        >\n          <template v-if=\"editable\">\n            <CompositeBasketMenu :editor=\"editor\" :row=\"item.row\">\n              <button type=\"button\" :class=\"chipButton\" :aria-label=\"t('composites.basket.label')\" :title=\"item.basket ? `${t('composites.basket.label')}: ${item.basket.label}` : t('composites.basket.label')\">\n                <span v-if=\"item.basket\" class=\"size-2.5 rounded-full\" :style=\"{ backgroundColor: item.basket.color }\" />\n                <UIcon v-else name=\"i-lucide-circle-dashed\" class=\"size-3.5\" />\n              </button>\n            </CompositeBasketMenu>\n            <button\n              type=\"button\"\n              :class=\"chipButton\"\n              :aria-label=\"t(item.titleHidden ? 'composites.titleHidden.show' : 'composites.titleHidden.hide')\"\n              :title=\"t(item.titleHidden ? 'composites.titleHidden.show' : 'composites.titleHidden.hide')\"\n              @click=\"toggleTitleHidden(item.row)\"\n            >\n              <UIcon :name=\"item.titleHidden ? 'i-lucide-eye' : 'i-lucide-eye-off'\" class=\"size-3.5\" />\n            </button>\n          </template>\n          <span v-else-if=\"item.basket\" :class=\"chip\" :title=\"item.basket.label\">\n            <span class=\"size-2.5 rounded-full\" :style=\"{ backgroundColor: item.basket.color }\" />\n          </span>\n\n          <template v-if=\"item.derived\">\n            <button\n              v-if=\"item.derived.toggleable\"\n              type=\"button\"\n              :class=\"chipButton\"\n              :aria-expanded=\"item.derived.open\"\n              :aria-label=\"t(item.derived.open ? 'composites.derivation.collapse' : 'composites.derivation.expand')\"\n              :title=\"t(item.derived.open ? 'composites.derivation.collapse' : 'composites.derivation.expand')\"\n              @click=\"toggleExpanded(item.row)\"\n            >\n              <UIcon :name=\"item.derived.open ? 'i-lucide-chevron-down' : 'i-lucide-chevron-right'\" class=\"size-3.5\" />\n            </button>\n            <span :class=\"chip\">\n              <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5\" />{{ t('composites.derivation.badge') }}\n            </span>\n            <span v-if=\"item.derived.stale\" :class=\"[chip, 'text-[var(--sk-warning)]']\">\n              <UIcon name=\"i-lucide-triangle-alert\" class=\"size-3.5\" />{{ t('composites.derivation.stale') }}\n            </span>\n          </template>\n\n          <template v-if=\"item.status\">\n            <CompositeStatusMenu v-if=\"editable\" :editor=\"editor\" :row=\"item.row\">\n              <button type=\"button\" :class=\"chipButton\" :aria-label=\"t('composites.status.label', { status: item.status.label })\">\n                <UIcon :name=\"item.status.icon\" :class=\"['size-3.5', item.status.color]\" />{{ item.status.label }}\n              </button>\n            </CompositeStatusMenu>\n            <span v-else :class=\"chip\">\n              <UIcon :name=\"item.status.icon\" :class=\"['size-3.5', item.status.color]\" />{{ item.status.label }}\n            </span>\n          </template>\n\n          <span v-for=\"tag in item.row.tagsVisible ? item.row.tags : []\" :key=\"tag\" :class=\"[chip, 'group max-w-40 gap-0']\">\n            <span class=\"truncate\">#{{ tag }}</span>\n            <button\n              v-if=\"editable\"\n              type=\"button\"\n              class=\"flex h-4 w-0 shrink-0 items-center justify-center overflow-hidden rounded-sm opacity-0 transition-all duration-150 group-hover:ml-1 group-hover:w-4 group-hover:opacity-100 hover:bg-[var(--sk-bg-elevated)] hover:text-[var(--sk-fg-highlighted)] focus-visible:ml-1 focus-visible:w-4 focus-visible:opacity-100 focus-visible:outline-2 focus-visible:outline-[var(--sk-primary)]\"\n              :aria-label=\"t('composites.tag.remove', { tag })\"\n              @click=\"removeTag(item.row, tag)\"\n            >\n              <UIcon name=\"i-lucide-x\" class=\"size-3\" />\n            </button>\n          </span>\n\n          <UPopover\n            v-if=\"editable && item.row.tagsVisible\"\n            :content=\"{ side: 'bottom', align: 'start', sideOffset: 6, onCloseAutoFocus: (event: Event) => event.preventDefault() }\"\n          >\n            <button type=\"button\" :class=\"chipButton\" :aria-label=\"t('composites.tag.add')\" :title=\"t('composites.tag.add')\">\n              <UIcon name=\"i-lucide-plus\" class=\"size-3.5\" />\n            </button>\n            <template #content>\n              <div class=\"w-64 p-3\">\n                <CompositeTagsEditor :editor=\"editor\" :row=\"item.row\" />\n              </div>\n            </template>\n          </UPopover>\n        </div>\n      </template>\n    </div>\n  </Teleport>\n</template>\n"],"mappings":"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"}

package/dist/features/composites/components/CompositeFieldEditor.js

@@ -84,6 +84,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			])) : __props.field.type === "multiselect" ? (openBlock(), createBlock(unref(UInputMenu), {
 				key: 1,
 				multiple: "",
+				"value-key": "value",
 				"model-value": chosen.value,
 				items: __props.field.options ?? [],
 				placeholder: unref(t)("composites.field.choose", { field: __props.field.label }),

package/dist/features/composites/components/CompositeFieldEditor.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompositeFieldEditor.js","names":["_openBlock","_createBlock","_unref","ReferenceFieldSelect","BibliographyEditor","_createElementBlock","_Fragment","DerivationBadge","_createCommentVNode","_withKeys"],"sources":["../../../../src/features/composites/components/CompositeFieldEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Editor } from '@tiptap/core'\nimport { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport type { CompositeMetaField } from '../kinds'\nimport { metaText } from '../meta-display'\nimport { compositeOfRow, type CompositeRow, setCompositeMetaField } from '../rows'\nimport BibliographyEditor from './BibliographyEditor.vue'\nimport DerivationBadge from './DerivationBadge.vue'\nimport ReferenceFieldSelect from './ReferenceFieldSelect.vue'\n\n/**\n * One meta field of a Baustein as an input that writes through `setCompositeMetaField`. Text-like inputs keep a local\n * draft and commit after typing pauses, on blur and on unmount, so the one-frame-late re-read of the rows never\n * overwrites what is being typed.\n */\nconst props = withDefaults(defineProps<{\n  editor: Editor\n  row: CompositeRow\n  field: CompositeMetaField\n  disabled?: boolean\n  size?: 'xs' | 'sm' | 'md'\n}>(), { size: 'sm' })\n\nconst { Input: UInput, InputMenu: UInputMenu, Select: USelect, Textarea: UTextarea } = useUiKit()\nconst { t } = useEditorI18n()\n\n/** The Baustein a `derivation` field belongs to; the read-only provenance display needs the node, not the field text. */\nconst derived = computed(() => props.field.type === 'derivation' ? compositeOfRow(props.editor.state.doc, props.row)?.node ?? null : null)\n\nconst stored = computed(() => metaText(props.row, props.field))\n/** The chosen values of a `multiselect` field (`meta[key]` is a `string[]`). */\nconst chosen = computed(() => {\n  const value = props.row.meta[props.field.key]\n  return Array.isArray(value) ? value.filter((item): item is string => typeof item === 'string') : []\n})\nconst draft = ref(stored.value)\nconst typing = ref(false)\nlet dirty = false\nlet timer: ReturnType<typeof setTimeout> | undefined\n\nwatch(stored, (value) => {\n  if (!typing.value && !dirty) draft.value = value\n})\n\nfunction commit() {\n  clearTimeout(timer)\n  if (!dirty) return\n  dirty = false\n  if (!props.editor.isDestroyed) setCompositeMetaField(props.editor, props.row, props.field.key, draft.value)\n}\n\nfunction onInput(value: unknown) {\n  draft.value = typeof value === 'string' ? value : ''\n  dirty = true\n  clearTimeout(timer)\n  timer = setTimeout(commit, 400)\n}\n\nfunction onBlur() {\n  typing.value = false\n  commit()\n}\n\nonBeforeUnmount(commit)\n\nfunction onChoice(value: unknown) {\n  setCompositeMetaField(props.editor, props.row, props.field.key, typeof value === 'string' ? value : '')\n}\n\nfunction onChoices(value: unknown) {\n  setCompositeMetaField(props.editor, props.row, props.field.key, Array.isArray(value) ? value : [])\n}\n</script>\n\n<template>\n  <USelect\n    v-if=\"field.type === 'select'\"\n    :model-value=\"stored || undefined\"\n    :items=\"field.options ?? []\"\n    :placeholder=\"t('composites.field.choose', { field: field.label })\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @update:model-value=\"onChoice\"\n  />\n  <UInputMenu\n    v-else-if=\"field.type === 'multiselect'\"\n    multiple\n    :model-value=\"chosen\"\n    :items=\"field.options ?? []\"\n    :placeholder=\"t('composites.field.choose', { field: field.label })\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @update:model-value=\"onChoices\"\n  />\n  <ReferenceFieldSelect\n    v-else-if=\"field.type === 'reference'\"\n    :editor=\"editor\"\n    :row=\"row\"\n    :field=\"field\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n  />\n  <BibliographyEditor\n    v-else-if=\"field.type === 'bibliography'\"\n    :editor=\"editor\"\n    :row=\"row\"\n    :field=\"field\"\n    :disabled=\"disabled\"\n  />\n  <template v-else-if=\"field.type === 'derivation'\">\n    <DerivationBadge v-if=\"derived\" :editor=\"editor\" :node=\"derived\" />\n  </template>\n  <UTextarea\n    v-else-if=\"field.type === 'textarea'\"\n    :model-value=\"draft\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    autoresize\n    :rows=\"2\"\n    :maxrows=\"6\"\n    class=\"w-full\"\n    @focus=\"typing = true\"\n    @blur=\"onBlur\"\n    @update:model-value=\"onInput\"\n  />\n  <UInput\n    v-else\n    :model-value=\"draft\"\n    :type=\"field.type\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @focus=\"typing = true\"\n    @blur=\"onBlur\"\n    @keydown.enter=\"commit\"\n    @update:model-value=\"onInput\"\n  />\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"CompositeFieldEditor.js","names":["_openBlock","_createBlock","_unref","ReferenceFieldSelect","BibliographyEditor","_createElementBlock","_Fragment","DerivationBadge","_createCommentVNode","_withKeys"],"sources":["../../../../src/features/composites/components/CompositeFieldEditor.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Editor } from '@tiptap/core'\nimport { computed, onBeforeUnmount, ref, watch } from 'vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport type { CompositeMetaField } from '../kinds'\nimport { metaText } from '../meta-display'\nimport { compositeOfRow, type CompositeRow, setCompositeMetaField } from '../rows'\nimport BibliographyEditor from './BibliographyEditor.vue'\nimport DerivationBadge from './DerivationBadge.vue'\nimport ReferenceFieldSelect from './ReferenceFieldSelect.vue'\n\n/**\n * One meta field of a Baustein as an input that writes through `setCompositeMetaField`. Text-like inputs keep a local\n * draft and commit after typing pauses, on blur and on unmount, so the one-frame-late re-read of the rows never\n * overwrites what is being typed.\n */\nconst props = withDefaults(defineProps<{\n  editor: Editor\n  row: CompositeRow\n  field: CompositeMetaField\n  disabled?: boolean\n  size?: 'xs' | 'sm' | 'md'\n}>(), { size: 'sm' })\n\nconst { Input: UInput, InputMenu: UInputMenu, Select: USelect, Textarea: UTextarea } = useUiKit()\nconst { t } = useEditorI18n()\n\n/** The Baustein a `derivation` field belongs to; the read-only provenance display needs the node, not the field text. */\nconst derived = computed(() => props.field.type === 'derivation' ? compositeOfRow(props.editor.state.doc, props.row)?.node ?? null : null)\n\nconst stored = computed(() => metaText(props.row, props.field))\n/** The chosen values of a `multiselect` field (`meta[key]` is a `string[]`). */\nconst chosen = computed(() => {\n  const value = props.row.meta[props.field.key]\n  return Array.isArray(value) ? value.filter((item): item is string => typeof item === 'string') : []\n})\nconst draft = ref(stored.value)\nconst typing = ref(false)\nlet dirty = false\nlet timer: ReturnType<typeof setTimeout> | undefined\n\nwatch(stored, (value) => {\n  if (!typing.value && !dirty) draft.value = value\n})\n\nfunction commit() {\n  clearTimeout(timer)\n  if (!dirty) return\n  dirty = false\n  if (!props.editor.isDestroyed) setCompositeMetaField(props.editor, props.row, props.field.key, draft.value)\n}\n\nfunction onInput(value: unknown) {\n  draft.value = typeof value === 'string' ? value : ''\n  dirty = true\n  clearTimeout(timer)\n  timer = setTimeout(commit, 400)\n}\n\nfunction onBlur() {\n  typing.value = false\n  commit()\n}\n\nonBeforeUnmount(commit)\n\nfunction onChoice(value: unknown) {\n  setCompositeMetaField(props.editor, props.row, props.field.key, typeof value === 'string' ? value : '')\n}\n\nfunction onChoices(value: unknown) {\n  setCompositeMetaField(props.editor, props.row, props.field.key, Array.isArray(value) ? value : [])\n}\n</script>\n\n<template>\n  <USelect\n    v-if=\"field.type === 'select'\"\n    :model-value=\"stored || undefined\"\n    :items=\"field.options ?? []\"\n    :placeholder=\"t('composites.field.choose', { field: field.label })\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @update:model-value=\"onChoice\"\n  />\n  <UInputMenu\n    v-else-if=\"field.type === 'multiselect'\"\n    multiple\n    value-key=\"value\"\n    :model-value=\"chosen\"\n    :items=\"field.options ?? []\"\n    :placeholder=\"t('composites.field.choose', { field: field.label })\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @update:model-value=\"onChoices\"\n  />\n  <ReferenceFieldSelect\n    v-else-if=\"field.type === 'reference'\"\n    :editor=\"editor\"\n    :row=\"row\"\n    :field=\"field\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n  />\n  <BibliographyEditor\n    v-else-if=\"field.type === 'bibliography'\"\n    :editor=\"editor\"\n    :row=\"row\"\n    :field=\"field\"\n    :disabled=\"disabled\"\n  />\n  <template v-else-if=\"field.type === 'derivation'\">\n    <DerivationBadge v-if=\"derived\" :editor=\"editor\" :node=\"derived\" />\n  </template>\n  <UTextarea\n    v-else-if=\"field.type === 'textarea'\"\n    :model-value=\"draft\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    autoresize\n    :rows=\"2\"\n    :maxrows=\"6\"\n    class=\"w-full\"\n    @focus=\"typing = true\"\n    @blur=\"onBlur\"\n    @update:model-value=\"onInput\"\n  />\n  <UInput\n    v-else\n    :model-value=\"draft\"\n    :type=\"field.type\"\n    :aria-label=\"field.label\"\n    :disabled=\"disabled\"\n    :size=\"size\"\n    class=\"w-full\"\n    @focus=\"typing = true\"\n    @blur=\"onBlur\"\n    @keydown.enter=\"commit\"\n    @update:model-value=\"onInput\"\n  />\n</template>\n"],"mappings":"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"}

package/dist/features/composites/components/CompositeView.js

@@ -1,6 +1,7 @@
 import { compositeKind } from "../kinds.js";
+import { basketOf, titleHiddenOf } from "../baskets.js";
 import { derivationOf } from "../derivation.js";
-import { compositeKindsOf } from "../nodes.js";
+import { compositeBasketsOf, compositeKindsOf } from "../nodes.js";
 import { useStoreRef } from "../../../vue/store-ref.js";
 import { computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, unref, withCtx } from "vue";
 import { NodeViewContent, NodeViewWrapper, nodeViewProps } from "@tiptap/vue-3";
@@ -16,9 +17,19 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			const id = props.node.attrs.id;
 			return typeof id === "string" && id !== "" && derivationOf(props.node) !== null && !expanded.value.has(id);
 		});
+		const basket = computed(() => basketOf(props.node));
+		const basketColor = computed(() => compositeBasketsOf(props.editor).find((candidate) => candidate.id === basket.value)?.color);
+		const revealedTitles = useStoreRef(() => props.editor.storage.composite.revealedTitles);
+		const titleHidden = computed(() => {
+			const id = props.node.attrs.id;
+			return titleHiddenOf(props.node) && !(typeof id === "string" && revealedTitles.value.has(id));
+		});
 		/** `text` as a CSS string literal (for `content:`). */
 		const cssString = (text) => `"${text.replace(/["\\]/g, "\\$&").replace(/\n/g, "\\a ")}"`;
-		const placeholderVars = computed(() => ({ "--composite-title-placeholder": cssString(kind.value.titlePlaceholder) }));
+		const placeholderVars = computed(() => ({
+			"--composite-title-placeholder": cssString(kind.value.titlePlaceholder),
+			...basketColor.value ? { "--sk-basket-color": basketColor.value } : {}
+		}));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(NodeViewWrapper), {
 				as: "section",
@@ -29,6 +40,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				"data-type": "composite",
 				"data-kind": _ctx.node.attrs.kind,
 				"data-id": _ctx.node.attrs.id || void 0,
+				"data-basket": basket.value || void 0,
+				"data-title-hidden": titleHidden.value ? "" : void 0,
 				style: normalizeStyle(placeholderVars.value)
 			}, {
 				default: withCtx(() => [
@@ -45,6 +58,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				"class",
 				"data-kind",
 				"data-id",
+				"data-basket",
+				"data-title-hidden",
 				"style"
 			]);
 		};

package/dist/features/composites/components/CompositeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"CompositeView.js","names":["selected","node","_openBlock","_createBlock","_unref","_normalizeClass","_normalizeStyle","_withCtx","_createCommentVNode","_createElementVNode","_createVNode"],"sources":["../../../../src/features/composites/components/CompositeView.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { NodeViewContent, NodeViewWrapper, nodeViewProps } from '@tiptap/vue-3'\nimport { computed } from 'vue'\nimport { compositeKind } from '../kinds'\nimport { compositeKindsOf } from '../nodes'\nimport { useStoreRef } from '../../../vue/store-ref'\nimport { derivationOf } from '../derivation'\n\nconst props = defineProps(nodeViewProps)\n\nconst kind = computed(() => compositeKind(compositeKindsOf(props.editor), String(props.node.attrs.kind)))\n\n// A derived Baustein (one with a `meta.derivation`) shows collapsed to a faded preview until it is opened; the content\n// stays laid out (CSS clips it), so editing positions are unaffected. The chrome's chevron and a caret inside open it.\nconst expanded = useStoreRef(() => props.editor.storage.composite.expanded)\nconst collapsed = computed(() => {\n  const id: unknown = props.node.attrs.id\n  return typeof id === 'string' && id !== '' && derivationOf(props.node) !== null && !expanded.value.has(id)\n})\n\n/** `text` as a CSS string literal (for `content:`). */\nconst cssString = (text: string) => `\"${text.replace(/[\"\\\\]/g, '\\\\$&').replace(/\\n/g, '\\\\a ')}\"`\n// Placeholder of the empty title (composites.css `content: var(…)`); a nested composite sets its own.\nconst placeholderVars = computed(() => ({\n  '--composite-title-placeholder': cssString(kind.value.titlePlaceholder),\n}))\n</script>\n\n<template>\n  <NodeViewWrapper\n    as=\"section\"\n    :class=\"['composite', { 'is-collapsed': collapsed, 'is-selected rounded-md ring-1 ring-[var(--sk-primary)]': selected }]\"\n    data-type=\"composite\"\n    :data-kind=\"node.attrs.kind\"\n    :data-id=\"node.attrs.id || undefined\"\n    :style=\"placeholderVars\"\n  >\n    <!-- Anchor of the kind icon on the left border: it only takes the icon's place and size. The composite chrome overlay\n         measures it and draws the icon as the button that opens the details popover and drags the composite. -->\n    <span class=\"composite__toggle\" contenteditable=\"false\" aria-hidden=\"true\" />\n    <NodeViewContent class=\"composite__content\" />\n  </NodeViewWrapper>\n</template>\n"],"mappings":";;;;;;;;;;;EAQA,MAAM,QAAQ;EAEd,MAAM,OAAO,eAAe,cAAc,iBAAiB,MAAM,MAAM,GAAG,OAAO,MAAM,KAAK,MAAM,IAAI,CAAC,CAAC;EAIxG,MAAM,WAAW,kBAAkB,MAAM,OAAO,QAAQ,UAAU,QAAQ;EAC1E,MAAM,YAAY,eAAe;GAC/B,MAAM,KAAc,MAAM,KAAK,MAAM;GACrC,OAAO,OAAO,OAAO,YAAY,OAAO,MAAM,aAAa,MAAM,IAAI,MAAM,QAAQ,CAAC,SAAS,MAAM,IAAI,EAAE;EAC3G,CAAC;;EAGD,MAAM,aAAa,SAAiB,IAAI,KAAK,QAAQ,UAAU,MAAM,CAAC,CAAC,QAAQ,OAAO,MAAM,EAAE;EAE9F,MAAM,kBAAkB,gBAAgB,EACtC,iCAAiC,UAAU,KAAK,MAAM,gBAAgB,EACxE,EAAE;;GAIA,OAAAE,UAAA,GAAAC,YAYkBC,MAAA,eAAA,GAAA;IAXhB,IAAG;IACF,OAAKC,eAAA,CAAA,aAAA;KAAA,gBAAkC,UAAA;KAAS,0DAA4DL,KAAAA;IAAQ,CAAA,CAAA;IACrH,aAAU;IACT,aAAWC,KAAAA,KAAK,MAAM;IACtB,WAASA,KAAAA,KAAK,MAAM,MAAM,KAAA;IAC1B,OAAKK,eAAE,gBAAA,KAAe;;IAEvB,SAAAC,cAC6G;KAD7GC,mBAAA,oOAAA;KAEA,OAAA,OAAA,OAAA,KAAAC,mBAA6E,QAAA;MAAvE,OAAM;MAAoB,iBAAgB;MAAQ,eAAY;;KACpEC,YAA8CN,MAAA,eAAA,GAAA,EAA7B,OAAM,qBAAoB,CAAA"}
+{"version":3,"file":"CompositeView.js","names":["selected","node","_openBlock","_createBlock","_unref","_normalizeClass","_normalizeStyle","_withCtx","_createCommentVNode","_createElementVNode","_createVNode"],"sources":["../../../../src/features/composites/components/CompositeView.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { NodeViewContent, NodeViewWrapper, nodeViewProps } from '@tiptap/vue-3'\nimport { computed } from 'vue'\nimport { basketOf, titleHiddenOf } from '../baskets'\nimport { compositeKind } from '../kinds'\nimport { compositeBasketsOf, compositeKindsOf } from '../nodes'\nimport { useStoreRef } from '../../../vue/store-ref'\nimport { derivationOf } from '../derivation'\n\nconst props = defineProps(nodeViewProps)\n\nconst kind = computed(() => compositeKind(compositeKindsOf(props.editor), String(props.node.attrs.kind)))\n\n// A derived Baustein (one with a `meta.derivation`) shows collapsed to a faded preview until it is opened; the content\n// stays laid out (CSS clips it), so editing positions are unaffected. The chrome's chevron and a caret inside open it.\nconst expanded = useStoreRef(() => props.editor.storage.composite.expanded)\nconst collapsed = computed(() => {\n  const id: unknown = props.node.attrs.id\n  return typeof id === 'string' && id !== '' && derivationOf(props.node) !== null && !expanded.value.has(id)\n})\n\n// Colour basket (`meta.basket`): `data-basket` carries the id, the stripe takes the basket's colour from `--sk-basket-color`.\nconst basket = computed(() => basketOf(props.node))\nconst basketColor = computed(() => compositeBasketsOf(props.editor).find(candidate => candidate.id === basket.value)?.color)\n\n// A hidden title (`meta.titleHidden`) stays hidden until a caret enters it (`revealedTitles`, see `CompositeNode`).\nconst revealedTitles = useStoreRef(() => props.editor.storage.composite.revealedTitles)\nconst titleHidden = computed(() => {\n  const id: unknown = props.node.attrs.id\n  return titleHiddenOf(props.node) && !(typeof id === 'string' && revealedTitles.value.has(id))\n})\n\n/** `text` as a CSS string literal (for `content:`). */\nconst cssString = (text: string) => `\"${text.replace(/[\"\\\\]/g, '\\\\$&').replace(/\\n/g, '\\\\a ')}\"`\n// Placeholder of the empty title (composites.css `content: var(…)`); a nested composite sets its own.\nconst placeholderVars = computed(() => ({\n  '--composite-title-placeholder': cssString(kind.value.titlePlaceholder),\n  ...(basketColor.value ? { '--sk-basket-color': basketColor.value } : {}),\n}))\n</script>\n\n<template>\n  <NodeViewWrapper\n    as=\"section\"\n    :class=\"['composite', { 'is-collapsed': collapsed, 'is-selected rounded-md ring-1 ring-[var(--sk-primary)]': selected }]\"\n    data-type=\"composite\"\n    :data-kind=\"node.attrs.kind\"\n    :data-id=\"node.attrs.id || undefined\"\n    :data-basket=\"basket || undefined\"\n    :data-title-hidden=\"titleHidden ? '' : undefined\"\n    :style=\"placeholderVars\"\n  >\n    <!-- Anchor of the kind icon on the left border: it only takes the icon's place and size. The composite chrome overlay\n         measures it and draws the icon as the button that opens the details popover and drags the composite. -->\n    <span class=\"composite__toggle\" contenteditable=\"false\" aria-hidden=\"true\" />\n    <NodeViewContent class=\"composite__content\" />\n  </NodeViewWrapper>\n</template>\n"],"mappings":";;;;;;;;;;;;EASA,MAAM,QAAQ;EAEd,MAAM,OAAO,eAAe,cAAc,iBAAiB,MAAM,MAAM,GAAG,OAAO,MAAM,KAAK,MAAM,IAAI,CAAC,CAAC;EAIxG,MAAM,WAAW,kBAAkB,MAAM,OAAO,QAAQ,UAAU,QAAQ;EAC1E,MAAM,YAAY,eAAe;GAC/B,MAAM,KAAc,MAAM,KAAK,MAAM;GACrC,OAAO,OAAO,OAAO,YAAY,OAAO,MAAM,aAAa,MAAM,IAAI,MAAM,QAAQ,CAAC,SAAS,MAAM,IAAI,EAAE;EAC3G,CAAC;EAGD,MAAM,SAAS,eAAe,SAAS,MAAM,IAAI,CAAC;EAClD,MAAM,cAAc,eAAe,mBAAmB,MAAM,MAAM,CAAC,CAAC,MAAK,cAAa,UAAU,OAAO,OAAO,KAAK,CAAC,EAAE,KAAK;EAG3H,MAAM,iBAAiB,kBAAkB,MAAM,OAAO,QAAQ,UAAU,cAAc;EACtF,MAAM,cAAc,eAAe;GACjC,MAAM,KAAc,MAAM,KAAK,MAAM;GACrC,OAAO,cAAc,MAAM,IAAI,KAAK,EAAE,OAAO,OAAO,YAAY,eAAe,MAAM,IAAI,EAAE;EAC7F,CAAC;;EAGD,MAAM,aAAa,SAAiB,IAAI,KAAK,QAAQ,UAAU,MAAM,CAAC,CAAC,QAAQ,OAAO,MAAM,EAAE;EAE9F,MAAM,kBAAkB,gBAAgB;GACtC,iCAAiC,UAAU,KAAK,MAAM,gBAAgB;GACtE,GAAI,YAAY,QAAQ,EAAE,qBAAqB,YAAY,MAAM,IAAI,CAAC;EACxE,EAAE;;GAIA,OAAAE,UAAA,GAAAC,YAckBC,MAAA,eAAA,GAAA;IAbhB,IAAG;IACF,OAAKC,eAAA,CAAA,aAAA;KAAA,gBAAkC,UAAA;KAAS,0DAA4DL,KAAAA;IAAQ,CAAA,CAAA;IACrH,aAAU;IACT,aAAWC,KAAAA,KAAK,MAAM;IACtB,WAASA,KAAAA,KAAK,MAAM,MAAM,KAAA;IAC1B,eAAa,OAAA,SAAU,KAAA;IACvB,qBAAmB,YAAA,QAAW,KAAQ,KAAA;IACtC,OAAKK,eAAE,gBAAA,KAAe;;IAEvB,SAAAC,cAC6G;KAD7GC,mBAAA,oOAAA;KAEA,OAAA,OAAA,OAAA,KAAAC,mBAA6E,QAAA;MAAvE,OAAM;MAAoB,iBAAgB;MAAQ,eAAY;;KACpEC,YAA8CN,MAAA,eAAA,GAAA,EAA7B,OAAM,qBAAoB,CAAA"}

package/dist/features/composites/components/DerivationBadge.js

@@ -1,7 +1,7 @@
 import { derivationOf } from "../derivation.js";
 import { useUiKit } from "../../../vue/kit/use-ui-kit.js";
 import { useEditorI18n } from "../../../vue/use-editor-i18n.js";
-import { derivationDetailsOf, derivationMethodLabel } from "../derived-chrome.js";
+import { derivationDetailsOf, derivationIsForeign, derivationMethodLabel } from "../derived-chrome.js";
 import { formatDate } from "../meta-display.js";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref } from "vue";
 //#region src/features/composites/components/DerivationBadge.vue
@@ -44,6 +44,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		const derivation = computed(() => derivationOf(props.node));
 		const details = computed(() => props.detailed ? derivationDetailsOf(props.editor, props.node) : null);
 		const method = computed(() => derivation.value ? derivationMethodLabel(t, derivation.value.method) : "");
+		const foreign = computed(() => derivation.value ? derivationIsForeign(props.editor, derivation.value) : false);
 		const created = computed(() => derivation.value?.createdAt ? formatDate(derivation.value.createdAt) : "");
 		return (_ctx, _cache) => {
 			return derivation.value && !__props.detailed ? (openBlock(), createElementBlock("div", _hoisted_1, [createVNode(unref(UIcon), {
@@ -52,6 +53,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			}), createElementVNode("span", _hoisted_2, toDisplayString([
 				unref(t)("composites.derivation.badge"),
 				method.value,
+				foreign.value ? unref(t)("composites.derivation.foreign") : "",
 				created.value
 			].filter(Boolean).join(" · ")), 1)])) : derivation.value && details.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
 				createElementVNode("div", _hoisted_4, [
@@ -59,15 +61,22 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 						name: "i-lucide-git-branch",
 						class: "size-3.5"
 					}), createTextVNode(toDisplayString(unref(t)("composites.derivation.badge")), 1)], 2),
-					details.value.stale ? (openBlock(), createElementBlock("span", {
+					details.value.foreign ? (openBlock(), createElementBlock("span", {
 						key: 0,
+						class: normalizeClass([chip, "text-[var(--sk-muted)]"])
+					}, [createVNode(unref(UIcon), {
+						name: "i-lucide-file-symlink",
+						class: "size-3.5"
+					}), createTextVNode(toDisplayString(unref(t)("composites.derivation.foreign")), 1)], 2)) : createCommentVNode("v-if", true),
+					details.value.stale ? (openBlock(), createElementBlock("span", {
+						key: 1,
 						class: normalizeClass([chip, "text-[var(--sk-warning)]"])
 					}, [createVNode(unref(UIcon), {
 						name: "i-lucide-triangle-alert",
 						class: "size-3.5"
 					}), createTextVNode(toDisplayString(unref(t)("composites.derivation.stale")), 1)], 2)) : createCommentVNode("v-if", true),
 					details.value.edited ? (openBlock(), createElementBlock("span", {
-						key: 1,
+						key: 2,
 						class: normalizeClass([chip, "text-[var(--sk-muted)]"])
 					}, [createVNode(unref(UIcon), {
 						name: "i-lucide-pencil",

package/dist/features/composites/components/DerivationBadge.js.map

@@ -1 +1 @@
-{"version":3,"file":"DerivationBadge.js","names":["_openBlock","_createElementBlock","_createVNode","_unref","_createElementVNode","_toDisplayString","_normalizeClass","_createTextVNode","_createCommentVNode","_Fragment"],"sources":["../../../../src/features/composites/components/DerivationBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Editor } from '@tiptap/core'\nimport { computed } from 'vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { derivationOf } from '../derivation'\nimport { derivationDetailsOf, derivationMethodLabel } from '../derived-chrome'\nimport { formatDate } from '../meta-display'\n\n/**\n * Where a derived Baustein comes from. Compact (the `derivation` field type): the „abgeleitet“ badge with method and\n * date. `detailed` (the details card): also the model, whether the source changed („Quelle geändert“), whether the body\n * was edited since it was generated („bearbeitet“) and a link to the stored raw output. The detailed variant hashes\n * the body, so it belongs only where one Baustein is shown.\n */\nconst props = defineProps<{ editor: Editor, node: ProseMirrorNode, detailed?: boolean }>()\n\nconst { Icon: UIcon } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst derivation = computed(() => derivationOf(props.node))\nconst details = computed(() => props.detailed ? derivationDetailsOf(props.editor, props.node) : null)\nconst method = computed(() => derivation.value ? derivationMethodLabel(t, derivation.value.method) : '')\nconst created = computed(() => derivation.value?.createdAt ? formatDate(derivation.value.createdAt) : '')\n\nconst chip = 'inline-flex h-5 shrink-0 items-center gap-1 rounded-sm px-1.5 text-xs leading-none whitespace-nowrap'\n</script>\n\n<template>\n  <div v-if=\"derivation && !detailed\" class=\"flex min-w-0 items-center gap-1.5 text-xs text-[var(--sk-muted)]\">\n    <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5 shrink-0\" />\n    <span class=\"truncate\">{{ [t('composites.derivation.badge'), method, created].filter(Boolean).join(' · ') }}</span>\n  </div>\n\n  <div v-else-if=\"derivation && details\" class=\"flex flex-col gap-1.5 rounded-md p-2 text-xs ring ring-[var(--sk-border)]\">\n    <div class=\"flex flex-wrap items-center gap-1\">\n      <span :class=\"[chip, 'text-[var(--sk-muted)]']\">\n        <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5\" />{{ t('composites.derivation.badge') }}\n      </span>\n      <span v-if=\"details.stale\" :class=\"[chip, 'text-[var(--sk-warning)]']\">\n        <UIcon name=\"i-lucide-triangle-alert\" class=\"size-3.5\" />{{ t('composites.derivation.stale') }}\n      </span>\n      <span v-if=\"details.edited\" :class=\"[chip, 'text-[var(--sk-muted)]']\">\n        <UIcon name=\"i-lucide-pencil\" class=\"size-3.5\" />{{ t('composites.derivation.edited') }}\n      </span>\n    </div>\n    <dl class=\"grid grid-cols-[auto_1fr] gap-x-2 gap-y-0.5\">\n      <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.method') }}</dt>\n      <dd class=\"truncate text-[var(--sk-fg)]\">{{ method }}</dd>\n      <template v-if=\"derivation.model\">\n        <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.model') }}</dt>\n        <dd class=\"truncate text-[var(--sk-fg)]\" :title=\"derivation.model\">{{ derivation.model }}</dd>\n      </template>\n      <template v-if=\"created\">\n        <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.createdAt') }}</dt>\n        <dd class=\"text-[var(--sk-fg)]\">{{ created }}</dd>\n      </template>\n    </dl>\n    <a\n      v-if=\"details.outputUrl\"\n      :href=\"details.outputUrl\"\n      target=\"_blank\"\n      rel=\"noopener\"\n      class=\"inline-flex w-fit items-center gap-1 text-[var(--sk-primary)] hover:underline\"\n    >\n      <UIcon name=\"i-lucide-external-link\" class=\"size-3.5\" />{{ t('composites.derivation.openOutput') }}\n    </a>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"DerivationBadge.js","names":["_openBlock","_createElementBlock","_createVNode","_unref","_createElementVNode","_toDisplayString","_normalizeClass","_createTextVNode","_createCommentVNode","_Fragment"],"sources":["../../../../src/features/composites/components/DerivationBadge.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Node as ProseMirrorNode } from '@tiptap/pm/model'\nimport type { Editor } from '@tiptap/core'\nimport { computed } from 'vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { derivationOf } from '../derivation'\nimport { derivationDetailsOf, derivationIsForeign, derivationMethodLabel } from '../derived-chrome'\nimport { formatDate } from '../meta-display'\n\n/**\n * Where a derived Baustein comes from. Compact (the `derivation` field type): the „abgeleitet“ badge with method and\n * date. `detailed` (the details card): also the model, whether the source changed („Quelle geändert“), whether the body\n * was edited since it was generated („bearbeitet“) and a link to the stored raw output. The detailed variant hashes\n * the body, so it belongs only where one Baustein is shown.\n */\nconst props = defineProps<{ editor: Editor, node: ProseMirrorNode, detailed?: boolean }>()\n\nconst { Icon: UIcon } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst derivation = computed(() => derivationOf(props.node))\nconst details = computed(() => props.detailed ? derivationDetailsOf(props.editor, props.node) : null)\nconst method = computed(() => derivation.value ? derivationMethodLabel(t, derivation.value.method) : '')\nconst foreign = computed(() => derivation.value ? derivationIsForeign(props.editor, derivation.value) : false)\nconst created = computed(() => derivation.value?.createdAt ? formatDate(derivation.value.createdAt) : '')\n\nconst chip = 'inline-flex h-5 shrink-0 items-center gap-1 rounded-sm px-1.5 text-xs leading-none whitespace-nowrap'\n</script>\n\n<template>\n  <div v-if=\"derivation && !detailed\" class=\"flex min-w-0 items-center gap-1.5 text-xs text-[var(--sk-muted)]\">\n    <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5 shrink-0\" />\n    <span class=\"truncate\">{{ [t('composites.derivation.badge'), method, foreign ? t('composites.derivation.foreign') : '', created].filter(Boolean).join(' · ') }}</span>\n  </div>\n\n  <div v-else-if=\"derivation && details\" class=\"flex flex-col gap-1.5 rounded-md p-2 text-xs ring ring-[var(--sk-border)]\">\n    <div class=\"flex flex-wrap items-center gap-1\">\n      <span :class=\"[chip, 'text-[var(--sk-muted)]']\">\n        <UIcon name=\"i-lucide-git-branch\" class=\"size-3.5\" />{{ t('composites.derivation.badge') }}\n      </span>\n      <span v-if=\"details.foreign\" :class=\"[chip, 'text-[var(--sk-muted)]']\">\n        <UIcon name=\"i-lucide-file-symlink\" class=\"size-3.5\" />{{ t('composites.derivation.foreign') }}\n      </span>\n      <span v-if=\"details.stale\" :class=\"[chip, 'text-[var(--sk-warning)]']\">\n        <UIcon name=\"i-lucide-triangle-alert\" class=\"size-3.5\" />{{ t('composites.derivation.stale') }}\n      </span>\n      <span v-if=\"details.edited\" :class=\"[chip, 'text-[var(--sk-muted)]']\">\n        <UIcon name=\"i-lucide-pencil\" class=\"size-3.5\" />{{ t('composites.derivation.edited') }}\n      </span>\n    </div>\n    <dl class=\"grid grid-cols-[auto_1fr] gap-x-2 gap-y-0.5\">\n      <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.method') }}</dt>\n      <dd class=\"truncate text-[var(--sk-fg)]\">{{ method }}</dd>\n      <template v-if=\"derivation.model\">\n        <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.model') }}</dt>\n        <dd class=\"truncate text-[var(--sk-fg)]\" :title=\"derivation.model\">{{ derivation.model }}</dd>\n      </template>\n      <template v-if=\"created\">\n        <dt class=\"text-[var(--sk-muted)]\">{{ t('composites.derivation.createdAt') }}</dt>\n        <dd class=\"text-[var(--sk-fg)]\">{{ created }}</dd>\n      </template>\n    </dl>\n    <a\n      v-if=\"details.outputUrl\"\n      :href=\"details.outputUrl\"\n      target=\"_blank\"\n      rel=\"noopener\"\n      class=\"inline-flex w-fit items-center gap-1 text-[var(--sk-primary)] hover:underline\"\n    >\n      <UIcon name=\"i-lucide-external-link\" class=\"size-3.5\" />{{ t('composites.derivation.openOutput') }}\n    </a>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/features/composites/components/FocusChip.js

@@ -0,0 +1,53 @@
+import { findBlockById } from "../../../core/schema/block-ids.js";
+import { useUiKit } from "../../../vue/kit/use-ui-kit.js";
+import { useEditorI18n } from "../../../vue/use-editor-i18n.js";
+import { compositeFocusOf } from "../focus.js";
+import { computed, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, toDisplayString, unref } from "vue";
+//#region src/features/composites/components/FocusChip.vue
+const _hoisted_1 = {
+	key: 0,
+	class: "fixed bottom-4 left-1/2 z-20 flex max-w-[90vw] -translate-x-1/2 items-center gap-2 rounded-full border border-[var(--sk-border)] bg-[var(--sk-bg)] py-1 pl-3 pr-1 shadow-lg",
+	role: "status"
+};
+const _hoisted_2 = { class: "truncate text-sm" };
+/**
+* Focus mode indicator (mounted by the composites feature): while a Baustein is focused (`focusComposite`) a small chip
+* fixed at the bottom of the surface names it and leaves focus mode.
+*/
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "FocusChip",
+	props: { editor: {} },
+	setup(__props) {
+		const props = __props;
+		const { Button: UButton, Icon: UIcon } = useUiKit();
+		const { t } = useEditorI18n();
+		const focused = computed(() => {
+			if (props.editor.isDestroyed) return null;
+			const id = compositeFocusOf(props.editor.state);
+			const found = id ? findBlockById(props.editor.state.doc, id) : null;
+			return found ? { title: found.node.child(0).textContent.trim() || t("composites.untitled") } : null;
+		});
+		return (_ctx, _cache) => {
+			return focused.value ? (openBlock(), createElementBlock("div", _hoisted_1, [
+				createVNode(unref(UIcon), {
+					name: "i-lucide-focus",
+					class: "size-4 shrink-0 text-[var(--sk-primary)]"
+				}),
+				createElementVNode("span", _hoisted_2, toDisplayString(unref(t)("composites.focus.chip", { title: focused.value.title })), 1),
+				createVNode(unref(UButton), {
+					size: "xs",
+					color: "neutral",
+					variant: "ghost",
+					icon: "i-lucide-x",
+					label: unref(t)("composites.focus.release"),
+					"aria-label": unref(t)("composites.focus.leave"),
+					onClick: _cache[0] || (_cache[0] = ($event) => __props.editor.commands.focusComposite(null))
+				}, null, 8, ["label", "aria-label"])
+			])) : createCommentVNode("v-if", true);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=FocusChip.js.map

package/dist/features/composites/components/FocusChip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusChip.js","names":["_openBlock","_createElementBlock","_createVNode","_unref","_createElementVNode","_toDisplayString","_createCommentVNode"],"sources":["../../../../src/features/composites/components/FocusChip.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Editor } from '@tiptap/vue-3'\nimport { computed } from 'vue'\nimport { findBlockById } from '../../../core/schema'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { compositeFocusOf } from '../focus'\n\n/**\n * Focus mode indicator (mounted by the composites feature): while a Baustein is focused (`focusComposite`) a small chip\n * fixed at the bottom of the surface names it and leaves focus mode.\n */\nconst props = defineProps<{ editor: Editor }>()\n\nconst { Button: UButton, Icon: UIcon } = useUiKit()\nconst { t } = useEditorI18n()\n\n// The vue-3 Editor's `state` is reactive, so this follows every transaction.\nconst focused = computed(() => {\n  if (props.editor.isDestroyed) return null\n  const id = compositeFocusOf(props.editor.state)\n  const found = id ? findBlockById(props.editor.state.doc, id) : null\n  return found ? { title: found.node.child(0).textContent.trim() || t('composites.untitled') } : null\n})\n</script>\n\n<template>\n  <div\n    v-if=\"focused\"\n    class=\"fixed bottom-4 left-1/2 z-20 flex max-w-[90vw] -translate-x-1/2 items-center gap-2 rounded-full border border-[var(--sk-border)] bg-[var(--sk-bg)] py-1 pl-3 pr-1 shadow-lg\"\n    role=\"status\"\n  >\n    <UIcon name=\"i-lucide-focus\" class=\"size-4 shrink-0 text-[var(--sk-primary)]\" />\n    <span class=\"truncate text-sm\">{{ t('composites.focus.chip', { title: focused.title }) }}</span>\n    <UButton size=\"xs\" color=\"neutral\" variant=\"ghost\" icon=\"i-lucide-x\" :label=\"t('composites.focus.release')\" :aria-label=\"t('composites.focus.leave')\" @click=\"editor.commands.focusComposite(null)\" />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAEd,MAAM,EAAE,QAAQ,SAAS,MAAM,UAAU,SAAS;EAClD,MAAM,EAAE,MAAM,cAAc;EAG5B,MAAM,UAAU,eAAe;GAC7B,IAAI,MAAM,OAAO,aAAa,OAAO;GACrC,MAAM,KAAK,iBAAiB,MAAM,OAAO,KAAK;GAC9C,MAAM,QAAQ,KAAK,cAAc,MAAM,OAAO,MAAM,KAAK,EAAE,IAAI;GAC/D,OAAO,QAAQ,EAAE,OAAO,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,YAAY,KAAK,KAAK,EAAE,qBAAqB,EAAE,IAAI;EACjG,CAAC;;GAKS,OAAA,QAAA,SADRA,UAAA,GAAAC,mBAQM,OARN,YAQM;IAHJC,YAAgFC,MAAA,KAAA,GAAA;KAAzE,MAAK;KAAiB,OAAM;;IACnCC,mBAAgG,QAAhG,YAAgGC,gBAA9DF,MAAA,CAAA,CAAC,CAAA,yBAAA,EAAA,OAAmC,QAAA,MAAQ,MAAK,CAAA,CAAA,GAAA,CAAA;IACnFD,YAAsMC,MAAA,OAAA,GAAA;KAA7L,MAAK;KAAK,OAAM;KAAU,SAAQ;KAAQ,MAAK;KAAc,OAAOA,MAAA,CAAA,CAAC,CAAA,0BAAA;KAA+B,cAAYA,MAAA,CAAA,CAAC,CAAA,wBAAA;KAA6B,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,QAAA,OAAO,SAAS,eAAc,IAAA"}

package/dist/features/composites/components/FocusChip.vue.d.ts

@@ -0,0 +1,14 @@
+import { Editor } from "@tiptap/vue-3";
+//#region src/features/composites/components/FocusChip.vue.d.ts
+/**
+ * Focus mode indicator (mounted by the composites feature): while a Baustein is focused (`focusComposite`) a small chip
+ * fixed at the bottom of the surface names it and leaves focus mode.
+ */
+type __VLS_Props = {
+  editor: Editor;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+//#endregion
+export { _default as default };
+//# sourceMappingURL=FocusChip.vue.d.ts.map

package/dist/features/composites/components/SettingsEditingTab.js

@@ -1,4 +1,5 @@
 import { DRAG_HANDLE_VISIBILITIES, HEADING_CONVERSION_SCOPES, KIND_ICON_VISIBILITIES, STRUCTURE_MODES, TREE_ROOTS } from "../../../settings/values.js";
+import { SPLIT_TARGET_CHARS_MAX, clampSplitTargetChars } from "../../../settings/index.js";
 import { useUiKit } from "../../../vue/kit/use-ui-kit.js";
 import { useEditorSettings } from "../../../vue/settings.js";
 import { useEditorI18n } from "../../../vue/use-editor-i18n.js";
@@ -6,7 +7,7 @@ import { STRUCTURE_MODE_KEYS } from "../structure-mode.js";
 import { DRAG_HANDLE_KEYS, HEADING_SCOPE_KEYS, KIND_ICON_KEYS, optionItems } from "../editing-settings-keys.js";
 import { TREE_ROOT_KEYS } from "../tree-root.js";
 import _sfc_main$1 from "../../../vue/components/SettingsSection.js";
-import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, unref, withCtx } from "vue";
+import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, ref, unref, watch, withCtx, withKeys } from "vue";
 //#region src/features/composites/components/SettingsEditingTab.vue
 const _hoisted_1 = { class: "flex flex-col gap-8" };
 const _hoisted_2 = { class: "py-3" };
@@ -20,7 +21,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 	props: { kinds: {} },
 	setup(__props) {
 		const props = __props;
-		const { FormField: UFormField, RadioGroup: URadioGroup, Select: USelect } = useUiKit();
+		const { FormField: UFormField, Input: UInput, RadioGroup: URadioGroup, Select: USelect } = useUiKit();
 		const { t } = useEditorI18n();
 		const { settings } = useEditorSettings();
 		const scopeItems = computed(() => optionItems(HEADING_CONVERSION_SCOPES, HEADING_SCOPE_KEYS, t));
@@ -33,6 +34,15 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			icon: kind.icon,
 			value: kind.id
 		})));
+		const splitTarget = ref(String(settings.value.blocks.splitTargetChars));
+		watch(() => settings.value.blocks.splitTargetChars, (value) => {
+			splitTarget.value = String(value);
+		});
+		function commitSplitTarget() {
+			const next = clampSplitTargetChars(splitTarget.value, settings.value.blocks.splitTargetChars);
+			settings.value.blocks.splitTargetChars = next;
+			splitTarget.value = String(next);
+		}
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", _hoisted_1, [
 				createVNode(_sfc_main$1, { title: unref(t)("composites.settings.structure.title") }, {
@@ -86,9 +96,35 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 							}, null, 8, ["modelValue", "items"])]),
 							_: 1
 						}, 8, ["label", "description"]),
+						createVNode(unref(UFormField), {
+							orientation: "horizontal",
+							class: "py-3",
+							label: unref(t)("settings.editing.splitTargetChars")
+						}, {
+							default: withCtx(() => [createVNode(unref(UInput), {
+								"model-value": splitTarget.value,
+								type: "number",
+								min: unref(200),
+								max: unref(SPLIT_TARGET_CHARS_MAX),
+								step: 100,
+								"aria-label": unref(t)("settings.editing.splitTargetChars"),
+								class: "w-32",
+								onBlur: commitSplitTarget,
+								onKeydown: withKeys(commitSplitTarget, ["enter"]),
+								"onUpdate:modelValue": _cache[4] || (_cache[4] = (value) => {
+									splitTarget.value = String(value);
+								})
+							}, null, 8, [
+								"model-value",
+								"min",
+								"max",
+								"aria-label"
+							])]),
+							_: 1
+						}, 8, ["label"]),
 						createElementVNode("div", _hoisted_5, [createVNode(unref(URadioGroup), {
 							modelValue: unref(settings).blocks.kindIcon,
-							"onUpdate:modelValue": _cache[4] || (_cache[4] = ($event) => unref(settings).blocks.kindIcon = $event),
+							"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => unref(settings).blocks.kindIcon = $event),
 							legend: unref(t)("composites.settings.kindIcon.legend"),
 							items: kindIconItems.value
 						}, null, 8, [
@@ -98,7 +134,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 						])]),
 						createElementVNode("div", _hoisted_6, [createVNode(unref(URadioGroup), {
 							modelValue: unref(settings).blocks.dragHandle,
-							"onUpdate:modelValue": _cache[5] || (_cache[5] = ($event) => unref(settings).blocks.dragHandle = $event),
+							"onUpdate:modelValue": _cache[6] || (_cache[6] = ($event) => unref(settings).blocks.dragHandle = $event),
 							legend: unref(t)("composites.settings.dragHandle.legend"),
 							items: dragHandleItems.value
 						}, null, 8, [

package/dist/features/composites/components/SettingsEditingTab.js.map

@@ -1 +1 @@
-{"version":3,"file":"SettingsEditingTab.js","names":["_openBlock","_createElementBlock","_createVNode","SettingsSection","_unref","_withCtx","_createElementVNode"],"sources":["../../../../src/features/composites/components/SettingsEditingTab.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport SettingsSection from '../../../vue/components/SettingsSection.vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorSettings } from '../../../vue/settings'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { DRAG_HANDLE_VISIBILITIES, HEADING_CONVERSION_SCOPES, KIND_ICON_VISIBILITIES, STRUCTURE_MODES, TREE_ROOTS } from '../../../settings'\nimport { DRAG_HANDLE_KEYS, HEADING_SCOPE_KEYS, KIND_ICON_KEYS, optionItems } from '../editing-settings-keys'\nimport type { CompositeKind } from '../kinds'\nimport { STRUCTURE_MODE_KEYS } from '../structure-mode'\nimport { TREE_ROOT_KEYS } from '../tree-root'\n\n/** „Bearbeiten“: Gliederung (structure mode, conversion scope), Bausteine defaults and the visibility of the block handles. */\nconst props = defineProps<{ kinds: readonly CompositeKind[] }>()\n\nconst { FormField: UFormField, RadioGroup: URadioGroup, Select: USelect } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst { settings } = useEditorSettings()\n\nconst scopeItems = computed(() => optionItems(HEADING_CONVERSION_SCOPES, HEADING_SCOPE_KEYS, t))\nconst structureItems = computed(() => optionItems(STRUCTURE_MODES, STRUCTURE_MODE_KEYS, t))\nconst treeRootItems = computed(() => optionItems(TREE_ROOTS, TREE_ROOT_KEYS, t))\nconst kindIconItems = computed(() => optionItems(KIND_ICON_VISIBILITIES, KIND_ICON_KEYS, t))\nconst dragHandleItems = computed(() => optionItems(DRAG_HANDLE_VISIBILITIES, DRAG_HANDLE_KEYS, t))\n\nconst kindItems = computed(() => props.kinds.map(kind => ({ label: kind.label, icon: kind.icon, value: kind.id })))\n</script>\n\n<template>\n  <div class=\"flex flex-col gap-8\">\n    <SettingsSection :title=\"t('composites.settings.structure.title')\">\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.structure\" :legend=\"t('composites.settings.structure.legend')\" :items=\"structureItems\" />\n      </div>\n      <div class=\"py-3\">\n        <URadioGroup\n          v-model=\"settings.editing.headingConversionScope\"\n          :legend=\"t('composites.settings.scope.legend')\"\n          :items=\"scopeItems\"\n        />\n      </div>\n    </SettingsSection>\n\n    <SettingsSection :title=\"t('composites.settings.sidebar.title')\">\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.treeRoot\" :legend=\"t('composites.settings.treeRoot.legend')\" :items=\"treeRootItems\" />\n      </div>\n    </SettingsSection>\n\n    <SettingsSection :title=\"t('composites.settings.composites.title')\">\n      <UFormField\n        orientation=\"horizontal\"\n        class=\"py-3\"\n        :label=\"t('composites.settings.defaultKind.label')\"\n        :description=\"t('composites.settings.defaultKind.description')\"\n      >\n        <USelect v-model=\"settings.blocks.defaultKind\" :items=\"kindItems\" class=\"w-64\" />\n      </UFormField>\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.kindIcon\" :legend=\"t('composites.settings.kindIcon.legend')\" :items=\"kindIconItems\" />\n      </div>\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.dragHandle\" :legend=\"t('composites.settings.dragHandle.legend')\" :items=\"dragHandleItems\" />\n      </div>\n    </SettingsSection>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"SettingsEditingTab.js","names":["_openBlock","_createElementBlock","_createVNode","SettingsSection","_unref","_withCtx","_createElementVNode","_withKeys"],"sources":["../../../../src/features/composites/components/SettingsEditingTab.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport SettingsSection from '../../../vue/components/SettingsSection.vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorSettings } from '../../../vue/settings'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { clampSplitTargetChars, DRAG_HANDLE_VISIBILITIES, HEADING_CONVERSION_SCOPES, KIND_ICON_VISIBILITIES, SPLIT_TARGET_CHARS_MAX, SPLIT_TARGET_CHARS_MIN, STRUCTURE_MODES, TREE_ROOTS } from '../../../settings'\nimport { DRAG_HANDLE_KEYS, HEADING_SCOPE_KEYS, KIND_ICON_KEYS, optionItems } from '../editing-settings-keys'\nimport type { CompositeKind } from '../kinds'\nimport { STRUCTURE_MODE_KEYS } from '../structure-mode'\nimport { TREE_ROOT_KEYS } from '../tree-root'\n\n/** „Bearbeiten“: Gliederung (structure mode, conversion scope), Bausteine defaults and the visibility of the block handles. */\nconst props = defineProps<{ kinds: readonly CompositeKind[] }>()\n\nconst { FormField: UFormField, Input: UInput, RadioGroup: URadioGroup, Select: USelect } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst { settings } = useEditorSettings()\n\nconst scopeItems = computed(() => optionItems(HEADING_CONVERSION_SCOPES, HEADING_SCOPE_KEYS, t))\nconst structureItems = computed(() => optionItems(STRUCTURE_MODES, STRUCTURE_MODE_KEYS, t))\nconst treeRootItems = computed(() => optionItems(TREE_ROOTS, TREE_ROOT_KEYS, t))\nconst kindIconItems = computed(() => optionItems(KIND_ICON_VISIBILITIES, KIND_ICON_KEYS, t))\nconst dragHandleItems = computed(() => optionItems(DRAG_HANDLE_VISIBILITIES, DRAG_HANDLE_KEYS, t))\n\nconst kindItems = computed(() => props.kinds.map(kind => ({ label: kind.label, icon: kind.icon, value: kind.id })))\n\n// The target size is edited as text and written back clamped to its range when the field is left, so a half-typed number never reaches the settings.\nconst splitTarget = ref(String(settings.value.blocks.splitTargetChars))\nwatch(() => settings.value.blocks.splitTargetChars, (value) => { splitTarget.value = String(value) })\nfunction commitSplitTarget() {\n  const next = clampSplitTargetChars(splitTarget.value, settings.value.blocks.splitTargetChars)\n  settings.value.blocks.splitTargetChars = next\n  splitTarget.value = String(next)\n}\n</script>\n\n<template>\n  <div class=\"flex flex-col gap-8\">\n    <SettingsSection :title=\"t('composites.settings.structure.title')\">\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.structure\" :legend=\"t('composites.settings.structure.legend')\" :items=\"structureItems\" />\n      </div>\n      <div class=\"py-3\">\n        <URadioGroup\n          v-model=\"settings.editing.headingConversionScope\"\n          :legend=\"t('composites.settings.scope.legend')\"\n          :items=\"scopeItems\"\n        />\n      </div>\n    </SettingsSection>\n\n    <SettingsSection :title=\"t('composites.settings.sidebar.title')\">\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.treeRoot\" :legend=\"t('composites.settings.treeRoot.legend')\" :items=\"treeRootItems\" />\n      </div>\n    </SettingsSection>\n\n    <SettingsSection :title=\"t('composites.settings.composites.title')\">\n      <UFormField\n        orientation=\"horizontal\"\n        class=\"py-3\"\n        :label=\"t('composites.settings.defaultKind.label')\"\n        :description=\"t('composites.settings.defaultKind.description')\"\n      >\n        <USelect v-model=\"settings.blocks.defaultKind\" :items=\"kindItems\" class=\"w-64\" />\n      </UFormField>\n      <UFormField orientation=\"horizontal\" class=\"py-3\" :label=\"t('settings.editing.splitTargetChars')\">\n        <UInput\n          :model-value=\"splitTarget\"\n          type=\"number\"\n          :min=\"SPLIT_TARGET_CHARS_MIN\"\n          :max=\"SPLIT_TARGET_CHARS_MAX\"\n          :step=\"100\"\n          :aria-label=\"t('settings.editing.splitTargetChars')\"\n          class=\"w-32\"\n          @blur=\"commitSplitTarget\"\n          @keydown.enter=\"commitSplitTarget\"\n          @update:model-value=\"(value: unknown) => { splitTarget = String(value) }\"\n        />\n      </UFormField>\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.kindIcon\" :legend=\"t('composites.settings.kindIcon.legend')\" :items=\"kindIconItems\" />\n      </div>\n      <div class=\"py-3\">\n        <URadioGroup v-model=\"settings.blocks.dragHandle\" :legend=\"t('composites.settings.dragHandle.legend')\" :items=\"dragHandleItems\" />\n      </div>\n    </SettingsSection>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/features/composites/derivation.d.ts

@@ -9,7 +9,8 @@ export type DerivationMethod = 'transcription' | 'pdf-text' | 'ocr' | 'descripti
 export type DerivationSource = {
   asset: string;
 } | {
-  block: string;
+  block: string; /** Document the block lives in; absent = this document. */
+  document?: string;
 };
 /** `meta.derivation` of a derived Baustein. */
 export interface Derivation {

package/dist/features/composites/derivation.js

@@ -12,6 +12,10 @@ function derivationOf(node) {
 	if (!from || typeof from !== "object" || typeof method !== "string") return null;
 	return value;
 }
+/** Whether `derivation` points at a block of another document than `documentId` (the open one; null/undefined = unknown, so any named document is another). */
+function isForeignSource(derivation, documentId) {
+	return "block" in derivation.from && !!derivation.from.document && derivation.from.document !== documentId;
+}
 const ASSET_URL_PREFIX = `${EDITOR_API}/assets/`;
 const ASSET_NAME = /^[0-9a-f-]{36}\.[a-z0-9]{1,8}$/;
 const ASSET_DOCUMENT_ID = /^[A-Za-z0-9_-]{1,64}$/;
@@ -93,6 +97,6 @@ function bodyMarkdown(editor, composite) {
 	});
 }
 //#endregion
-export { DERIVATION_KEY, assetRefOf, bodyMarkdown, derivationOf, derivationState, renditionsOf, sourceOf };
+export { DERIVATION_KEY, assetRefOf, bodyMarkdown, derivationOf, derivationState, isForeignSource, renditionsOf, sourceOf };
 
 //# sourceMappingURL=derivation.js.map