@inkbar/vue 0.9.0 → 0.11.0

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

@@ -1 +1 @@
-{"version":3,"file":"InkZoomSelect.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","InkIcon","_createElementBlock","_Fragment","_renderList","_createTextVNode","_toDisplayString","InkIcon_default","CUSTOM","InkZoomSelect_vue_vue_type_script_setup_true_lang_default","useZoom","level","ZOOM_LEVELS","l","z","custom","computed","zoom","value","onChange","v","next","FITS","triggerAttrs","percent","levels","list","c","scale","a","b","openBlock","createBlock","unref","SelectRoot","withCtx","createVNode","SelectTrigger","mergeProps","SelectValue","SelectIcon","ChevronDown","SelectPortal","SelectContent","SelectViewport","createElementBlock","Fragment","renderList","SelectItem","o","SelectItemText","createTextVNode","toDisplayString","SelectItemIndicator","Check","SelectSeparator"],"sources":["../../src/components/InkZoomSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ZOOM_LEVELS } from '@inkbar/core/dom'\nimport { Check, ChevronDown } from '@inkbar/icons'\nimport {\n  SelectContent,\n  SelectIcon,\n  SelectItem,\n  SelectItemIndicator,\n  SelectItemText,\n  SelectPortal,\n  SelectRoot,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n  SelectViewport,\n} from 'reka-ui'\nimport { computed } from 'vue'\n\nimport { useZoom } from '../composables/useZoom'\n\nimport InkIcon from './InkIcon.vue'\n\nimport type { ZoomValue } from '@inkbar/core/dom'\n\nconst CUSTOM = 'custom:'\n\nconst { zoom, scale, setZoom } = useZoom()\n\nconst level = (z: number) => ZOOM_LEVELS.find((l) => Math.abs(l - z) < 0.001)\n/** A numeric zoom that is not one of the levels (zoom in and out multiply). */\nconst custom = computed(() =>\n  typeof zoom.value === 'number' && level(zoom.value) === undefined ? zoom.value : null\n)\nconst value = computed(() => {\n  const z = zoom.value\n  if (typeof z !== 'number') return z\n  return custom.value === null ? String(level(z)) : `${CUSTOM}${z}`\n})\n\nfunction onChange(v: unknown): void {\n  if (typeof v !== 'string' || v === value.value) return\n  const next: ZoomValue =\n    v === 'fit-width' || v === 'fit-page' ? v : Number(v.replace(CUSTOM, ''))\n  setZoom(next)\n}\n\nconst FITS = [\n  { value: 'fit-width', label: 'Fit width' },\n  { value: 'fit-page', label: 'Fit page' },\n]\n// Reka's typed props stop at its own; ARIA goes through a bound object.\nconst triggerAttrs = { 'aria-label': 'Zoom' }\nconst percent = (z: number) => `${Math.round(z * 100)}%`\n/** The levels, with a custom zoom in its place among them. */\nconst levels = computed(() => {\n  const list = ZOOM_LEVELS.map((l) => ({ z: l, value: String(l), label: percent(l) }))\n  const c = custom.value\n  if (c !== null) list.push({ z: c, value: `${CUSTOM}${c}`, label: percent(scale.value) })\n  return list.sort((a, b) => a.z - b.z)\n})\n</script>\n\n<template>\n  <SelectRoot :model-value=\"value\" @update:model-value=\"onChange\">\n    <SelectTrigger\n      class=\"ink-zoom-select ink-select-trigger\"\n      data-ink-zoom-select\n      v-bind=\"triggerAttrs\"\n    >\n      <SelectValue class=\"ink-select-value\" />\n      <SelectIcon class=\"ink-select-icon\">\n        <InkIcon :icon=\"ChevronDown\" :size=\"16\" />\n      </SelectIcon>\n    </SelectTrigger>\n    <SelectPortal>\n      <SelectContent\n        class=\"ink-select-content\"\n        data-ink-select-content\n        position=\"popper\"\n        side=\"top\"\n        :side-offset=\"4\"\n      >\n        <SelectViewport>\n          <SelectItem\n            v-for=\"o in FITS\"\n            :key=\"o.value\"\n            :value=\"o.value\"\n            class=\"ink-select-item\"\n            data-ink-select-item\n          >\n            <SelectItemText>{{ o.label }}</SelectItemText>\n            <SelectItemIndicator class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </SelectItemIndicator>\n          </SelectItem>\n          <SelectSeparator class=\"ink-select-separator\" />\n          <SelectItem\n            v-for=\"o in levels\"\n            :key=\"o.value\"\n            :value=\"o.value\"\n            class=\"ink-select-item\"\n            data-ink-select-item\n          >\n            <SelectItemText>{{ o.label }}</SelectItemText>\n            <SelectItemIndicator class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </SelectItemIndicator>\n          </SelectItem>\n        </SelectViewport>\n      </SelectContent>\n    </SelectPortal>\n  </SelectRoot>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"InkZoomSelect.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createVNode","_mergeProps","InkIcon","_createElementBlock","_Fragment","_renderList","_createTextVNode","_toDisplayString","InkIcon_default","CUSTOM","InkZoomSelect_vue_vue_type_script_setup_true_lang_default","useZoom","level","ZOOM_LEVELS","l","z","custom","computed","zoom","value","onChange","v","next","FITS","triggerAttrs","percent","levels","list","c","scale","a","b","openBlock","createBlock","unref","SelectRoot","withCtx","createVNode","SelectTrigger","mergeProps","SelectValue","SelectIcon","ChevronDown","SelectPortal","SelectContent","SelectViewport","createElementBlock","Fragment","renderList","SelectItem","o","SelectItemText","createTextVNode","toDisplayString","SelectItemIndicator","Check","SelectSeparator"],"sources":["../../src/components/InkZoomSelect.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ZOOM_LEVELS } from '@inkbar/core/dom'\nimport { Check, ChevronDown } from '@inkbar/icons'\nimport {\n  SelectContent,\n  SelectIcon,\n  SelectItem,\n  SelectItemIndicator,\n  SelectItemText,\n  SelectPortal,\n  SelectRoot,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n  SelectViewport,\n} from 'reka-ui'\nimport { computed } from 'vue'\n\nimport { useZoom } from '../composables/useZoom'\n\nimport InkIcon from './InkIcon.vue'\n\nimport type { ZoomValue } from '@inkbar/core/dom'\n\nconst CUSTOM = 'custom:'\n\nconst { zoom, scale, setZoom } = useZoom()\n\nconst level = (z: number) => ZOOM_LEVELS.find((l) => Math.abs(l - z) < 0.001)\n/** A numeric zoom that is not one of the levels (zoom in and out multiply). */\nconst custom = computed(() =>\n  typeof zoom.value === 'number' && level(zoom.value) === undefined ? zoom.value : null\n)\nconst value = computed(() => {\n  const z = zoom.value\n  if (typeof z !== 'number') return z\n  return custom.value === null ? String(level(z)) : `${CUSTOM}${z}`\n})\n\nfunction onChange(v: unknown): void {\n  if (typeof v !== 'string' || v === value.value) return\n  const next: ZoomValue =\n    v === 'fit-width' || v === 'fit-page' ? v : Number(v.replace(CUSTOM, ''))\n  setZoom(next)\n}\n\nconst FITS = [\n  { value: 'fit-width', label: 'Fit width' },\n  { value: 'fit-page', label: 'Fit page' },\n]\n// Reka's typed props stop at its own; ARIA goes through a bound object.\nconst triggerAttrs = { 'aria-label': 'Zoom' }\nconst percent = (z: number) => `${Math.round(z * 100)}%`\n/** The levels, with a custom zoom in its place among them. */\nconst levels = computed(() => {\n  const list = ZOOM_LEVELS.map((l) => ({ z: l, value: String(l), label: percent(l) }))\n  const c = custom.value\n  if (c !== null) list.push({ z: c, value: `${CUSTOM}${c}`, label: percent(scale.value) })\n  return list.sort((a, b) => a.z - b.z)\n})\n</script>\n\n<template>\n  <SelectRoot :model-value=\"value\" @update:model-value=\"onChange\">\n    <SelectTrigger\n      class=\"ink-select ink-select-trigger ink-zoom-select\"\n      data-ink-zoom-select\n      v-bind=\"triggerAttrs\"\n    >\n      <SelectValue class=\"ink-select-value\" />\n      <SelectIcon class=\"ink-select-icon\">\n        <InkIcon :icon=\"ChevronDown\" :size=\"16\" />\n      </SelectIcon>\n    </SelectTrigger>\n    <SelectPortal>\n      <SelectContent\n        class=\"ink-select-content\"\n        data-ink-select-content\n        position=\"popper\"\n        side=\"top\"\n        :side-offset=\"4\"\n      >\n        <SelectViewport>\n          <SelectItem\n            v-for=\"o in FITS\"\n            :key=\"o.value\"\n            :value=\"o.value\"\n            class=\"ink-select-item\"\n            data-ink-select-item\n          >\n            <SelectItemText>{{ o.label }}</SelectItemText>\n            <SelectItemIndicator class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </SelectItemIndicator>\n          </SelectItem>\n          <SelectSeparator class=\"ink-select-separator\" />\n          <SelectItem\n            v-for=\"o in levels\"\n            :key=\"o.value\"\n            :value=\"o.value\"\n            class=\"ink-select-item\"\n            data-ink-select-item\n          >\n            <SelectItemText>{{ o.label }}</SelectItemText>\n            <SelectItemIndicator class=\"ink-select-indicator\">\n              <InkIcon :icon=\"Check\" :size=\"16\" />\n            </SelectItemIndicator>\n          </SelectItem>\n        </SelectViewport>\n      </SelectContent>\n    </SelectPortal>\n  </SelectRoot>\n</template>\n"],"mappings":"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"}

