@ecsplico/editor 3.6.0 → 4.1.0

package/dist/features/image-studio/components/ImageStudioLibraryPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageStudioLibraryPanel.js","names":["_openBlock","_createElementBlock","_createElementVNode","_createVNode","_unref","_Fragment","_renderList","_createBlock","_createCommentVNode","_toDisplayString","ImageStudioLibraryTile"],"sources":["../../../../src/features/image-studio/components/ImageStudioLibraryPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, onMounted, reactive, ref, watch } from 'vue'\nimport { fetchErrorMessage } from '../../../core'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport type { ImageStudioLibrary, ImageStudioLibraryItem } from '../library'\nimport type { ImageStudioState } from '../state'\nimport ImageStudioLibraryTile from './ImageStudioLibraryTile.vue'\n\n/**\n * The gallery tab of the Bild-Studio: search, one select per facet of the host and the host's images as tiles. The\n * list is read on mount (the facets with their first option chosen), after a facet change and 300 ms after the last\n * keystroke of the search; a newer read aborts the running one. Picking, referencing, renaming and deleting go to the\n * host (`library`) or up to the dialog (`use`, `reference`, `removed`), which applies the reducers.\n */\nconst props = defineProps<{ library: ImageStudioLibrary, state: ImageStudioState }>()\nconst emit = defineEmits<{ use: [item: ImageStudioLibraryItem], reference: [item: ImageStudioLibraryItem], removed: [id: string] }>()\n\nconst { Alert: UAlert, Input: UInput, Select: USelect } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst SEARCH_DELAY_MS = 300\n\nconst facets = props.library.facets()\nconst values = reactive<Record<string, string>>(Object.fromEntries(facets.map(facet => [facet.id, facet.options[0]?.value ?? ''])))\nconst search = ref('')\nconst items = ref<readonly ImageStudioLibraryItem[]>([])\nconst busy = ref(false)\nconst problem = ref<string>()\n\nlet controller: AbortController | undefined\nlet searchTimer: ReturnType<typeof setTimeout> | undefined\n\nasync function load() {\n  clearTimeout(searchTimer)\n  searchTimer = undefined\n  controller?.abort()\n  const own = new AbortController()\n  controller = own\n  busy.value = true\n  problem.value = undefined\n  try {\n    const found = await props.library.list({ search: search.value, facets: { ...values } }, own.signal)\n    if (own.signal.aborted) return\n    items.value = found\n  } catch (error) {\n    if (own.signal.aborted) return\n    problem.value = t('imageStudio.dialog.library.failed', { message: fetchErrorMessage(error) })\n  } finally {\n    if (controller === own) {\n      controller = undefined\n      busy.value = false\n    }\n  }\n}\n\nonMounted(() => void load())\nwatch(values, () => void load())\nwatch(search, () => {\n  clearTimeout(searchTimer)\n  searchTimer = setTimeout(() => void load(), SEARCH_DELAY_MS)\n})\nonBeforeUnmount(() => {\n  clearTimeout(searchTimer)\n  controller?.abort()\n})\n\nconst held = (id: string) => props.state.references.some(image => image.id === id) || props.state.generations.some(image => image.id === id)\n\nasync function rename(item: ImageStudioLibraryItem, title: string) {\n  if (!props.library.rename) return\n  problem.value = undefined\n  try {\n    const renamed = await props.library.rename(item.id, title)\n    items.value = items.value.map(other => other.id === item.id ? renamed : other)\n  } catch (error) {\n    problem.value = fetchErrorMessage(error)\n  }\n}\n\nasync function remove(item: ImageStudioLibraryItem) {\n  if (!props.library.remove) return\n  problem.value = undefined\n  try {\n    await props.library.remove(item.id)\n    items.value = items.value.filter(other => other.id !== item.id)\n    emit('removed', item.id)\n  } catch (error) {\n    problem.value = fetchErrorMessage(error)\n  }\n}\n</script>\n\n<template>\n  <section class=\"flex flex-col gap-3 p-1\" data-image-studio-library>\n    <div class=\"flex flex-wrap items-center gap-2\">\n      <UInput\n        v-model=\"search\"\n        class=\"min-w-40 flex-1\"\n        icon=\"i-lucide-search\"\n        size=\"xs\"\n        :placeholder=\"t('imageStudio.dialog.library.search')\"\n        :aria-label=\"t('imageStudio.dialog.library.search')\"\n        data-image-studio-library-search\n      />\n      <USelect\n        v-for=\"facet in facets\"\n        :key=\"facet.id\"\n        v-model=\"values[facet.id]\"\n        :items=\"facet.options.map(option => ({ label: option.label, value: option.value }))\"\n        size=\"xs\"\n        :aria-label=\"facet.label\"\n        :data-image-studio-facet=\"facet.id\"\n      />\n    </div>\n    <UAlert v-if=\"problem\" color=\"error\" variant=\"subtle\" :title=\"problem\" />\n    <p v-if=\"busy\" class=\"text-sm text-[var(--sk-muted)]\" role=\"status\">\n      {{ t('imageStudio.dialog.library.loading') }}\n    </p>\n    <p v-else-if=\"!items.length && !problem\" class=\"text-sm text-[var(--sk-muted)]\">\n      {{ t('imageStudio.dialog.library.empty') }}\n    </p>\n    <ul v-if=\"items.length\" class=\"grid grid-cols-2 gap-2 sm:grid-cols-3\">\n      <ImageStudioLibraryTile\n        v-for=\"item in items\"\n        :key=\"item.id\"\n        :item=\"item\"\n        :selected=\"state.selected === item.id\"\n        :held=\"held(item.id)\"\n        :renamable=\"Boolean(library.rename)\"\n        :removable=\"Boolean(library.remove)\"\n        @use=\"emit('use', item)\"\n        @reference=\"emit('reference', item)\"\n        @rename=\"title => rename(item, title)\"\n        @remove=\"remove(item)\"\n      />\n    </ul>\n  </section>\n</template>\n"],"mappings":"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"}

package/dist/features/image-studio/components/ImageStudioLibraryTile.js

