@inkbar/vue 0.3.0 → 0.5.0

package/README.md

@@ -20,7 +20,7 @@
 
 ---
 
-Drop a PDF viewer into your Vue app and let people highlight text, leave notes with replies and review redactions. `@inkbar/vue` gives you components and composables to build your own toolbars, plus note and suggestion popovers, all styled by `@inkbar/theme`.
+Drop a PDF viewer into your Vue app and let people highlight text, leave notes with replies and redact. `@inkbar/vue` gives you components and composables to build your own toolbars, plus a popover for comment threads, all styled by `@inkbar/theme`.
 
 Annotations are plain typed objects. Bind them with `v-model` to keep them in your own state, or let Inkbar hold them with undo and redo.
 
@@ -50,8 +50,7 @@ import {
   InkPageCount,
   InkNextPage,
   InkZoomSelect,
-  InkNotePopover,
-  InkSuggestionCard,
+  InkThreadPopover,
 } from '@inkbar/vue'
 import type { Annotation } from '@inkbar/core'
 import { assets } from 'virtual:inkbar-assets'
@@ -69,7 +68,7 @@ const annotations = ref<Annotation[]>([])
     v-model:annotations="annotations"
   >
     <InkToolbar>
-      <InkToolButton tool="view" />
+      <InkToolButton tool="select-text" />
       <InkToolButton tool="select" />
       <InkToolButton tool="highlight" />
       <InkToolButton tool="redact-area" />
@@ -86,8 +85,7 @@ const annotations = ref<Annotation[]>([])
       <InkNextPage />
       <InkZoomSelect />
     </InkToolbar>
-    <InkNotePopover />
-    <InkSuggestionCard />
+    <InkThreadPopover />
   </InkRoot>
 </template>
 ```
@@ -116,15 +114,21 @@ Inside `InkRoot`, `useHistory()` returns the same object. Its `batch(fn)` runs `
 
 `key` identifies the document. Reuse the same key when only the signed URL changes and the document is not reloaded.
 
-## Note popover
+## Thread popover
 
-`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.
+`InkThreadPopover` opens the comment thread of the activated note or text markup (a highlight, underline, strikeout or squiggly). A new note or highlight has no text yet, so the form first writes its own `contents` (labelled "Comment"); after that it adds replies. A highlight with a comment shows a small marker at its end. Replies show in the thread only; the page draws just the note or highlight they answer.
 
-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.
+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. A highlight stays: the mark is the point. Locked annotations 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.
+
+The highlight tool leaves `contents` free for the comment. `doc.text(page)` returns the page's text items; match the markup's `quads` against them to get the marked text. `InkHighlightMenu` is a split button for the tool: it picks the markup kind and its colour.
+
+## Signatures
+
+`InkSignatureMenu` lists saved signatures, picks one for the `signature` tool, removes them, and opens `InkSignatureDialog` to draw, type or upload a new one. These are marks on the page, not cryptographic signatures. Pass `signatures` to `InkRoot` to keep them somewhere: `createLocalSignatureStore(key)` from `@inkbar/core` uses `localStorage`, and without it they last until reload. `signatureFonts` lists the handwriting fonts the Type tab offers; load them with `@font-face`. A placed signature keeps its aspect ratio when resized.
 
 ## 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.
+Slots let you render parts yourself. `InkViewport` has `loading`, `empty`, `error`, `annotation` and `page-error` slots. `InkThreadPopover` has 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` and `ThreadPopoverSlotProps`, 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.
 
@@ -134,10 +138,11 @@ 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.
+- With the `signature` tool active, `Enter` places the chosen signature at the centre of the current page.
 
 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.