package/dist/components/RecordCards.js

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

package/dist/components/RecordCards.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RecordCards.js","names":["_sfc_main","RecordCards_vue_vue_type_script_setup_true_lang_default","RecordCards_default"],"sources":["../../src/components/RecordCards.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A record list's markup on core's record list controller, shared by `InkRecordList` and\n * `InkSearchResults`: `createRecordList`'s `div.ink-records` holding `ul.ink-record-list` with\n * one `li.ink-record` card per row, the empty text and a polite live region. The controller\n * holds the rows, the count and the announcement, and handles the clicks, keys, Tab stop,\n * focus and scrolling. Empty, with no empty text, until there is a source.\n */\nimport {\n  createRecordListController,\n  type RecordListController,\n  type RecordListRow,\n  type RecordListSource,\n} from '@inkbar/core/dom'\nimport { computed, nextTick, shallowRef, useTemplateRef, watch } from 'vue'\n\nconst props = withDefaults(\n  defineProps<{\n    source: RecordListSource | null\n    /** Whether the empty text shows when there are no rows. */\n    emptyShown?: boolean\n  }>(),\n  { emptyShown: true }\n)\n\nconst emit = defineEmits<{ 'update:count': [count: number] }>()\n\ndefineSlots<{ empty?(): unknown }>()\n\nconst root = useTemplateRef<HTMLElement>('root')\nconst controller = shallowRef<RecordListController | null>(null)\nconst rows = shallowRef<readonly RecordListRow[]>([])\nconst announcement = shallowRef('')\nconst empty = computed(\n  () => controller.value !== null && rows.value.length === 0 && props.emptyShown\n)\n\nlet reported: number | null = null\nfunction report(count: number): void {\n  if (count === reported) return\n  reported = count\n  emit('update:count', count)\n}\n\n/**\n * When the rows change under a focused action whose button goes (its card lost that action),\n * focus the same place in the card once it re-renders, else the row. A row that goes is the\n * controller's to re-home.\n */\nfunction keepActionFocus(): void {\n  const el = root.value\n  const active = el?.ownerDocument.activeElement\n  if (!el || !(active instanceof HTMLButtonElement) || !el.contains(active)) return\n  const row = active.closest<HTMLElement>('[data-ink-record]')\n  if (!row) return\n  const id = row.dataset.inkRecord\n  const buttons = (r: HTMLElement) => [\n    ...r.querySelectorAll<HTMLElement>('.ink-card-actions > button'),\n  ]\n  const index = buttons(row).indexOf(active)\n  void nextTick(() => {\n    if (active.isConnected) return\n    const now = [...el.querySelectorAll<HTMLElement>('[data-ink-record]')].find(\n      (r) => r.dataset.inkRecord === id\n    )\n    if (now) (buttons(now)[index] ?? now).focus({ preventScroll: true })\n  })\n}\n\nwatch(\n  [() => props.source, root],\n  ([source, el], _, onCleanup) => {\n    if (!source || !el) {\n      controller.value = null\n      rows.value = []\n      announcement.value = ''\n      return\n    }\n    const c = createRecordListController(source)\n    controller.value = c\n    rows.value = c.rows.get()\n    announcement.value = c.announcement.get()\n    report(c.count.get())\n    const stops = [\n      c.rows.subscribe((next) => {\n        keepActionFocus()\n        rows.value = next\n      }),\n      c.count.subscribe(report),\n      c.announcement.subscribe((text) => {\n        announcement.value = text\n      }),\n    ]\n    const detach = c.attach(el)\n    onCleanup(() => {\n      for (const stop of stops) stop()\n      detach()\n      c.destroy()\n    })\n  },\n  { flush: 'post', immediate: true }\n)\n</script>\n\n<template>\n  <div ref=\"root\" class=\"ink-records\" data-ink-records tabindex=\"-1\">\n    <ul class=\"ink-record-list\" role=\"list\" :hidden=\"rows.length === 0\">\n      <!-- The controller sets each row's tabindex. -->\n      <li\n        v-for=\"{ item, card, selected } in rows\"\n        :key=\"item.id\"\n        class=\"ink-record\"\n        :data-ink-record=\"item.id\"\n        :aria-current=\"selected ? 'true' : undefined\"\n        :data-selected=\"selected ? '' : undefined\"\n      >\n        <div :class=\"['ink-card', card?.className]\">\n          <template v-if=\"card\">\n            <p class=\"ink-card-title\">{{ card.title }}</p>\n            <!-- prettier-ignore -->\n            <p v-if=\"card.meta !== undefined\" class=\"ink-card-meta\"><span v-if=\"card.swatch !== undefined\" class=\"ink-card-swatch\" :style=\"{ background: card.swatch }\" />{{ card.meta }}</p>\n            <p v-if=\"card.body !== undefined\" class=\"ink-card-body\">{{ card.body }}</p>\n            <!-- prettier-ignore -->\n            <p v-if=\"card.excerpt !== undefined\" class=\"ink-card-excerpt\">{{ card.excerpt.before }}<mark>{{ card.excerpt.match }}</mark>{{ card.excerpt.after }}</p>\n            <div class=\"ink-card-actions\">\n              <button\n                v-for=\"label in Object.keys(card.actions)\"\n                :key=\"label\"\n                type=\"button\"\n                @click=\"controller?.act(item.id, label)\"\n                v-text=\"label\"\n              />\n            </div>\n          </template>\n        </div>\n      </li>\n    </ul>\n    <p class=\"ink-record-list-empty\" :hidden=\"!empty\">\n      <slot name=\"empty\">Nothing here yet.</slot>\n    </p>\n    <div\n      class=\"ink-visually-hidden\"\n      aria-live=\"polite\"\n      data-ink-record-status\n      v-text=\"announcement\"\n    />\n  </div>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,25 @@
+import { RecordListSource } from '@inkbar/core/dom';
+type __VLS_Props = {
+    source: RecordListSource | null;
+    /** Whether the empty text shows when there are no rows. */
+    emptyShown?: boolean;
+};
+type __VLS_Slots = {
+    empty?(): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:count": (count: number) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate:count"?: (count: number) => any;
+}>, {
+    emptyShown: boolean;
+}, {}, {}, {}, 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=RecordCards.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RecordCards.vue.d.ts","sourceRoot":"","sources":["../../src/components/RecordCards.vue"],"names":[],"mappings":"AA6JA,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,kBAAkB,CAAA;AAIzB,KAAK,WAAW,GAAG;IACf,MAAM,EAAE,gBAAgB,GAAG,IAAI,CAAA;IAC/B,2DAA2D;IAC3D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB,CAAC;AASJ,KAAK,WAAW,GAAG;IAAE,KAAK,CAAC,IAAI,OAAO,CAAA;CAAE,CAAC;AAgNzC,QAAA,MAAM,UAAU;;;;;;6EAId,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/RecordCards.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,120 @@
+import { Fragment as e, computed as t, createCommentVNode as n, createElementBlock as r, createElementVNode as i, createTextVNode as a, defineComponent as o, nextTick as s, normalizeClass as c, normalizeStyle as l, openBlock as u, renderList as d, renderSlot as f, shallowRef as p, toDisplayString as m, useTemplateRef as h, watch as g } from "vue";
+import { createRecordListController as _ } from "@inkbar/core/dom";
+//#region src/components/RecordCards.vue?vue&type=script&setup=true&lang.ts
+var v = ["hidden"], y = [
+	"data-ink-record",
+	"aria-current",
+	"data-selected"
+], b = { class: "ink-card-title" }, x = {
+	key: 0,
+	class: "ink-card-meta"
+}, S = {
+	key: 1,
+	class: "ink-card-body"
+}, C = {
+	key: 2,
+	class: "ink-card-excerpt"
+}, w = { class: "ink-card-actions" }, T = ["onClick", "textContent"], E = ["hidden"], D = ["textContent"], O = /*@__PURE__*/ o({
+	__name: "RecordCards",
+	props: {
+		source: {},
+		emptyShown: {
+			type: Boolean,
+			default: !0
+		}
+	},
+	emits: ["update:count"],
+	setup(o, { emit: O }) {
+		let k = o, A = O, j = h("root"), M = p(null), N = p([]), P = p(""), F = t(() => M.value !== null && N.value.length === 0 && k.emptyShown), I = null;
+		function L(e) {
+			e !== I && (I = e, A("update:count", e));
+		}
+		function R() {
+			let e = j.value, t = e?.ownerDocument.activeElement;
+			if (!e || !(t instanceof HTMLButtonElement) || !e.contains(t)) return;
+			let n = t.closest("[data-ink-record]");
+			if (!n) return;
+			let r = n.dataset.inkRecord, i = (e) => [...e.querySelectorAll(".ink-card-actions > button")], a = i(n).indexOf(t);
+			s(() => {
+				if (t.isConnected) return;
+				let n = [...e.querySelectorAll("[data-ink-record]")].find((e) => e.dataset.inkRecord === r);
+				n && (i(n)[a] ?? n).focus({ preventScroll: !0 });
+			});
+		}
+		return g([() => k.source, j], ([e, t], n, r) => {
+			if (!e || !t) {
+				M.value = null, N.value = [], P.value = "";
+				return;
+			}
+			let i = _(e);
+			M.value = i, N.value = i.rows.get(), P.value = i.announcement.get(), L(i.count.get());
+			let a = [
+				i.rows.subscribe((e) => {
+					R(), N.value = e;
+				}),
+				i.count.subscribe(L),
+				i.announcement.subscribe((e) => {
+					P.value = e;
+				})
+			], o = i.attach(t);
+			r(() => {
+				for (let e of a) e();
+				o(), i.destroy();
+			});
+		}, {
+			flush: "post",
+			immediate: !0
+		}), (t, o) => (u(), r("div", {
+			ref_key: "root",
+			ref: j,
+			class: "ink-records",
+			"data-ink-records": "",
+			tabindex: "-1"
+		}, [
+			i("ul", {
+				class: "ink-record-list",
+				role: "list",
+				hidden: N.value.length === 0
+			}, [(u(!0), r(e, null, d(N.value, ({ item: t, card: o, selected: s }) => (u(), r("li", {
+				key: t.id,
+				class: "ink-record",
+				"data-ink-record": t.id,
+				"aria-current": s ? "true" : void 0,
+				"data-selected": s ? "" : void 0
+			}, [i("div", { class: c(["ink-card", o?.className]) }, [o ? (u(), r(e, { key: 0 }, [
+				i("p", b, m(o.title), 1),
+				o.meta === void 0 ? n("", !0) : (u(), r("p", x, [o.swatch === void 0 ? n("", !0) : (u(), r("span", {
+					key: 0,
+					class: "ink-card-swatch",
+					style: l({ background: o.swatch })
+				}, null, 4)), a(m(o.meta), 1)])),
+				o.body === void 0 ? n("", !0) : (u(), r("p", S, m(o.body), 1)),
+				o.excerpt === void 0 ? n("", !0) : (u(), r("p", C, [
+					a(m(o.excerpt.before), 1),
+					i("mark", null, m(o.excerpt.match), 1),
+					a(m(o.excerpt.after), 1)
+				])),
+				i("div", w, [(u(!0), r(e, null, d(Object.keys(o.actions), (e) => (u(), r("button", {
+					key: e,
+					type: "button",
+					onClick: (n) => M.value?.act(t.id, e),
+					textContent: m(e)
+				}, null, 8, T))), 128))])
+			], 64)) : n("", !0)], 2)], 8, y))), 128))], 8, v),
+			i("p", {
+				class: "ink-record-list-empty",
+				hidden: !F.value
+			}, [f(t.$slots, "empty", {}, () => [o[0] ||= a("Nothing here yet.", -1)])], 8, E),
+			i("div", {
+				class: "ink-visually-hidden",
+				"aria-live": "polite",
+				"data-ink-record-status": "",
+				textContent: m(P.value)
+			}, null, 8, D)
+		], 512));
+	}
+});
+//#endregion
+export { O as default };
+
+//# sourceMappingURL=RecordCards.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RecordCards.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_createElementVNode","_Fragment","_renderList","_normalizeClass","_toDisplayString","_normalizeStyle","_createCommentVNode","_createTextVNode","_renderSlot","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_7","_hoisted_8","_hoisted_9","_hoisted_10","RecordCards_vue_vue_type_script_setup_true_lang_default","__emit","props","__props","emit","root","useTemplateRef","controller","shallowRef","rows","announcement","empty","computed","reported","report","count","keepActionFocus","el","active","row","id","buttons","r","index","now","watch","source","c","createRecordListController","stops","next","text","detach","stop","openBlock","createElementBlock","createElementVNode","Fragment","renderList","item","selected","normalizeClass","card","toDisplayString","createCommentVNode","normalizeStyle","createTextVNode","label","renderSlot","_ctx","_cache"],"sources":["../../src/components/RecordCards.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A record list's markup on core's record list controller, shared by `InkRecordList` and\n * `InkSearchResults`: `createRecordList`'s `div.ink-records` holding `ul.ink-record-list` with\n * one `li.ink-record` card per row, the empty text and a polite live region. The controller\n * holds the rows, the count and the announcement, and handles the clicks, keys, Tab stop,\n * focus and scrolling. Empty, with no empty text, until there is a source.\n */\nimport {\n  createRecordListController,\n  type RecordListController,\n  type RecordListRow,\n  type RecordListSource,\n} from '@inkbar/core/dom'\nimport { computed, nextTick, shallowRef, useTemplateRef, watch } from 'vue'\n\nconst props = withDefaults(\n  defineProps<{\n    source: RecordListSource | null\n    /** Whether the empty text shows when there are no rows. */\n    emptyShown?: boolean\n  }>(),\n  { emptyShown: true }\n)\n\nconst emit = defineEmits<{ 'update:count': [count: number] }>()\n\ndefineSlots<{ empty?(): unknown }>()\n\nconst root = useTemplateRef<HTMLElement>('root')\nconst controller = shallowRef<RecordListController | null>(null)\nconst rows = shallowRef<readonly RecordListRow[]>([])\nconst announcement = shallowRef('')\nconst empty = computed(\n  () => controller.value !== null && rows.value.length === 0 && props.emptyShown\n)\n\nlet reported: number | null = null\nfunction report(count: number): void {\n  if (count === reported) return\n  reported = count\n  emit('update:count', count)\n}\n\n/**\n * When the rows change under a focused action whose button goes (its card lost that action),\n * focus the same place in the card once it re-renders, else the row. A row that goes is the\n * controller's to re-home.\n */\nfunction keepActionFocus(): void {\n  const el = root.value\n  const active = el?.ownerDocument.activeElement\n  if (!el || !(active instanceof HTMLButtonElement) || !el.contains(active)) return\n  const row = active.closest<HTMLElement>('[data-ink-record]')\n  if (!row) return\n  const id = row.dataset.inkRecord\n  const buttons = (r: HTMLElement) => [\n    ...r.querySelectorAll<HTMLElement>('.ink-card-actions > button'),\n  ]\n  const index = buttons(row).indexOf(active)\n  void nextTick(() => {\n    if (active.isConnected) return\n    const now = [...el.querySelectorAll<HTMLElement>('[data-ink-record]')].find(\n      (r) => r.dataset.inkRecord === id\n    )\n    if (now) (buttons(now)[index] ?? now).focus({ preventScroll: true })\n  })\n}\n\nwatch(\n  [() => props.source, root],\n  ([source, el], _, onCleanup) => {\n    if (!source || !el) {\n      controller.value = null\n      rows.value = []\n      announcement.value = ''\n      return\n    }\n    const c = createRecordListController(source)\n    controller.value = c\n    rows.value = c.rows.get()\n    announcement.value = c.announcement.get()\n    report(c.count.get())\n    const stops = [\n      c.rows.subscribe((next) => {\n        keepActionFocus()\n        rows.value = next\n      }),\n      c.count.subscribe(report),\n      c.announcement.subscribe((text) => {\n        announcement.value = text\n      }),\n    ]\n    const detach = c.attach(el)\n    onCleanup(() => {\n      for (const stop of stops) stop()\n      detach()\n      c.destroy()\n    })\n  },\n  { flush: 'post', immediate: true }\n)\n</script>\n\n<template>\n  <div ref=\"root\" class=\"ink-records\" data-ink-records tabindex=\"-1\">\n    <ul class=\"ink-record-list\" role=\"list\" :hidden=\"rows.length === 0\">\n      <!-- The controller sets each row's tabindex. -->\n      <li\n        v-for=\"{ item, card, selected } in rows\"\n        :key=\"item.id\"\n        class=\"ink-record\"\n        :data-ink-record=\"item.id\"\n        :aria-current=\"selected ? 'true' : undefined\"\n        :data-selected=\"selected ? '' : undefined\"\n      >\n        <div :class=\"['ink-card', card?.className]\">\n          <template v-if=\"card\">\n            <p class=\"ink-card-title\">{{ card.title }}</p>\n            <!-- prettier-ignore -->\n            <p v-if=\"card.meta !== undefined\" class=\"ink-card-meta\"><span v-if=\"card.swatch !== undefined\" class=\"ink-card-swatch\" :style=\"{ background: card.swatch }\" />{{ card.meta }}</p>\n            <p v-if=\"card.body !== undefined\" class=\"ink-card-body\">{{ card.body }}</p>\n            <!-- prettier-ignore -->\n            <p v-if=\"card.excerpt !== undefined\" class=\"ink-card-excerpt\">{{ card.excerpt.before }}<mark>{{ card.excerpt.match }}</mark>{{ card.excerpt.after }}</p>\n            <div class=\"ink-card-actions\">\n              <button\n                v-for=\"label in Object.keys(card.actions)\"\n                :key=\"label\"\n                type=\"button\"\n                @click=\"controller?.act(item.id, label)\"\n                v-text=\"label\"\n              />\n            </div>\n          </template>\n        </div>\n      </li>\n    </ul>\n    <p class=\"ink-record-list-empty\" :hidden=\"!empty\">\n      <slot name=\"empty\">Nothing here yet.</slot>\n    </p>\n    <div\n      class=\"ink-visually-hidden\"\n      aria-live=\"polite\"\n      data-ink-record-status\n      v-text=\"announcement\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/SidebarTrigger.js

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