@@ -0,0 +1,134 @@
+import { useUiKit } from "../../../vue/kit/use-ui-kit.js";
+import { useEditorI18n } from "../../../vue/use-editor-i18n.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, openBlock, ref, toDisplayString, unref, withKeys, withModifiers } from "vue";
+//#region src/features/image-studio/components/ImageStudioLibraryTile.vue
+const _hoisted_1 = ["data-selected"];
+const _hoisted_2 = { class: "block overflow-hidden rounded bg-[var(--sk-bg-elevated)]" };
+const _hoisted_3 = ["src", "alt"];
+const _hoisted_4 = { class: "flex min-w-0 flex-col" };
+const _hoisted_5 = ["title"];
+const _hoisted_6 = ["title"];
+const _hoisted_7 = { class: "flex flex-wrap items-center justify-between gap-1" };
+const _hoisted_8 = { class: "flex items-center" };
+/**
+* One image of the host's gallery. „Als Bild verwenden“ makes it the block's image, „Als Referenz“ adds it to the
+* references (disabled once the block holds it), the pencil renames it in place (Enter commits, Escape or blur cancels)
+* and the trash asks the host to delete it. The host's `subtitle` shows under the title.
+*/
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	__name: "ImageStudioLibraryTile",
+	props: {
+		item: {},
+		selected: { type: Boolean },
+		held: { type: Boolean },
+		renamable: { type: Boolean },
+		removable: { type: Boolean }
+	},
+	emits: [
+		"use",
+		"reference",
+		"rename",
+		"remove"
+	],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const { Button: UButton, Input: UInput } = useUiKit();
+		const { t } = useEditorI18n();
+		const title = computed(() => props.item.title || t("imageStudio.dialog.tile.untitled"));
+		const editing = ref(false);
+		const draft = ref("");
+		function startRename() {
+			draft.value = props.item.title;
+			editing.value = true;
+		}
+		function commitRename() {
+			if (!editing.value) return;
+			editing.value = false;
+			const next = draft.value.trim();
+			if (next !== "" && next !== props.item.title) emit("rename", next);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("li", {
+				class: "flex flex-col gap-1.5 rounded-md border border-[var(--sk-border)] p-1.5 data-[selected=true]:border-[var(--sk-primary)]",
+				"data-selected": __props.selected,
+				"data-image-studio-library-tile": ""
+			}, [
+				createElementVNode("div", _hoisted_2, [createElementVNode("img", {
+					src: __props.item.url,
+					alt: title.value,
+					class: "aspect-square w-full object-cover",
+					draggable: "false"
+				}, null, 8, _hoisted_3)]),
+				createElementVNode("div", _hoisted_4, [editing.value ? (openBlock(), createBlock(unref(UInput), {
+					key: 0,
+					modelValue: draft.value,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => draft.value = $event),
+					size: "xs",
+					autofocus: "",
+					"aria-label": unref(t)("imageStudio.dialog.library.rename"),
+					"data-image-studio-library-rename": "",
+					onKeydown: [withKeys(withModifiers(commitRename, ["prevent"]), ["enter"]), _cache[1] || (_cache[1] = withKeys(withModifiers(($event) => editing.value = false, ["prevent", "stop"]), ["esc"]))],
+					onBlur: _cache[2] || (_cache[2] = ($event) => editing.value = false)
+				}, null, 8, [
+					"modelValue",
+					"aria-label",
+					"onKeydown"
+				])) : (openBlock(), createElementBlock("span", {
+					key: 1,
+					class: "truncate text-xs font-medium text-[var(--sk-fg-highlighted)]",
+					title: title.value
+				}, toDisplayString(title.value), 9, _hoisted_5)), __props.item.subtitle ? (openBlock(), createElementBlock("span", {
+					key: 2,
+					class: "truncate text-xs text-[var(--sk-muted)]",
+					title: __props.item.subtitle
+				}, toDisplayString(__props.item.subtitle), 9, _hoisted_6)) : createCommentVNode("v-if", true)]),
+				createElementVNode("div", _hoisted_7, [
+					createVNode(unref(UButton), {
+						label: unref(t)("imageStudio.dialog.tile.use"),
+						icon: __props.selected ? "i-lucide-check" : void 0,
+						size: "xs",
+						color: "primary",
+						variant: __props.selected ? "solid" : "outline",
+						"aria-pressed": __props.selected,
+						onClick: _cache[3] || (_cache[3] = ($event) => emit("use"))
+					}, null, 8, [
+						"label",
+						"icon",
+						"variant",
+						"aria-pressed"
+					]),
+					createVNode(unref(UButton), {
+						label: unref(t)("imageStudio.dialog.library.reference"),
+						size: "xs",
+						color: "neutral",
+						variant: "outline",
+						disabled: __props.held,
+						onClick: _cache[4] || (_cache[4] = ($event) => emit("reference"))
+					}, null, 8, ["label", "disabled"]),
+					createElementVNode("span", _hoisted_8, [__props.renamable ? (openBlock(), createBlock(unref(UButton), {
+						key: 0,
+						icon: "i-lucide-pencil",
+						size: "xs",
+						color: "neutral",
+						variant: "ghost",
+						"aria-label": unref(t)("imageStudio.dialog.library.rename"),
+						onClick: startRename
+					}, null, 8, ["aria-label"])) : createCommentVNode("v-if", true), __props.removable ? (openBlock(), createBlock(unref(UButton), {
+						key: 1,
+						icon: "i-lucide-trash-2",
+						size: "xs",
+						color: "neutral",
+						variant: "ghost",
+						"aria-label": unref(t)("imageStudio.dialog.library.remove"),
+						onClick: _cache[5] || (_cache[5] = ($event) => emit("remove"))
+					}, null, 8, ["aria-label"])) : createCommentVNode("v-if", true)])
+				])
+			], 8, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { _sfc_main as default };
+
+//# sourceMappingURL=ImageStudioLibraryTile.js.map

package/dist/features/image-studio/components/ImageStudioLibraryTile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageStudioLibraryTile.js","names":["_openBlock","_createElementBlock","_createElementVNode","_createBlock","_unref","_withKeys","_withModifiers","_toDisplayString","_createCommentVNode","_createVNode"],"sources":["../../../../src/features/image-studio/components/ImageStudioLibraryTile.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport type { ImageStudioLibraryItem } from '../library'\n\n/**\n * One image of the host's gallery. „Als Bild verwenden“ makes it the block's image, „Als Referenz“ adds it to the\n * references (disabled once the block holds it), the pencil renames it in place (Enter commits, Escape or blur cancels)\n * and the trash asks the host to delete it. The host's `subtitle` shows under the title.\n */\nconst props = defineProps<{ item: ImageStudioLibraryItem, selected: boolean, held: boolean, renamable: boolean, removable: boolean }>()\nconst emit = defineEmits<{ use: [], reference: [], rename: [title: string], remove: [] }>()\n\nconst { Button: UButton, Input: UInput } = useUiKit()\nconst { t } = useEditorI18n()\n\nconst title = computed(() => props.item.title || t('imageStudio.dialog.tile.untitled'))\n\nconst editing = ref(false)\nconst draft = ref('')\n\nfunction startRename() {\n  draft.value = props.item.title\n  editing.value = true\n}\n\nfunction commitRename() {\n  if (!editing.value) return\n  editing.value = false\n  const next = draft.value.trim()\n  if (next !== '' && next !== props.item.title) emit('rename', next)\n}\n</script>\n\n<template>\n  <li\n    class=\"flex flex-col gap-1.5 rounded-md border border-[var(--sk-border)] p-1.5 data-[selected=true]:border-[var(--sk-primary)]\"\n    :data-selected=\"selected\"\n    data-image-studio-library-tile\n  >\n    <div class=\"block overflow-hidden rounded bg-[var(--sk-bg-elevated)]\">\n      <img :src=\"item.url\" :alt=\"title\" class=\"aspect-square w-full object-cover\" draggable=\"false\">\n    </div>\n    <div class=\"flex min-w-0 flex-col\">\n      <UInput\n        v-if=\"editing\"\n        v-model=\"draft\"\n        size=\"xs\"\n        autofocus\n        :aria-label=\"t('imageStudio.dialog.library.rename')\"\n        data-image-studio-library-rename\n        @keydown.enter.prevent=\"commitRename\"\n        @keydown.esc.prevent.stop=\"editing = false\"\n        @blur=\"editing = false\"\n      />\n      <span v-else class=\"truncate text-xs font-medium text-[var(--sk-fg-highlighted)]\" :title=\"title\">{{ title }}</span>\n      <span v-if=\"item.subtitle\" class=\"truncate text-xs text-[var(--sk-muted)]\" :title=\"item.subtitle\">{{ item.subtitle }}</span>\n    </div>\n    <div class=\"flex flex-wrap items-center justify-between gap-1\">\n      <UButton\n        :label=\"t('imageStudio.dialog.tile.use')\"\n        :icon=\"selected ? 'i-lucide-check' : undefined\"\n        size=\"xs\"\n        color=\"primary\"\n        :variant=\"selected ? 'solid' : 'outline'\"\n        :aria-pressed=\"selected\"\n        @click=\"emit('use')\"\n      />\n      <UButton\n        :label=\"t('imageStudio.dialog.library.reference')\"\n        size=\"xs\"\n        color=\"neutral\"\n        variant=\"outline\"\n        :disabled=\"held\"\n        @click=\"emit('reference')\"\n      />\n      <span class=\"flex items-center\">\n        <UButton\n          v-if=\"renamable\"\n          icon=\"i-lucide-pencil\"\n          size=\"xs\"\n          color=\"neutral\"\n          variant=\"ghost\"\n          :aria-label=\"t('imageStudio.dialog.library.rename')\"\n          @click=\"startRename\"\n        />\n        <UButton\n          v-if=\"removable\"\n          icon=\"i-lucide-trash-2\"\n          size=\"xs\"\n          color=\"neutral\"\n          variant=\"ghost\"\n          :aria-label=\"t('imageStudio.dialog.library.remove')\"\n          @click=\"emit('remove')\"\n        />\n      </span>\n    </div>\n  </li>\n</template>\n"],"mappings":"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"}