+- `Enter` or `Space` selects and activates it. A note or text markup opens its thread; 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.
@@ -151,7 +156,7 @@ Components carry state on data attributes, for example `[data-annotation][data-s
 
 ## Composables
 
-`useDocument`, `useAnnotations`, `useTool`, `useSelection`, `useZoom`, `usePage`, `useHistory` and `useEmbedded` read the state of the nearest `InkRoot`. Build your own toolbar or side panel from them.
+`useDocument`, `useAnnotations`, `useTool`, `useSelection`, `useZoom`, `usePage`, `useHistory` and `useEmbedded` read the state of the nearest `InkRoot`. Build your own toolbar or side panel from them. Tool options, such as the shape kind, last as long as `InkRoot`. The tool style that `useToolStyle` reads and sets (colours, line style, text style) belongs to the document: opening another one starts again from the theme's defaults.
 
 ## Licence
 

package/dist/components/InkAnnotation.js.map

@@ -1 +1 @@
-{"version":3,"file":"InkAnnotation.js","names":["_sfc_main","InkAnnotation_vue_vue_type_script_setup_true_lang_default","InkAnnotation_default"],"sources":["../../src/components/InkAnnotation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Slot props for one annotation. It renders only its default slot: the overlay already draws\n * the default visual for every annotation that is not custom, so this never draws a second\n * one. InkPage teleports it into the annotation's overlay element.\n */\nimport { acceptSuggestion } from '@inkbar/core'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\n\nimport type { AnnotationSlotProps, AnnotationState } from './annotation-slot'\nimport type { Annotation } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    annotation: Annotation\n    /** The overlay element; its `data-state` (which includes hover) drives `state`. */\n    element?: HTMLElement | undefined\n  }>(),\n  { element: undefined }\n)\n\ndefineSlots<{ default?(props: AnnotationSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\n\nconst observed = shallowRef<AnnotationState | null>(null)\nlet observer: MutationObserver | undefined\nfunction readState(el: HTMLElement): AnnotationState | null {\n  const s = el.dataset.state\n  return s === 'idle' || s === 'hover' || s === 'selected' ? s : null\n}\nwatch(\n  () => props.element,\n  (el) => {\n    observer?.disconnect()\n    observer = undefined\n    observed.value = el ? readState(el) : null\n    if (!el) return\n    observer = new MutationObserver(() => {\n      observed.value = readState(el)\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n  },\n  { immediate: true }\n)\nonBeforeUnmount(() => observer?.disconnect())\n\nconst isSuggestion = computed(\n  () => props.annotation.type === 'redact' && props.annotation.origin === 'suggested'\n)\n\nconst slotProps = computed<AnnotationSlotProps>(() => {\n  const { id } = props.annotation\n  const store = () => ctx.document.value?.annotations\n  return {\n    annotation: props.annotation,\n    state: observed.value ?? (ctx.selection.value.includes(id) ? 'selected' : 'idle'),\n    locked: props.annotation.locked === true,\n    select: () => store()?.select([id]),\n    remove: () => void store()?.remove(id),\n    accept: () => {\n      const s = store()\n      if (s && isSuggestion.value) acceptSuggestion(s, id)\n    },\n    dismiss: () => {\n      if (isSuggestion.value) store()?.remove(id)\n    },\n  }\n})\n</script>\n\n<template>\n  <slot v-bind=\"slotProps\" />\n</template>\n"],"mappings":""}
+{"version":3,"file":"InkAnnotation.js","names":["_sfc_main","InkAnnotation_vue_vue_type_script_setup_true_lang_default","InkAnnotation_default"],"sources":["../../src/components/InkAnnotation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Slot props for one annotation. It renders only its default slot: the overlay already draws\n * the default visual for every annotation that is not custom, so this never draws a second\n * one. InkPage teleports it into the annotation's overlay element.\n */\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\n\nimport type { AnnotationSlotProps, AnnotationState } from './annotation-slot'\nimport type { Annotation } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    annotation: Annotation\n    /** The overlay element; its `data-state` (which includes hover) drives `state`. */\n    element?: HTMLElement | undefined\n  }>(),\n  { element: undefined }\n)\n\ndefineSlots<{ default?(props: AnnotationSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\n\nconst observed = shallowRef<AnnotationState | null>(null)\nlet observer: MutationObserver | undefined\nfunction readState(el: HTMLElement): AnnotationState | null {\n  const s = el.dataset.state\n  return s === 'idle' || s === 'hover' || s === 'selected' ? s : null\n}\nwatch(\n  () => props.element,\n  (el) => {\n    observer?.disconnect()\n    observer = undefined\n    observed.value = el ? readState(el) : null\n    if (!el) return\n    observer = new MutationObserver(() => {\n      observed.value = readState(el)\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n  },\n  { immediate: true }\n)\nonBeforeUnmount(() => observer?.disconnect())\n\nconst slotProps = computed<AnnotationSlotProps>(() => {\n  const { id } = props.annotation\n  const store = () => ctx.document.value?.annotations\n  return {\n    annotation: props.annotation,\n    state: observed.value ?? (ctx.selection.value.includes(id) ? 'selected' : 'idle'),\n    locked: props.annotation.locked === true,\n    select: () => store()?.select([id]),\n    remove: () => void store()?.remove(id),\n  }\n})\n</script>\n\n<template>\n  <slot v-bind=\"slotProps\" />\n</template>\n"],"mappings":""}

package/dist/components/InkAnnotation.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InkAnnotation.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkAnnotation.vue"],"names":[],"mappings":"AAwFA,OAAO,KAAK,EAAE,mBAAmB,EAAmB,MAAM,mBAAmB,CAAA;AAC7E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAG9C,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,UAAU,CAAA;IACtB,mFAAmF;IACnF,OAAO,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;CAClC,CAAC;AAMJ,KAAK,WAAW,GAAG;IAAE,OAAO,CAAC,CAAC,KAAK,EAAE,mBAAmB,GAAG,OAAO,CAAA;CAAE,CAAC;AAuErE,QAAA,MAAM,UAAU;;6EAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"InkAnnotation.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkAnnotation.vue"],"names":[],"mappings":"AA2EA,OAAO,KAAK,EAAE,mBAAmB,EAAmB,MAAM,mBAAmB,CAAA;AAC7E,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAG9C,KAAK,WAAW,GAAG;IACf,UAAU,EAAE,UAAU,CAAA;IACtB,mFAAmF;IACnF,OAAO,CAAC,EAAE,WAAW,GAAG,SAAS,CAAA;CAClC,CAAC;AAMJ,KAAK,WAAW,GAAG;IAAE,OAAO,CAAC,CAAC,KAAK,EAAE,mBAAmB,GAAG,OAAO,CAAA;CAAE,CAAC;AA4DrE,QAAA,MAAM,UAAU;;6EAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/InkAnnotation.vue_vue_type_script_setup_true_lang.js

@@ -1,48 +1,40 @@
 import { injectInkContext as e } from "../context.js";
 import { computed as t, defineComponent as n, guardReactiveProps as r, normalizeProps as i, onBeforeUnmount as a, renderSlot as o, shallowRef as s, watch as c } from "vue";
-import { acceptSuggestion as l } from "@inkbar/core";
 //#region src/components/InkAnnotation.vue?vue&type=script&setup=true&lang.ts
-var u = /*@__PURE__*/ n({
+var l = /*@__PURE__*/ n({
 	__name: "InkAnnotation",
 	props: {
 		annotation: {},
 		element: { default: void 0 }
 	},
 	setup(n) {
-		let u = n, d = e(), f = s(null), p;
-		function m(e) {
+		let l = n, u = e(), d = s(null), f;
+		function p(e) {
 			let t = e.dataset.state;
 			return t === "idle" || t === "hover" || t === "selected" ? t : null;
 		}
-		c(() => u.element, (e) => {
-			p?.disconnect(), p = void 0, f.value = e ? m(e) : null, e && (p = new MutationObserver(() => {
-				f.value = m(e);
-			}), p.observe(e, {
+		c(() => l.element, (e) => {
+			f?.disconnect(), f = void 0, d.value = e ? p(e) : null, e && (f = new MutationObserver(() => {
+				d.value = p(e);
+			}), f.observe(e, {
 				attributes: !0,
 				attributeFilter: ["data-state"]
 			}));
-		}, { immediate: !0 }), a(() => p?.disconnect());
-		let h = t(() => u.annotation.type === "redact" && u.annotation.origin === "suggested"), g = t(() => {
-			let { id: e } = u.annotation, t = () => d.document.value?.annotations;
+		}, { immediate: !0 }), a(() => f?.disconnect());
+		let m = t(() => {
+			let { id: e } = l.annotation, t = () => u.document.value?.annotations;
 			return {
-				annotation: u.annotation,
-				state: f.value ?? (d.selection.value.includes(e) ? "selected" : "idle"),
-				locked: u.annotation.locked === !0,
+				annotation: l.annotation,
+				state: d.value ?? (u.selection.value.includes(e) ? "selected" : "idle"),
+				locked: l.annotation.locked === !0,
 				select: () => t()?.select([e]),
-				remove: () => void t()?.remove(e),
-				accept: () => {
-					let n = t();
-					n && h.value && l(n, e);
-				},
-				dismiss: () => {
-					h.value && t()?.remove(e);
-				}
+				remove: () => void t()?.remove(e)
 			};
 		});
-		return (e, t) => o(e.$slots, "default", i(r(g.value)));
+		return (e, t) => o(e.$slots, "default", i(r(m.value)));
 	}
 });
 //#endregion
-export { u as default };
+export { l as default };
 
 //# sourceMappingURL=InkAnnotation.vue_vue_type_script_setup_true_lang.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"InkAnnotation.vue_vue_type_script_setup_true_lang.js","names":["_renderSlot","_normalizeProps","_guardReactiveProps","InkAnnotation_vue_vue_type_script_setup_true_lang_default","props","__props","ctx","injectInkContext","observed","shallowRef","observer","readState","s","el","watch","onBeforeUnmount","isSuggestion","computed","slotProps","store","id","acceptSuggestion","renderSlot","_ctx","normalizeProps","guardReactiveProps"],"sources":["../../src/components/InkAnnotation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Slot props for one annotation. It renders only its default slot: the overlay already draws\n * the default visual for every annotation that is not custom, so this never draws a second\n * one. InkPage teleports it into the annotation's overlay element.\n */\nimport { acceptSuggestion } from '@inkbar/core'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\n\nimport type { AnnotationSlotProps, AnnotationState } from './annotation-slot'\nimport type { Annotation } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    annotation: Annotation\n    /** The overlay element; its `data-state` (which includes hover) drives `state`. */\n    element?: HTMLElement | undefined\n  }>(),\n  { element: undefined }\n)\n\ndefineSlots<{ default?(props: AnnotationSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\n\nconst observed = shallowRef<AnnotationState | null>(null)\nlet observer: MutationObserver | undefined\nfunction readState(el: HTMLElement): AnnotationState | null {\n  const s = el.dataset.state\n  return s === 'idle' || s === 'hover' || s === 'selected' ? s : null\n}\nwatch(\n  () => props.element,\n  (el) => {\n    observer?.disconnect()\n    observer = undefined\n    observed.value = el ? readState(el) : null\n    if (!el) return\n    observer = new MutationObserver(() => {\n      observed.value = readState(el)\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n  },\n  { immediate: true }\n)\nonBeforeUnmount(() => observer?.disconnect())\n\nconst isSuggestion = computed(\n  () => props.annotation.type === 'redact' && props.annotation.origin === 'suggested'\n)\n\nconst slotProps = computed<AnnotationSlotProps>(() => {\n  const { id } = props.annotation\n  const store = () => ctx.document.value?.annotations\n  return {\n    annotation: props.annotation,\n    state: observed.value ?? (ctx.selection.value.includes(id) ? 'selected' : 'idle'),\n    locked: props.annotation.locked === true,\n    select: () => store()?.select([id]),\n    remove: () => void store()?.remove(id),\n    accept: () => {\n      const s = store()\n      if (s && isSuggestion.value) acceptSuggestion(s, id)\n    },\n    dismiss: () => {\n      if (isSuggestion.value) store()?.remove(id)\n    },\n  }\n})\n</script>\n\n<template>\n  <slot v-bind=\"slotProps\" />\n</template>\n"],"mappings":";;;;;;;;;;;EAcA,IAAMI,IAAQC,GAWRC,IAAMC,EAAiB,GAEvBC,IAAWC,EAAmC,IAAI,GACpDC;EACJ,SAASC,EAAU,GAAyC;GAC1D,IAAMC,IAAIC,EAAG,QAAQ;GACrB,OAAOD,MAAM,UAAUA,MAAM,WAAWA,MAAM,aAAaA,IAAI;EACjE;EAeA,AAdAE,QACQV,EAAM,UACX,MAAO;GAIN,AAHAM,GAAU,WAAW,GACrB,IAAW,KAAA,GACX,EAAS,QAAQG,IAAKF,EAAUE,CAAE,IAAI,MACjCA,MACL,IAAW,IAAI,uBAAuB;IACpC,EAAS,QAAQF,EAAUE,CAAE;GAC/B,CAAC,GACDH,EAAS,QAAQG,GAAI;IAAE,YAAY;IAAM,iBAAiB,CAAC,YAAY;GAAE,CAAC;EAC5E,GACA,EAAE,WAAW,GAAK,CACpB,GACAE,QAAsBL,GAAU,WAAW,CAAC;EAE5C,IAAMM,IAAeC,QACbb,EAAM,WAAW,SAAS,YAAYA,EAAM,WAAW,WAAW,WAC1E,GAEMc,IAAYD,QAAoC;GACpD,IAAM,EAAE,UAAOb,EAAM,YACfe,UAAcb,EAAI,SAAS,OAAO;GACxC,OAAO;IACL,YAAYF,EAAM;IAClB,OAAOI,EAAS,UAAUF,EAAI,UAAU,MAAM,SAASc,CAAE,IAAI,aAAa;IAC1E,QAAQhB,EAAM,WAAW,WAAW;IACpC,cAAce,EAAM,CAAC,EAAE,OAAO,CAACC,CAAE,CAAC;IAClC,cAAc,KAAKD,EAAM,CAAC,EAAE,OAAOC,CAAE;IACrC,cAAc;KACZ,IAAMR,IAAIO,EAAM;KAChB,AAAIP,KAAKI,EAAa,SAAOK,EAAiBT,GAAGQ,CAAE;IACrD;IACA,eAAe;KACb,AAAIJ,EAAa,SAAOG,EAAM,CAAC,EAAE,OAAOC,CAAE;IAC5C;GACF;EACF,CAAC;mBAICpB,EAA2BuB,EAAA,QAAA,WAAAtB,EAAAC,EAAbgB,EAAA,KAAS,CAAA,CAAA"}
+{"version":3,"file":"InkAnnotation.vue_vue_type_script_setup_true_lang.js","names":["_renderSlot","_normalizeProps","_guardReactiveProps","InkAnnotation_vue_vue_type_script_setup_true_lang_default","props","__props","ctx","injectInkContext","observed","shallowRef","observer","readState","s","el","watch","onBeforeUnmount","slotProps","computed","store","id","renderSlot","_ctx","normalizeProps","guardReactiveProps"],"sources":["../../src/components/InkAnnotation.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Slot props for one annotation. It renders only its default slot: the overlay already draws\n * the default visual for every annotation that is not custom, so this never draws a second\n * one. InkPage teleports it into the annotation's overlay element.\n */\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\n\nimport type { AnnotationSlotProps, AnnotationState } from './annotation-slot'\nimport type { Annotation } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    annotation: Annotation\n    /** The overlay element; its `data-state` (which includes hover) drives `state`. */\n    element?: HTMLElement | undefined\n  }>(),\n  { element: undefined }\n)\n\ndefineSlots<{ default?(props: AnnotationSlotProps): unknown }>()\n\nconst ctx = injectInkContext()\n\nconst observed = shallowRef<AnnotationState | null>(null)\nlet observer: MutationObserver | undefined\nfunction readState(el: HTMLElement): AnnotationState | null {\n  const s = el.dataset.state\n  return s === 'idle' || s === 'hover' || s === 'selected' ? s : null\n}\nwatch(\n  () => props.element,\n  (el) => {\n    observer?.disconnect()\n    observer = undefined\n    observed.value = el ? readState(el) : null\n    if (!el) return\n    observer = new MutationObserver(() => {\n      observed.value = readState(el)\n    })\n    observer.observe(el, { attributes: true, attributeFilter: ['data-state'] })\n  },\n  { immediate: true }\n)\nonBeforeUnmount(() => observer?.disconnect())\n\nconst slotProps = computed<AnnotationSlotProps>(() => {\n  const { id } = props.annotation\n  const store = () => ctx.document.value?.annotations\n  return {\n    annotation: props.annotation,\n    state: observed.value ?? (ctx.selection.value.includes(id) ? 'selected' : 'idle'),\n    locked: props.annotation.locked === true,\n    select: () => store()?.select([id]),\n    remove: () => void store()?.remove(id),\n  }\n})\n</script>\n\n<template>\n  <slot v-bind=\"slotProps\" />\n</template>\n"],"mappings":";;;;;;;;;;EAaA,IAAMI,IAAQC,GAWRC,IAAMC,EAAiB,GAEvBC,IAAWC,EAAmC,IAAI,GACpDC;EACJ,SAASC,EAAU,GAAyC;GAC1D,IAAMC,IAAIC,EAAG,QAAQ;GACrB,OAAOD,MAAM,UAAUA,MAAM,WAAWA,MAAM,aAAaA,IAAI;EACjE;EAeA,AAdAE,QACQV,EAAM,UACX,MAAO;GAIN,AAHAM,GAAU,WAAW,GACrB,IAAW,KAAA,GACX,EAAS,QAAQG,IAAKF,EAAUE,CAAE,IAAI,MACjCA,MACL,IAAW,IAAI,uBAAuB;IACpC,EAAS,QAAQF,EAAUE,CAAE;GAC/B,CAAC,GACDH,EAAS,QAAQG,GAAI;IAAE,YAAY;IAAM,iBAAiB,CAAC,YAAY;GAAE,CAAC;EAC5E,GACA,EAAE,WAAW,GAAK,CACpB,GACAE,QAAsBL,GAAU,WAAW,CAAC;EAE5C,IAAMM,IAAYC,QAAoC;GACpD,IAAM,EAAE,UAAOb,EAAM,YACfc,UAAcZ,EAAI,SAAS,OAAO;GACxC,OAAO;IACL,YAAYF,EAAM;IAClB,OAAOI,EAAS,UAAUF,EAAI,UAAU,MAAM,SAASa,CAAE,IAAI,aAAa;IAC1E,QAAQf,EAAM,WAAW,WAAW;IACpC,cAAcc,EAAM,CAAC,EAAE,OAAO,CAACC,CAAE,CAAC;IAClC,cAAc,KAAKD,EAAM,CAAC,EAAE,OAAOC,CAAE;GACvC;EACF,CAAC;mBAICnB,EAA2BqB,EAAA,QAAA,WAAApB,EAAAC,EAAbc,EAAA,KAAS,CAAA,CAAA"}

package/dist/components/InkColorMenu.js

@@ -0,0 +1,7 @@
+import e from "./InkColorMenu.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/InkColorMenu.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=InkColorMenu.js.map

package/dist/components/InkColorMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InkColorMenu.js","names":["_sfc_main","InkColorMenu_vue_vue_type_script_setup_true_lang_default","InkColorMenu_default"],"sources":["../../src/components/InkColorMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A colour menu for one colour property (border, fill or text) of the selection or the active\n * tool. The trigger shows the current colour as a swatch: split when the selection disagrees,\n * slashed for no fill. The panel is a palette grid, plus \"No fill\" for `fill` and \"Custom…\",\n * which opens a native colour input. The menu disables when nothing supports the property.\n */\nimport {\n  COLOR_COLUMNS,\n  colorMenuModel,\n  focusInitialMenuItem,\n  handleMenuKeys,\n  menuItems,\n  type ColorProperty,\n} from '@inkbar/core/dom'\nimport { Check } from '@inkbar/icons'\nimport {\n  PopoverContent,\n  PopoverPortal,\n  PopoverRoot,\n  PopoverTrigger,\n  ToolbarButton,\n} from 'reka-ui'\nimport { computed, defineComponent, mergeProps, ref, useAttrs, watch } from 'vue'\n\nimport { useToolStyle } from '../composables/useToolStyle'\n\nimport InkIcon from './InkIcon.vue'\n\nimport type { StyleGroup } from '@inkbar/core'\n\ndefineOptions({ inheritAttrs: false })\nconst attrs = useAttrs()\n\n/** Stands in for the toolbar item when the menu is nested in another panel. */\nconst PassThrough = defineComponent({\n  inheritAttrs: false,\n  setup:\n    (_, { slots }) =>\n    () =>\n      slots.default?.(),\n})\n\nconst props = defineProps<{\n  /** The colour this menu sets. */\n  property: ColorProperty\n  /** Accessible name; defaults to \"Border colour\", \"Fill colour\" or \"Text colour\". */\n  label?: string\n  /**\n   * Renders the trigger outside the toolbar's roving focus, for a menu nested in another\n   * panel (the text style menu's text colour).\n   */\n  standalone?: boolean\n  /**\n   * Scopes the menu to one style group: it shows and sets that group's colour whatever tool\n   * is active, and recolours the selection only when it is all in the group.\n   */\n  group?: StyleGroup | undefined\n  /** The colour new annotations get while the style leaves it unset; the swatch shows it. */\n  fallback?: string | undefined\n}>()\n\nconst { current, supported, set } = useToolStyle(() => props.group)\nconst open = ref(false)\nconst customInput = ref<HTMLInputElement | null>(null)\n\nconst model = computed(() =>\n  colorMenuModel(props.property, current.value, supported.value, props.fallback)\n)\nconst name = computed(() => props.label ?? model.value.label)\nconst trigger = computed(() => model.value.trigger)\n\n// The menu closes when the control disables (the selection cleared while it was open).\nwatch(\n  () => model.value.enabled,\n  (enabled) => {\n    if (!enabled) open.value = false\n  }\n)\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\nfunction onTriggerKeydown(e: KeyboardEvent): void {\n  if (e.key !== 'ArrowDown' || e.defaultPrevented || open.value || !model.value.enabled)\n    return\n  e.preventDefault()\n  focusFirst = true\n  open.value = true\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  // One menu is open at a time.\n  const menu = document.querySelector(\n    `[data-ink-menu=\"color-${props.property}\"] [role=\"menu\"]`\n  )\n  if (menu) {\n    if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n    else focusInitialMenuItem(menu)\n  }\n  focusFirst = false\n}\n\n// Reka's typed props stop at its own; ARIA goes through bound objects.\nconst triggerAttrs = computed(() => ({\n  'aria-label': name.value,\n  title: name.value,\n  'aria-haspopup': 'menu' as const,\n  onKeydown: onTriggerKeydown,\n  'data-mixed': model.value.mixed ? '' : undefined,\n}))\n/**\n * The trigger's bindings over the host's: both keydown listeners run, the host's first, and a\n * host `disabled` can disable the trigger but not enable it.\n */\nconst triggerBindings = computed(() =>\n  mergeProps(attrs, triggerAttrs.value, {\n    disabled: (attrs.disabled ?? false) !== false || !model.value.enabled,\n  })\n)\nconst menuAttrs = computed(() => ({ 'aria-label': name.value }))\nconst innerAttrs = computed(() => ({\n  role: 'menu',\n  'aria-label': name.value,\n  onKeydown: (e: KeyboardEvent) => handleMenuKeys(e, e.currentTarget as HTMLElement),\n}))\n</script>\n\n<template>\n  <PopoverRoot v-model:open=\"open\">\n    <component :is=\"standalone ? PassThrough : ToolbarButton\" as-child>\n      <PopoverTrigger as-child>\n        <button\n          type=\"button\"\n          class=\"ink-menu-trigger ink-color-menu\"\n          :data-ink-color-menu=\"property\"\n          :data-state=\"open ? 'open' : 'closed'\"\n          v-bind=\"triggerBindings\"\n        >\n          <slot>\n            <span\n              class=\"ink-swatch\"\n              data-ink-swatch\n              aria-hidden=\"true\"\n              :data-property=\"property\"\n              :data-kind=\"trigger.kind\"\n              :data-color=\"trigger.kind === 'color' ? trigger.color : undefined\"\n              :style=\"\n                trigger.kind === 'color' ? { '--ink-swatch': trigger.color } : undefined\n              \"\n            />\n          </slot>\n        </button>\n      </PopoverTrigger>\n    </component>\n    <PopoverPortal>\n      <PopoverContent\n        class=\"ink-select-content ink-menu-content\"\n        data-ink-select-content\n        :data-ink-menu=\"`color-${property}`\"\n        side=\"bottom\"\n        align=\"start\"\n        :side-offset=\"4\"\n        :collision-padding=\"8\"\n        v-bind=\"menuAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n      >\n        <div v-bind=\"innerAttrs\">\n          <button\n            v-if=\"model.noFill\"\n            type=\"button\"\n            role=\"menuitemradio\"\n            class=\"ink-select-item ink-menu-item\"\n            data-ink-select-item\n            tabindex=\"-1\"\n            :aria-checked=\"model.noFill.checked\"\n            :data-state=\"model.noFill.checked ? 'checked' : 'unchecked'\"\n            @click=\"set(model.noFill.patch)\"\n          >\n            No fill\n            <span v-if=\"model.noFill.checked\" class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </span>\n          </button>\n          <div\n            role=\"group\"\n            aria-label=\"Colours\"\n            class=\"ink-color-grid\"\n            :data-ink-menu-columns=\"COLOR_COLUMNS\"\n          >\n            <button\n              v-for=\"sw in model.swatches\"\n              :key=\"sw.key\"\n              type=\"button\"\n              role=\"menuitemradio\"\n              class=\"ink-swatch-item\"\n              tabindex=\"-1\"\n              :aria-label=\"sw.label\"\n              :aria-checked=\"sw.checked\"\n              :data-state=\"sw.checked ? 'checked' : 'unchecked'\"\n              :style=\"{ '--ink-swatch': sw.color }\"\n              @click=\"set(sw.patch)\"\n            />\n          </div>\n          <button\n            type=\"button\"\n            role=\"menuitem\"\n            class=\"ink-select-item ink-menu-item\"\n            data-ink-select-item\n            tabindex=\"-1\"\n            @click=\"customInput?.click()\"\n          >\n            Custom…\n          </button>\n        </div>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n  <input\n    ref=\"customInput\"\n    type=\"color\"\n    class=\"ink-color-input\"\n    aria-label=\"Custom colour\"\n    :data-ink-color-input=\"property\"\n    tabindex=\"-1\"\n    :value=\"model.customValue.toLowerCase()\"\n    @change=\"set(model.custom(($event.target as HTMLInputElement).value))\"\n  />\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,34 @@
+import { ColorProperty } from '@inkbar/core/dom';
+import { StyleGroup } from '@inkbar/core';
+type __VLS_Props = {
+    /** The colour this menu sets. */
+    property: ColorProperty;
+    /** Accessible name; defaults to "Border colour", "Fill colour" or "Text colour". */
+    label?: string;
+    /**
+     * Renders the trigger outside the toolbar's roving focus, for a menu nested in another
+     * panel (the text style menu's text colour).
+     */
+    standalone?: boolean;
+    /**
+     * Scopes the menu to one style group: it shows and sets that group's colour whatever tool
+     * is active, and recolours the selection only when it is all in the group.
+     */
+    group?: StyleGroup | undefined;
+    /** The colour new annotations get while the style leaves it unset; the swatch shows it. */
+    fallback?: string | undefined;
+};
+declare var __VLS_21: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_21) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};
+//# sourceMappingURL=InkColorMenu.vue.d.ts.map