package/dist/components/SidebarTrigger.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarTrigger.js","names":["_sfc_main","SidebarTrigger_vue_vue_type_script_setup_true_lang_default","SidebarTrigger_default"],"sources":["../../src/components/SidebarTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A sidebar trigger's content: `createSidebar`'s markup, so the theme styles both alike. The\n * rail shows the icon alone (the trigger's `title` carries the label); tabs and stack headers\n * show the label too. The badge is hidden from assistive technology: the trigger's name has it.\n */\nimport { sidebarBadge, type SidebarPanelInfo } from '@inkbar/core/dom'\nimport { computed } from 'vue'\n\nimport InkIcon from './InkIcon.vue'\n\nconst props = defineProps<{ panel: SidebarPanelInfo; rail: boolean }>()\nconst badge = computed(() => sidebarBadge(props.panel.badge))\n</script>\n\n<template>\n  <InkIcon v-if=\"panel.icon\" :icon=\"panel.icon\" />\n  <span v-if=\"!panel.icon || !rail\" class=\"ink-sidebar-label\">{{ panel.label }}</span>\n  <span class=\"ink-sidebar-badge\" aria-hidden=\"true\" :hidden=\"badge === null\">{{\n    badge\n  }}</span>\n</template>\n"],"mappings":""}

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

