@inkbar/vue 0.6.0 → 0.8.0

package/dist/components/InkSignFieldPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InkSignFieldPopover.js","names":["_sfc_main","InkSignFieldPopover_vue_vue_type_script_setup_true_lang_default","InkSignFieldPopover_default"],"sources":["../../src/components/InkSignFieldPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The signature menu for a signature field, opened from the field's \"Sign\" button and anchored\n * to its box. It lists the saved signatures and \"Create signature\", as `InkSignatureMenu`\n * does. Picking one signs the field with it (`signField`); a signature made in\n * `InkSignatureDialog` signs the field once saved, without picking the signature tool. Focus\n * returns to the field. InkViewport mounts it, one per document; hosts compose nothing.\n */\nimport { InkError, signField, type SignatureTemplate } from '@inkbar/core'\nimport {\n  focusInitialMenuItem,\n  SIGNATURE_LABELS,\n  signatureMenuModel,\n  watchDetached,\n} from '@inkbar/core/dom'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { useInkContext } from '../context'\nimport { useReadable } from '../use-readable'\n\nimport InkSignatureDialog from './InkSignatureDialog.vue'\nimport SignatureMenuPanel from './SignatureMenuPanel.vue'\n\nimport type { InkDocument } from '@inkbar/core'\nimport type { SignFieldRequest } from '@inkbar/core/dom'\n\nconst props = defineProps<{\n  /** The field to sign; `null` while the menu is closed. */\n  request: SignFieldRequest | null\n}>()\nconst emit = defineEmits<{ close: [] }>()\n\nconst NO_TEMPLATES: readonly SignatureTemplate[] = []\n\nconst ctx = useInkContext('InkSignFieldPopover')\nconst templates = useReadable(() => ctx.signatures.value.templates, NO_TEMPLATES)\n// No signature is \"chosen\" here: each signing picks its own.\nconst model = computed(() => signatureMenuModel(templates.value, {}))\nconst open = computed(() => props.request !== null)\n/** The field the dialog signs once its signature is saved, and the document it is in. */\nconst creatingFor = shallowRef<{ req: SignFieldRequest; doc: InkDocument } | null>(null)\nconst creating = computed({\n  get: () => creatingFor.value !== null,\n  set: (next) => {\n    if (!next) creatingFor.value = null\n  },\n})\n/**\n * The request the menu was last open for, kept to return focus once it closes. A request that\n * replaces the open one takes over, so focus returns to the field asked for last.\n */\nlet last: SignFieldRequest | null = null\n/** Set while the menu closes for the dialog, which takes focus instead of the field. */\nlet toDialog = false\n/** Cleared on unmount, so a dialog save that settles after the document went signs nothing. */\nlet alive = true\nonBeforeUnmount(() => {\n  alive = false\n})\n\n// The field's box went (its page unmounted, its layer rebuilt): the menu has nothing to stand\n// by.\nwatch(\n  () => props.request,\n  (req, _, onCleanup) => {\n    if (!req) return\n    last = req\n    onCleanup(watchDetached(req.anchor, () => emit('close')))\n  },\n  { immediate: true }\n)\n\nconst control = (req: SignFieldRequest | null): HTMLElement | null =>\n  req?.anchor.querySelector<HTMLElement>('button.ink-form-control') ?? null\n\n/** Focus goes back to the field's button, or to the scroll element once the field's box has gone. */\nfunction returnFocus(req: SignFieldRequest | null): void {\n  const c = control(req)\n  ;(c?.isConnected ? c : ctx.viewportEl.value)?.focus({ preventScroll: true })\n}\n\n/** Signs the request's field with `t`; a refusal (signed, read-only by now) goes to `error`. */\nfunction sign(req: SignFieldRequest, doc: InkDocument, t: SignatureTemplate): void {\n  // The document the request came from is still the open one.\n  if (!alive || ctx.document.value !== doc) return\n  try {\n    signField(doc, req.field, req.widget, t)\n  } catch (e) {\n    if (!(e instanceof InkError)) throw e\n    ctx.reportError(e)\n  }\n}\n\nfunction choose(t: SignatureTemplate): void {\n  const req = props.request\n  const doc = ctx.document.value\n  emit('close')\n  if (req && doc) sign(req, doc, t)\n}\n\nfunction create(): void {\n  const req = props.request\n  const doc = ctx.document.value\n  if (!req || !doc) return\n  toDialog = true\n  creatingFor.value = { req, doc }\n  emit('close')\n}\n\nfunction onSaved(t: SignatureTemplate): void {\n  const c = creatingFor.value\n  if (c) sign(c.req, c.doc, t)\n}\n\n/**\n * A press on this field's own button toggles the menu through the engine; it must not also\n * close it here first, or the click would open it again.\n */\nfunction onInteractOutside(e: CustomEvent<{ originalEvent: Event }>): void {\n  const target = e.detail.originalEvent.target\n  if (target instanceof Node && props.request?.anchor.contains(target)) e.preventDefault()\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  // An old removal error is not news when the menu opens again.\n  ctx.signatures.value.clearRemoveError()\n  const menu = (e.target as HTMLElement | null)?.querySelector<HTMLElement>(\n    '[role=\"menu\"]'\n  )\n  if (menu) focusInitialMenuItem(menu)\n}\n\nfunction onCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  if (!toDialog) returnFocus(last)\n  toDialog = false\n}\n\nfunction onDialogCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  returnFocus(last)\n}\n\nfunction onOpenChange(next: boolean): void {\n  if (!next) emit('close')\n}\n\n// Reka's typed props stop at its own; ARIA goes through a bound object.\nconst menuAttrs = { 'aria-label': SIGNATURE_LABELS.menu }\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"props.request\"\n        :reference=\"props.request.anchor\"\n        class=\"ink-select-content ink-menu-content\"\n        data-ink-select-content\n        data-ink-menu=\"signature\"\n        :data-ink-sign-field-menu=\"props.request.field\"\n        side=\"bottom\"\n        align=\"start\"\n        :side-offset=\"4\"\n        :collision-padding=\"8\"\n        v-bind=\"menuAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"onCloseAutoFocus\"\n        @interact-outside=\"onInteractOutside\"\n      >\n        <SignatureMenuPanel :items=\"model.items\" @choose=\"choose\" @create=\"create\" />\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n  <InkSignatureDialog\n    v-model:open=\"creating\"\n    :select=\"false\"\n    @save=\"onSaved\"\n    @close-auto-focus=\"onDialogCloseAutoFocus\"\n  />\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,13 @@
+import { SignFieldRequest } from '@inkbar/core/dom';
+type __VLS_Props = {
+    /** The field to sign; `null` while the menu is closed. */
+    request: SignFieldRequest | null;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    close: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onClose?: () => any;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=InkSignFieldPopover.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InkSignFieldPopover.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkSignFieldPopover.vue"],"names":[],"mappings":"AAiNA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAGxD,KAAK,WAAW,GAAG;IACjB,0DAA0D;IAC1D,OAAO,EAAE,gBAAgB,GAAG,IAAI,CAAA;CACjC,CAAC;AA4RF,QAAA,MAAM,YAAY;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/InkSignFieldPopover.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,116 @@
+import { useInkContext as e } from "../context.js";
+import { useReadable as t } from "../use-readable.js";
+import n from "./InkSignatureDialog.js";
+import r from "./SignatureMenuPanel.js";
+import { Fragment as i, computed as a, createBlock as o, createCommentVNode as s, createElementBlock as c, createVNode as l, defineComponent as u, mergeProps as d, onBeforeUnmount as f, openBlock as p, shallowRef as m, unref as h, watch as g, withCtx as _ } from "vue";
+import { InkError as v, signField as y } from "@inkbar/core";
+import { SIGNATURE_LABELS as b, focusInitialMenuItem as x, signatureMenuModel as S, watchDetached as C } from "@inkbar/core/dom";
+import { PopoverContent as w, PopoverPortal as T, PopoverRoot as E } from "reka-ui";
+//#region src/components/InkSignFieldPopover.vue?vue&type=script&setup=true&lang.ts
+var D = /*@__PURE__*/ u({
+	__name: "InkSignFieldPopover",
+	props: { request: {} },
+	emits: ["close"],
+	setup(u, { emit: D }) {
+		let O = u, k = D, A = [], j = e("InkSignFieldPopover"), M = t(() => j.signatures.value.templates, A), N = a(() => S(M.value, {})), P = a(() => O.request !== null), F = m(null), I = a({
+			get: () => F.value !== null,
+			set: (e) => {
+				e || (F.value = null);
+			}
+		}), L = null, R = !1, z = !0;
+		f(() => {
+			z = !1;
+		}), g(() => O.request, (e, t, n) => {
+			e && (L = e, n(C(e.anchor, () => k("close"))));
+		}, { immediate: !0 });
+		let B = (e) => e?.anchor.querySelector("button.ink-form-control") ?? null;
+		function V(e) {
+			let t = B(e);
+			(t?.isConnected ? t : j.viewportEl.value)?.focus({ preventScroll: !0 });
+		}
+		function H(e, t, n) {
+			if (z && j.document.value === t) try {
+				y(t, e.field, e.widget, n);
+			} catch (e) {
+				if (!(e instanceof v)) throw e;
+				j.reportError(e);
+			}
+		}
+		function U(e) {
+			let t = O.request, n = j.document.value;
+			k("close"), t && n && H(t, n, e);
+		}
+		function W() {
+			let e = O.request, t = j.document.value;
+			e && t && (R = !0, F.value = {
+				req: e,
+				doc: t
+			}, k("close"));
+		}
+		function G(e) {
+			let t = F.value;
+			t && H(t.req, t.doc, e);
+		}
+		function K(e) {
+			let t = e.detail.originalEvent.target;
+			t instanceof Node && O.request?.anchor.contains(t) && e.preventDefault();
+		}
+		function q(e) {
+			e.preventDefault(), j.signatures.value.clearRemoveError();
+			let t = e.target?.querySelector("[role=\"menu\"]");
+			t && x(t);
+		}
+		function J(e) {
+			e.preventDefault(), R || V(L), R = !1;
+		}
+		function Y(e) {
+			e.preventDefault(), V(L);
+		}
+		function X(e) {
+			e || k("close");
+		}
+		let Z = { "aria-label": b.menu };
+		return (e, t) => (p(), c(i, null, [l(h(E), {
+			open: P.value,
+			"onUpdate:open": X
+		}, {
+			default: _(() => [l(h(T), null, {
+				default: _(() => [O.request ? (p(), o(h(w), d({
+					key: 0,
+					reference: O.request.anchor,
+					class: "ink-select-content ink-menu-content",
+					"data-ink-select-content": "",
+					"data-ink-menu": "signature",
+					"data-ink-sign-field-menu": O.request.field,
+					side: "bottom",
+					align: "start",
+					"side-offset": 4,
+					"collision-padding": 8
+				}, Z, {
+					onOpenAutoFocus: q,
+					onCloseAutoFocus: J,
+					onInteractOutside: K
+				}), {
+					default: _(() => [l(r, {
+						items: N.value.items,
+						onChoose: U,
+						onCreate: W
+					}, null, 8, ["items"])]),
+					_: 1
+				}, 16, ["reference", "data-ink-sign-field-menu"])) : s("", !0)]),
+				_: 1
+			})]),
+			_: 1
+		}, 8, ["open"]), l(n, {
+			open: I.value,
+			"onUpdate:open": t[0] ||= (e) => I.value = e,
+			select: !1,
+			onSave: G,
+			onCloseAutoFocus: Y
+		}, null, 8, ["open"])], 64));
+	}
+});
+//#endregion
+export { D as default };
+
+//# sourceMappingURL=InkSignFieldPopover.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"InkSignFieldPopover.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_createVNode","_unref","_withCtx","_createBlock","_mergeProps","SignatureMenuPanel","_createCommentVNode","InkSignatureDialog","InkSignatureDialog_default","SignatureMenuPanel_default","InkSignFieldPopover_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","NO_TEMPLATES","ctx","useInkContext","templates","useReadable","model","computed","signatureMenuModel","open","creatingFor","shallowRef","creating","next","last","toDialog","alive","onBeforeUnmount","watch","req","onCleanup","watchDetached","control","returnFocus","c","sign","doc","t","InkError","choose","create","onSaved","onInteractOutside","target","onOpenAutoFocus","menu","focusInitialMenuItem","onCloseAutoFocus","onDialogCloseAutoFocus","onOpenChange","menuAttrs","SIGNATURE_LABELS","openBlock","createElementBlock","Fragment","createVNode","unref","PopoverRoot","withCtx","PopoverPortal","createBlock","PopoverContent","mergeProps","createCommentVNode","_cache","$event"],"sources":["../../src/components/InkSignFieldPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * The signature menu for a signature field, opened from the field's \"Sign\" button and anchored\n * to its box. It lists the saved signatures and \"Create signature\", as `InkSignatureMenu`\n * does. Picking one signs the field with it (`signField`); a signature made in\n * `InkSignatureDialog` signs the field once saved, without picking the signature tool. Focus\n * returns to the field. InkViewport mounts it, one per document; hosts compose nothing.\n */\nimport { InkError, signField, type SignatureTemplate } from '@inkbar/core'\nimport {\n  focusInitialMenuItem,\n  SIGNATURE_LABELS,\n  signatureMenuModel,\n  watchDetached,\n} from '@inkbar/core/dom'\nimport { PopoverContent, PopoverPortal, PopoverRoot } from 'reka-ui'\nimport { computed, onBeforeUnmount, shallowRef, watch } from 'vue'\n\nimport { useInkContext } from '../context'\nimport { useReadable } from '../use-readable'\n\nimport InkSignatureDialog from './InkSignatureDialog.vue'\nimport SignatureMenuPanel from './SignatureMenuPanel.vue'\n\nimport type { InkDocument } from '@inkbar/core'\nimport type { SignFieldRequest } from '@inkbar/core/dom'\n\nconst props = defineProps<{\n  /** The field to sign; `null` while the menu is closed. */\n  request: SignFieldRequest | null\n}>()\nconst emit = defineEmits<{ close: [] }>()\n\nconst NO_TEMPLATES: readonly SignatureTemplate[] = []\n\nconst ctx = useInkContext('InkSignFieldPopover')\nconst templates = useReadable(() => ctx.signatures.value.templates, NO_TEMPLATES)\n// No signature is \"chosen\" here: each signing picks its own.\nconst model = computed(() => signatureMenuModel(templates.value, {}))\nconst open = computed(() => props.request !== null)\n/** The field the dialog signs once its signature is saved, and the document it is in. */\nconst creatingFor = shallowRef<{ req: SignFieldRequest; doc: InkDocument } | null>(null)\nconst creating = computed({\n  get: () => creatingFor.value !== null,\n  set: (next) => {\n    if (!next) creatingFor.value = null\n  },\n})\n/**\n * The request the menu was last open for, kept to return focus once it closes. A request that\n * replaces the open one takes over, so focus returns to the field asked for last.\n */\nlet last: SignFieldRequest | null = null\n/** Set while the menu closes for the dialog, which takes focus instead of the field. */\nlet toDialog = false\n/** Cleared on unmount, so a dialog save that settles after the document went signs nothing. */\nlet alive = true\nonBeforeUnmount(() => {\n  alive = false\n})\n\n// The field's box went (its page unmounted, its layer rebuilt): the menu has nothing to stand\n// by.\nwatch(\n  () => props.request,\n  (req, _, onCleanup) => {\n    if (!req) return\n    last = req\n    onCleanup(watchDetached(req.anchor, () => emit('close')))\n  },\n  { immediate: true }\n)\n\nconst control = (req: SignFieldRequest | null): HTMLElement | null =>\n  req?.anchor.querySelector<HTMLElement>('button.ink-form-control') ?? null\n\n/** Focus goes back to the field's button, or to the scroll element once the field's box has gone. */\nfunction returnFocus(req: SignFieldRequest | null): void {\n  const c = control(req)\n  ;(c?.isConnected ? c : ctx.viewportEl.value)?.focus({ preventScroll: true })\n}\n\n/** Signs the request's field with `t`; a refusal (signed, read-only by now) goes to `error`. */\nfunction sign(req: SignFieldRequest, doc: InkDocument, t: SignatureTemplate): void {\n  // The document the request came from is still the open one.\n  if (!alive || ctx.document.value !== doc) return\n  try {\n    signField(doc, req.field, req.widget, t)\n  } catch (e) {\n    if (!(e instanceof InkError)) throw e\n    ctx.reportError(e)\n  }\n}\n\nfunction choose(t: SignatureTemplate): void {\n  const req = props.request\n  const doc = ctx.document.value\n  emit('close')\n  if (req && doc) sign(req, doc, t)\n}\n\nfunction create(): void {\n  const req = props.request\n  const doc = ctx.document.value\n  if (!req || !doc) return\n  toDialog = true\n  creatingFor.value = { req, doc }\n  emit('close')\n}\n\nfunction onSaved(t: SignatureTemplate): void {\n  const c = creatingFor.value\n  if (c) sign(c.req, c.doc, t)\n}\n\n/**\n * A press on this field's own button toggles the menu through the engine; it must not also\n * close it here first, or the click would open it again.\n */\nfunction onInteractOutside(e: CustomEvent<{ originalEvent: Event }>): void {\n  const target = e.detail.originalEvent.target\n  if (target instanceof Node && props.request?.anchor.contains(target)) e.preventDefault()\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  // An old removal error is not news when the menu opens again.\n  ctx.signatures.value.clearRemoveError()\n  const menu = (e.target as HTMLElement | null)?.querySelector<HTMLElement>(\n    '[role=\"menu\"]'\n  )\n  if (menu) focusInitialMenuItem(menu)\n}\n\nfunction onCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  if (!toDialog) returnFocus(last)\n  toDialog = false\n}\n\nfunction onDialogCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  returnFocus(last)\n}\n\nfunction onOpenChange(next: boolean): void {\n  if (!next) emit('close')\n}\n\n// Reka's typed props stop at its own; ARIA goes through a bound object.\nconst menuAttrs = { 'aria-label': SIGNATURE_LABELS.menu }\n</script>\n\n<template>\n  <PopoverRoot :open=\"open\" @update:open=\"onOpenChange\">\n    <PopoverPortal>\n      <PopoverContent\n        v-if=\"props.request\"\n        :reference=\"props.request.anchor\"\n        class=\"ink-select-content ink-menu-content\"\n        data-ink-select-content\n        data-ink-menu=\"signature\"\n        :data-ink-sign-field-menu=\"props.request.field\"\n        side=\"bottom\"\n        align=\"start\"\n        :side-offset=\"4\"\n        :collision-padding=\"8\"\n        v-bind=\"menuAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"onCloseAutoFocus\"\n        @interact-outside=\"onInteractOutside\"\n      >\n        <SignatureMenuPanel :items=\"model.items\" @choose=\"choose\" @create=\"create\" />\n      </PopoverContent>\n    </PopoverPortal>\n  </PopoverRoot>\n  <InkSignatureDialog\n    v-model:open=\"creating\"\n    :select=\"false\"\n    @save=\"onSaved\"\n    @close-auto-focus=\"onDialogCloseAutoFocus\"\n  />\n</template>\n"],"mappings":";;;;;;;;;;;;;;EA2BA,IAAMe,IAAQC,GAIRC,IAAOH,GAEPI,IAA6C,CAAC,GAE9CC,IAAMC,EAAc,qBAAqB,GACzCC,IAAYC,QAAkBH,EAAI,WAAW,MAAM,WAAWD,CAAY,GAE1EK,IAAQC,QAAeC,EAAmBJ,EAAU,OAAO,CAAC,CAAC,CAAC,GAC9DK,IAAOF,QAAeT,EAAM,YAAY,IAAI,GAE5CY,IAAcC,EAA+D,IAAI,GACjFC,IAAWL,EAAS;GACxB,WAAWG,EAAY,UAAU;GACjC,MAAM,MAAS;IACb,AAAKG,MAAM,EAAY,QAAQ;GACjC;EACF,CAAC,GAKGC,IAAgC,MAEhCC,IAAW,IAEXC,IAAQ;EAOZ,AANAC,QAAsB;GACpB,IAAQ;EACV,CAAC,GAIDC,QACQpB,EAAM,UACX,GAAK,GAAG,MAAc;GACrB,AAAKqB,MACL,IAAOA,GACPC,EAAUC,EAAcF,EAAI,cAAcnB,EAAK,OAAO,CAAC,CAAC;EAC1D,GACA,EAAE,WAAW,GAAK,CACpB;EAEA,IAAMsB,KAAW,MACfH,GAAK,OAAO,cAA2B,yBAAyB,KAAK;EAGvE,SAASI,EAAY,GAAoC;GACvD,IAAMC,IAAIF,EAAQH,CAAG;GACpB,CAACK,GAAG,cAAcA,IAAItB,EAAI,WAAW,MAAA,EAAQ,MAAM,EAAE,eAAe,GAAK,CAAC;EAC7E;EAGA,SAASuB,EAAK,GAAuB,GAAkB,GAA4B;GAEjF,IAAKT,KAASd,EAAI,SAAS,UAAUwB,GACrC,IAAI;IACF,EAAUA,GAAKP,EAAI,OAAOA,EAAI,QAAQQ,CAAC;GACzC,SAAS,GAAG;IACV,IAAI,EAAE,aAAaC,IAAW,MAAM;IACpC,EAAI,YAAY,CAAC;GACnB;EACF;EAEA,SAASC,EAAO,GAA4B;GAC1C,IAAMV,IAAMrB,EAAM,SACZ4B,IAAMxB,EAAI,SAAS;GAEzB,AADAF,EAAK,OAAO,GACRmB,KAAOO,KAAKD,EAAKN,GAAKO,GAAKC,CAAC;EAClC;EAEA,SAASG,IAAe;GACtB,IAAMX,IAAMrB,EAAM,SACZ4B,IAAMxB,EAAI,SAAS;GACzB,AAAKiB,KAAQO,MACb,IAAW,IACX,EAAY,QAAQ;IAAE;IAAK;GAAI,GAC/B1B,EAAK,OAAO;EACd;EAEA,SAAS+B,EAAQ,GAA4B;GAC3C,IAAMP,IAAId,EAAY;GACtB,AAAIc,KAAGC,EAAKD,EAAE,KAAKA,EAAE,KAAKG,CAAC;EAC7B;EAMA,SAASK,EAAkB,GAAgD;GACzE,IAAMC,IAAS,EAAE,OAAO,cAAc;GACtC,AAAIA,aAAkB,QAAQnC,EAAM,SAAS,OAAO,SAASmC,CAAM,KAAG,EAAE,eAAe;EACzF;EAEA,SAASC,EAAgB,GAAgB;GAGvC,AAFA,EAAE,eAAe,GAEjBhC,EAAI,WAAW,MAAM,iBAAiB;GACtC,IAAMiC,IAAQ,EAAE,QAA+B,cAC7C,iBACF;GACA,AAAIA,KAAMC,EAAqBD,CAAI;EACrC;EAEA,SAASE,EAAiB,GAAgB;GAGxC,AAFA,EAAE,eAAe,GACZtB,KAAUQ,EAAYT,CAAI,GAC/B,IAAW;EACb;EAEA,SAASwB,EAAuB,GAAgB;GAE9C,AADA,EAAE,eAAe,GACjBf,EAAYT,CAAI;EAClB;EAEA,SAASyB,EAAa,GAAqB;GACzC,AAAK1B,KAAMb,EAAK,OAAO;EACzB;EAGA,IAAMwC,IAAY,EAAE,cAAcC,EAAiB,KAAK;oBAItDvD,EAAAA,GAAAA,EAAAA,GAAAA,MAAAA,CAAAA,EAqBcC,EAAA4D,CAAA,GAAA;GArBA,MAAMtC,EAAA;GAAO,iBAAa8B;;GACtC,SAAAnD,QAmBgB,CAnBhBF,EAmBgBC,EAAA8D,CAAA,GAAA,MAAA;IAlBd,SAAA7D,QAiBiB,CAhBTU,EAAM,WADdf,EAAA,GAAAM,EAiBiBF,EAAAgE,CAAA,GAjBjB7D,EAiBiB;;KAfd,WAAWQ,EAAM,QAAQ;KAC1B,OAAM;KACN,2BAAA;KACA,iBAAc;KACb,4BAA0BA,EAAM,QAAQ;KACzC,MAAK;KACL,OAAM;KACL,eAAa;KACb,qBAAmB;IACZ,GAAA0C,GAAS;KACC;KACC;KACA;;KAEnB,SAAApD,QAA6E,CAA7EF,EAA6EK,GAAA;MAAxD,OAAOe,EAAA,MAAM;MAAQ,UAAQuB;MAAS,UAAQC;;;;;;;EAIzE5C,GAAAA,GAAAA,CAAAA,MAAAA,CAAAA,GAAAA,EAKEO,GAAA;GAJQ,MAAMmB,EAAA;GAAA,iBAAA,AAAA0C,EAAA,QAAA,MAAA,EAAQ,QAAAC;GACrB,QAAQ;GACR,QAAMxB;GACN,kBAAkBO"}

package/dist/components/InkSignatureDialog.js.map

@@ -1 +1 @@
-{"version":3,"file":"InkSignatureDialog.js","names":["_sfc_main","InkSignatureDialog_vue_vue_type_script_setup_true_lang_default","InkSignatureDialog_default"],"sources":["../../src/components/InkSignatureDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * \"Create signature\": a modal with Draw, Type and Image tabs. Draw is a pad with the draw\n * tool's renderer; Type sets a name in one of the host's handwriting fonts; Image takes a PNG\n * or JPEG scan. Save stores the template through InkRoot's signature store and selects it for\n * the `signature` tool. Escape, Cancel or a press outside closes it.\n */\nimport { SIGNATURE_LABELS } from '@inkbar/core/dom'\nimport {\n  DialogContent,\n  DialogOverlay,\n  DialogPortal,\n  DialogRoot,\n  DialogTitle,\n} from 'reka-ui'\n\nimport SignatureForm from './SignatureForm.vue'\n\nimport type { SignatureTemplate } from '@inkbar/core'\n\nconst props = defineProps<{\n  /** The fonts the Type tab offers. Default: InkRoot's `signatureFonts`. */\n  fonts?: readonly string[] | undefined\n}>()\nconst open = defineModel<boolean>('open', { default: false })\nconst emit = defineEmits<{\n  /** The new template, once saved and selected. */\n  save: [template: SignatureTemplate]\n  /** Reka's close auto-focus; prevent it to place focus yourself. */\n  closeAutoFocus: [event: Event]\n}>()\n\n// Reka's typed props stop at its own; ARIA goes through a bound object. No description: the\n// title says it all.\nconst contentAttrs = { 'aria-modal': 'true', 'aria-describedby': undefined }\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  ;(e.target as HTMLElement | null)\n    ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n    ?.focus({ preventScroll: true })\n}\n</script>\n\n<template>\n  <DialogRoot v-model:open=\"open\">\n    <DialogPortal>\n      <DialogOverlay class=\"ink-dialog-overlay\" data-ink-dialog-overlay />\n      <DialogContent\n        class=\"ink-dialog ink-signature-dialog\"\n        data-ink-signature-dialog\n        v-bind=\"contentAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"emit('closeAutoFocus', $event)\"\n      >\n        <DialogTitle class=\"ink-dialog-title\">{{ SIGNATURE_LABELS.dialog }}</DialogTitle>\n        <SignatureForm\n          :fonts=\"props.fonts\"\n          @saved=\"emit('save', $event)\"\n          @close=\"open = false\"\n        />\n      </DialogContent>\n    </DialogPortal>\n  </DialogRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"InkSignatureDialog.js","names":["_sfc_main","InkSignatureDialog_vue_vue_type_script_setup_true_lang_default","InkSignatureDialog_default"],"sources":["../../src/components/InkSignatureDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * \"Create signature\": a modal with Draw, Type and Image tabs. Draw is a pad with the draw\n * tool's renderer; Type sets a name in one of the host's handwriting fonts; Image takes a PNG\n * or JPEG scan. Save stores the template through InkRoot's signature store and, unless `select`\n * is false, selects it for the `signature` tool. Escape, Cancel or a press outside closes it.\n */\nimport { SIGNATURE_LABELS } from '@inkbar/core/dom'\nimport {\n  DialogContent,\n  DialogOverlay,\n  DialogPortal,\n  DialogRoot,\n  DialogTitle,\n} from 'reka-ui'\n\nimport SignatureForm from './SignatureForm.vue'\n\nimport type { SignatureTemplate } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    /** The fonts the Type tab offers. Default: InkRoot's `signatureFonts`. */\n    fonts?: readonly string[] | undefined\n    /**\n     * Whether saving selects the new signature for the `signature` tool. False leaves the tool\n     * alone, for a dialog that signs a field with it through `save`.\n     */\n    select?: boolean\n  }>(),\n  { fonts: undefined, select: true }\n)\nconst open = defineModel<boolean>('open', { default: false })\nconst emit = defineEmits<{\n  /** The new template, once saved (and selected, with `select`). */\n  save: [template: SignatureTemplate]\n  /** Reka's close auto-focus; prevent it to place focus yourself. */\n  closeAutoFocus: [event: Event]\n}>()\n\n// Reka's typed props stop at its own; ARIA goes through a bound object. No description: the\n// title says it all.\nconst contentAttrs = { 'aria-modal': 'true', 'aria-describedby': undefined }\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  ;(e.target as HTMLElement | null)\n    ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n    ?.focus({ preventScroll: true })\n}\n</script>\n\n<template>\n  <DialogRoot v-model:open=\"open\">\n    <DialogPortal>\n      <DialogOverlay class=\"ink-dialog-overlay\" data-ink-dialog-overlay />\n      <DialogContent\n        class=\"ink-dialog ink-signature-dialog\"\n        data-ink-signature-dialog\n        v-bind=\"contentAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"emit('closeAutoFocus', $event)\"\n      >\n        <DialogTitle class=\"ink-dialog-title\">{{ SIGNATURE_LABELS.dialog }}</DialogTitle>\n        <SignatureForm\n          :fonts=\"props.fonts\"\n          :select=\"props.select\"\n          @saved=\"emit('save', $event)\"\n          @close=\"open = false\"\n        />\n      </DialogContent>\n    </DialogPortal>\n  </DialogRoot>\n</template>\n"],"mappings":""}

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

@@ -2,6 +2,11 @@ import { SignatureTemplate } from '@inkbar/core';
 type __VLS_Props = {
     /** The fonts the Type tab offers. Default: InkRoot's `signatureFonts`. */
     fonts?: readonly string[] | undefined;
+    /**
+     * Whether saving selects the new signature for the `signature` tool. False leaves the tool
+     * alone, for a dialog that signs a field with it through `save`.
+     */
+    select?: boolean;
 };
 type __VLS_ModelProps = {
     'open'?: boolean;
@@ -15,7 +20,10 @@ declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {},
     "onUpdate:open"?: (value: boolean) => any;
     onCloseAutoFocus?: (event: Event) => any;
     onSave?: (template: SignatureTemplate) => any;
-}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+}>, {
+    select: boolean;
+    fonts: readonly string[] | undefined;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: typeof __VLS_export;
 export default _default;
 //# sourceMappingURL=InkSignatureDialog.vue.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"InkSignatureDialog.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkSignatureDialog.vue"],"names":[],"mappings":"AAoFA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,KAAK,WAAW,GAAG;IACjB,0EAA0E;IAC1E,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;CACtC,CAAC;AAyBF,KAAK,gBAAgB,GAAG;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAKF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAmKxD,QAAA,MAAM,YAAY;;;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"InkSignatureDialog.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkSignatureDialog.vue"],"names":[],"mappings":"AA6FA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,KAAK,WAAW,GAAG;IACf,0EAA0E;IAC1E,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;IACrC;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAC;AA4BJ,KAAK,gBAAgB,GAAG;IACxB,MAAM,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAOF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAoKxD,QAAA,MAAM,YAAY;;;;;;;;;;;6EAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/InkSignatureDialog.vue_vue_type_script_setup_true_lang.js

@@ -5,7 +5,13 @@ import { DialogContent as p, DialogOverlay as m, DialogPortal as h, DialogRoot a
 //#region src/components/InkSignatureDialog.vue?vue&type=script&setup=true&lang.ts
 var v = /*@__PURE__*/ i({
 	__name: "InkSignatureDialog",
-	props: /*@__PURE__*/ a({ fonts: {} }, {
+	props: /*@__PURE__*/ a({
+		fonts: { default: void 0 },
+		select: {
+			type: Boolean,
+			default: !0
+		}
+	}, {
 		open: {
 			type: Boolean,
 			default: !1
@@ -41,9 +47,10 @@ var v = /*@__PURE__*/ i({
 						_: 1
 					}), r(e, {
 						fonts: v.fonts,
+						select: v.select,
 						onSaved: a[0] ||= (e) => b("save", e),
 						onClose: a[1] ||= (e) => y.value = !1
-					}, null, 8, ["fonts"])]),
+					}, null, 8, ["fonts", "select"])]),
 					_: 1
 				}, 16)]),
 				_: 1

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

