@inkbar/vue 0.2.0 → 0.3.0

package/README.md

@@ -69,6 +69,7 @@ const annotations = ref<Annotation[]>([])
     v-model:annotations="annotations"
   >
     <InkToolbar>
+      <InkToolButton tool="view" />
       <InkToolButton tool="select" />
       <InkToolButton tool="highlight" />
       <InkToolButton tool="redact-area" />
@@ -119,11 +120,30 @@ Inside `InkRoot`, `useHistory()` returns the same object. Its `batch(fn)` runs `
 
 `InkNotePopover` opens the thread of the activated note. A new note has no text yet, so the form first writes the note's own text (labelled "Comment"); after that it adds replies.
 
-A root note with no text and no replies is removed when its popover closes, or when activation moves to another annotation, so abandoned notes do not stay on the page. Locked notes are never removed. If you add notes yourself (`add({ type: 'note', ... })`), give them `contents`, or they will be removed the first time someone opens and closes them.
+A root note with no text and no replies is removed when its popover closes, or when activation moves to another annotation, so abandoned notes do not stay on the page. Locked notes are never removed. If you add notes yourself (`add({ type: 'text', ... })`), give them `contents`, or they will be removed the first time someone opens and closes them.
+
+## Custom rendering
+
+Slots let you render parts yourself. `InkViewport` has `loading`, `empty`, `error`, `annotation` and `page-error` slots. `InkNotePopover` and `InkSuggestionCard` have a scoped default slot that receives the popover's props, and the default slot of `InkToolButton` receives `{ active, label }`. The props are typed as `AnnotationSlotProps`, `NotePopoverSlotProps` and `SuggestionCardSlotProps`, the same types the React and Svelte packages export.
+
+`InkRoot`, `InkToolbar`, `InkToolButton`, `InkUndo`, `InkRedo`, `InkPrevPage`, `InkNextPage`, `InkZoomIn` and `InkZoomOut` take `as-child` to render your own element in place of theirs, such as a button from your design system. Put that element in the default slot. The control keeps its behaviour and accessible name.
 
 ## Keyboard
 
-The scroll element takes focus. With the highlight or redact tool active, `Enter` turns the text selection into a mark; with the note tool, `Enter` places a note in the middle of the current page and opens it. On a focused annotation, `Enter` or `Space` selects and activates it (a note opens its thread and a suggested redaction its card; other types are only selected), `ArrowUp` and `ArrowDown` move between annotations, `Shift` + arrow moves it by 1 pt (add `Alt` for 10 pt), `Ctrl` or `Cmd` + `Shift` + arrow resizes an area mark, and `Delete` removes it. The full table is in the [`@inkbar/core` README](https://github.com/inkbar/inkbar/tree/main/packages/core#tools-and-keyboard).
+The scroll area takes focus. From there:
+
+- With the `highlight` or `redact-area` tool active, `Enter` turns the text selection into a mark.
+- With the `note` tool active, `Enter` places a note at the centre of the current page and opens it.
+
+On a focused annotation:
+
+- `Enter` or `Space` selects and activates it. A note opens its thread and a suggested redaction its card; other types are only selected.
+- `ArrowUp` and `ArrowDown` move to the previous or next annotation on the page.
+- `Shift` + arrow moves it by 1 pt, or by 10 pt with `Alt` as well.
+- `Ctrl` or `Cmd` + `Shift` + arrow resizes an area redaction, text box or shape.
+- `Delete` or `Backspace` removes it.
+
+The full table, with the zoom and page keys, is in the [`@inkbar/core` README](https://github.com/inkbar/inkbar/tree/main/packages/core#tools-and-keyboard).
 
 ## Styling
 

package/dist/components/InkNotePopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"InkNotePopover.js","names":["_sfc_main","InkNotePopover_vue_vue_type_script_setup_true_lang_default","InkNotePopover_default"],"sources":["../../src/components/InkNotePopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The thread for the activated note, anchored to the note's overlay element. Activating a\n * reply opens the whole thread from its root. Closing (Close, Escape, a press outside) clears `activated`.\n *\n * A new note has no text. While its root is empty (and unlocked) the default form writes the\n * root's own `contents`, labelled \"Comment\", and the thread list stays hidden until there is\n * something in it; after that the form adds replies. Closing a root that is still empty and\n * has no replies removes it, so an abandoned note does not stay on the page.\n */\nimport { isAbandonedNote, threadOf, threadRoot } from '@inkbar/core'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, ref, watch } from 'vue'\n\nimport { useAnnotations } from '../composables/useAnnotations'\nimport { injectInkContext } from '../context'\n\nimport { useAnnotationElement } from './annotation-element'\nimport { keepOpenOnAnnotation, useFocusReturn } from './popover-focus'\n\nimport type { Annotation, NoteAnnotation } from '@inkbar/core'\nimport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\nexport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\ndefineSlots<{ default?(props: NotePopoverSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\nconst { annotations, add, update, remove } = useAnnotations()\n\nconst find = (id: string | undefined) =>\n  id ? annotations.value.find((a) => a.id === id) : undefined\n\nconst note = computed<NoteAnnotation | null>(() => {\n  const a = find(ctx.activated.value ?? undefined)\n  return a?.type === 'note' ? threadRoot(annotations.value, a) : null\n})\nconst anchor = useAnnotationElement(\n  ctx,\n  computed(() => note.value?.id ?? null)\n)\nconst focusReturn = useFocusReturn(ctx)\nconst open = computed(() => note.value !== null && anchor.value !== null)\nconst thread = computed<Annotation[]>(() =>\n  note.value ? threadOf(annotations.value, note.value) : []\n)\n\n/** True while the default form writes the root note's own text rather than a reply. */\nconst editingRoot = computed(() => {\n  const root = note.value\n  return root !== null && !root.locked && !root.contents?.trim()\n})\n\nconst draft = ref('')\nconst noteId = () => note.value?.id\n// Synchronous, so a render for another note never shows the old draft.\nwatch(noteId, () => (draft.value = ''), { flush: 'sync' })\nwatch(noteId, (_next, previous) => {\n  // Activation moved on from a note that never got any text: drop it.\n  if (previous !== undefined) dropIfEmpty(previous)\n})\n\n/**\n * Notes this popover wrote text or a reply for. In controlled mode the write is a proposal\n * the host may not have applied yet, so the applied list still shows the note empty; these\n * are never dropped as abandoned.\n */\nconst written = new Set<string>()\n/** Notes this popover has already asked to remove, so a slow host is asked once. */\nconst dropped = new Set<string>()\n\n/** Removes an unlocked root note with no text and no replies. True when it did. */\nfunction dropIfEmpty(id: string): boolean {\n  if (dropped.has(id) || written.has(id) || !isAbandonedNote(annotations.value, id))\n    return false\n  dropped.add(id)\n  remove(id)\n  return true\n}\n\nfunction reply(text: string): void {\n  const root = note.value\n  const contents = text.trim()\n  if (!root || !contents) return\n  written.add(root.id)\n  add({ type: 'note', page: root.page, rect: root.rect, contents, inReplyTo: root.id })\n  draft.value = ''\n}\nfunction close(): void {\n  const root = note.value\n  if (root && find(root.id) && isEmptyRoot(root)) {\n    focusReturn.beforeRemove(anchor.value)\n    dropIfEmpty(root.id)\n  }\n  ctx.setActivated(null)\n}\nfunction isEmptyRoot(root: NoteAnnotation): boolean {\n  return (\n    !written.has(root.id) &&\n    !root.locked &&\n    !root.contents?.trim() &&\n    thread.value.length === 1\n  )\n}\nfunction submit(): void {\n  const text = draft.value.trim()\n  if (!text) return\n  if (editingRoot.value) {\n    updateContents(text)\n    draft.value = ''\n  } else reply(text)\n}\n/** Locked notes cannot be removed: removing one does nothing and keeps the popover. */\nfunction removeThread(): void {\n  const root = note.value\n  if (!root || root.locked) return\n  focusReturn.beforeRemove(anchor.value)\n  // Under a slow controlled host the note stays listed for a while; it is not asked for again.\n  dropped.add(root.id)\n  remove(root.id)\n  ctx.setActivated(null)\n}\nfunction updateContents(contents: string): void {\n  if (!note.value || note.value.locked) return\n  if (contents.trim()) written.add(note.value.id)\n  update(note.value.id, { contents })\n}\nfunction onOpenChange(next: boolean): void {\n  if (!next) close()\n}\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"note && anchor\"\n        :reference=\"anchor\"\n        class=\"ink-note-popover\"\n        data-ink-note-popover\n        side=\"right\"\n        :side-offset=\"8\"\n        :collision-padding=\"8\"\n        v-bind=\"{ 'aria-label': 'Note thread' }\"\n        @interact-outside=\"keepOpenOnAnnotation\"\n        @close-auto-focus=\"focusReturn.onCloseAutoFocus($event, anchor)\"\n      >\n        <slot\n          :note=\"note\"\n          :replies=\"thread.slice(1)\"\n          :reply=\"reply\"\n          :update=\"updateContents\"\n          :remove=\"removeThread\"\n          :close=\"close\"\n        >\n          <ol v-if=\"!editingRoot || thread.length > 1\" class=\"ink-thread\" data-ink-thread>\n            <li\n              v-for=\"item in thread\"\n              :key=\"item.id\"\n              class=\"ink-thread-item\"\n              data-ink-thread-item\n              :data-reply=\"item.inReplyTo ? '' : undefined\"\n            >\n              <span class=\"ink-thread-author\">{{ item.author ?? 'Anonymous' }}</span>\n              <time class=\"ink-thread-time\" :datetime=\"item.createdAt\">\n                {{ new Date(item.createdAt).toLocaleString() }}\n              </time>\n              <p class=\"ink-thread-text\">{{ item.contents }}</p>\n            </li>\n          </ol>\n          <form class=\"ink-thread-reply\" data-ink-thread-reply @submit.prevent=\"submit\">\n            <textarea\n              v-model=\"draft\"\n              :aria-label=\"editingRoot ? 'Comment' : 'Reply'\"\n              rows=\"2\"\n              :placeholder=\"editingRoot ? 'Comment' : 'Reply'\"\n            />\n            <div class=\"ink-thread-actions\">\n              <button type=\"submit\" :disabled=\"!draft.trim()\">\n                {{ editingRoot ? 'Comment' : 'Reply' }}\n              </button>\n              <button v-if=\"!note.locked\" type=\"button\" @click=\"removeThread\">\n                Delete\n              </button>\n              <button type=\"button\" @click=\"close\">Close</button>\n            </div>\n          </form>\n        </slot>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"InkNotePopover.js","names":["_sfc_main","InkNotePopover_vue_vue_type_script_setup_true_lang_default","InkNotePopover_default"],"sources":["../../src/components/InkNotePopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The thread for the activated note, anchored to the note's overlay element. Activating a\n * reply opens the whole thread from its root. Closing (Close, Escape, a press outside) clears `activated`.\n *\n * A new note has no text. While its root is empty (and unlocked) the default form writes the\n * root's own `contents`, labelled \"Comment\", and the thread list stays hidden until there is\n * something in it; after that the form adds replies. Closing a root that is still empty and\n * has no replies removes it, so an abandoned note does not stay on the page.\n */\nimport { isAbandonedNote, threadOf, threadRoot } from '@inkbar/core'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, ref, watch } from 'vue'\n\nimport { useAnnotations } from '../composables/useAnnotations'\nimport { injectInkContext } from '../context'\n\nimport { useAnnotationElement } from './annotation-element'\nimport { keepOpenOnAnnotation, useFocusReturn } from './popover-focus'\n\nimport type { Annotation, NoteAnnotation } from '@inkbar/core'\nimport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\nexport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\ndefineSlots<{ default?(props: NotePopoverSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\nconst { annotations, add, update, remove } = useAnnotations()\n\nconst find = (id: string | undefined) =>\n  id ? annotations.value.find((a) => a.id === id) : undefined\n\nconst note = computed<NoteAnnotation | null>(() => {\n  const a = find(ctx.activated.value ?? undefined)\n  return a?.type === 'text' ? threadRoot(annotations.value, a) : null\n})\nconst anchor = useAnnotationElement(\n  ctx,\n  computed(() => note.value?.id ?? null)\n)\nconst focusReturn = useFocusReturn(ctx)\nconst open = computed(() => note.value !== null && anchor.value !== null)\nconst thread = computed<Annotation[]>(() =>\n  note.value ? threadOf(annotations.value, note.value) : []\n)\n\n/** True while the default form writes the root note's own text rather than a reply. */\nconst editingRoot = computed(() => {\n  const root = note.value\n  return root !== null && !root.locked && !root.contents?.trim()\n})\n\nconst draft = ref('')\nconst noteId = () => note.value?.id\n// Synchronous, so a render for another note never shows the old draft.\nwatch(noteId, () => (draft.value = ''), { flush: 'sync' })\nwatch(noteId, (_next, previous) => {\n  // Activation moved on from a note that never got any text: drop it.\n  if (previous !== undefined) dropIfEmpty(previous)\n})\n\n/**\n * Notes this popover wrote text or a reply for. In controlled mode the write is a proposal\n * the host may not have applied yet, so the applied list still shows the note empty; these\n * are never dropped as abandoned.\n */\nconst written = new Set<string>()\n/** Notes this popover has already asked to remove, so a slow host is asked once. */\nconst dropped = new Set<string>()\n\n/** Removes an unlocked root note with no text and no replies. True when it did. */\nfunction dropIfEmpty(id: string): boolean {\n  if (dropped.has(id) || written.has(id) || !isAbandonedNote(annotations.value, id))\n    return false\n  dropped.add(id)\n  remove(id)\n  return true\n}\n\nfunction reply(text: string): void {\n  const root = note.value\n  const contents = text.trim()\n  if (!root || !contents) return\n  written.add(root.id)\n  add({ type: 'text', page: root.page, rect: root.rect, contents, inReplyTo: root.id })\n  draft.value = ''\n}\nfunction close(): void {\n  const root = note.value\n  if (root && find(root.id) && isEmptyRoot(root)) {\n    focusReturn.beforeRemove(anchor.value)\n    dropIfEmpty(root.id)\n  }\n  ctx.setActivated(null)\n}\nfunction isEmptyRoot(root: NoteAnnotation): boolean {\n  return (\n    !written.has(root.id) &&\n    !root.locked &&\n    !root.contents?.trim() &&\n    thread.value.length === 1\n  )\n}\nfunction submit(): void {\n  const text = draft.value.trim()\n  if (!text) return\n  if (editingRoot.value) {\n    updateContents(text)\n    draft.value = ''\n  } else reply(text)\n}\n/** Locked notes cannot be removed: removing one does nothing and keeps the popover. */\nfunction removeThread(): void {\n  const root = note.value\n  if (!root || root.locked) return\n  focusReturn.beforeRemove(anchor.value)\n  // Under a slow controlled host the note stays listed for a while; it is not asked for again.\n  dropped.add(root.id)\n  remove(root.id)\n  ctx.setActivated(null)\n}\nfunction updateContents(contents: string): void {\n  if (!note.value || note.value.locked) return\n  if (contents.trim()) written.add(note.value.id)\n  update(note.value.id, { contents })\n}\nfunction onOpenChange(next: boolean): void {\n  if (!next) close()\n}\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"note && anchor\"\n        :reference=\"anchor\"\n        class=\"ink-note-popover\"\n        data-ink-note-popover\n        side=\"right\"\n        :side-offset=\"8\"\n        :collision-padding=\"8\"\n        v-bind=\"{ 'aria-label': 'Note thread' }\"\n        @interact-outside=\"keepOpenOnAnnotation\"\n        @close-auto-focus=\"focusReturn.onCloseAutoFocus($event, anchor)\"\n      >\n        <slot\n          :note=\"note\"\n          :replies=\"thread.slice(1)\"\n          :reply=\"reply\"\n          :update=\"updateContents\"\n          :remove=\"removeThread\"\n          :close=\"close\"\n        >\n          <ol v-if=\"!editingRoot || thread.length > 1\" class=\"ink-thread\" data-ink-thread>\n            <li\n              v-for=\"item in thread\"\n              :key=\"item.id\"\n              class=\"ink-thread-item\"\n              data-ink-thread-item\n              :data-reply=\"item.inReplyTo ? '' : undefined\"\n            >\n              <span class=\"ink-thread-author\">{{ item.author ?? 'Anonymous' }}</span>\n              <time class=\"ink-thread-time\" :datetime=\"item.createdAt\">\n                {{ new Date(item.createdAt).toLocaleString() }}\n              </time>\n              <p class=\"ink-thread-text\">{{ item.contents }}</p>\n            </li>\n          </ol>\n          <form class=\"ink-thread-reply\" data-ink-thread-reply @submit.prevent=\"submit\">\n            <textarea\n              v-model=\"draft\"\n              :aria-label=\"editingRoot ? 'Comment' : 'Reply'\"\n              rows=\"2\"\n              :placeholder=\"editingRoot ? 'Comment' : 'Reply'\"\n            />\n            <div class=\"ink-thread-actions\">\n              <button type=\"submit\" :disabled=\"!draft.trim()\">\n                {{ editingRoot ? 'Comment' : 'Reply' }}\n              </button>\n              <button v-if=\"!note.locked\" type=\"button\" @click=\"removeThread\">\n                Delete\n              </button>\n              <button type=\"button\" @click=\"close\">Close</button>\n            </div>\n          </form>\n        </slot>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n</template>\n"],"mappings":""}

package/dist/components/InkNotePopover.vue_vue_type_script_setup_true_lang.js

@@ -15,7 +15,7 @@ var ie = {
 	setup(f) {
 		let N = e(), { annotations: P, add: F, update: I, remove: L } = t(), R = (e) => e ? P.value.find((t) => t.id === e) : void 0, z = o(() => {
 			let e = R(N.activated.value ?? void 0);
-			return e?.type === "note" ? ee(P.value, e) : null;
+			return e?.type === "text" ? ee(P.value, e) : null;
 		}), B = n(N, o(() => z.value?.id ?? null)), V = i(N), H = o(() => z.value !== null && B.value !== null), U = o(() => z.value ? E(P.value, z.value) : []), W = o(() => {
 			let e = z.value;
 			return e !== null && !e.locked && !e.contents?.trim();
@@ -30,7 +30,7 @@ var ie = {
 		function X(e) {
 			let t = z.value, n = e.trim();
 			t && n && (q.add(t.id), F({
-				type: "note",
+				type: "text",
 				page: t.page,
 				rect: t.rect,
 				contents: n,

package/dist/components/InkNotePopover.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"InkNotePopover.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","_renderSlot","_createElementBlock","_Fragment","_renderList","_createElementVNode","_toDisplayString","_createCommentVNode","_withModifiers","_withDirectives","_vModelText","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","InkNotePopover_vue_vue_type_script_setup_true_lang_default","ctx","injectInkContext","useAnnotations","find","id","annotations","a","note","computed","threadRoot","anchor","useAnnotationElement","focusReturn","useFocusReturn","open","thread","threadOf","editingRoot","root","draft","ref","noteId","watch","previous","dropIfEmpty","written","dropped","isAbandonedNote","remove","reply","contents","text","add","close","isEmptyRoot","submit","updateContents","removeThread","update","onOpenChange","next","openBlock","createBlock","unref","PopoverRoot","withCtx","createVNode","PopoverPortal","PopoverContent","mergeProps","keepOpenOnAnnotation","_cache","$event","renderSlot","_ctx","createElementBlock","Fragment","renderList","item","createElementVNode","toDisplayString","createCommentVNode","withModifiers","withDirectives","vModelText"],"sources":["../../src/components/InkNotePopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The thread for the activated note, anchored to the note's overlay element. Activating a\n * reply opens the whole thread from its root. Closing (Close, Escape, a press outside) clears `activated`.\n *\n * A new note has no text. While its root is empty (and unlocked) the default form writes the\n * root's own `contents`, labelled \"Comment\", and the thread list stays hidden until there is\n * something in it; after that the form adds replies. Closing a root that is still empty and\n * has no replies removes it, so an abandoned note does not stay on the page.\n */\nimport { isAbandonedNote, threadOf, threadRoot } from '@inkbar/core'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, ref, watch } from 'vue'\n\nimport { useAnnotations } from '../composables/useAnnotations'\nimport { injectInkContext } from '../context'\n\nimport { useAnnotationElement } from './annotation-element'\nimport { keepOpenOnAnnotation, useFocusReturn } from './popover-focus'\n\nimport type { Annotation, NoteAnnotation } from '@inkbar/core'\nimport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\nexport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\ndefineSlots<{ default?(props: NotePopoverSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\nconst { annotations, add, update, remove } = useAnnotations()\n\nconst find = (id: string | undefined) =>\n  id ? annotations.value.find((a) => a.id === id) : undefined\n\nconst note = computed<NoteAnnotation | null>(() => {\n  const a = find(ctx.activated.value ?? undefined)\n  return a?.type === 'note' ? threadRoot(annotations.value, a) : null\n})\nconst anchor = useAnnotationElement(\n  ctx,\n  computed(() => note.value?.id ?? null)\n)\nconst focusReturn = useFocusReturn(ctx)\nconst open = computed(() => note.value !== null && anchor.value !== null)\nconst thread = computed<Annotation[]>(() =>\n  note.value ? threadOf(annotations.value, note.value) : []\n)\n\n/** True while the default form writes the root note's own text rather than a reply. */\nconst editingRoot = computed(() => {\n  const root = note.value\n  return root !== null && !root.locked && !root.contents?.trim()\n})\n\nconst draft = ref('')\nconst noteId = () => note.value?.id\n// Synchronous, so a render for another note never shows the old draft.\nwatch(noteId, () => (draft.value = ''), { flush: 'sync' })\nwatch(noteId, (_next, previous) => {\n  // Activation moved on from a note that never got any text: drop it.\n  if (previous !== undefined) dropIfEmpty(previous)\n})\n\n/**\n * Notes this popover wrote text or a reply for. In controlled mode the write is a proposal\n * the host may not have applied yet, so the applied list still shows the note empty; these\n * are never dropped as abandoned.\n */\nconst written = new Set<string>()\n/** Notes this popover has already asked to remove, so a slow host is asked once. */\nconst dropped = new Set<string>()\n\n/** Removes an unlocked root note with no text and no replies. True when it did. */\nfunction dropIfEmpty(id: string): boolean {\n  if (dropped.has(id) || written.has(id) || !isAbandonedNote(annotations.value, id))\n    return false\n  dropped.add(id)\n  remove(id)\n  return true\n}\n\nfunction reply(text: string): void {\n  const root = note.value\n  const contents = text.trim()\n  if (!root || !contents) return\n  written.add(root.id)\n  add({ type: 'note', page: root.page, rect: root.rect, contents, inReplyTo: root.id })\n  draft.value = ''\n}\nfunction close(): void {\n  const root = note.value\n  if (root && find(root.id) && isEmptyRoot(root)) {\n    focusReturn.beforeRemove(anchor.value)\n    dropIfEmpty(root.id)\n  }\n  ctx.setActivated(null)\n}\nfunction isEmptyRoot(root: NoteAnnotation): boolean {\n  return (\n    !written.has(root.id) &&\n    !root.locked &&\n    !root.contents?.trim() &&\n    thread.value.length === 1\n  )\n}\nfunction submit(): void {\n  const text = draft.value.trim()\n  if (!text) return\n  if (editingRoot.value) {\n    updateContents(text)\n    draft.value = ''\n  } else reply(text)\n}\n/** Locked notes cannot be removed: removing one does nothing and keeps the popover. */\nfunction removeThread(): void {\n  const root = note.value\n  if (!root || root.locked) return\n  focusReturn.beforeRemove(anchor.value)\n  // Under a slow controlled host the note stays listed for a while; it is not asked for again.\n  dropped.add(root.id)\n  remove(root.id)\n  ctx.setActivated(null)\n}\nfunction updateContents(contents: string): void {\n  if (!note.value || note.value.locked) return\n  if (contents.trim()) written.add(note.value.id)\n  update(note.value.id, { contents })\n}\nfunction onOpenChange(next: boolean): void {\n  if (!next) close()\n}\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"note && anchor\"\n        :reference=\"anchor\"\n        class=\"ink-note-popover\"\n        data-ink-note-popover\n        side=\"right\"\n        :side-offset=\"8\"\n        :collision-padding=\"8\"\n        v-bind=\"{ 'aria-label': 'Note thread' }\"\n        @interact-outside=\"keepOpenOnAnnotation\"\n        @close-auto-focus=\"focusReturn.onCloseAutoFocus($event, anchor)\"\n      >\n        <slot\n          :note=\"note\"\n          :replies=\"thread.slice(1)\"\n          :reply=\"reply\"\n          :update=\"updateContents\"\n          :remove=\"removeThread\"\n          :close=\"close\"\n        >\n          <ol v-if=\"!editingRoot || thread.length > 1\" class=\"ink-thread\" data-ink-thread>\n            <li\n              v-for=\"item in thread\"\n              :key=\"item.id\"\n              class=\"ink-thread-item\"\n              data-ink-thread-item\n              :data-reply=\"item.inReplyTo ? '' : undefined\"\n            >\n              <span class=\"ink-thread-author\">{{ item.author ?? 'Anonymous' }}</span>\n              <time class=\"ink-thread-time\" :datetime=\"item.createdAt\">\n                {{ new Date(item.createdAt).toLocaleString() }}\n              </time>\n              <p class=\"ink-thread-text\">{{ item.contents }}</p>\n            </li>\n          </ol>\n          <form class=\"ink-thread-reply\" data-ink-thread-reply @submit.prevent=\"submit\">\n            <textarea\n              v-model=\"draft\"\n              :aria-label=\"editingRoot ? 'Comment' : 'Reply'\"\n              rows=\"2\"\n              :placeholder=\"editingRoot ? 'Comment' : 'Reply'\"\n            />\n            <div class=\"ink-thread-actions\">\n              <button type=\"submit\" :disabled=\"!draft.trim()\">\n                {{ editingRoot ? 'Comment' : 'Reply' }}\n              </button>\n              <button v-if=\"!note.locked\" type=\"button\" @click=\"removeThread\">\n                Delete\n              </button>\n              <button type=\"button\" @click=\"close\">Close</button>\n            </div>\n          </form>\n        </slot>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"InkNotePopover.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","_renderSlot","_createElementBlock","_Fragment","_renderList","_createElementVNode","_toDisplayString","_createCommentVNode","_withModifiers","_withDirectives","_vModelText","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","InkNotePopover_vue_vue_type_script_setup_true_lang_default","ctx","injectInkContext","useAnnotations","find","id","annotations","a","note","computed","threadRoot","anchor","useAnnotationElement","focusReturn","useFocusReturn","open","thread","threadOf","editingRoot","root","draft","ref","noteId","watch","previous","dropIfEmpty","written","dropped","isAbandonedNote","remove","reply","contents","text","add","close","isEmptyRoot","submit","updateContents","removeThread","update","onOpenChange","next","openBlock","createBlock","unref","PopoverRoot","withCtx","createVNode","PopoverPortal","PopoverContent","mergeProps","keepOpenOnAnnotation","_cache","$event","renderSlot","_ctx","createElementBlock","Fragment","renderList","item","createElementVNode","toDisplayString","createCommentVNode","withModifiers","withDirectives","vModelText"],"sources":["../../src/components/InkNotePopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The thread for the activated note, anchored to the note's overlay element. Activating a\n * reply opens the whole thread from its root. Closing (Close, Escape, a press outside) clears `activated`.\n *\n * A new note has no text. While its root is empty (and unlocked) the default form writes the\n * root's own `contents`, labelled \"Comment\", and the thread list stays hidden until there is\n * something in it; after that the form adds replies. Closing a root that is still empty and\n * has no replies removes it, so an abandoned note does not stay on the page.\n */\nimport { isAbandonedNote, threadOf, threadRoot } from '@inkbar/core'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, ref, watch } from 'vue'\n\nimport { useAnnotations } from '../composables/useAnnotations'\nimport { injectInkContext } from '../context'\n\nimport { useAnnotationElement } from './annotation-element'\nimport { keepOpenOnAnnotation, useFocusReturn } from './popover-focus'\n\nimport type { Annotation, NoteAnnotation } from '@inkbar/core'\nimport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\nexport type { NotePopoverSlotProps } from '@inkbar/core/dom'\n\ndefineSlots<{ default?(props: NotePopoverSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\nconst { annotations, add, update, remove } = useAnnotations()\n\nconst find = (id: string | undefined) =>\n  id ? annotations.value.find((a) => a.id === id) : undefined\n\nconst note = computed<NoteAnnotation | null>(() => {\n  const a = find(ctx.activated.value ?? undefined)\n  return a?.type === 'text' ? threadRoot(annotations.value, a) : null\n})\nconst anchor = useAnnotationElement(\n  ctx,\n  computed(() => note.value?.id ?? null)\n)\nconst focusReturn = useFocusReturn(ctx)\nconst open = computed(() => note.value !== null && anchor.value !== null)\nconst thread = computed<Annotation[]>(() =>\n  note.value ? threadOf(annotations.value, note.value) : []\n)\n\n/** True while the default form writes the root note's own text rather than a reply. */\nconst editingRoot = computed(() => {\n  const root = note.value\n  return root !== null && !root.locked && !root.contents?.trim()\n})\n\nconst draft = ref('')\nconst noteId = () => note.value?.id\n// Synchronous, so a render for another note never shows the old draft.\nwatch(noteId, () => (draft.value = ''), { flush: 'sync' })\nwatch(noteId, (_next, previous) => {\n  // Activation moved on from a note that never got any text: drop it.\n  if (previous !== undefined) dropIfEmpty(previous)\n})\n\n/**\n * Notes this popover wrote text or a reply for. In controlled mode the write is a proposal\n * the host may not have applied yet, so the applied list still shows the note empty; these\n * are never dropped as abandoned.\n */\nconst written = new Set<string>()\n/** Notes this popover has already asked to remove, so a slow host is asked once. */\nconst dropped = new Set<string>()\n\n/** Removes an unlocked root note with no text and no replies. True when it did. */\nfunction dropIfEmpty(id: string): boolean {\n  if (dropped.has(id) || written.has(id) || !isAbandonedNote(annotations.value, id))\n    return false\n  dropped.add(id)\n  remove(id)\n  return true\n}\n\nfunction reply(text: string): void {\n  const root = note.value\n  const contents = text.trim()\n  if (!root || !contents) return\n  written.add(root.id)\n  add({ type: 'text', page: root.page, rect: root.rect, contents, inReplyTo: root.id })\n  draft.value = ''\n}\nfunction close(): void {\n  const root = note.value\n  if (root && find(root.id) && isEmptyRoot(root)) {\n    focusReturn.beforeRemove(anchor.value)\n    dropIfEmpty(root.id)\n  }\n  ctx.setActivated(null)\n}\nfunction isEmptyRoot(root: NoteAnnotation): boolean {\n  return (\n    !written.has(root.id) &&\n    !root.locked &&\n    !root.contents?.trim() &&\n    thread.value.length === 1\n  )\n}\nfunction submit(): void {\n  const text = draft.value.trim()\n  if (!text) return\n  if (editingRoot.value) {\n    updateContents(text)\n    draft.value = ''\n  } else reply(text)\n}\n/** Locked notes cannot be removed: removing one does nothing and keeps the popover. */\nfunction removeThread(): void {\n  const root = note.value\n  if (!root || root.locked) return\n  focusReturn.beforeRemove(anchor.value)\n  // Under a slow controlled host the note stays listed for a while; it is not asked for again.\n  dropped.add(root.id)\n  remove(root.id)\n  ctx.setActivated(null)\n}\nfunction updateContents(contents: string): void {\n  if (!note.value || note.value.locked) return\n  if (contents.trim()) written.add(note.value.id)\n  update(note.value.id, { contents })\n}\nfunction onOpenChange(next: boolean): void {\n  if (!next) close()\n}\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"note && anchor\"\n        :reference=\"anchor\"\n        class=\"ink-note-popover\"\n        data-ink-note-popover\n        side=\"right\"\n        :side-offset=\"8\"\n        :collision-padding=\"8\"\n        v-bind=\"{ 'aria-label': 'Note thread' }\"\n        @interact-outside=\"keepOpenOnAnnotation\"\n        @close-auto-focus=\"focusReturn.onCloseAutoFocus($event, anchor)\"\n      >\n        <slot\n          :note=\"note\"\n          :replies=\"thread.slice(1)\"\n          :reply=\"reply\"\n          :update=\"updateContents\"\n          :remove=\"removeThread\"\n          :close=\"close\"\n        >\n          <ol v-if=\"!editingRoot || thread.length > 1\" class=\"ink-thread\" data-ink-thread>\n            <li\n              v-for=\"item in thread\"\n              :key=\"item.id\"\n              class=\"ink-thread-item\"\n              data-ink-thread-item\n              :data-reply=\"item.inReplyTo ? '' : undefined\"\n            >\n              <span class=\"ink-thread-author\">{{ item.author ?? 'Anonymous' }}</span>\n              <time class=\"ink-thread-time\" :datetime=\"item.createdAt\">\n                {{ new Date(item.createdAt).toLocaleString() }}\n              </time>\n              <p class=\"ink-thread-text\">{{ item.contents }}</p>\n            </li>\n          </ol>\n          <form class=\"ink-thread-reply\" data-ink-thread-reply @submit.prevent=\"submit\">\n            <textarea\n              v-model=\"draft\"\n              :aria-label=\"editingRoot ? 'Comment' : 'Reply'\"\n              rows=\"2\"\n              :placeholder=\"editingRoot ? 'Comment' : 'Reply'\"\n            />\n            <div class=\"ink-thread-actions\">\n              <button type=\"submit\" :disabled=\"!draft.trim()\">\n                {{ editingRoot ? 'Comment' : 'Reply' }}\n              </button>\n              <button v-if=\"!note.locked\" type=\"button\" @click=\"removeThread\">\n                Delete\n              </button>\n              <button type=\"button\" @click=\"close\">Close</button>\n            </div>\n          </form>\n        </slot>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n</template>\n"],"mappings":"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"}

package/dist/components/InkRoot.vue.d.ts

@@ -84,8 +84,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -105,13 +105,12 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -134,13 +133,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -164,13 +163,14 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -190,13 +190,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -212,11 +212,11 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -238,7 +238,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -331,8 +331,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -352,13 +352,12 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -381,13 +380,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -411,13 +410,14 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -437,13 +437,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -459,11 +459,11 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -485,7 +485,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -581,8 +581,8 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -602,13 +602,12 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -631,13 +630,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -661,13 +660,14 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -687,13 +687,13 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -709,11 +709,11 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -735,7 +735,7 @@ declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;

package/dist/composables/useAnnotations.d.ts

@@ -52,8 +52,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -73,13 +73,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -102,13 +101,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -132,13 +131,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -158,13 +158,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -180,11 +180,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -206,7 +206,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -290,8 +290,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -311,13 +311,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -340,13 +339,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -370,13 +369,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -396,13 +396,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -418,11 +418,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -444,7 +444,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -530,8 +530,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -551,13 +551,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -580,13 +579,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -610,13 +609,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -636,13 +636,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -658,11 +658,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -684,7 +684,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -769,8 +769,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -790,13 +790,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -819,13 +818,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -849,13 +848,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -875,13 +875,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -897,11 +897,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -923,7 +923,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1008,8 +1008,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1029,13 +1029,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -1058,13 +1057,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1088,13 +1087,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -1114,13 +1114,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1136,11 +1136,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1162,7 +1162,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1247,8 +1247,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1268,13 +1268,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -1297,13 +1296,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1327,13 +1326,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -1353,13 +1353,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1375,11 +1375,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1401,7 +1401,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1489,8 +1489,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1510,13 +1510,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -1539,13 +1538,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1569,13 +1568,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -1595,13 +1595,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1617,11 +1617,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1643,7 +1643,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1729,8 +1729,8 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "note";
-        icon: "note" | "comment" | "help" | "insert" | "key" | "paragraph";
+        type: "text";
+        icon: "comment" | "note" | "help" | "insert" | "key" | "paragraph";
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1750,13 +1750,12 @@ export declare function useAnnotations(): {
         createdAt: string;
         modifiedAt: string;
         source: "session" | "pdf";
-        type: "freeText";
-        text: string;
+        type: "freetext";
+        contents: string;
         fontSize: number;
         fontFamily: string;
         align: "left" | "center" | "right";
         author?: string | undefined;
-        contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
@@ -1779,13 +1778,13 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "square" | "circle";
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1809,13 +1808,14 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         };
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        endings?: ["square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash", "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash"] | undefined;
+        head?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
+        tail?: "square" | "circle" | "none" | "openArrow" | "closedArrow" | "diamond" | "butt" | "slash" | undefined;
     } | {
         id: string;
         page: number;
@@ -1835,13 +1835,13 @@ export declare function useAnnotations(): {
             x: number;
             y: number;
         }[];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
         locked?: boolean | undefined;
         custom?: Record<string, unknown> | undefined;
-        fill?: string | undefined;
+        interiorColor?: string | undefined;
     } | {
         id: string;
         page: number;
@@ -1857,11 +1857,11 @@ export declare function useAnnotations(): {
         modifiedAt: string;
         source: "session" | "pdf";
         type: "ink";
-        paths: {
+        inklist: {
             x: number;
             y: number;
         }[][];
-        strokeWidth: number;
+        width: number;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;
@@ -1883,7 +1883,7 @@ export declare function useAnnotations(): {
         source: "session" | "pdf";
         type: "redact";
         origin: "user" | "suggested";
-        fill: string;
+        interiorColor: string;
         author?: string | undefined;
         contents?: string | undefined;
         inReplyTo?: string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inkbar/vue",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "Vue 3 components and composables for Inkbar, the browser PDF viewer and editor.",
   "license": "MIT",
   "homepage": "https://inkbar.dev",
@@ -24,17 +24,17 @@
     "./package.json": "./package.json"
   },
   "dependencies": {
-    "@inkbar/icons": "^0.2.0",
+    "@inkbar/icons": "^0.3.0",
     "reka-ui": "^2.11.0"
   },
   "peerDependencies": {
-    "@inkbar/core": "^0.2.0",
+    "@inkbar/core": "^0.3.0",
     "vue": "^3.5.0"
   },
   "devDependencies": {
-    "@inkbar/core": "0.2.0",
+    "@inkbar/core": "0.3.0",
     "@inkbar/fixtures": "0.0.0",
-    "@inkbar/theme": "0.2.0",
+    "@inkbar/theme": "0.3.0",
     "@playwright/experimental-ct-vue": "1.62.1",
     "@playwright/test": "1.62.1",
     "@vitejs/plugin-vue": "^6.0.10",