@@ -0,0 +1,9 @@
+import { SidebarPanelInfo } from '@inkbar/core/dom';
+type __VLS_Props = {
+    panel: SidebarPanelInfo;
+    rail: boolean;
+};
+declare const __VLS_export: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;
+//# sourceMappingURL=SidebarTrigger.vue.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarTrigger.vue.d.ts","sourceRoot":"","sources":["../../src/components/SidebarTrigger.vue"],"names":[],"mappings":"AA6BA,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AAMtE,KAAK,WAAW,GAAG;IAAE,KAAK,EAAE,gBAAgB,CAAC;IAAC,IAAI,EAAE,OAAO,CAAA;CAAE,CAAC;AAgD9D,QAAA,MAAM,YAAY,kSAEhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/SidebarTrigger.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,33 @@
+import e from "./InkIcon.js";
+import { Fragment as t, computed as n, createBlock as r, createCommentVNode as i, createElementBlock as a, createElementVNode as o, defineComponent as s, openBlock as c, toDisplayString as l } from "vue";
+import { sidebarBadge as u } from "@inkbar/core/dom";
+//#region src/components/SidebarTrigger.vue?vue&type=script&setup=true&lang.ts
+var d = {
+	key: 1,
+	class: "ink-sidebar-label"
+}, f = ["hidden"], p = /*@__PURE__*/ s({
+	__name: "SidebarTrigger",
+	props: {
+		panel: {},
+		rail: { type: Boolean }
+	},
+	setup(s) {
+		let p = s, m = n(() => u(p.panel.badge));
+		return (n, u) => (c(), a(t, null, [
+			s.panel.icon ? (c(), r(e, {
+				key: 0,
+				icon: s.panel.icon
+			}, null, 8, ["icon"])) : i("", !0),
+			!s.panel.icon || !s.rail ? (c(), a("span", d, l(s.panel.label), 1)) : i("", !0),
+			o("span", {
+				class: "ink-sidebar-badge",
+				"aria-hidden": "true",
+				hidden: m.value === null
+			}, l(m.value), 9, f)
+		], 64));
+	}
+});
+//#endregion
+export { p as default };
+
+//# sourceMappingURL=SidebarTrigger.vue_vue_type_script_setup_true_lang.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SidebarTrigger.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_Fragment","_createBlock","InkIcon","_createCommentVNode","_toDisplayString","_createElementVNode","InkIcon_default","_hoisted_1","_hoisted_2","SidebarTrigger_vue_vue_type_script_setup_true_lang_default","props","__props","badge","computed","sidebarBadge","openBlock","createElementBlock","Fragment","createBlock","createCommentVNode","toDisplayString","createElementVNode"],"sources":["../../src/components/SidebarTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A sidebar trigger's content: `createSidebar`'s markup, so the theme styles both alike. The\n * rail shows the icon alone (the trigger's `title` carries the label); tabs and stack headers\n * show the label too. The badge is hidden from assistive technology: the trigger's name has it.\n */\nimport { sidebarBadge, type SidebarPanelInfo } from '@inkbar/core/dom'\nimport { computed } from 'vue'\n\nimport InkIcon from './InkIcon.vue'\n\nconst props = defineProps<{ panel: SidebarPanelInfo; rail: boolean }>()\nconst badge = computed(() => sidebarBadge(props.panel.badge))\n</script>\n\n<template>\n  <InkIcon v-if=\"panel.icon\" :icon=\"panel.icon\" />\n  <span v-if=\"!panel.icon || !rail\" class=\"ink-sidebar-label\">{{ panel.label }}</span>\n  <span class=\"ink-sidebar-badge\" aria-hidden=\"true\" :hidden=\"badge === null\">{{\n    badge\n  }}</span>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAWA,IAAMY,IAAQC,GACRC,IAAQC,QAAeC,EAAaJ,EAAM,MAAM,KAAK,CAAC;;GAI3CC,EAAA,MAAM,QAArBb,EAAA,GAAAG,EAAgDC,GAAA;;IAApB,MAAMS,EAAA,MAAM;;GAC3B,CAAAA,EAAA,MAAM,QAAI,CAAKA,EAAA,QAA5Bb,EAAA,GAAAC,EAAoF,QAApFQ,GAAoFH,EAArBO,EAAA,MAAM,KAAK,GAAA,CAAA,KAAAQ,EAAA,IAAA,EAAA;GAC1Ed,EAES,QAAA;IAFH,OAAM;IAAoB,eAAY;IAAQ,QAAQO,EAAA,UAAK;GAC/D,GAAAR,EAAAQ,EAAA,KAAK,GAAA,GAAAJ,CAAA"}