@@ -1 +1 @@
-{"version":3,"file":"InkSignatureDialog.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","_createTextVNode","_toDisplayString","SignatureForm","SignatureForm_default","InkSignatureDialog_vue_vue_type_script_setup_true_lang_default","\"open\"","\"openModifiers\"","__emit","props","__props","open","useModel","emit","contentAttrs","onOpenAutoFocus","openBlock","createBlock","unref","DialogRoot","_cache","$event","withCtx","createVNode","DialogPortal","DialogOverlay","DialogContent","mergeProps","DialogTitle","createTextVNode","toDisplayString","SIGNATURE_LABELS"],"sources":["../../src/components/InkSignatureDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * \"Create signature\": a modal with Draw, Type and Image tabs. Draw is a pad with the draw\n * tool's renderer; Type sets a name in one of the host's handwriting fonts; Image takes a PNG\n * or JPEG scan. Save stores the template through InkRoot's signature store and selects it for\n * the `signature` tool. Escape, Cancel or a press outside closes it.\n */\nimport { SIGNATURE_LABELS } from '@inkbar/core/dom'\nimport {\n  DialogContent,\n  DialogOverlay,\n  DialogPortal,\n  DialogRoot,\n  DialogTitle,\n} from 'reka-ui'\n\nimport SignatureForm from './SignatureForm.vue'\n\nimport type { SignatureTemplate } from '@inkbar/core'\n\nconst props = defineProps<{\n  /** The fonts the Type tab offers. Default: InkRoot's `signatureFonts`. */\n  fonts?: readonly string[] | undefined\n}>()\nconst open = defineModel<boolean>('open', { default: false })\nconst emit = defineEmits<{\n  /** The new template, once saved and selected. */\n  save: [template: SignatureTemplate]\n  /** Reka's close auto-focus; prevent it to place focus yourself. */\n  closeAutoFocus: [event: Event]\n}>()\n\n// Reka's typed props stop at its own; ARIA goes through a bound object. No description: the\n// title says it all.\nconst contentAttrs = { 'aria-modal': 'true', 'aria-describedby': undefined }\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  ;(e.target as HTMLElement | null)\n    ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n    ?.focus({ preventScroll: true })\n}\n</script>\n\n<template>\n  <DialogRoot v-model:open=\"open\">\n    <DialogPortal>\n      <DialogOverlay class=\"ink-dialog-overlay\" data-ink-dialog-overlay />\n      <DialogContent\n        class=\"ink-dialog ink-signature-dialog\"\n        data-ink-signature-dialog\n        v-bind=\"contentAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"emit('closeAutoFocus', $event)\"\n      >\n        <DialogTitle class=\"ink-dialog-title\">{{ SIGNATURE_LABELS.dialog }}</DialogTitle>\n        <SignatureForm\n          :fonts=\"props.fonts\"\n          @saved=\"emit('save', $event)\"\n          @close=\"open = false\"\n        />\n      </DialogContent>\n    </DialogPortal>\n  </DialogRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAoBA,IAAMe,IAAQC,GAIRC,IAAOjB,EAAoBgB,GAAC,MAA0B,GACtDG,IAAOL,GASPM,IAAe;GAAE,cAAc;GAAQ,oBAAoB,KAAA;EAAU;EAE3E,SAASC,EAAgB,GAAgB;GAEtC,AADD,EAAE,eAAe,GAChB,EAAG,QACA,cAA2B,wCAAoC,CAAA,EAC/D,MAAM,EAAE,eAAe,GAAK,CAAC;EACnC;oBAIEpB,EAAA,GAAAC,EAkBaC,EAAAsB,CAAA,GAAA;GAlBO,MAAMR,EAAA;GAAA,iBAAA,AAAAS,EAAA,QAAA,MAAA,EAAI,QAAAC;;GAC5B,SAAAvB,QAgBe,CAhBfC,EAgBeF,EAAA2B,CAAA,GAAA,MAAA;IAfb,SAAA1B,QAAoE,CAApEC,EAAoEF,EAAA4B,CAAA,GAAA;KAArD,OAAM;KAAqB,2BAAA;IAC1C1B,CAAAA,GAAAA,EAagBF,EAAA6B,CAAA,GAbhB1B,EAagB;KAZd,OAAM;KACN,6BAAA;IACQ,GAAAc,GAAY;KACF;KACjB,kBAAgB,AAAAM,EAAA,QAAA,MAAEP,EAAI,kBAAmBQ,CAAM;;KAEhD,SAAAvB,QAAiF,CAAjFC,EAAiFF,EAAA+B,CAAA,GAAA,EAApE,OAAM,mBAAkB,GAAA;MAAC,SAAA9B,QAA6B,CAA1BG,EAAAC,EAAAL,EAAAkC,CAAA,CAAgB,CAAC,MAAM,GAAA,CAAA,CAAA,CAAA;;KAChEhC,CAAAA,GAAAA,EAIEI,GAAA;MAHC,OAAOM,EAAM;MACb,SAAK,AAAAW,EAAA,QAAA,MAAEP,EAAI,QAASQ,CAAM;MAC1B,SAAK,AAAAD,EAAA,QAAA,MAAE,EAAA,QAAI"}
+{"version":3,"file":"InkSignatureDialog.vue_vue_type_script_setup_true_lang.js","names":["_useModel","_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","_createTextVNode","_toDisplayString","SignatureForm","SignatureForm_default","InkSignatureDialog_vue_vue_type_script_setup_true_lang_default","\"open\"","\"openModifiers\"","__emit","props","__props","open","useModel","emit","contentAttrs","onOpenAutoFocus","openBlock","createBlock","unref","DialogRoot","_cache","$event","withCtx","createVNode","DialogPortal","DialogOverlay","DialogContent","mergeProps","DialogTitle","createTextVNode","toDisplayString","SIGNATURE_LABELS"],"sources":["../../src/components/InkSignatureDialog.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * \"Create signature\": a modal with Draw, Type and Image tabs. Draw is a pad with the draw\n * tool's renderer; Type sets a name in one of the host's handwriting fonts; Image takes a PNG\n * or JPEG scan. Save stores the template through InkRoot's signature store and, unless `select`\n * is false, selects it for the `signature` tool. Escape, Cancel or a press outside closes it.\n */\nimport { SIGNATURE_LABELS } from '@inkbar/core/dom'\nimport {\n  DialogContent,\n  DialogOverlay,\n  DialogPortal,\n  DialogRoot,\n  DialogTitle,\n} from 'reka-ui'\n\nimport SignatureForm from './SignatureForm.vue'\n\nimport type { SignatureTemplate } from '@inkbar/core'\n\nconst props = withDefaults(\n  defineProps<{\n    /** The fonts the Type tab offers. Default: InkRoot's `signatureFonts`. */\n    fonts?: readonly string[] | undefined\n    /**\n     * Whether saving selects the new signature for the `signature` tool. False leaves the tool\n     * alone, for a dialog that signs a field with it through `save`.\n     */\n    select?: boolean\n  }>(),\n  { fonts: undefined, select: true }\n)\nconst open = defineModel<boolean>('open', { default: false })\nconst emit = defineEmits<{\n  /** The new template, once saved (and selected, with `select`). */\n  save: [template: SignatureTemplate]\n  /** Reka's close auto-focus; prevent it to place focus yourself. */\n  closeAutoFocus: [event: Event]\n}>()\n\n// Reka's typed props stop at its own; ARIA goes through a bound object. No description: the\n// title says it all.\nconst contentAttrs = { 'aria-modal': 'true', 'aria-describedby': undefined }\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  ;(e.target as HTMLElement | null)\n    ?.querySelector<HTMLElement>('[role=\"tab\"][aria-selected=\"true\"]')\n    ?.focus({ preventScroll: true })\n}\n</script>\n\n<template>\n  <DialogRoot v-model:open=\"open\">\n    <DialogPortal>\n      <DialogOverlay class=\"ink-dialog-overlay\" data-ink-dialog-overlay />\n      <DialogContent\n        class=\"ink-dialog ink-signature-dialog\"\n        data-ink-signature-dialog\n        v-bind=\"contentAttrs\"\n        @open-auto-focus=\"onOpenAutoFocus\"\n        @close-auto-focus=\"emit('closeAutoFocus', $event)\"\n      >\n        <DialogTitle class=\"ink-dialog-title\">{{ SIGNATURE_LABELS.dialog }}</DialogTitle>\n        <SignatureForm\n          :fonts=\"props.fonts\"\n          :select=\"props.select\"\n          @saved=\"emit('save', $event)\"\n          @close=\"open = false\"\n        />\n      </DialogContent>\n    </DialogPortal>\n  </DialogRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EAoBA,IAAMe,IAAQC,GAYRC,IAAOjB,EAAoBgB,GAAC,MAA0B,GACtDG,IAAOL,GASPM,IAAe;GAAE,cAAc;GAAQ,oBAAoB,KAAA;EAAU;EAE3E,SAASC,EAAgB,GAAgB;GAEtC,AADD,EAAE,eAAe,GAChB,EAAG,QACA,cAA2B,wCAAoC,CAAA,EAC/D,MAAM,EAAE,eAAe,GAAK,CAAC;EACnC;oBAIEpB,EAAA,GAAAC,EAmBaC,EAAAsB,CAAA,GAAA;GAnBO,MAAMR,EAAA;GAAA,iBAAA,AAAAS,EAAA,QAAA,MAAA,EAAI,QAAAC;;GAC5B,SAAAvB,QAiBe,CAjBfC,EAiBeF,EAAA2B,CAAA,GAAA,MAAA;IAhBb,SAAA1B,QAAoE,CAApEC,EAAoEF,EAAA4B,CAAA,GAAA;KAArD,OAAM;KAAqB,2BAAA;IAC1C1B,CAAAA,GAAAA,EAcgBF,EAAA6B,CAAA,GAdhB1B,EAcgB;KAbd,OAAM;KACN,6BAAA;IACQ,GAAAc,GAAY;KACF;KACjB,kBAAgB,AAAAM,EAAA,QAAA,MAAEP,EAAI,kBAAmBQ,CAAM;;KAEhD,SAAAvB,QAAiF,CAAjFC,EAAiFF,EAAA+B,CAAA,GAAA,EAApE,OAAM,mBAAkB,GAAA;MAAC,SAAA9B,QAA6B,CAA1BG,EAAAC,EAAAL,EAAAkC,CAAA,CAAgB,CAAC,MAAM,GAAA,CAAA,CAAA,CAAA;;KAChEhC,CAAAA,GAAAA,EAKEI,GAAA;MAJC,OAAOM,EAAM;MACb,QAAQA,EAAM;MACd,SAAK,AAAAW,EAAA,QAAA,MAAEP,EAAI,QAASQ,CAAM;MAC1B,SAAK,AAAAD,EAAA,QAAA,MAAE,EAAA,QAAI"}

package/dist/components/InkSignatureMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"InkSignatureMenu.js","names":["_sfc_main","InkSignatureMenu_vue_vue_type_script_setup_true_lang_default","InkSignatureMenu_default"],"sources":["../../src/components/InkSignatureMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A split button for the signature tool. The main part activates the tool with the chosen\n * signature, or opens the menu when none is chosen; the chevron opens the saved signatures as\n * previews, each with a remove button, and \"Create signature\", which opens\n * `InkSignatureDialog`. Choosing a signature switches to the tool with it.\n */\nimport {\n  focusInitialMenuItem,\n  handleMenuKeys,\n  menuItems,\n  SIGNATURE_LABELS,\n  signatureMenuModel,\n  signaturePreview,\n} from '@inkbar/core/dom'\nimport { ChevronDown, Plus, Signature, Trash2 } from '@inkbar/icons'\nimport {\n  PopoverAnchor,\n  PopoverContent,\n  PopoverPortal,\n  PopoverRoot,\n  PopoverTrigger,\n  ToolbarButton,\n} from 'reka-ui'\nimport { computed, nextTick, ref, useTemplateRef, watch } from 'vue'\n\nimport { useTool } from '../composables/useTool'\nimport { useToolOptions } from '../composables/useToolOptions'\nimport { useInkContext } from '../context'\nimport { useReadable } from '../use-readable'\n\nimport InkIcon from './InkIcon.vue'\nimport InkSignatureDialog from './InkSignatureDialog.vue'\n\nimport type { SignatureOptions, SignatureTemplate } from '@inkbar/core'\n\ndefineOptions({ inheritAttrs: false })\nconst props = defineProps<{\n  /** The fonts the dialog's Type tab offers. Default: InkRoot's `signatureFonts`. */\n  fonts?: readonly string[] | undefined\n}>()\n\nconst NO_TEMPLATES: readonly SignatureTemplate[] = []\n\nconst { tool, setTool } = useTool()\nconst { options, setOptions } = useToolOptions<SignatureOptions>('signature')\nconst ctx = useInkContext('InkSignatureMenu')\nconst templates = useReadable(() => ctx.signatures.value.templates, NO_TEMPLATES)\nconst removeError = useReadable(() => ctx.signatures.value.removeError, undefined)\nconst model = computed(() => signatureMenuModel(templates.value, options.value))\nconst active = computed(() => tool.value === 'signature')\nconst open = ref(false)\nconst creating = ref(false)\n// An old removal error is not news when the menu opens again.\nwatch(open, (isOpen) => {\n  if (isOpen) ctx.signatures.value.clearRemoveError()\n})\nconst main = useTemplateRef<{ $el: HTMLElement }>('main')\n\n/** A saved signature drawn small: ink as filled outlines. */\nconst previews = computed(() =>\n  model.value.items.map((item) =>\n    item.template.kind === 'ink' ? signaturePreview(item.template) : null\n  )\n)\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\n/** Set while the menu closes for the dialog, which takes focus instead of the trigger. */\nlet toDialog = false\n\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\nconst panel = (): HTMLElement | null =>\n  document.querySelector<HTMLElement>('[data-ink-menu=\"signature\"] [role=\"menu\"]')\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  const menu = panel()\n  if (menu) {\n    if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n    else focusInitialMenuItem(menu)\n  }\n  focusFirst = false\n}\n\nfunction onCloseAutoFocus(e: Event): void {\n  if (toDialog) e.preventDefault()\n  toDialog = false\n}\n\nfunction onMain(): void {\n  if (model.value.selected) setTool('signature')\n  else open.value = true\n}\n\nfunction choose(id: string): void {\n  setOptions({ templateId: id })\n  setTool('signature')\n  open.value = false\n}\n\n/** Removes a template; focus moves to the signature now in its row, else \"Create signature\". */\nfunction remove(id: string, row: number): void {\n  ctx.signatures.value.remove(id).then(\n    async () => {\n      await nextTick()\n      const menu = panel()\n      if (!menu) return\n      const rows = menu.querySelectorAll<HTMLElement>('.ink-signature-item')\n      const next =\n        rows[Math.min(row, rows.length - 1)] ??\n        menu.querySelector<HTMLElement>('[data-ink-signature-create]')\n      next?.focus({ preventScroll: true })\n    },\n    () => {\n      // The host's store refused: the signature stays.\n    }\n  )\n}\n\nfunction create(): void {\n  toDialog = true\n  open.value = false\n  creating.value = true\n}\n\nfunction onDialogCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  main.value?.$el.focus({ preventScroll: true })\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': SIGNATURE_LABELS.sign,\n  title: SIGNATURE_LABELS.sign,\n  onClick: onMain,\n}))\nconst triggerAttrs = {\n  'aria-label': SIGNATURE_LABELS.trigger,\n  title: SIGNATURE_LABELS.trigger,\n  'aria-haspopup': 'menu' as const,\n  onKeydown: onTriggerKeydown,\n}\nconst menuAttrs = { 'aria-label': SIGNATURE_LABELS.menu }\nconst innerAttrs = {\n  role: 'menu',\n  'aria-label': SIGNATURE_LABELS.menu,\n  onKeydown: (e: KeyboardEvent) => 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=\"SIGNATURE_LABELS.sign\"\n        class=\"ink-split-button ink-signature-menu\"\n        data-ink-signature-menu\n        v-bind=\"$attrs\"\n      >\n        <ToolbarButton\n          ref=\"main\"\n          class=\"ink-tool-button ink-signature-button\"\n          data-ink-tool-button\n          data-ink-signature-button\n          data-tool=\"signature\"\n          :data-state=\"active ? 'on' : 'off'\"\n          v-bind=\"mainAttrs\"\n        >\n          <slot :active=\"active\"><InkIcon :icon=\"Signature\" /></slot>\n        </ToolbarButton>\n        <ToolbarButton as-child>\n          <PopoverTrigger as-child>\n            <button\n              type=\"button\"\n              class=\"ink-menu-trigger ink-signature-menu-trigger\"\n              data-ink-signature-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=\"signature\"\n            side=\"bottom\"\n            align=\"start\"\n            :side-offset=\"4\"\n            :collision-padding=\"8\"\n            v-bind=\"menuAttrs\"\n            @open-auto-focus=\"onOpenAutoFocus\"\n            @close-auto-focus=\"onCloseAutoFocus\"\n          >\n            <div v-bind=\"innerAttrs\">\n              <template v-if=\"model.items.length > 0\">\n                <div\n                  role=\"group\"\n                  :aria-label=\"SIGNATURE_LABELS.saved\"\n                  class=\"ink-signature-list\"\n                  data-ink-menu-columns=\"2\"\n                >\n                  <template v-for=\"(item, row) in model.items\" :key=\"item.id\">\n                    <button\n                      type=\"button\"\n                      role=\"menuitemradio\"\n                      :aria-checked=\"item.checked\"\n                      :aria-label=\"item.label\"\n                      tabindex=\"-1\"\n                      class=\"ink-select-item ink-menu-item ink-signature-item\"\n                      data-ink-select-item\n                      :data-key=\"item.id\"\n                      :data-state=\"item.checked ? 'checked' : 'unchecked'\"\n                      @click=\"choose(item.id)\"\n                    >\n                      <span class=\"ink-signature-preview\" :data-kind=\"item.template.kind\">\n                        <img\n                          v-if=\"item.template.kind === 'image'\"\n                          :src=\"item.template.imagedata\"\n                          alt=\"\"\n                          draggable=\"false\"\n                        />\n                        <svg v-else :viewBox=\"previews[row]?.viewBox\" aria-hidden=\"true\">\n                          <path\n                            v-for=\"(d, i) in previews[row]?.paths ?? []\"\n                            :key=\"i\"\n                            :d=\"d\"\n                            fill=\"currentColor\"\n                          />\n                        </svg>\n                      </span>\n                    </button>\n                    <button\n                      type=\"button\"\n                      role=\"menuitem\"\n                      :aria-label=\"item.removeLabel\"\n                      :title=\"item.removeLabel\"\n                      tabindex=\"-1\"\n                      class=\"ink-menu-item ink-signature-remove\"\n                      data-ink-signature-remove\n                      :data-key=\"item.id\"\n                      @click=\"remove(item.id, row)\"\n                    >\n                      <InkIcon :icon=\"Trash2\" :size=\"16\" />\n                    </button>\n                  </template>\n                </div>\n                <div role=\"separator\" class=\"ink-select-separator\" />\n              </template>\n              <button\n                type=\"button\"\n                role=\"menuitem\"\n                tabindex=\"-1\"\n                class=\"ink-select-item ink-menu-item ink-signature-create\"\n                data-ink-select-item\n                data-ink-signature-create\n                @click=\"create\"\n              >\n                <InkIcon :icon=\"Plus\" :size=\"16\" />\n                {{ SIGNATURE_LABELS.create }}\n              </button>\n              <p\n                v-if=\"removeError\"\n                class=\"ink-field-error ink-signature-remove-error\"\n                role=\"alert\"\n                data-ink-signature-remove-error\n              >\n                {{ removeError }}\n              </p>\n            </div>\n          </PopoverContent>\n        </PopoverPortal>\n        <InkSignatureDialog\n          v-model:open=\"creating\"\n          :fonts=\"props.fonts\"\n          @close-auto-focus=\"onDialogCloseAutoFocus\"\n        />\n      </div>\n    </PopoverAnchor>\n  </PopoverRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"InkSignatureMenu.js","names":["_sfc_main","InkSignatureMenu_vue_vue_type_script_setup_true_lang_default","InkSignatureMenu_default"],"sources":["../../src/components/InkSignatureMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A split button for the signature tool. The main part activates the tool with the chosen\n * signature, or opens the menu when none is chosen; the chevron opens the saved signatures as\n * previews, each with a remove button, and \"Create signature\", which opens\n * `InkSignatureDialog`. Choosing a signature switches to the tool with it.\n */\nimport {\n  focusInitialMenuItem,\n  menuItems,\n  SIGNATURE_LABELS,\n  signatureMenuModel,\n} from '@inkbar/core/dom'\nimport { ChevronDown, Signature } from '@inkbar/icons'\nimport {\n  PopoverAnchor,\n  PopoverContent,\n  PopoverPortal,\n  PopoverRoot,\n  PopoverTrigger,\n  ToolbarButton,\n} from 'reka-ui'\nimport { computed, ref, useTemplateRef, watch } from 'vue'\n\nimport { useTool } from '../composables/useTool'\nimport { useToolOptions } from '../composables/useToolOptions'\nimport { useInkContext } from '../context'\nimport { useReadable } from '../use-readable'\n\nimport InkIcon from './InkIcon.vue'\nimport InkSignatureDialog from './InkSignatureDialog.vue'\nimport SignatureMenuPanel from './SignatureMenuPanel.vue'\n\nimport type { SignatureOptions, SignatureTemplate } from '@inkbar/core'\n\ndefineOptions({ inheritAttrs: false })\nconst props = defineProps<{\n  /** The fonts the dialog's Type tab offers. Default: InkRoot's `signatureFonts`. */\n  fonts?: readonly string[] | undefined\n}>()\n\nconst NO_TEMPLATES: readonly SignatureTemplate[] = []\n\nconst { tool, setTool } = useTool()\nconst { options, setOptions } = useToolOptions<SignatureOptions>('signature')\nconst ctx = useInkContext('InkSignatureMenu')\nconst templates = useReadable(() => ctx.signatures.value.templates, NO_TEMPLATES)\nconst model = computed(() => signatureMenuModel(templates.value, options.value))\nconst active = computed(() => tool.value === 'signature')\nconst open = ref(false)\nconst creating = ref(false)\n// An old removal error is not news when the menu opens again.\nwatch(open, (isOpen) => {\n  if (isOpen) ctx.signatures.value.clearRemoveError()\n})\nconst main = useTemplateRef<{ $el: HTMLElement }>('main')\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\n/** Set while the menu closes for the dialog, which takes focus instead of the trigger. */\nlet toDialog = false\n\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\n// Not a signature field's menu, which shares the attribute.\nconst panel = (): HTMLElement | null =>\n  document.querySelector<HTMLElement>(\n    '[data-ink-menu=\"signature\"]:not([data-ink-sign-field-menu]) [role=\"menu\"]'\n  )\n\nfunction onOpenAutoFocus(e: Event): void {\n  e.preventDefault()\n  const menu = panel()\n  if (menu) {\n    if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n    else focusInitialMenuItem(menu)\n  }\n  focusFirst = false\n}\n\nfunction onCloseAutoFocus(e: Event): void {\n  if (toDialog) e.preventDefault()\n  toDialog = false\n}\n\nfunction onMain(): void {\n  if (model.value.selected) setTool('signature')\n  else open.value = true\n}\n\nfunction choose(id: string): void {\n  setOptions({ templateId: id })\n  setTool('signature')\n  open.value = false\n}\n\nfunction create(): void {\n  toDialog = true\n  open.value = false\n  creating.value = true\n}\n\nfunction onDialogCloseAutoFocus(e: Event): void {\n  e.preventDefault()\n  main.value?.$el.focus({ preventScroll: true })\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': SIGNATURE_LABELS.sign,\n  title: SIGNATURE_LABELS.sign,\n  onClick: onMain,\n}))\nconst triggerAttrs = {\n  'aria-label': SIGNATURE_LABELS.trigger,\n  title: SIGNATURE_LABELS.trigger,\n  'aria-haspopup': 'menu' as const,\n  onKeydown: onTriggerKeydown,\n}\nconst menuAttrs = { 'aria-label': SIGNATURE_LABELS.menu }\n</script>\n\n<template>\n  <PopoverRoot v-model:open=\"open\">\n    <PopoverAnchor as-child>\n      <div\n        role=\"group\"\n        :aria-label=\"SIGNATURE_LABELS.sign\"\n        class=\"ink-split-button ink-signature-menu\"\n        data-ink-signature-menu\n        v-bind=\"$attrs\"\n      >\n        <ToolbarButton\n          ref=\"main\"\n          class=\"ink-tool-button ink-signature-button\"\n          data-ink-tool-button\n          data-ink-signature-button\n          data-tool=\"signature\"\n          :data-state=\"active ? 'on' : 'off'\"\n          v-bind=\"mainAttrs\"\n        >\n          <slot :active=\"active\"><InkIcon :icon=\"Signature\" /></slot>\n        </ToolbarButton>\n        <ToolbarButton as-child>\n          <PopoverTrigger as-child>\n            <button\n              type=\"button\"\n              class=\"ink-menu-trigger ink-signature-menu-trigger\"\n              data-ink-signature-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=\"signature\"\n            side=\"bottom\"\n            align=\"start\"\n            :side-offset=\"4\"\n            :collision-padding=\"8\"\n            v-bind=\"menuAttrs\"\n            @open-auto-focus=\"onOpenAutoFocus\"\n            @close-auto-focus=\"onCloseAutoFocus\"\n          >\n            <SignatureMenuPanel\n              :items=\"model.items\"\n              @choose=\"choose($event.id)\"\n              @create=\"create\"\n            />\n          </PopoverContent>\n        </PopoverPortal>\n        <InkSignatureDialog\n          v-model:open=\"creating\"\n          :fonts=\"props.fonts\"\n          @close-auto-focus=\"onDialogCloseAutoFocus\"\n        />\n      </div>\n    </PopoverAnchor>\n  </PopoverRoot>\n</template>\n"],"mappings":""}

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