package/dist/components/InkColorMenu.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InkColorMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkColorMenu.vue"],"names":[],"mappings":"AA6OA,OAAO,EAML,KAAK,aAAa,EACnB,MAAM,kBAAkB,CAAA;AAezB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAe9C,KAAK,WAAW,GAAG;IACjB,iCAAiC;IACjC,QAAQ,EAAE,aAAa,CAAA;IACvB,oFAAoF;IACpF,KAAK,CAAC,EAAE,MAAM,CAAA;IACd;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,UAAU,GAAG,SAAS,CAAA;IAC9B,2FAA2F;IAC3F,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CAC9B,CAAC;AAqTF,QAAA,IAAI,QAAQ,IAAY,CAAC;AACzB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAGhD,QAAA,MAAM,UAAU,kSAEd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/InkColorMenu.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,153 @@
+import { useToolStyle as e } from "../composables/useToolStyle.js";
+import t from "./InkIcon.js";
+import { Fragment as n, computed as r, createBlock as ee, createCommentVNode as i, createElementBlock as a, createElementVNode as o, createTextVNode as s, createVNode as c, defineComponent as l, guardReactiveProps as u, mergeProps as d, normalizeProps as f, normalizeStyle as p, openBlock as m, ref as h, renderList as g, renderSlot as _, resolveDynamicComponent as v, unref as y, useAttrs as b, watch as x, withCtx as S } from "vue";
+import { COLOR_COLUMNS as C, colorMenuModel as w, focusInitialMenuItem as T, handleMenuKeys as E, menuItems as D } from "@inkbar/core/dom";
+import { PopoverContent as O, PopoverPortal as k, PopoverRoot as A, PopoverTrigger as j, ToolbarButton as M } from "reka-ui";
+import { Check as N } from "@inkbar/icons";
+//#region src/components/InkColorMenu.vue?vue&type=script&setup=true&lang.ts
+var P = ["data-ink-color-menu", "data-state"], F = [
+	"data-property",
+	"data-kind",
+	"data-color"
+], I = ["aria-checked", "data-state"], L = {
+	key: 0,
+	class: "ink-select-indicator"
+}, R = ["data-ink-menu-columns"], z = [
+	"aria-label",
+	"aria-checked",
+	"data-state",
+	"onClick"
+], B = ["data-ink-color-input", "value"], V = /*@__PURE__*/ l({
+	inheritAttrs: !1,
+	__name: "InkColorMenu",
+	props: {
+		property: {},
+		label: {},
+		standalone: { type: Boolean },
+		group: {},
+		fallback: {}
+	},
+	setup(V) {
+		let H = b(), U = l({
+			inheritAttrs: !1,
+			setup: (e, { slots: t }) => () => t.default?.()
+		}), W = V, { current: G, supported: K, set: q } = e(() => W.group), J = h(!1), Y = h(null), X = r(() => w(W.property, G.value, K.value, W.fallback)), Z = r(() => W.label ?? X.value.label), Q = r(() => X.value.trigger);
+		x(() => X.value.enabled, (e) => {
+			e || (J.value = !1);
+		});
+		let $ = !1;
+		function te(e) {
+			e.key !== "ArrowDown" || e.defaultPrevented || J.value || !X.value.enabled || (e.preventDefault(), $ = !0, J.value = !0);
+		}
+		function ne(e) {
+			e.preventDefault();
+			let t = document.querySelector(`[data-ink-menu="color-${W.property}"] [role="menu"]`);
+			t && ($ ? D(t)[0]?.focus({ preventScroll: !0 }) : T(t)), $ = !1;
+		}
+		let re = r(() => ({
+			"aria-label": Z.value,
+			title: Z.value,
+			"aria-haspopup": "menu",
+			onKeydown: te,
+			"data-mixed": X.value.mixed ? "" : void 0
+		})), ie = r(() => d(H, re.value, { disabled: (H.disabled ?? !1) !== !1 || !X.value.enabled })), ae = r(() => ({ "aria-label": Z.value })), oe = r(() => ({
+			role: "menu",
+			"aria-label": Z.value,
+			onKeydown: (e) => E(e, e.currentTarget)
+		}));
+		return (e, r) => (m(), a(n, null, [c(y(A), {
+			open: J.value,
+			"onUpdate:open": r[2] ||= (e) => J.value = e
+		}, {
+			default: S(() => [(m(), ee(v(V.standalone ? y(U) : y(M)), { "as-child": "" }, {
+				default: S(() => [c(y(j), { "as-child": "" }, {
+					default: S(() => [o("button", d({
+						type: "button",
+						class: "ink-menu-trigger ink-color-menu",
+						"data-ink-color-menu": V.property,
+						"data-state": J.value ? "open" : "closed"
+					}, ie.value), [_(e.$slots, "default", {}, () => [o("span", {
+						class: "ink-swatch",
+						"data-ink-swatch": "",
+						"aria-hidden": "true",
+						"data-property": V.property,
+						"data-kind": Q.value.kind,
+						"data-color": Q.value.kind === "color" ? Q.value.color : void 0,
+						style: p(Q.value.kind === "color" ? { "--ink-swatch": Q.value.color } : void 0)
+					}, null, 12, F)])], 16, P)]),
+					_: 3
+				})]),
+				_: 3
+			})), c(y(k), null, {
+				default: S(() => [c(y(O), d({
+					class: "ink-select-content ink-menu-content",
+					"data-ink-select-content": "",
+					"data-ink-menu": `color-${V.property}`,
+					side: "bottom",
+					align: "start",
+					"side-offset": 4,
+					"collision-padding": 8
+				}, ae.value, { onOpenAutoFocus: ne }), {
+					default: S(() => [o("div", f(u(oe.value)), [
+						X.value.noFill ? (m(), a("button", {
+							key: 0,
+							type: "button",
+							role: "menuitemradio",
+							class: "ink-select-item ink-menu-item",
+							"data-ink-select-item": "",
+							tabindex: "-1",
+							"aria-checked": X.value.noFill.checked,
+							"data-state": X.value.noFill.checked ? "checked" : "unchecked",
+							onClick: r[0] ||= (e) => y(q)(X.value.noFill.patch)
+						}, [r[4] ||= s(" No fill ", -1), X.value.noFill.checked ? (m(), a("span", L, [c(t, {
+							icon: y(N),
+							size: 16
+						}, null, 8, ["icon"])])) : i("", !0)], 8, I)) : i("", !0),
+						o("div", {
+							role: "group",
+							"aria-label": "Colours",
+							class: "ink-color-grid",
+							"data-ink-menu-columns": y(C)
+						}, [(m(!0), a(n, null, g(X.value.swatches, (e) => (m(), a("button", {
+							key: e.key,
+							type: "button",
+							role: "menuitemradio",
+							class: "ink-swatch-item",
+							tabindex: "-1",
+							"aria-label": e.label,
+							"aria-checked": e.checked,
+							"data-state": e.checked ? "checked" : "unchecked",
+							style: p({ "--ink-swatch": e.color }),
+							onClick: (t) => y(q)(e.patch)
+						}, null, 12, z))), 128))], 8, R),
+						o("button", {
+							type: "button",
+							role: "menuitem",
+							class: "ink-select-item ink-menu-item",
+							"data-ink-select-item": "",
+							tabindex: "-1",
+							onClick: r[1] ||= (e) => Y.value?.click()
+						}, " Custom… ")
+					], 16)]),
+					_: 1
+				}, 16, ["data-ink-menu"])]),
+				_: 1
+			})]),
+			_: 3
+		}, 8, ["open"]), o("input", {
+			ref_key: "customInput",
+			ref: Y,
+			type: "color",
+			class: "ink-color-input",
+			"aria-label": "Custom colour",
+			"data-ink-color-input": V.property,
+			tabindex: "-1",
+			value: X.value.customValue.toLowerCase(),
+			onChange: r[3] ||= (e) => y(q)(X.value.custom(e.target.value))
+		}, null, 40, B)], 64));
+	}
+});
+//#endregion
+export { V as default };
+
+//# sourceMappingURL=InkColorMenu.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InkColorMenu.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_createVNode","_unref","_withCtx","_createBlock","_resolveDynamicComponent","_createElementVNode","_mergeProps","_renderSlot","_normalizeStyle","_normalizeProps","_guardReactiveProps","_createTextVNode","InkIcon","_createCommentVNode","_renderList","InkIcon_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","InkColorMenu_vue_vue_type_script_setup_true_lang_default","attrs","useAttrs","PassThrough","defineComponent","slots","props","__props","useToolStyle","open","ref","customInput","model","computed","colorMenuModel","current","supported","name","trigger","enabled","focusFirst","onTriggerKeydown","onOpenAutoFocus","menu","menuItems","focusInitialMenuItem","triggerAttrs","triggerBindings","mergeProps","menuAttrs","innerAttrs","handleMenuKeys","openBlock","createElementBlock","Fragment","createVNode","unref","PopoverRoot","_cache","$event","withCtx","createBlock","resolveDynamicComponent","ToolbarButton","PopoverTrigger","createElementVNode","renderSlot","_ctx","normalizeStyle","PopoverPortal","PopoverContent","normalizeProps","guardReactiveProps","set","createTextVNode","Check","createCommentVNode","COLOR_COLUMNS","renderList","sw"],"sources":["../../src/components/InkColorMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A colour menu for one colour property (border, fill or text) of the selection or the active\n * tool. The trigger shows the current colour as a swatch: split when the selection disagrees,\n * slashed for no fill. The panel is a palette grid, plus \"No fill\" for `fill` and \"Custom…\",\n * which opens a native colour input. The menu disables when nothing supports the property.\n */\nimport {\n  COLOR_COLUMNS,\n  colorMenuModel,\n  focusInitialMenuItem,\n  handleMenuKeys,\n  menuItems,\n  type ColorProperty,\n} from '@inkbar/core/dom'\nimport { Check } from '@inkbar/icons'\nimport {\n  PopoverContent,\n  PopoverPortal,\n  PopoverRoot,\n  PopoverTrigger,\n  ToolbarButton,\n} from 'reka-ui'\nimport { computed, defineComponent, mergeProps, ref, useAttrs, watch } from 'vue'\n\nimport { useToolStyle } from '../composables/useToolStyle'\n\nimport InkIcon from './InkIcon.vue'\n\nimport type { StyleGroup } from '@inkbar/core'\n\ndefineOptions({ inheritAttrs: false })\nconst attrs = useAttrs()\n\n/** Stands in for the toolbar item when the menu is nested in another panel. */\nconst PassThrough = defineComponent({\n  inheritAttrs: false,\n  setup:\n    (_, { slots }) =>\n    () =>\n      slots.default?.(),\n})\n\nconst props = defineProps<{\n  /** The colour this menu sets. */\n  property: ColorProperty\n  /** Accessible name; defaults to \"Border colour\", \"Fill colour\" or \"Text colour\". */\n  label?: string\n  /**\n   * Renders the trigger outside the toolbar's roving focus, for a menu nested in another\n   * panel (the text style menu's text colour).\n   */\n  standalone?: boolean\n  /**\n   * Scopes the menu to one style group: it shows and sets that group's colour whatever tool\n   * is active, and recolours the selection only when it is all in the group.\n   */\n  group?: StyleGroup | undefined\n  /** The colour new annotations get while the style leaves it unset; the swatch shows it. */\n  fallback?: string | undefined\n}>()\n\nconst { current, supported, set } = useToolStyle(() => props.group)\nconst open = ref(false)\nconst customInput = ref<HTMLInputElement | null>(null)\n\nconst model = computed(() =>\n  colorMenuModel(props.property, current.value, supported.value, props.fallback)\n)\nconst name = computed(() => props.label ?? model.value.label)\nconst trigger = computed(() => model.value.trigger)\n\n// The menu closes when the control disables (the selection cleared while it was open).\nwatch(\n  () => model.value.enabled,\n  (enabled) => {\n    if (!enabled) open.value = false\n  }\n)\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\nfunction onTriggerKeydown(e: KeyboardEvent): void {\n  if (e.key !== 'ArrowDown' || e.defaultPrevented || open.value || !model.value.enabled)\n    return\n  e.preventDefault()\n  focusFirst = true\n  open.value = true\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  // One menu is open at a time.\n  const menu = document.querySelector(\n    `[data-ink-menu=\"color-${props.property}\"] [role=\"menu\"]`\n  )\n  if (menu) {\n    if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n    else focusInitialMenuItem(menu)\n  }\n  focusFirst = false\n}\n\n// Reka's typed props stop at its own; ARIA goes through bound objects.\nconst triggerAttrs = computed(() => ({\n  'aria-label': name.value,\n  title: name.value,\n  'aria-haspopup': 'menu' as const,\n  onKeydown: onTriggerKeydown,\n  'data-mixed': model.value.mixed ? '' : undefined,\n}))\n/**\n * The trigger's bindings over the host's: both keydown listeners run, the host's first, and a\n * host `disabled` can disable the trigger but not enable it.\n */\nconst triggerBindings = computed(() =>\n  mergeProps(attrs, triggerAttrs.value, {\n    disabled: (attrs.disabled ?? false) !== false || !model.value.enabled,\n  })\n)\nconst menuAttrs = computed(() => ({ 'aria-label': name.value }))\nconst innerAttrs = computed(() => ({\n  role: 'menu',\n  'aria-label': name.value,\n  onKeydown: (e: KeyboardEvent) => handleMenuKeys(e, e.currentTarget as HTMLElement),\n}))\n</script>\n\n<template>\n  <PopoverRoot v-model:open=\"open\">\n    <component :is=\"standalone ? PassThrough : ToolbarButton\" as-child>\n      <PopoverTrigger as-child>\n        <button\n          type=\"button\"\n          class=\"ink-menu-trigger ink-color-menu\"\n          :data-ink-color-menu=\"property\"\n          :data-state=\"open ? 'open' : 'closed'\"\n          v-bind=\"triggerBindings\"\n        >\n          <slot>\n            <span\n              class=\"ink-swatch\"\n              data-ink-swatch\n              aria-hidden=\"true\"\n              :data-property=\"property\"\n              :data-kind=\"trigger.kind\"\n              :data-color=\"trigger.kind === 'color' ? trigger.color : undefined\"\n              :style=\"\n                trigger.kind === 'color' ? { '--ink-swatch': trigger.color } : undefined\n              \"\n            />\n          </slot>\n        </button>\n      </PopoverTrigger>\n    </component>\n    <PopoverPortal>\n      <PopoverContent\n        class=\"ink-select-content ink-menu-content\"\n        data-ink-select-content\n        :data-ink-menu=\"`color-${property}`\"\n        side=\"bottom\"\n        align=\"start\"\n        :side-offset=\"4\"\n        :collision-padding=\"8\"\n        v-bind=\"menuAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n      >\n        <div v-bind=\"innerAttrs\">\n          <button\n            v-if=\"model.noFill\"\n            type=\"button\"\n            role=\"menuitemradio\"\n            class=\"ink-select-item ink-menu-item\"\n            data-ink-select-item\n            tabindex=\"-1\"\n            :aria-checked=\"model.noFill.checked\"\n            :data-state=\"model.noFill.checked ? 'checked' : 'unchecked'\"\n            @click=\"set(model.noFill.patch)\"\n          >\n            No fill\n            <span v-if=\"model.noFill.checked\" class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </span>\n          </button>\n          <div\n            role=\"group\"\n            aria-label=\"Colours\"\n            class=\"ink-color-grid\"\n            :data-ink-menu-columns=\"COLOR_COLUMNS\"\n          >\n            <button\n              v-for=\"sw in model.swatches\"\n              :key=\"sw.key\"\n              type=\"button\"\n              role=\"menuitemradio\"\n              class=\"ink-swatch-item\"\n              tabindex=\"-1\"\n              :aria-label=\"sw.label\"\n              :aria-checked=\"sw.checked\"\n              :data-state=\"sw.checked ? 'checked' : 'unchecked'\"\n              :style=\"{ '--ink-swatch': sw.color }\"\n              @click=\"set(sw.patch)\"\n            />\n          </div>\n          <button\n            type=\"button\"\n            role=\"menuitem\"\n            class=\"ink-select-item ink-menu-item\"\n            data-ink-select-item\n            tabindex=\"-1\"\n            @click=\"customInput?.click()\"\n          >\n            Custom…\n          </button>\n        </div>\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n  <input\n    ref=\"customInput\"\n    type=\"color\"\n    class=\"ink-color-input\"\n    aria-label=\"Custom colour\"\n    :data-ink-color-input=\"property\"\n    tabindex=\"-1\"\n    :value=\"model.customValue.toLowerCase()\"\n    @change=\"set(model.custom(($event.target as HTMLInputElement).value))\"\n  />\n</template>\n"],"mappings":"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"}