package/dist/components/sidebar-context.d.ts

@@ -0,0 +1,21 @@
+import { SidebarController, SidebarPanelInfo, SidebarState } from '@inkbar/core/dom';
+import { Ref } from 'vue';
+/** A panel as `InkPanel` registers it. */
+export interface SidebarPanelEntry {
+    /** The panel's props; read inside a computed, so changes reach the sidebar. */
+    info(): SidebarPanelInfo;
+    /** The panel's element once mounted, to keep the panels in DOM order. */
+    element(): HTMLElement | null;
+}
+/** What `InkSidebar` gives its panels. */
+export interface SidebarContext {
+    controller: SidebarController;
+    /** The controller's state: read it to re-render when the attributes change. */
+    state: Readonly<Ref<SidebarState>>;
+    /** Adds a panel at the end; returns the function that removes it. */
+    register(entry: SidebarPanelEntry): () => void;
+    /** Puts the registered panels in the order of their elements in the DOM. */
+    arrange(): void;
+}
+export declare const injectSidebarContext: <T extends SidebarContext | null | undefined = SidebarContext>(fallback?: T | undefined) => T extends null ? SidebarContext | null : SidebarContext, provideSidebarContext: (contextValue: SidebarContext) => SidebarContext;
+//# sourceMappingURL=sidebar-context.d.ts.map