package/dist/features/image-studio/components/ImageStudioView.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImageStudioView.js","names":["selected","node","editor","_openBlock","_createBlock","_unref","_normalizeClass","_withCtx","_createElementVNode","_createElementBlock","_createVNode","_toDisplayString","_createCommentVNode","ImageStudioDialog"],"sources":["../../../../src/features/image-studio/components/ImageStudioView.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { NodeViewWrapper, nodeViewProps } from '@tiptap/vue-3'\nimport { computed, onBeforeUnmount, ref, shallowRef, toRaw } from 'vue'\nimport { editorEntryOf } from '../../../core'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { useNotifier } from '../../../vue/use-notifier'\nimport { SCRATCH_DOCUMENT_ID } from '../../media/assets'\nimport { createImageStudioNodeStore, type ImageStudioNodeStore } from '../node-store'\nimport { normalizeImageStudioState } from '../state'\nimport ImageStudioDialog from './ImageStudioDialog.vue'\n\nconst props = defineProps(nodeViewProps)\n\nconst { Button: UButton, Icon: UIcon } = useUiKit()\nconst { t } = useEditorI18n()\nconst notify = useNotifier(() => props.editor)\n\nconst studio = computed(() => normalizeImageStudioState(props.node.attrs.studio))\nconst description = computed(() => studio.value.description.trim())\n\n// The store (and with it the Prompt-Bausteine list) is built when the studio opens first and lives as long as the view.\nconst open = ref(false)\nconst store = shallowRef<ImageStudioNodeStore>()\n\n/** Opens the studio dialog; a read-only editor opens none, a backend without image generation explains itself. */\nfunction openStudio() {\n  if (!props.editor.isEditable) return\n  const ctx = editorEntryOf(toRaw(props.editor))?.ctx\n  const backend = ctx?.backend.images\n  if (!ctx || !backend) {\n    notify({ id: 'image-studio.unavailable', title: t('imageStudio.action.notConfigured'), kind: 'warning' })\n    return\n  }\n  store.value ??= createImageStudioNodeStore({\n    editor: toRaw(props.editor),\n    getPos: props.getPos,\n    backend,\n    documentId: ctx.documentId ?? SCRATCH_DOCUMENT_ID,\n  })\n  open.value = true\n}\n\nonBeforeUnmount(() => store.value?.dispose())\n</script>\n\n<template>\n  <NodeViewWrapper\n    as=\"figure\"\n    data-image-studio-block\n    :class=\"['my-3 flex flex-col gap-2 rounded-md', { 'outline-2 outline-offset-2 outline-[var(--sk-primary)]': selected }]\"\n    @dblclick=\"openStudio\"\n    @sk-image-studio-open=\"openStudio\"\n  >\n    <div class=\"flex flex-col gap-2\" contenteditable=\"false\">\n      <img\n        v-if=\"node.attrs.src\"\n        :src=\"node.attrs.src\"\n        :alt=\"node.attrs.alt || description\"\n        class=\"m-0 max-w-full rounded-md\"\n      >\n      <div\n        v-else\n        class=\"flex min-h-32 flex-col items-center justify-center gap-2 rounded-md border border-dashed border-[var(--sk-border)] p-4 text-center text-sm\"\n      >\n        <UIcon name=\"i-lucide-image-plus\" class=\"size-6 shrink-0 text-[var(--sk-fg-dimmed)]\" />\n        <span v-if=\"description\" class=\"whitespace-pre-wrap text-[var(--sk-muted)]\">{{ description }}</span>\n        <span v-else class=\"text-[var(--sk-fg-dimmed)]\">{{ t('imageStudio.node.noDescription') }}</span>\n      </div>\n      <figcaption v-if=\"node.attrs.src && description\" class=\"whitespace-pre-wrap px-1 text-sm text-[var(--sk-muted)]\">\n        {{ description }}\n      </figcaption>\n      <div v-if=\"editor.isEditable\" class=\"flex\">\n        <UButton\n          :label=\"t('imageStudio.node.open')\"\n          icon=\"i-lucide-wand-sparkles\"\n          size=\"xs\"\n          color=\"neutral\"\n          variant=\"soft\"\n          @click=\"openStudio\"\n        />\n      </div>\n    </div>\n    <ImageStudioDialog\n      v-if=\"store\"\n      v-model:open=\"open\"\n      :store=\"store\"\n      :title=\"t('imageStudio.node.dialogTitle')\"\n    />\n  </NodeViewWrapper>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAEd,MAAM,EAAE,QAAQ,SAAS,MAAM,UAAU,SAAS;EAClD,MAAM,EAAE,MAAM,cAAc;EAC5B,MAAM,SAAS,kBAAkB,MAAM,MAAM;EAE7C,MAAM,SAAS,eAAe,0BAA0B,MAAM,KAAK,MAAM,MAAM,CAAC;EAChF,MAAM,cAAc,eAAe,OAAO,MAAM,YAAY,KAAK,CAAC;EAGlE,MAAM,OAAO,IAAI,KAAK;EACtB,MAAM,QAAQ,WAAiC;;EAG/C,SAAS,aAAa;GACpB,IAAI,CAAC,MAAM,OAAO,YAAY;GAC9B,MAAM,MAAM,cAAc,MAAM,MAAM,MAAM,CAAC,CAAC,EAAE;GAChD,MAAM,UAAU,KAAK,QAAQ;GAC7B,IAAI,CAAC,OAAO,CAAC,SAAS;IACpB,OAAO;KAAE,IAAI;KAA4B,OAAO,EAAE,kCAAkC;KAAG,MAAM;IAAU,CAAC;IACxG;GACF;GACA,MAAM,UAAU,2BAA2B;IACzC,QAAQ,MAAM,MAAM,MAAM;IAC1B,QAAQ,MAAM;IACd;IACA,YAAY,IAAI,cAAA;GAClB,CAAC;GACD,KAAK,QAAQ;EACf;EAEA,sBAAsB,MAAM,OAAO,QAAQ,CAAC;;GAI1C,OAAAG,UAAA,GAAAC,YA0CkBC,MAAA,eAAA,GAAA;IAzChB,IAAG;IACH,2BAAA;IACC,OAAKC,eAAA,CAAA,uCAAA,EAAA,0DAAsGN,KAAAA,SAAQ,CAAA,CAAA;IACnH,YAAU;IACV,qBAAsB;;IAEvB,SAAAO,cA4BM,CA5BNC,mBA4BM,OA5BN,YA4BM;KA1BIP,KAAAA,KAAK,MAAM,OADnBE,UAAA,GAAAM,mBAKC,OAAA;;MAHE,KAAKR,KAAAA,KAAK,MAAM;MAChB,KAAKA,KAAAA,KAAK,MAAM,OAAO,YAAA;MACxB,OAAM;KAER,GAAA,MAAA,GAAA,UAAA,MAAAE,UAAA,GAAAM,mBAOM,OAPN,YAOM,CAHJC,YAAuFL,MAAA,KAAA,GAAA;MAAhF,MAAK;MAAsB,OAAM;KAC5B,CAAA,GAAA,YAAA,SAAZF,UAAA,GAAAM,mBAAoG,QAApG,YAAoGE,gBAArB,YAAA,KAAW,GAAA,CAAA,MAC1FR,UAAA,GAAAM,mBAAgG,QAAhG,YAAgGE,gBAA7CN,MAAA,CAAA,CAAC,CAAA,gCAAA,CAAA,GAAA,CAAA,EAAA,CAAA;KAEpCJ,KAAAA,KAAK,MAAM,OAAO,YAAA,SAApCE,UAAA,GAAAM,mBAEa,cAFb,YAEaE,gBADR,YAAA,KAAW,GAAA,CAAA,KAAAC,mBAAA,QAAA,IAAA;KAELV,KAAAA,OAAO,cAAlBC,UAAA,GAAAM,mBASM,OATN,YASM,CARJC,YAOEL,MAAA,OAAA,GAAA;MANC,OAAOA,MAAA,CAAA,CAAC,CAAA,uBAAA;MACT,MAAK;MACL,MAAK;MACL,OAAM;MACN,SAAQ;MACP,SAAO;;IAKN,CAAA,GAAA,MAAA,SADRF,UAAA,GAAAC,YAKES,aAAA;;KAHQ,MAAM,KAAA;KAAA,iBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,KAAI,QAAA;KACjB,OAAO,MAAA;KACP,OAAOR,MAAA,CAAA,CAAC,CAAA,8BAAA"}
+{"version":3,"file":"ImageStudioView.js","names":["selected","node","editor","_openBlock","_createBlock","_unref","_normalizeClass","_withCtx","_createElementVNode","_createElementBlock","_createVNode","_toDisplayString","_createCommentVNode","ImageStudioDialog"],"sources":["../../../../src/features/image-studio/components/ImageStudioView.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { NodeViewWrapper, nodeViewProps } from '@tiptap/vue-3'\nimport { computed, onBeforeUnmount, ref, shallowRef, toRaw } from 'vue'\nimport { editorEntryOf } from '../../../core'\nimport { useUiKit } from '../../../vue/kit/use-ui-kit'\nimport { useEditorI18n } from '../../../vue/use-editor-i18n'\nimport { useNotifier } from '../../../vue/use-notifier'\nimport { SCRATCH_DOCUMENT_ID } from '../../media/assets'\nimport { createImageStudioNodeStore, type ImageStudioNodeStore } from '../node-store'\nimport { normalizeImageStudioState } from '../state'\nimport ImageStudioDialog from './ImageStudioDialog.vue'\n\nconst props = defineProps(nodeViewProps)\n\nconst { Button: UButton, Icon: UIcon } = useUiKit()\nconst { t } = useEditorI18n()\nconst notify = useNotifier(() => props.editor)\n\nconst studio = computed(() => normalizeImageStudioState(props.node.attrs.studio))\nconst description = computed(() => studio.value.description.trim())\n\n// The store (and with it the prompt blocks list) is built when the studio opens first and lives as long as the view.\nconst open = ref(false)\nconst store = shallowRef<ImageStudioNodeStore>()\n\n/** Opens the studio dialog; a read-only editor opens none, a backend without image generation explains itself. */\nfunction openStudio() {\n  if (!props.editor.isEditable) return\n  const ctx = editorEntryOf(toRaw(props.editor))?.ctx\n  const backend = ctx?.backend.images\n  if (!ctx || !backend) {\n    notify({ id: 'image-studio.unavailable', title: t('imageStudio.action.notConfigured'), kind: 'warning' })\n    return\n  }\n  store.value ??= createImageStudioNodeStore({\n    editor: toRaw(props.editor),\n    getPos: props.getPos,\n    backend,\n    documentId: ctx.documentId ?? SCRATCH_DOCUMENT_ID,\n  })\n  open.value = true\n}\n\nonBeforeUnmount(() => store.value?.dispose())\n</script>\n\n<template>\n  <NodeViewWrapper\n    as=\"figure\"\n    data-image-studio-block\n    :class=\"['my-3 flex flex-col gap-2 rounded-md', { 'outline-2 outline-offset-2 outline-[var(--sk-primary)]': selected }]\"\n    @dblclick=\"openStudio\"\n    @sk-image-studio-open=\"openStudio\"\n  >\n    <div class=\"flex flex-col gap-2\" contenteditable=\"false\">\n      <img\n        v-if=\"node.attrs.src\"\n        :src=\"node.attrs.src\"\n        :alt=\"node.attrs.alt || description\"\n        class=\"m-0 max-w-full rounded-md\"\n      >\n      <div\n        v-else\n        class=\"flex min-h-32 flex-col items-center justify-center gap-2 rounded-md border border-dashed border-[var(--sk-border)] p-4 text-center text-sm\"\n      >\n        <UIcon name=\"i-lucide-image-plus\" class=\"size-6 shrink-0 text-[var(--sk-fg-dimmed)]\" />\n        <span v-if=\"description\" class=\"whitespace-pre-wrap text-[var(--sk-muted)]\">{{ description }}</span>\n        <span v-else class=\"text-[var(--sk-fg-dimmed)]\">{{ t('imageStudio.node.noDescription') }}</span>\n      </div>\n      <figcaption v-if=\"node.attrs.src && description\" class=\"whitespace-pre-wrap px-1 text-sm text-[var(--sk-muted)]\">\n        {{ description }}\n      </figcaption>\n      <div v-if=\"editor.isEditable\" class=\"flex\">\n        <UButton\n          :label=\"t('imageStudio.node.open')\"\n          icon=\"i-lucide-wand-sparkles\"\n          size=\"xs\"\n          color=\"neutral\"\n          variant=\"soft\"\n          @click=\"openStudio\"\n        />\n      </div>\n    </div>\n    <ImageStudioDialog\n      v-if=\"store\"\n      v-model:open=\"open\"\n      :store=\"store\"\n      :title=\"t('imageStudio.node.dialogTitle')\"\n    />\n  </NodeViewWrapper>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EAEd,MAAM,EAAE,QAAQ,SAAS,MAAM,UAAU,SAAS;EAClD,MAAM,EAAE,MAAM,cAAc;EAC5B,MAAM,SAAS,kBAAkB,MAAM,MAAM;EAE7C,MAAM,SAAS,eAAe,0BAA0B,MAAM,KAAK,MAAM,MAAM,CAAC;EAChF,MAAM,cAAc,eAAe,OAAO,MAAM,YAAY,KAAK,CAAC;EAGlE,MAAM,OAAO,IAAI,KAAK;EACtB,MAAM,QAAQ,WAAiC;;EAG/C,SAAS,aAAa;GACpB,IAAI,CAAC,MAAM,OAAO,YAAY;GAC9B,MAAM,MAAM,cAAc,MAAM,MAAM,MAAM,CAAC,CAAC,EAAE;GAChD,MAAM,UAAU,KAAK,QAAQ;GAC7B,IAAI,CAAC,OAAO,CAAC,SAAS;IACpB,OAAO;KAAE,IAAI;KAA4B,OAAO,EAAE,kCAAkC;KAAG,MAAM;IAAU,CAAC;IACxG;GACF;GACA,MAAM,UAAU,2BAA2B;IACzC,QAAQ,MAAM,MAAM,MAAM;IAC1B,QAAQ,MAAM;IACd;IACA,YAAY,IAAI,cAAA;GAClB,CAAC;GACD,KAAK,QAAQ;EACf;EAEA,sBAAsB,MAAM,OAAO,QAAQ,CAAC;;GAI1C,OAAAG,UAAA,GAAAC,YA0CkBC,MAAA,eAAA,GAAA;IAzChB,IAAG;IACH,2BAAA;IACC,OAAKC,eAAA,CAAA,uCAAA,EAAA,0DAAsGN,KAAAA,SAAQ,CAAA,CAAA;IACnH,YAAU;IACV,qBAAsB;;IAEvB,SAAAO,cA4BM,CA5BNC,mBA4BM,OA5BN,YA4BM;KA1BIP,KAAAA,KAAK,MAAM,OADnBE,UAAA,GAAAM,mBAKC,OAAA;;MAHE,KAAKR,KAAAA,KAAK,MAAM;MAChB,KAAKA,KAAAA,KAAK,MAAM,OAAO,YAAA;MACxB,OAAM;KAER,GAAA,MAAA,GAAA,UAAA,MAAAE,UAAA,GAAAM,mBAOM,OAPN,YAOM,CAHJC,YAAuFL,MAAA,KAAA,GAAA;MAAhF,MAAK;MAAsB,OAAM;KAC5B,CAAA,GAAA,YAAA,SAAZF,UAAA,GAAAM,mBAAoG,QAApG,YAAoGE,gBAArB,YAAA,KAAW,GAAA,CAAA,MAC1FR,UAAA,GAAAM,mBAAgG,QAAhG,YAAgGE,gBAA7CN,MAAA,CAAA,CAAC,CAAA,gCAAA,CAAA,GAAA,CAAA,EAAA,CAAA;KAEpCJ,KAAAA,KAAK,MAAM,OAAO,YAAA,SAApCE,UAAA,GAAAM,mBAEa,cAFb,YAEaE,gBADR,YAAA,KAAW,GAAA,CAAA,KAAAC,mBAAA,QAAA,IAAA;KAELV,KAAAA,OAAO,cAAlBC,UAAA,GAAAM,mBASM,OATN,YASM,CARJC,YAOEL,MAAA,OAAA,GAAA;MANC,OAAOA,MAAA,CAAA,CAAC,CAAA,uBAAA;MACT,MAAK;MACL,MAAK;MACL,OAAM;MACN,SAAQ;MACP,SAAO;;IAKN,CAAA,GAAA,MAAA,SADRF,UAAA,GAAAC,YAKES,aAAA;;KAHQ,MAAM,KAAA;KAAA,iBAAA,OAAA,OAAA,OAAA,MAAA,WAAA,KAAI,QAAA;KACjB,OAAO,MAAA;KACP,OAAOR,MAAA,CAAA,CAAC,CAAA,8BAAA"}

package/dist/features/image-studio/feature.d.ts

@@ -13,7 +13,7 @@ export interface ImageStudioUi {
  */
 export declare const IMAGE_STUDIO_OPEN = "sk-image-studio-open";
 /**
- * The Bild-Studio block (`imageStudio` node: a picture with its description, Prompt-Bausteine, references, previous
+ * The Bild-Studio block (`imageStudio` node: a picture with its description, prompt blocks, references, previous
  * generations and chat log in one `studio` attribute), the `/` entry `bild-studio` that inserts an empty one, offered
  * where the caret has `insert.imageStudio`, and the block action `image-studio.open` («Im Bild-Studio öffnen») that asks
  * the block's view to open the studio dialog. The node view and the dialog come from the framework binding (`ui`).

package/dist/features/image-studio/feature.js

@@ -28,7 +28,7 @@ const blockActions = (ctx) => [{
 	}
 }];
 /**
-* The Bild-Studio block (`imageStudio` node: a picture with its description, Prompt-Bausteine, references, previous
+* The Bild-Studio block (`imageStudio` node: a picture with its description, prompt blocks, references, previous
 * generations and chat log in one `studio` attribute), the `/` entry `bild-studio` that inserts an empty one, offered
 * where the caret has `insert.imageStudio`, and the block action `image-studio.open` («Im Bild-Studio öffnen») that asks
 * the block's view to open the studio dialog. The node view and the dialog come from the framework binding (`ui`).

package/dist/features/image-studio/feature.js.map

@@ -1 +1 @@
-{"version":3,"file":"feature.js","names":[],"sources":["../../../src/features/image-studio/feature.ts"],"sourcesContent":["import type { NodeViewRenderer } from '@tiptap/core'\nimport { type BlockAction, command, type CommandDef, type EditorFeature, type FeatureContext } from '../../core'\nimport { ABILITY } from '../../core/schema'\nimport { ImageStudioNode, imageStudioSchemaExtensions } from './schema'\n\n/** What a framework binding supplies to the Bild-Studio feature. */\nexport interface ImageStudioUi {\n  /** The block's view of the framework; without one the node renders as the plain `<img>` of its HTML form. */\n  nodeView?: NodeViewRenderer\n}\n\n/**\n * The event the `image-studio.open` block action fires on the block's node view element; the view answers it by opening\n * the studio dialog. A node view that does not listen (a headless editor) ignores it.\n */\nexport const IMAGE_STUDIO_OPEN = 'sk-image-studio-open'\n\nconst commands = (ctx: FeatureContext): CommandDef<never>[] => [\n  command({\n    id: 'imageStudio',\n    slash: { id: 'bild-studio' },\n    creates: { type: 'imageStudio' },\n    icon: 'i-lucide-image-plus',\n    label: ctx.t('imageStudio.slash.insert'),\n    ability: ABILITY.imageStudio,\n    command: c => c.insertImageStudio(),\n  }),\n]\n\nconst blockActions = (ctx: FeatureContext): BlockAction[] => [{\n  id: 'image-studio.open',\n  label: ctx.t('imageStudio.action.open'),\n  icon: 'i-lucide-wand-sparkles',\n  isVisible: block => block.node.type.name === 'imageStudio',\n  placement: 'both',\n  run: (block) => {\n    const dom = block.editor.view.nodeDOM(block.pos)\n    if (dom instanceof HTMLElement) dom.dispatchEvent(new CustomEvent(IMAGE_STUDIO_OPEN))\n  },\n}]\n\n/**\n * The Bild-Studio block (`imageStudio` node: a picture with its description, Prompt-Bausteine, references, previous\n * generations and chat log in one `studio` attribute), the `/` entry `bild-studio` that inserts an empty one, offered\n * where the caret has `insert.imageStudio`, and the block action `image-studio.open` («Im Bild-Studio öffnen») that asks\n * the block's view to open the studio dialog. The node view and the dialog come from the framework binding (`ui`).\n * Works without the `images` backend capability: the view then explains that generation is not set up instead of opening.\n */\nexport function imageStudioFeatureCore(ui: ImageStudioUi = {}): EditorFeature<never> {\n  const { nodeView } = ui\n  return {\n    id: 'image-studio',\n    dimension: 'content',\n    schemaExtensions: imageStudioSchemaExtensions,\n    extensions: () => [nodeView\n      ? ImageStudioNode.extend({\n          addNodeView(): NodeViewRenderer {\n            return nodeView\n          },\n        })\n      : ImageStudioNode],\n    commands,\n    blockActions,\n  }\n}\n"],"mappings":";;;;;;;;AAeA,MAAa,oBAAoB;AAEjC,MAAM,YAAY,QAA6C,CAC7D,QAAQ;CACN,IAAI;CACJ,OAAO,EAAE,IAAI,cAAc;CAC3B,SAAS,EAAE,MAAM,cAAc;CAC/B,MAAM;CACN,OAAO,IAAI,EAAE,0BAA0B;CACvC,SAAS,QAAQ;CACjB,UAAS,MAAK,EAAE,kBAAkB;AACpC,CAAC,CACH;AAEA,MAAM,gBAAgB,QAAuC,CAAC;CAC5D,IAAI;CACJ,OAAO,IAAI,EAAE,yBAAyB;CACtC,MAAM;CACN,YAAW,UAAS,MAAM,KAAK,KAAK,SAAS;CAC7C,WAAW;CACX,MAAM,UAAU;EACd,MAAM,MAAM,MAAM,OAAO,KAAK,QAAQ,MAAM,GAAG;EAC/C,IAAI,eAAe,aAAa,IAAI,cAAc,IAAI,YAAY,iBAAiB,CAAC;CACtF;AACF,CAAC;;;;;;;;AASD,SAAgB,uBAAuB,KAAoB,CAAC,GAAyB;CACnF,MAAM,EAAE,aAAa;CACrB,OAAO;EACL,IAAI;EACJ,WAAW;EACX,kBAAkB;EAClB,kBAAkB,CAAC,WACf,gBAAgB,OAAO,EACrB,cAAgC;GAC9B,OAAO;EACT,EACF,CAAC,IACD,eAAe;EACnB;EACA;CACF;AACF"}
+{"version":3,"file":"feature.js","names":[],"sources":["../../../src/features/image-studio/feature.ts"],"sourcesContent":["import type { NodeViewRenderer } from '@tiptap/core'\nimport { type BlockAction, command, type CommandDef, type EditorFeature, type FeatureContext } from '../../core'\nimport { ABILITY } from '../../core/schema'\nimport { ImageStudioNode, imageStudioSchemaExtensions } from './schema'\n\n/** What a framework binding supplies to the Bild-Studio feature. */\nexport interface ImageStudioUi {\n  /** The block's view of the framework; without one the node renders as the plain `<img>` of its HTML form. */\n  nodeView?: NodeViewRenderer\n}\n\n/**\n * The event the `image-studio.open` block action fires on the block's node view element; the view answers it by opening\n * the studio dialog. A node view that does not listen (a headless editor) ignores it.\n */\nexport const IMAGE_STUDIO_OPEN = 'sk-image-studio-open'\n\nconst commands = (ctx: FeatureContext): CommandDef<never>[] => [\n  command({\n    id: 'imageStudio',\n    slash: { id: 'bild-studio' },\n    creates: { type: 'imageStudio' },\n    icon: 'i-lucide-image-plus',\n    label: ctx.t('imageStudio.slash.insert'),\n    ability: ABILITY.imageStudio,\n    command: c => c.insertImageStudio(),\n  }),\n]\n\nconst blockActions = (ctx: FeatureContext): BlockAction[] => [{\n  id: 'image-studio.open',\n  label: ctx.t('imageStudio.action.open'),\n  icon: 'i-lucide-wand-sparkles',\n  isVisible: block => block.node.type.name === 'imageStudio',\n  placement: 'both',\n  run: (block) => {\n    const dom = block.editor.view.nodeDOM(block.pos)\n    if (dom instanceof HTMLElement) dom.dispatchEvent(new CustomEvent(IMAGE_STUDIO_OPEN))\n  },\n}]\n\n/**\n * The Bild-Studio block (`imageStudio` node: a picture with its description, prompt blocks, references, previous\n * generations and chat log in one `studio` attribute), the `/` entry `bild-studio` that inserts an empty one, offered\n * where the caret has `insert.imageStudio`, and the block action `image-studio.open` («Im Bild-Studio öffnen») that asks\n * the block's view to open the studio dialog. The node view and the dialog come from the framework binding (`ui`).\n * Works without the `images` backend capability: the view then explains that generation is not set up instead of opening.\n */\nexport function imageStudioFeatureCore(ui: ImageStudioUi = {}): EditorFeature<never> {\n  const { nodeView } = ui\n  return {\n    id: 'image-studio',\n    dimension: 'content',\n    schemaExtensions: imageStudioSchemaExtensions,\n    extensions: () => [nodeView\n      ? ImageStudioNode.extend({\n          addNodeView(): NodeViewRenderer {\n            return nodeView\n          },\n        })\n      : ImageStudioNode],\n    commands,\n    blockActions,\n  }\n}\n"],"mappings":";;;;;;;;AAeA,MAAa,oBAAoB;AAEjC,MAAM,YAAY,QAA6C,CAC7D,QAAQ;CACN,IAAI;CACJ,OAAO,EAAE,IAAI,cAAc;CAC3B,SAAS,EAAE,MAAM,cAAc;CAC/B,MAAM;CACN,OAAO,IAAI,EAAE,0BAA0B;CACvC,SAAS,QAAQ;CACjB,UAAS,MAAK,EAAE,kBAAkB;AACpC,CAAC,CACH;AAEA,MAAM,gBAAgB,QAAuC,CAAC;CAC5D,IAAI;CACJ,OAAO,IAAI,EAAE,yBAAyB;CACtC,MAAM;CACN,YAAW,UAAS,MAAM,KAAK,KAAK,SAAS;CAC7C,WAAW;CACX,MAAM,UAAU;EACd,MAAM,MAAM,MAAM,OAAO,KAAK,QAAQ,MAAM,GAAG;EAC/C,IAAI,eAAe,aAAa,IAAI,cAAc,IAAI,YAAY,iBAAiB,CAAC;CACtF;AACF,CAAC;;;;;;;;AASD,SAAgB,uBAAuB,KAAoB,CAAC,GAAyB;CACnF,MAAM,EAAE,aAAa;CACrB,OAAO;EACL,IAAI;EACJ,WAAW;EACX,kBAAkB;EAClB,kBAAkB,CAAC,WACf,gBAAgB,OAAO,EACrB,cAAgC;GAC9B,OAAO;EACT,EACF,CAAC,IACD,eAAe;EACnB;EACA;CACF;AACF"}

package/dist/features/image-studio/index.d.ts

@@ -1,5 +1,6 @@
 import { ImageStudioImage, ImageStudioPromptBlock } from "../../core/backend-types.js";
 import { IMAGE_STUDIO_OPEN, ImageStudioUi, imageStudioFeatureCore } from "./feature.js";
-import { EMPTY_IMAGE_STUDIO_STATE, ImageStudioState, ImageStudioTurn, addGeneration, addReference, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "./state.js";
+import { EMPTY_IMAGE_STUDIO_STATE, ImageStudioState, ImageStudioTurn, addGeneration, addReference, adoptImage, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "./state.js";
 import { ImageStudioAttrs, ImageStudioNode, imageStudioSchemaExtensions } from "./schema.js";
-export { EMPTY_IMAGE_STUDIO_STATE, IMAGE_STUDIO_OPEN, type ImageStudioAttrs, type ImageStudioImage, ImageStudioNode, type ImageStudioPromptBlock, type ImageStudioState, type ImageStudioTurn, type ImageStudioUi, addGeneration, addReference, imageStudioFeatureCore, imageStudioSchemaExtensions, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock };
+import { ImageStudioLibrary, ImageStudioLibraryFacet, ImageStudioLibraryItem, ImageStudioLibraryQuery } from "./library.js";
+export { EMPTY_IMAGE_STUDIO_STATE, IMAGE_STUDIO_OPEN, type ImageStudioAttrs, type ImageStudioImage, type ImageStudioLibrary, type ImageStudioLibraryFacet, type ImageStudioLibraryItem, type ImageStudioLibraryQuery, ImageStudioNode, type ImageStudioPromptBlock, type ImageStudioState, type ImageStudioTurn, type ImageStudioUi, addGeneration, addReference, adoptImage, imageStudioFeatureCore, imageStudioSchemaExtensions, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock };

package/dist/features/image-studio/index.js

@@ -1,4 +1,4 @@
-import { EMPTY_IMAGE_STUDIO_STATE, addGeneration, addReference, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "./state.js";
+import { EMPTY_IMAGE_STUDIO_STATE, addGeneration, addReference, adoptImage, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "./state.js";
 import { ImageStudioNode, imageStudioSchemaExtensions } from "./schema.js";
 import { IMAGE_STUDIO_OPEN, imageStudioFeatureCore } from "./feature.js";
-export { EMPTY_IMAGE_STUDIO_STATE, IMAGE_STUDIO_OPEN, ImageStudioNode, addGeneration, addReference, imageStudioFeatureCore, imageStudioSchemaExtensions, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock };
+export { EMPTY_IMAGE_STUDIO_STATE, IMAGE_STUDIO_OPEN, ImageStudioNode, addGeneration, addReference, adoptImage, imageStudioFeatureCore, imageStudioSchemaExtensions, isEmptyImageStudioState, normalizeImageStudioState, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock };

package/dist/features/image-studio/library.d.ts

@@ -0,0 +1,35 @@
+import { ImageStudioImage } from "../../core/backend-types.js";
+import "./state.js";
+//#region src/features/image-studio/library.d.ts
+/**
+ * One filter of the gallery (a Kapitel select, say); the dialog renders it as a select. Option values must be
+ * non-empty: select primitives reserve the empty string, so an «all» option needs a value of its own (`'alle'`).
+ */
+export interface ImageStudioLibraryFacet {
+  readonly id: string;
+  readonly label: string;
+  readonly options: readonly {
+    readonly value: string;
+    readonly label: string;
+  }[];
+}
+/** What the gallery shows: the search text and the chosen option (`value`) of each facet, by facet id. */
+export interface ImageStudioLibraryQuery {
+  readonly search: string;
+  readonly facets: Readonly<Record<string, string>>;
+}
+/** An image of the gallery; `subtitle` is a host line under the title (origin, usage, Kapitel). */
+export interface ImageStudioLibraryItem extends ImageStudioImage {
+  readonly subtitle?: string;
+}
+export interface ImageStudioLibrary {
+  /** The host's filter facets; the first option of each is the default. Read each time the gallery tab opens. */
+  facets: () => readonly ImageStudioLibraryFacet[];
+  list: (query: ImageStudioLibraryQuery, signal: AbortSignal) => Promise<readonly ImageStudioLibraryItem[]>;
+  /** Resolves with the renamed item; absent = no renaming. */
+  rename?: (id: string, title: string) => Promise<ImageStudioLibraryItem>;
+  /** Rejects with an Error whose message the dialog shows (asset in use, say); absent = no deleting. */
+  remove?: (id: string) => Promise<void>;
+}
+//#endregion
+//# sourceMappingURL=library.d.ts.map

package/dist/features/image-studio/node-core.d.ts

@@ -16,9 +16,9 @@ export interface ImageStudioNodeCoreOptions {
 /** What a view renders from a node's studio: the observable part of an `ImageStudioNodeCore`. */
 export interface ImageStudioNodeSnapshot {
   readonly state: ImageStudioState;
-  /** The managed list of Prompt-Bausteine, as the backend answered; empty until then. */
+  /** The managed list of prompt blocks, as the backend answered; empty until then. */
   readonly promptBlocks: readonly ImageStudioPromptBlock[];
-  /** The Prompt-Bausteine could not be loaded: the message. */
+  /** The prompt blocks could not be loaded: the message. */
   readonly problem: string | undefined;
 }
 /**
@@ -38,7 +38,7 @@ export interface ImageStudioNodeCore extends ReadonlyStore<ImageStudioNodeSnapsh
  * The core of the store of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every
  * editor transaction, so undo, collaboration and other writers show), `update` writes it back through
  * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and
- * `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Listeners run synchronously. Call `dispose`
+ * `generate`, `upload` and the prompt blocks go to `backend.images`. Listeners run synchronously. Call `dispose`
  * when the view goes.
  */
 export declare function createImageStudioNodeCore(options: ImageStudioNodeCoreOptions): ImageStudioNodeCore;

package/dist/features/image-studio/node-core.js

@@ -5,7 +5,7 @@ const NO_IMAGES = "@ecsplico/editor: the backend has no images capability";
 * The core of the store of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every
 * editor transaction, so undo, collaboration and other writers show), `update` writes it back through
 * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and
-* `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Listeners run synchronously. Call `dispose`
+* `generate`, `upload` and the prompt blocks go to `backend.images`. Listeners run synchronously. Call `dispose`
 * when the view goes.
 */
 function createImageStudioNodeCore(options) {

package/dist/features/image-studio/node-core.js.map

@@ -1 +1 @@
-{"version":3,"file":"node-core.js","names":[],"sources":["../../../src/features/image-studio/node-core.ts"],"sourcesContent":["import type { Editor } from '@tiptap/core'\nimport type { EditorBackend } from '../../core/backend'\nimport type { ReadonlyStore } from '../../core/store'\nimport { EMPTY_IMAGE_STUDIO_STATE, type ImageStudioImage, type ImageStudioPromptBlock, type ImageStudioState, normalizeImageStudioState } from './state'\n\nexport interface ImageStudioNodeCoreOptions {\n  editor: Editor\n  /** Position of the `imageStudio` node (a node view's `getPos`); `undefined` once the node is gone. */\n  getPos: () => number | undefined\n  /** The backend's image port; `undefined` (backend without the `images` capability) makes `generate` and `upload` reject. */\n  backend: EditorBackend['images']\n  /** Document whose package stores the uploaded references. */\n  documentId: string\n}\n\n/** What a view renders from a node's studio: the observable part of an `ImageStudioNodeCore`. */\nexport interface ImageStudioNodeSnapshot {\n  readonly state: ImageStudioState\n  /** The managed list of Prompt-Bausteine, as the backend answered; empty until then. */\n  readonly promptBlocks: readonly ImageStudioPromptBlock[]\n  /** The Prompt-Bausteine could not be loaded: the message. */\n  readonly problem: string | undefined\n}\n\n/**\n * The framework-free store of one `imageStudio` node (`createImageStudioNodeCore`): an observable `ImageStudioNodeSnapshot`\n * (`get`/`subscribe`, see `ReadonlyStore`; every change replaces the snapshot) and the actions the dialog needs.\n * The Vue and React bindings wrap it into the store shape of their dialog.\n */\nexport interface ImageStudioNodeCore extends ReadonlyStore<ImageStudioNodeSnapshot> {\n  /** Writes `next` into the node's `studio` attribute as one transaction (`src` follows the selected image). */\n  update: (next: ImageStudioState) => void\n  generate: (instruction: string, signal: AbortSignal) => Promise<ImageStudioImage>\n  upload: (file: File) => Promise<ImageStudioImage>\n  /** Stops following the editor and ignores the answers still outstanding; call when the node view unmounts. */\n  dispose: () => void\n}\n\n// What a store without the backend's `images` port rejects with (the node view does not open one without the port).\nconst NO_IMAGES = '@ecsplico/editor: the backend has no images capability'\n\n/**\n * The core of the store of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every\n * editor transaction, so undo, collaboration and other writers show), `update` writes it back through\n * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and\n * `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Listeners run synchronously. Call `dispose`\n * when the view goes.\n */\nexport function createImageStudioNodeCore(options: ImageStudioNodeCoreOptions): ImageStudioNodeCore {\n  const { editor, getPos, backend, documentId } = options\n  let snapshot: ImageStudioNodeSnapshot = { state: EMPTY_IMAGE_STUDIO_STATE, promptBlocks: [], problem: undefined }\n  const listeners = new Set<(value: ImageStudioNodeSnapshot) => void>()\n  let disposed = false\n  // The attribute value `state` was normalized from: a transaction that left it alone keeps `state` as it is.\n  let source: unknown\n\n  function publish(patch: Partial<ImageStudioNodeSnapshot>): void {\n    snapshot = { ...snapshot, ...patch }\n    // A copy: listeners may (un)subscribe while being notified.\n    for (const listener of [...listeners]) listener(snapshot)\n  }\n\n  function sync(): void {\n    const pos = getPos()\n    const node = pos === undefined || editor.isDestroyed ? null : editor.state.doc.nodeAt(pos)\n    if (node?.type.name !== 'imageStudio' || node.attrs.studio === source) return\n    source = node.attrs.studio\n    publish({ state: normalizeImageStudioState(source) })\n  }\n\n  editor.on('transaction', sync)\n  sync()\n\n  if (backend) {\n    backend.promptBlocks().then(\n      (blocks) => { if (!disposed) publish({ promptBlocks: blocks }) },\n      (error: unknown) => { if (!disposed) publish({ problem: error instanceof Error ? error.message : String(error) }) },\n    )\n  }\n\n  return {\n    get: () => snapshot,\n    subscribe(listener) {\n      listeners.add(listener)\n      return () => { listeners.delete(listener) }\n    },\n    update(next) {\n      const pos = getPos()\n      if (pos === undefined || editor.isDestroyed) return\n      editor.commands.setImageStudioState(pos, next)\n    },\n    generate(instruction, signal) {\n      if (!backend) return Promise.reject(new Error(NO_IMAGES))\n      const { description, promptBlockIds, references, generations } = snapshot.state\n      const referenceUrls = [...references, ...generations].filter(image => image.active).map(image => image.url)\n      return backend.generate({ description, instruction, promptBlockIds: [...promptBlockIds], referenceUrls }, signal)\n    },\n    upload(file): Promise<ImageStudioImage> {\n      return backend ? backend.upload(documentId, file) : Promise.reject(new Error(NO_IMAGES))\n    },\n    dispose() {\n      disposed = true\n      listeners.clear()\n      editor.off('transaction', sync)\n    },\n  }\n}\n"],"mappings":";;AAuCA,MAAM,YAAY;;;;;;;;AASlB,SAAgB,0BAA0B,SAA0D;CAClG,MAAM,EAAE,QAAQ,QAAQ,SAAS,eAAe;CAChD,IAAI,WAAoC;EAAE,OAAO;EAA0B,cAAc,CAAC;EAAG,SAAS,KAAA;CAAU;CAChH,MAAM,4BAAY,IAAI,IAA8C;CACpE,IAAI,WAAW;CAEf,IAAI;CAEJ,SAAS,QAAQ,OAA+C;EAC9D,WAAW;GAAE,GAAG;GAAU,GAAG;EAAM;EAEnC,KAAK,MAAM,YAAY,CAAC,GAAG,SAAS,GAAG,SAAS,QAAQ;CAC1D;CAEA,SAAS,OAAa;EACpB,MAAM,MAAM,OAAO;EACnB,MAAM,OAAO,QAAQ,KAAA,KAAa,OAAO,cAAc,OAAO,OAAO,MAAM,IAAI,OAAO,GAAG;EACzF,IAAI,MAAM,KAAK,SAAS,iBAAiB,KAAK,MAAM,WAAW,QAAQ;EACvE,SAAS,KAAK,MAAM;EACpB,QAAQ,EAAE,OAAO,0BAA0B,MAAM,EAAE,CAAC;CACtD;CAEA,OAAO,GAAG,eAAe,IAAI;CAC7B,KAAK;CAEL,IAAI,SACF,QAAQ,aAAa,CAAC,CAAC,MACpB,WAAW;EAAE,IAAI,CAAC,UAAU,QAAQ,EAAE,cAAc,OAAO,CAAC;CAAE,IAC9D,UAAmB;EAAE,IAAI,CAAC,UAAU,QAAQ,EAAE,SAAS,iBAAiB,QAAQ,MAAM,UAAU,OAAO,KAAK,EAAE,CAAC;CAAE,CACpH;CAGF,OAAO;EACL,WAAW;EACX,UAAU,UAAU;GAClB,UAAU,IAAI,QAAQ;GACtB,aAAa;IAAE,UAAU,OAAO,QAAQ;GAAE;EAC5C;EACA,OAAO,MAAM;GACX,MAAM,MAAM,OAAO;GACnB,IAAI,QAAQ,KAAA,KAAa,OAAO,aAAa;GAC7C,OAAO,SAAS,oBAAoB,KAAK,IAAI;EAC/C;EACA,SAAS,aAAa,QAAQ;GAC5B,IAAI,CAAC,SAAS,OAAO,QAAQ,uBAAO,IAAI,MAAM,SAAS,CAAC;GACxD,MAAM,EAAE,aAAa,gBAAgB,YAAY,gBAAgB,SAAS;GAC1E,MAAM,gBAAgB,CAAC,GAAG,YAAY,GAAG,WAAW,CAAC,CAAC,QAAO,UAAS,MAAM,MAAM,CAAC,CAAC,KAAI,UAAS,MAAM,GAAG;GAC1G,OAAO,QAAQ,SAAS;IAAE;IAAa;IAAa,gBAAgB,CAAC,GAAG,cAAc;IAAG;GAAc,GAAG,MAAM;EAClH;EACA,OAAO,MAAiC;GACtC,OAAO,UAAU,QAAQ,OAAO,YAAY,IAAI,IAAI,QAAQ,uBAAO,IAAI,MAAM,SAAS,CAAC;EACzF;EACA,UAAU;GACR,WAAW;GACX,UAAU,MAAM;GAChB,OAAO,IAAI,eAAe,IAAI;EAChC;CACF;AACF"}
+{"version":3,"file":"node-core.js","names":[],"sources":["../../../src/features/image-studio/node-core.ts"],"sourcesContent":["import type { Editor } from '@tiptap/core'\nimport type { EditorBackend } from '../../core/backend'\nimport type { ReadonlyStore } from '../../core/store'\nimport { EMPTY_IMAGE_STUDIO_STATE, type ImageStudioImage, type ImageStudioPromptBlock, type ImageStudioState, normalizeImageStudioState } from './state'\n\nexport interface ImageStudioNodeCoreOptions {\n  editor: Editor\n  /** Position of the `imageStudio` node (a node view's `getPos`); `undefined` once the node is gone. */\n  getPos: () => number | undefined\n  /** The backend's image port; `undefined` (backend without the `images` capability) makes `generate` and `upload` reject. */\n  backend: EditorBackend['images']\n  /** Document whose package stores the uploaded references. */\n  documentId: string\n}\n\n/** What a view renders from a node's studio: the observable part of an `ImageStudioNodeCore`. */\nexport interface ImageStudioNodeSnapshot {\n  readonly state: ImageStudioState\n  /** The managed list of prompt blocks, as the backend answered; empty until then. */\n  readonly promptBlocks: readonly ImageStudioPromptBlock[]\n  /** The prompt blocks could not be loaded: the message. */\n  readonly problem: string | undefined\n}\n\n/**\n * The framework-free store of one `imageStudio` node (`createImageStudioNodeCore`): an observable `ImageStudioNodeSnapshot`\n * (`get`/`subscribe`, see `ReadonlyStore`; every change replaces the snapshot) and the actions the dialog needs.\n * The Vue and React bindings wrap it into the store shape of their dialog.\n */\nexport interface ImageStudioNodeCore extends ReadonlyStore<ImageStudioNodeSnapshot> {\n  /** Writes `next` into the node's `studio` attribute as one transaction (`src` follows the selected image). */\n  update: (next: ImageStudioState) => void\n  generate: (instruction: string, signal: AbortSignal) => Promise<ImageStudioImage>\n  upload: (file: File) => Promise<ImageStudioImage>\n  /** Stops following the editor and ignores the answers still outstanding; call when the node view unmounts. */\n  dispose: () => void\n}\n\n// What a store without the backend's `images` port rejects with (the node view does not open one without the port).\nconst NO_IMAGES = '@ecsplico/editor: the backend has no images capability'\n\n/**\n * The core of the store of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every\n * editor transaction, so undo, collaboration and other writers show), `update` writes it back through\n * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and\n * `generate`, `upload` and the prompt blocks go to `backend.images`. Listeners run synchronously. Call `dispose`\n * when the view goes.\n */\nexport function createImageStudioNodeCore(options: ImageStudioNodeCoreOptions): ImageStudioNodeCore {\n  const { editor, getPos, backend, documentId } = options\n  let snapshot: ImageStudioNodeSnapshot = { state: EMPTY_IMAGE_STUDIO_STATE, promptBlocks: [], problem: undefined }\n  const listeners = new Set<(value: ImageStudioNodeSnapshot) => void>()\n  let disposed = false\n  // The attribute value `state` was normalized from: a transaction that left it alone keeps `state` as it is.\n  let source: unknown\n\n  function publish(patch: Partial<ImageStudioNodeSnapshot>): void {\n    snapshot = { ...snapshot, ...patch }\n    // A copy: listeners may (un)subscribe while being notified.\n    for (const listener of [...listeners]) listener(snapshot)\n  }\n\n  function sync(): void {\n    const pos = getPos()\n    const node = pos === undefined || editor.isDestroyed ? null : editor.state.doc.nodeAt(pos)\n    if (node?.type.name !== 'imageStudio' || node.attrs.studio === source) return\n    source = node.attrs.studio\n    publish({ state: normalizeImageStudioState(source) })\n  }\n\n  editor.on('transaction', sync)\n  sync()\n\n  if (backend) {\n    backend.promptBlocks().then(\n      (blocks) => { if (!disposed) publish({ promptBlocks: blocks }) },\n      (error: unknown) => { if (!disposed) publish({ problem: error instanceof Error ? error.message : String(error) }) },\n    )\n  }\n\n  return {\n    get: () => snapshot,\n    subscribe(listener) {\n      listeners.add(listener)\n      return () => { listeners.delete(listener) }\n    },\n    update(next) {\n      const pos = getPos()\n      if (pos === undefined || editor.isDestroyed) return\n      editor.commands.setImageStudioState(pos, next)\n    },\n    generate(instruction, signal) {\n      if (!backend) return Promise.reject(new Error(NO_IMAGES))\n      const { description, promptBlockIds, references, generations } = snapshot.state\n      const referenceUrls = [...references, ...generations].filter(image => image.active).map(image => image.url)\n      return backend.generate({ description, instruction, promptBlockIds: [...promptBlockIds], referenceUrls }, signal)\n    },\n    upload(file): Promise<ImageStudioImage> {\n      return backend ? backend.upload(documentId, file) : Promise.reject(new Error(NO_IMAGES))\n    },\n    dispose() {\n      disposed = true\n      listeners.clear()\n      editor.off('transaction', sync)\n    },\n  }\n}\n"],"mappings":";;AAuCA,MAAM,YAAY;;;;;;;;AASlB,SAAgB,0BAA0B,SAA0D;CAClG,MAAM,EAAE,QAAQ,QAAQ,SAAS,eAAe;CAChD,IAAI,WAAoC;EAAE,OAAO;EAA0B,cAAc,CAAC;EAAG,SAAS,KAAA;CAAU;CAChH,MAAM,4BAAY,IAAI,IAA8C;CACpE,IAAI,WAAW;CAEf,IAAI;CAEJ,SAAS,QAAQ,OAA+C;EAC9D,WAAW;GAAE,GAAG;GAAU,GAAG;EAAM;EAEnC,KAAK,MAAM,YAAY,CAAC,GAAG,SAAS,GAAG,SAAS,QAAQ;CAC1D;CAEA,SAAS,OAAa;EACpB,MAAM,MAAM,OAAO;EACnB,MAAM,OAAO,QAAQ,KAAA,KAAa,OAAO,cAAc,OAAO,OAAO,MAAM,IAAI,OAAO,GAAG;EACzF,IAAI,MAAM,KAAK,SAAS,iBAAiB,KAAK,MAAM,WAAW,QAAQ;EACvE,SAAS,KAAK,MAAM;EACpB,QAAQ,EAAE,OAAO,0BAA0B,MAAM,EAAE,CAAC;CACtD;CAEA,OAAO,GAAG,eAAe,IAAI;CAC7B,KAAK;CAEL,IAAI,SACF,QAAQ,aAAa,CAAC,CAAC,MACpB,WAAW;EAAE,IAAI,CAAC,UAAU,QAAQ,EAAE,cAAc,OAAO,CAAC;CAAE,IAC9D,UAAmB;EAAE,IAAI,CAAC,UAAU,QAAQ,EAAE,SAAS,iBAAiB,QAAQ,MAAM,UAAU,OAAO,KAAK,EAAE,CAAC;CAAE,CACpH;CAGF,OAAO;EACL,WAAW;EACX,UAAU,UAAU;GAClB,UAAU,IAAI,QAAQ;GACtB,aAAa;IAAE,UAAU,OAAO,QAAQ;GAAE;EAC5C;EACA,OAAO,MAAM;GACX,MAAM,MAAM,OAAO;GACnB,IAAI,QAAQ,KAAA,KAAa,OAAO,aAAa;GAC7C,OAAO,SAAS,oBAAoB,KAAK,IAAI;EAC/C;EACA,SAAS,aAAa,QAAQ;GAC5B,IAAI,CAAC,SAAS,OAAO,QAAQ,uBAAO,IAAI,MAAM,SAAS,CAAC;GACxD,MAAM,EAAE,aAAa,gBAAgB,YAAY,gBAAgB,SAAS;GAC1E,MAAM,gBAAgB,CAAC,GAAG,YAAY,GAAG,WAAW,CAAC,CAAC,QAAO,UAAS,MAAM,MAAM,CAAC,CAAC,KAAI,UAAS,MAAM,GAAG;GAC1G,OAAO,QAAQ,SAAS;IAAE;IAAa;IAAa,gBAAgB,CAAC,GAAG,cAAc;IAAG;GAAc,GAAG,MAAM;EAClH;EACA,OAAO,MAAiC;GACtC,OAAO,UAAU,QAAQ,OAAO,YAAY,IAAI,IAAI,QAAQ,uBAAO,IAAI,MAAM,SAAS,CAAC;EACzF;EACA,UAAU;GACR,WAAW;GACX,UAAU,MAAM;GAChB,OAAO,IAAI,eAAe,IAAI;EAChC;CACF;AACF"}

package/dist/features/image-studio/node-store.d.ts

@@ -11,7 +11,7 @@ export interface ImageStudioNodeStore extends ImageStudioStore {
  * The `ImageStudioStore` of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every
  * editor transaction, so undo, collaboration and other writers show), `update` writes it back through
  * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and
- * `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Call `dispose` when the view goes.
+ * `generate`, `upload` and the prompt blocks go to `backend.images`. Call `dispose` when the view goes.
  * The Vue wrapper of `createImageStudioNodeCore`.
  */
 export declare function createImageStudioNodeStore(options: ImageStudioNodeStoreOptions): ImageStudioNodeStore;

package/dist/features/image-studio/node-store.js

@@ -5,7 +5,7 @@ import { shallowRef } from "vue";
 * The `ImageStudioStore` of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every
 * editor transaction, so undo, collaboration and other writers show), `update` writes it back through
 * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and
-* `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Call `dispose` when the view goes.
+* `generate`, `upload` and the prompt blocks go to `backend.images`. Call `dispose` when the view goes.
 * The Vue wrapper of `createImageStudioNodeCore`.
 */
 function createImageStudioNodeStore(options) {

package/dist/features/image-studio/node-store.js.map

@@ -1 +1 @@
-{"version":3,"file":"node-store.js","names":[],"sources":["../../../src/features/image-studio/node-store.ts"],"sourcesContent":["import { shallowRef } from 'vue'\nimport { createImageStudioNodeCore, type ImageStudioNodeCoreOptions } from './node-core'\nimport type { ImageStudioPromptBlock, ImageStudioState } from './state'\nimport type { ImageStudioStore } from './store'\n\nexport type ImageStudioNodeStoreOptions = ImageStudioNodeCoreOptions\n\n/** A store over one node, with the function that detaches it from the editor. */\nexport interface ImageStudioNodeStore extends ImageStudioStore {\n  /** Stops following the editor and ignores the answers still outstanding; call when the node view unmounts. */\n  dispose: () => void\n}\n\n/**\n * The `ImageStudioStore` of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every\n * editor transaction, so undo, collaboration and other writers show), `update` writes it back through\n * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and\n * `generate`, `upload` and the Prompt-Bausteine go to `backend.images`. Call `dispose` when the view goes.\n * The Vue wrapper of `createImageStudioNodeCore`.\n */\nexport function createImageStudioNodeStore(options: ImageStudioNodeStoreOptions): ImageStudioNodeStore {\n  const core = createImageStudioNodeCore(options)\n  const initial = core.get()\n  const state = shallowRef<ImageStudioState>(initial.state)\n  const promptBlocks = shallowRef<readonly ImageStudioPromptBlock[]>(initial.promptBlocks)\n  const problem = shallowRef<string | undefined>(initial.problem)\n  core.subscribe((snapshot) => {\n    state.value = snapshot.state\n    promptBlocks.value = snapshot.promptBlocks\n    problem.value = snapshot.problem\n  })\n  return {\n    state,\n    promptBlocks,\n    problem,\n    update: core.update,\n    generate: core.generate,\n    upload: core.upload,\n    dispose: core.dispose,\n  }\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,2BAA2B,SAA4D;CACrG,MAAM,OAAO,0BAA0B,OAAO;CAC9C,MAAM,UAAU,KAAK,IAAI;CACzB,MAAM,QAAQ,WAA6B,QAAQ,KAAK;CACxD,MAAM,eAAe,WAA8C,QAAQ,YAAY;CACvF,MAAM,UAAU,WAA+B,QAAQ,OAAO;CAC9D,KAAK,WAAW,aAAa;EAC3B,MAAM,QAAQ,SAAS;EACvB,aAAa,QAAQ,SAAS;EAC9B,QAAQ,QAAQ,SAAS;CAC3B,CAAC;CACD,OAAO;EACL;EACA;EACA;EACA,QAAQ,KAAK;EACb,UAAU,KAAK;EACf,QAAQ,KAAK;EACb,SAAS,KAAK;CAChB;AACF"}
+{"version":3,"file":"node-store.js","names":[],"sources":["../../../src/features/image-studio/node-store.ts"],"sourcesContent":["import { shallowRef } from 'vue'\nimport { createImageStudioNodeCore, type ImageStudioNodeCoreOptions } from './node-core'\nimport type { ImageStudioPromptBlock, ImageStudioState } from './state'\nimport type { ImageStudioStore } from './store'\n\nexport type ImageStudioNodeStoreOptions = ImageStudioNodeCoreOptions\n\n/** A store over one node, with the function that detaches it from the editor. */\nexport interface ImageStudioNodeStore extends ImageStudioStore {\n  /** Stops following the editor and ignores the answers still outstanding; call when the node view unmounts. */\n  dispose: () => void\n}\n\n/**\n * The `ImageStudioStore` of one `imageStudio` node: `state` follows the node's `studio` attribute (re-read on every\n * editor transaction, so undo, collaboration and other writers show), `update` writes it back through\n * `setImageStudioState` as one transaction (one undo step; the node's `src` follows the selected image), and\n * `generate`, `upload` and the prompt blocks go to `backend.images`. Call `dispose` when the view goes.\n * The Vue wrapper of `createImageStudioNodeCore`.\n */\nexport function createImageStudioNodeStore(options: ImageStudioNodeStoreOptions): ImageStudioNodeStore {\n  const core = createImageStudioNodeCore(options)\n  const initial = core.get()\n  const state = shallowRef<ImageStudioState>(initial.state)\n  const promptBlocks = shallowRef<readonly ImageStudioPromptBlock[]>(initial.promptBlocks)\n  const problem = shallowRef<string | undefined>(initial.problem)\n  core.subscribe((snapshot) => {\n    state.value = snapshot.state\n    promptBlocks.value = snapshot.promptBlocks\n    problem.value = snapshot.problem\n  })\n  return {\n    state,\n    promptBlocks,\n    problem,\n    update: core.update,\n    generate: core.generate,\n    upload: core.upload,\n    dispose: core.dispose,\n  }\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,2BAA2B,SAA4D;CACrG,MAAM,OAAO,0BAA0B,OAAO;CAC9C,MAAM,UAAU,KAAK,IAAI;CACzB,MAAM,QAAQ,WAA6B,QAAQ,KAAK;CACxD,MAAM,eAAe,WAA8C,QAAQ,YAAY;CACvF,MAAM,UAAU,WAA+B,QAAQ,OAAO;CAC9D,KAAK,WAAW,aAAa;EAC3B,MAAM,QAAQ,SAAS;EACvB,aAAa,QAAQ,SAAS;EAC9B,QAAQ,QAAQ,SAAS;CAC3B,CAAC;CACD,OAAO;EACL;EACA;EACA;EACA,QAAQ,KAAK;EACb,UAAU,KAAK;EACf,QAAQ,KAAK;EACb,SAAS,KAAK;CAChB;AACF"}

package/dist/features/image-studio/react/ImageStudioDialog.d.ts

@@ -1,7 +1,7 @@
 import { ImageStudioReactStore } from "./store.js";
 //#region src/features/image-studio/react/ImageStudioDialog.d.ts
 /**
- * The Bild-Studio: description and Prompt-Bausteine on the left, references and previous generations in the middle,
+ * The Bild-Studio: description and prompt blocks on the left, references and previous generations in the middle,
  * the block's image and the chat on the right. The dialog applies the reducers of `../state` to `store.state` and
  * hands every result to `store.update`; the store only generates, uploads and persists (see `ImageStudioReactStore`).
  *

package/dist/features/image-studio/react/ImageStudioDialog.js

@@ -7,15 +7,16 @@ import { Dialog, DialogContent, DialogHeader, DialogTitle } from "../../../react
 import { Textarea } from "../../../react/ui/textarea.js";
 import { Alert, AlertTitle } from "../../../react/ui/alert.js";
 import { Switch } from "../../../react/ui/switch.js";
-import { addGeneration, addReference, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "../state.js";
+import { addGeneration, addReference, adoptImage, removeImage, select, selectedImage, setDescription, toggleImage, togglePromptBlock } from "../state.js";
 import { ImageStudioChat } from "./ImageStudioChat.js";
+import { ImageStudioLibraryPanel } from "./ImageStudioLibraryPanel.js";
 import { ImageStudioTile } from "./ImageStudioTile.js";
 import { useEffect, useId, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/features/image-studio/react/ImageStudioDialog.tsx
 const COMMIT_DELAY_MS = 500;
 /**
-* The Bild-Studio: description and Prompt-Bausteine on the left, references and previous generations in the middle,
+* The Bild-Studio: description and prompt blocks on the left, references and previous generations in the middle,
 * the block's image and the chat on the right. The dialog applies the reducers of `../state` to `store.state` and
 * hands every result to `store.update`; the store only generates, uploads and persists (see `ImageStudioReactStore`).
 *
@@ -139,6 +140,8 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 			}
 		}
 	}
+	const { library } = store;
+	const [tab, setTab] = useState("block");
 	function close() {
 		commitDescription();
 		abortGeneration();
@@ -146,6 +149,7 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 	}
 	useEffect(() => {
 		if (open) return;
+		setTab("block");
 		commitDescription();
 		abortGeneration();
 	}, [open]);
@@ -154,6 +158,13 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 		abortGeneration();
 	}, []);
 	const heading = "text-sm font-medium text-foreground";
+	/** A gallery item as the state holds it: without the host's `subtitle`, not active. */
+	const pick = ({ id, url, title }) => ({
+		id,
+		url,
+		title,
+		active: false
+	});
 	return /* @__PURE__ */ jsx(Dialog, {
 		open,
 		onOpenChange: (value) => {
@@ -162,6 +173,9 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 		children: /* @__PURE__ */ jsxs(DialogContent, {
 			className: "max-h-[calc(100vh-2rem)] overflow-y-auto sm:max-w-[min(72rem,calc(100vw-2rem))]",
 			"aria-describedby": void 0,
+			onEscapeKeyDown: (event) => {
+				if (event.target instanceof Element && event.target.closest("[data-image-studio-library-rename]")) event.preventDefault();
+			},
 			children: [/* @__PURE__ */ jsx(DialogHeader, { children: /* @__PURE__ */ jsx(DialogTitle, { children: title ?? t("imageStudio.dialog.title") }) }), /* @__PURE__ */ jsxs("div", {
 				className: "flex flex-col gap-3",
 				"data-image-studio-dialog": true,
@@ -226,7 +240,29 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 						}),
 						/* @__PURE__ */ jsxs("div", {
 							className: "flex min-h-0 flex-col gap-4 lg:overflow-y-auto",
-							children: [/* @__PURE__ */ jsxs("section", {
+							children: [library && /* @__PURE__ */ jsx("div", {
+								className: "flex gap-1",
+								role: "tablist",
+								"data-image-studio-tabs": true,
+								children: ["block", "library"].map((name) => /* @__PURE__ */ jsx(Button, {
+									size: "sm",
+									variant: tab === name ? "default" : "ghost",
+									role: "tab",
+									"aria-selected": tab === name,
+									"data-image-studio-tab": name,
+									onClick: () => setTab(name),
+									children: t(name === "block" ? "imageStudio.dialog.tabs.block" : "imageStudio.dialog.tabs.library")
+								}, name))
+							}), library && tab === "library" ? /* @__PURE__ */ jsx(ImageStudioLibraryPanel, {
+								library,
+								state,
+								onUse: (item) => apply(adoptImage(latest.current, pick(item))),
+								onReference: (item) => apply(addReference(latest.current, pick(item))),
+								onRemoved: (id) => {
+									const current = latest.current;
+									if (current.references.some((image) => image.id === id) || current.generations.some((image) => image.id === id)) apply(removeImage(current, id));
+								}
+							}) : /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("section", {
 								className: "flex flex-col gap-2 rounded-md border border-dashed border-transparent p-1 data-[dragging=true]:border-primary",
 								"data-dragging": dragging,
 								"aria-labelledby": `${uid}-references`,
@@ -314,7 +350,7 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 									className: "text-sm text-muted-foreground",
 									children: t("imageStudio.dialog.generations.empty")
 								})]
-							})]
+							})] })]
 						}),
 						/* @__PURE__ */ jsxs("div", {
 							className: "flex min-h-0 flex-col gap-3",
@@ -332,6 +368,11 @@ function ImageStudioDialog({ open, onOpenChange, store, title }) {
 										alt: picture.title || t("imageStudio.dialog.tile.untitled"),
 										className: "size-full object-contain",
 										"data-image-studio-preview": true
+									}) : store.placeholderUrl ? /* @__PURE__ */ jsx("img", {
+										src: store.placeholderUrl,
+										alt: "",
+										className: "size-full object-contain opacity-60",
+										"data-image-studio-placeholder": true
 									}) : /* @__PURE__ */ jsx("p", {
 										className: "text-sm text-muted-foreground",
 										children: t("imageStudio.dialog.preview.empty")