package/dist/components/InkHighlightMenu.js

@@ -0,0 +1,7 @@
+import e from "./InkHighlightMenu.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/InkHighlightMenu.vue
+var t = e;
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=InkHighlightMenu.js.map

package/dist/components/InkHighlightMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InkHighlightMenu.js","names":["_sfc_main","InkHighlightMenu_vue_vue_type_script_setup_true_lang_default","InkHighlightMenu_default"],"sources":["../../src/components/InkHighlightMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A split button for the highlight tool. The main part activates the tool with the current\n * markup kind and draws that kind's icon; the chevron opens a menu of the four kinds plus\n * the markup colour. Choosing a kind switches to the tool with it. The colour is a nested\n * `InkColorMenu` scoped to the `markup` style group, so it works whatever tool is active.\n */\nimport {\n  focusInitialMenuItem,\n  handleMenuKeys,\n  highlightMenuModel,\n  MARKUP_ICONS,\n  MARKUP_KINDS,\n  menuItems,\n  type HighlightOptions,\n  type MarkupKind,\n} from '@inkbar/core/dom'\nimport { ChevronDown } from '@inkbar/icons'\nimport {\n  PopoverAnchor,\n  PopoverContent,\n  PopoverPortal,\n  PopoverRoot,\n  PopoverTrigger,\n  ToolbarButton,\n} from 'reka-ui'\nimport { computed, ref } from 'vue'\n\nimport { useDocument } from '../composables/useDocument'\nimport { useTool } from '../composables/useTool'\nimport { useToolOptions } from '../composables/useToolOptions'\n\nimport InkColorMenu from './InkColorMenu.vue'\nimport InkIcon from './InkIcon.vue'\n\ndefineOptions({ inheritAttrs: false })\nconst { tool, setTool } = useTool()\nconst { options, setOptions } = useToolOptions<HighlightOptions>('highlight')\nconst { document: doc } = useDocument()\nconst open = ref(false)\n\nconst model = computed(() => highlightMenuModel(options.value, MARKUP_KINDS))\nconst active = computed(() => tool.value === 'highlight')\n/** The colour the chosen kind gets while the markup style leaves it unset. */\nconst fallback = computed(() => doc.value?.annotations.defaults.color(model.value.kind))\nconst icon = computed(() => MARKUP_ICONS[model.value.kind])\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\nfunction onTriggerKeydown(e: KeyboardEvent): void {\n  if (e.key !== 'ArrowDown' || e.defaultPrevented || open.value) return\n  e.preventDefault()\n  focusFirst = true\n  open.value = true\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  // One highlight menu is open at a time.\n  const menu = document.querySelector('[data-ink-menu=\"highlight\"] [role=\"menu\"]')\n  if (menu) {\n    if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n    else focusInitialMenuItem(menu)\n  }\n  focusFirst = false\n}\n\nfunction choose(kind: MarkupKind): void {\n  setOptions({ kind })\n  setTool('highlight')\n  open.value = false\n}\n\n// Reka's typed props stop at its own; ARIA and listeners go through bound objects.\nconst mainAttrs = computed(() => ({\n  'aria-pressed': String(active.value),\n  'aria-label': model.value.label,\n  title: model.value.label,\n  onClick: () => setTool('highlight'),\n}))\nconst triggerAttrs = {\n  'aria-label': 'Choose highlight',\n  title: 'Choose highlight',\n  'aria-haspopup': 'menu' as const,\n  onKeydown: onTriggerKeydown,\n}\nconst menuAttrs = { 'aria-label': 'Highlights' }\n/** The colour trigger is an item of this menu, reached with the arrow keys. */\nconst colourAttrs = { role: 'menuitem', tabindex: -1 }\nconst innerAttrs = {\n  role: 'menu',\n  'aria-label': 'Highlights',\n  // Capture, so the arrow keys move on from the colour item before its own ArrowDown\n  // opens the nested menu.\n  onKeydownCapture: (e: KeyboardEvent) =>\n    handleMenuKeys(e, e.currentTarget as HTMLElement),\n}\n</script>\n\n<template>\n  <PopoverRoot v-model:open=\"open\">\n    <PopoverAnchor as-child>\n      <div\n        role=\"group\"\n        aria-label=\"Highlight\"\n        class=\"ink-split-button ink-highlight-menu\"\n        data-ink-highlight-menu\n        v-bind=\"$attrs\"\n      >\n        <ToolbarButton\n          class=\"ink-tool-button ink-highlight-button\"\n          data-ink-tool-button\n          data-ink-highlight-button\n          data-tool=\"highlight\"\n          :data-kind=\"model.kind\"\n          :data-state=\"active ? 'on' : 'off'\"\n          v-bind=\"mainAttrs\"\n        >\n          <slot :active=\"active\" :kind=\"model.kind\"><InkIcon :icon=\"icon\" /></slot>\n        </ToolbarButton>\n        <ToolbarButton as-child>\n          <PopoverTrigger as-child>\n            <button\n              type=\"button\"\n              class=\"ink-menu-trigger ink-highlight-menu-trigger\"\n              data-ink-highlight-menu-trigger\n              :data-state=\"open ? 'open' : 'closed'\"\n              v-bind=\"triggerAttrs\"\n            >\n              <InkIcon :icon=\"ChevronDown\" />\n            </button>\n          </PopoverTrigger>\n        </ToolbarButton>\n        <PopoverPortal>\n          <PopoverContent\n            class=\"ink-select-content ink-menu-content\"\n            data-ink-select-content\n            data-ink-menu=\"highlight\"\n            side=\"bottom\"\n            align=\"start\"\n            :side-offset=\"4\"\n            :collision-padding=\"8\"\n            v-bind=\"menuAttrs\"\n            @open-auto-focus=\"onOpenAutoFocus\"\n          >\n            <div v-bind=\"innerAttrs\">\n              <div role=\"group\" aria-label=\"Kinds\" class=\"ink-highlight-kinds\">\n                <button\n                  v-for=\"item in model.items\"\n                  :key=\"item.kind\"\n                  type=\"button\"\n                  role=\"menuitemradio\"\n                  class=\"ink-select-item ink-menu-item ink-highlight-item\"\n                  data-ink-select-item\n                  tabindex=\"-1\"\n                  :data-key=\"item.kind\"\n                  :aria-checked=\"item.checked\"\n                  :data-state=\"item.checked ? 'checked' : 'unchecked'\"\n                  @click=\"choose(item.kind)\"\n                >\n                  <InkIcon :icon=\"MARKUP_ICONS[item.kind]\" :size=\"16\" />\n                  {{ item.label }}\n                </button>\n              </div>\n              <div role=\"separator\" class=\"ink-select-separator\" />\n              <div role=\"group\" aria-label=\"Colour\" class=\"ink-highlight-colour\">\n                <span class=\"ink-highlight-colour-label\" aria-hidden=\"true\">Colour</span>\n                <InkColorMenu\n                  property=\"border\"\n                  group=\"markup\"\n                  label=\"Highlight colour\"\n                  standalone\n                  :fallback=\"fallback\"\n                  v-bind=\"colourAttrs\"\n                />\n              </div>\n            </div>\n          </PopoverContent>\n        </PopoverPortal>\n      </div>\n    </PopoverAnchor>\n  </PopoverRoot>\n</template>\n"],"mappings":""}

package/dist/components/{InkSuggestionCard.vue.d.ts → InkHighlightMenu.vue.d.ts}

@@ -1,8 +1,9 @@
-import { SuggestionCardSlotProps } from '@inkbar/core/dom';
-export type { ConfidenceBucket } from '@inkbar/core';
-export type { SuggestionCardSlotProps } from '@inkbar/core/dom';
-type __VLS_Slots = {
-    default?(props: SuggestionCardSlotProps): unknown;
+declare var __VLS_21: {
+    active: boolean;
+    kind: "highlight" | "underline" | "strikeout" | "squiggly";
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_21) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
@@ -13,4 +14,4 @@ type __VLS_WithSlots<T, S> = T & {
         $slots: S;
     };
 };
-//# sourceMappingURL=InkSuggestionCard.vue.d.ts.map
+//# sourceMappingURL=InkHighlightMenu.vue.d.ts.map

package/dist/components/InkHighlightMenu.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InkHighlightMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkHighlightMenu.vue"],"names":[],"mappings":"AA8hBA,QAAA,IAAI,QAAQ;;;CAAY,CAAC;AACzB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAGhD,QAAA,MAAM,UAAU,+QACd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}