package/dist/components/sidebar-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-context.d.ts","sourceRoot":"","sources":["../../src/components/sidebar-context.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AACzF,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAE9B,0CAA0C;AAC1C,MAAM,WAAW,iBAAiB;IAChC,+EAA+E;IAC/E,IAAI,IAAI,gBAAgB,CAAA;IACxB,yEAAyE;IACzE,OAAO,IAAI,WAAW,GAAG,IAAI,CAAA;CAC9B;AAED,0CAA0C;AAC1C,MAAM,WAAW,cAAc;IAC7B,UAAU,EAAE,iBAAiB,CAAA;IAC7B,+EAA+E;IAC/E,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC,CAAA;IAClC,qEAAqE;IACrE,QAAQ,CAAC,KAAK,EAAE,iBAAiB,GAAG,MAAM,IAAI,CAAA;IAC9C,4EAA4E;IAC5E,OAAO,IAAI,IAAI,CAAA;CAChB;AAED,eAAO,MAAO,oBAAoB,uJAAE,qBAAqB,kDACZ,CAAA"}

package/dist/components/sidebar-context.js

@@ -0,0 +1,7 @@
+import { createContext as e } from "reka-ui";
+//#region src/components/sidebar-context.ts
+var [t, n] = e("InkSidebar");
+//#endregion
+export { t as injectSidebarContext, n as provideSidebarContext };
+
+//# sourceMappingURL=sidebar-context.js.map