@@ -1 +1 @@
-{"version":3,"file":"InkSignatureMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkSignatureMenu.vue"],"names":[],"mappings":"AA2UA,KAAK,WAAW,GAAG;IACjB,mFAAmF;IACnF,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;CACtC,CAAC;AA2dF,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,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"}
+{"version":3,"file":"InkSignatureMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkSignatureMenu.vue"],"names":[],"mappings":"AAqOA,KAAK,WAAW,GAAG;IACjB,mFAAmF;IACnF,KAAK,CAAC,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,CAAA;CACtC,CAAC;AAsVF,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,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/InkSignatureMenu.vue_vue_type_script_setup_true_lang.js

@@ -2,124 +2,96 @@ import { useInkContext as e } from "../context.js";
 import { useReadable as t } from "../use-readable.js";
 import { useTool as n } from "../composables/useTool.js";
 import { useToolOptions as r } from "../composables/useToolOptions.js";
-import i from "./InkIcon.js";
-import ee from "./InkSignatureDialog.js";
-import { Fragment as a, computed as o, createBlock as te, createCommentVNode as s, createElementBlock as c, createElementVNode as l, createTextVNode as u, createVNode as d, defineComponent as f, guardReactiveProps as ne, mergeProps as p, nextTick as re, normalizeProps as ie, openBlock as m, ref as h, renderList as g, renderSlot as ae, toDisplayString as _, unref as v, useTemplateRef as oe, watch as se, withCtx as y } from "vue";
-import { SIGNATURE_LABELS as b, focusInitialMenuItem as ce, handleMenuKeys as le, menuItems as ue, signatureMenuModel as de, signaturePreview as fe } from "@inkbar/core/dom";
-import { PopoverAnchor as pe, PopoverContent as x, PopoverPortal as S, PopoverRoot as C, PopoverTrigger as w, ToolbarButton as T } from "reka-ui";
-import { ChevronDown as E, Plus as D, Signature as O, Trash2 as k } from "@inkbar/icons";
+import i from "./InkSignatureDialog.js";
+import a from "./InkIcon.js";
+import o from "./SignatureMenuPanel.js";
+import { computed as s, createBlock as c, createElementVNode as l, createVNode as u, defineComponent as d, mergeProps as f, openBlock as p, ref as m, renderSlot as ee, unref as h, useTemplateRef as g, watch as _, withCtx as v } from "vue";
+import { SIGNATURE_LABELS as y, focusInitialMenuItem as b, menuItems as x, signatureMenuModel as S } from "@inkbar/core/dom";
+import { PopoverAnchor as C, PopoverContent as w, PopoverPortal as T, PopoverRoot as E, PopoverTrigger as D, ToolbarButton as O } from "reka-ui";
+import { ChevronDown as k, Signature as A } from "@inkbar/icons";
 //#region src/components/InkSignatureMenu.vue?vue&type=script&setup=true&lang.ts