package/dist/components/sidebar-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar-context.js","names":["injectSidebarContext","provideSidebarContext","createContext"],"sources":["../../src/components/sidebar-context.ts"],"sourcesContent":["import { createContext } from 'reka-ui'\n\nimport type { SidebarController, SidebarPanelInfo, SidebarState } from '@inkbar/core/dom'\nimport type { Ref } from 'vue'\n\n/** A panel as `InkPanel` registers it. */\nexport interface SidebarPanelEntry {\n  /** The panel's props; read inside a computed, so changes reach the sidebar. */\n  info(): SidebarPanelInfo\n  /** The panel's element once mounted, to keep the panels in DOM order. */\n  element(): HTMLElement | null\n}\n\n/** What `InkSidebar` gives its panels. */\nexport interface SidebarContext {\n  controller: SidebarController\n  /** The controller's state: read it to re-render when the attributes change. */\n  state: Readonly<Ref<SidebarState>>\n  /** Adds a panel at the end; returns the function that removes it. */\n  register(entry: SidebarPanelEntry): () => void\n  /** Puts the registered panels in the order of their elements in the DOM. */\n  arrange(): void\n}\n\nexport const [injectSidebarContext, provideSidebarContext] =\n  createContext<SidebarContext>('InkSidebar')\n"],"mappings":";;AAwBA,IAAa,CAACA,GAAsBC,KAClCC,EAA8B,YAAY"}