-var A = ["aria-label"], j = ["data-state"], M = ["aria-label"], N = [
-	"aria-checked",
-	"aria-label",
-	"data-key",
-	"data-state",
-	"onClick"
-], P = ["data-kind"], F = ["src"], I = ["viewBox"], L = ["d"], R = [
-	"aria-label",
-	"title",
-	"data-key",
-	"onClick"
-], z = {
-	key: 1,
-	class: "ink-field-error ink-signature-remove-error",
-	role: "alert",
-	"data-ink-signature-remove-error": ""
-}, B = /*@__PURE__*/ f({
+var j = ["aria-label"], M = ["data-state"], N = /*@__PURE__*/ d({
 	inheritAttrs: !1,
 	__name: "InkSignatureMenu",
 	props: { fonts: {} },
-	setup(f) {
-		let B = f, me = [], { tool: he, setTool: V } = n(), { options: ge, setOptions: _e } = r("signature"), H = e("InkSignatureMenu"), ve = t(() => H.signatures.value.templates, me), U = t(() => H.signatures.value.removeError, void 0), W = o(() => de(ve.value, ge.value)), G = o(() => he.value === "signature"), K = h(!1), q = h(!1);
-		se(K, (e) => {
-			e && H.signatures.value.clearRemoveError();
+	setup(d) {
+		let N = d, P = [], { tool: F, setTool: I } = n(), { options: L, setOptions: R } = r("signature"), z = e("InkSignatureMenu"), B = t(() => z.signatures.value.templates, P), V = s(() => S(B.value, L.value)), H = s(() => F.value === "signature"), U = m(!1), W = m(!1);
+		_(U, (e) => {
+			e && z.signatures.value.clearRemoveError();
 		});
-		let J = oe("main"), Y = o(() => W.value.items.map((e) => e.template.kind === "ink" ? fe(e.template) : null)), X = !1, Z = !1;
-		function ye(e) {
-			e.key !== "ArrowDown" || e.defaultPrevented || K.value || (e.preventDefault(), X = !0, K.value = !0);
+		let G = g("main"), K = !1, q = !1;
+		function J(e) {
+			e.key !== "ArrowDown" || e.defaultPrevented || U.value || (e.preventDefault(), K = !0, U.value = !0);
 		}
-		let Q = () => document.querySelector("[data-ink-menu=\"signature\"] [role=\"menu\"]");
-		function be(e) {
+		let Y = () => document.querySelector("[data-ink-menu=\"signature\"]:not([data-ink-sign-field-menu]) [role=\"menu\"]");
+		function X(e) {
 			e.preventDefault();
-			let t = Q();
-			t && (X ? ue(t)[0]?.focus({ preventScroll: !0 }) : ce(t)), X = !1;
+			let t = Y();
+			t && (K ? x(t)[0]?.focus({ preventScroll: !0 }) : b(t)), K = !1;
 		}
-		function xe(e) {
-			Z && e.preventDefault(), Z = !1;
+		function Z(e) {
+			q && e.preventDefault(), q = !1;
 		}
-		function Se() {
-			W.value.selected ? V("signature") : K.value = !0;
+		function Q() {
+			V.value.selected ? I("signature") : U.value = !0;
 		}
-		function Ce(e) {
-			_e({ templateId: e }), V("signature"), K.value = !1;
+		function $(e) {
+			R({ templateId: e }), I("signature"), U.value = !1;
 		}
-		function $(e, t) {
-			H.signatures.value.remove(e).then(async () => {
-				await re();
-				let e = Q();
-				if (!e) return;
-				let n = e.querySelectorAll(".ink-signature-item");
-				(n[Math.min(t, n.length - 1)] ?? e.querySelector("[data-ink-signature-create]"))?.focus({ preventScroll: !0 });
-			}, () => {});
+		function te() {
+			q = !0, U.value = !1, W.value = !0;
 		}
-		function we() {
-			Z = !0, K.value = !1, q.value = !0;
+		function ne(e) {
+			e.preventDefault(), G.value?.$el.focus({ preventScroll: !0 });
 		}
-		function Te(e) {
-			e.preventDefault(), J.value?.$el.focus({ preventScroll: !0 });
-		}
-		let Ee = o(() => ({
-			"aria-pressed": String(G.value),
-			"aria-label": b.sign,
-			title: b.sign,
-			onClick: Se
-		})), De = {
-			"aria-label": b.trigger,
-			title: b.trigger,
+		let re = s(() => ({
+			"aria-pressed": String(H.value),
+			"aria-label": y.sign,
+			title: y.sign,
+			onClick: Q
+		})), ie = {
+			"aria-label": y.trigger,
+			title: y.trigger,
 			"aria-haspopup": "menu",
-			onKeydown: ye
-		}, Oe = { "aria-label": b.menu }, ke = {
-			role: "menu",
-			"aria-label": b.menu,
-			onKeydown: (e) => le(e, e.currentTarget)
-		};
-		return (e, t) => (m(), te(v(C), {
-			open: K.value,
-			"onUpdate:open": t[1] ||= (e) => K.value = e
+			onKeydown: J
+		}, ae = { "aria-label": y.menu };
+		return (e, t) => (p(), c(h(E), {
+			open: U.value,
+			"onUpdate:open": t[2] ||= (e) => U.value = e
 		}, {
-			default: y(() => [d(v(pe), { "as-child": "" }, {
-				default: y(() => [l("div", p({
+			default: v(() => [u(h(C), { "as-child": "" }, {
+				default: v(() => [l("div", f({
 					role: "group",
-					"aria-label": v(b).sign,
+					"aria-label": h(y).sign,
 					class: "ink-split-button ink-signature-menu",
 					"data-ink-signature-menu": ""
 				}, e.$attrs), [
-					d(v(T), p({
+					u(h(O), f({
 						ref_key: "main",
-						ref: J,
+						ref: G,
 						class: "ink-tool-button ink-signature-button",
 						"data-ink-tool-button": "",
 						"data-ink-signature-button": "",
 						"data-tool": "signature",
-						"data-state": G.value ? "on" : "off"
-					}, Ee.value), {
-						default: y(() => [ae(e.$slots, "default", { active: G.value }, () => [d(i, { icon: v(O) }, null, 8, ["icon"])])]),
+						"data-state": H.value ? "on" : "off"
+					}, re.value), {
+						default: v(() => [ee(e.$slots, "default", { active: H.value }, () => [u(a, { icon: h(A) }, null, 8, ["icon"])])]),
 						_: 3
 					}, 16, ["data-state"]),
-					d(v(T), { "as-child": "" }, {
-						default: y(() => [d(v(w), { "as-child": "" }, {
-							default: y(() => [l("button", p({
+					u(h(O), { "as-child": "" }, {
+						default: v(() => [u(h(D), { "as-child": "" }, {
+							default: v(() => [l("button", f({
 								type: "button",
 								class: "ink-menu-trigger ink-signature-menu-trigger",
 								"data-ink-signature-menu-trigger": "",
-								"data-state": K.value ? "open" : "closed"
-							}, De), [d(i, { icon: v(E) }, null, 8, ["icon"])], 16, j)]),
+								"data-state": U.value ? "open" : "closed"
+							}, ie), [u(a, { icon: h(k) }, null, 8, ["icon"])], 16, M)]),
 							_: 1
 						})]),
 						_: 1
 					}),
-					d(v(S), null, {
-						default: y(() => [d(v(x), p({
+					u(h(T), null, {
+						default: v(() => [u(h(w), f({
 							class: "ink-select-content ink-menu-content",
 							"data-ink-select-content": "",
 							"data-ink-menu": "signature",
@@ -127,85 +99,26 @@ var A = ["aria-label"], j = ["data-state"], M = ["aria-label"], N = [
 							align: "start",
 							"side-offset": 4,
 							"collision-padding": 8
-						}, Oe, {
-							onOpenAutoFocus: be,
-							onCloseAutoFocus: xe
+						}, ae, {
+							onOpenAutoFocus: X,
+							onCloseAutoFocus: Z
 						}), {
-							default: y(() => [l("div", ie(ne(ke)), [
-								W.value.items.length > 0 ? (m(), c(a, { key: 0 }, [l("div", {
-									role: "group",
-									"aria-label": v(b).saved,
-									class: "ink-signature-list",
-									"data-ink-menu-columns": "2"
-								}, [(m(!0), c(a, null, g(W.value.items, (e, t) => (m(), c(a, { key: e.id }, [l("button", {
-									type: "button",
-									role: "menuitemradio",
-									"aria-checked": e.checked,
-									"aria-label": e.label,
-									tabindex: "-1",
-									class: "ink-select-item ink-menu-item ink-signature-item",
-									"data-ink-select-item": "",
-									"data-key": e.id,
-									"data-state": e.checked ? "checked" : "unchecked",
-									onClick: (t) => Ce(e.id)
-								}, [l("span", {
-									class: "ink-signature-preview",
-									"data-kind": e.template.kind
-								}, [e.template.kind === "image" ? (m(), c("img", {
-									key: 0,
-									src: e.template.imagedata,
-									alt: "",
-									draggable: "false"
-								}, null, 8, F)) : (m(), c("svg", {
-									key: 1,
-									viewBox: Y.value[t]?.viewBox,
-									"aria-hidden": "true"
-								}, [(m(!0), c(a, null, g(Y.value[t]?.paths ?? [], (e, t) => (m(), c("path", {
-									key: t,
-									d: e,
-									fill: "currentColor"
-								}, null, 8, L))), 128))], 8, I))], 8, P)], 8, N), l("button", {
-									type: "button",
-									role: "menuitem",
-									"aria-label": e.removeLabel,
-									title: e.removeLabel,
-									tabindex: "-1",
-									class: "ink-menu-item ink-signature-remove",
-									"data-ink-signature-remove": "",
-									"data-key": e.id,
-									onClick: (n) => $(e.id, t)
-								}, [d(i, {
-									icon: v(k),
-									size: 16
-								}, null, 8, ["icon"])], 8, R)], 64))), 128))], 8, M), t[2] ||= l("div", {
-									role: "separator",
-									class: "ink-select-separator"
-								}, null, -1)], 64)) : s("", !0),
-								l("button", {
-									type: "button",
-									role: "menuitem",
-									tabindex: "-1",
-									class: "ink-select-item ink-menu-item ink-signature-create",
-									"data-ink-select-item": "",
-									"data-ink-signature-create": "",
-									onClick: we
-								}, [d(i, {
-									icon: v(D),
-									size: 16
-								}, null, 8, ["icon"]), u(" " + _(v(b).create), 1)]),
-								v(U) ? (m(), c("p", z, _(v(U)), 1)) : s("", !0)
-							], 16)]),
+							default: v(() => [u(o, {
+								items: V.value.items,
+								onChoose: t[0] ||= (e) => $(e.id),
+								onCreate: te
+							}, null, 8, ["items"])]),
 							_: 1
 						}, 16)]),
 						_: 1
 					}),
-					d(ee, {
-						open: q.value,
-						"onUpdate:open": t[0] ||= (e) => q.value = e,
-						fonts: B.fonts,
-						onCloseAutoFocus: Te
+					u(i, {
+						open: W.value,
+						"onUpdate:open": t[1] ||= (e) => W.value = e,
+						fonts: N.fonts,
+						onCloseAutoFocus: ne
 					}, null, 8, ["open", "fonts"])
-				], 16, A)]),
+				], 16, j)]),
 				_: 3
 			})]),
 			_: 3
@@ -213,6 +126,6 @@ var A = ["aria-label"], j = ["data-state"], M = ["aria-label"], N = [
 	}
 });
 //#endregion
-export { B as default };
+export { N as default };
 
 //# sourceMappingURL=InkSignatureMenu.vue_vue_type_script_setup_true_lang.js.map