@inkbar/vue 0.8.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +70 -4
- package/dist/components/InkDownloadButton.js +7 -0
- package/dist/components/InkDownloadButton.js.map +1 -0
- package/dist/components/InkDownloadButton.vue.d.ts +21 -0
- package/dist/components/InkDownloadButton.vue.d.ts.map +1 -0
- package/dist/components/InkDownloadButton.vue_vue_type_script_setup_true_lang.js +42 -0
- package/dist/components/InkDownloadButton.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkFindBar.js.map +1 -1
- package/dist/components/InkFindBar.vue.d.ts.map +1 -1
- package/dist/components/InkFindBar.vue_vue_type_script_setup_true_lang.js +48 -48
- package/dist/components/InkFindBar.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkHighlightMenu.js.map +1 -1
- package/dist/components/InkHighlightMenu.vue.d.ts.map +1 -1
- package/dist/components/InkHighlightMenu.vue_vue_type_script_setup_true_lang.js +67 -65
- package/dist/components/InkHighlightMenu.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkPanel.js +7 -0
- package/dist/components/InkPanel.js.map +1 -0
- package/dist/components/InkPanel.vue.d.ts +21 -0
- package/dist/components/InkPanel.vue.d.ts.map +1 -0
- package/dist/components/InkPanel.vue_vue_type_script_setup_true_lang.js +48 -0
- package/dist/components/InkPanel.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkPrintButton.js +7 -0
- package/dist/components/InkPrintButton.js.map +1 -0
- package/dist/components/InkPrintButton.vue.d.ts +19 -0
- package/dist/components/InkPrintButton.vue.d.ts.map +1 -0
- package/dist/components/InkPrintButton.vue_vue_type_script_setup_true_lang.js +39 -0
- package/dist/components/InkPrintButton.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkRecordList.js +7 -0
- package/dist/components/InkRecordList.js.map +1 -0
- package/dist/components/InkRecordList.vue.d.ts +35 -0
- package/dist/components/InkRecordList.vue.d.ts.map +1 -0
- package/dist/components/InkRecordList.vue_vue_type_script_setup_true_lang.js +41 -0
- package/dist/components/InkRecordList.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkRoot.js.map +1 -1
- package/dist/components/InkRoot.vue.d.ts +48 -4
- package/dist/components/InkRoot.vue.d.ts.map +1 -1
- package/dist/components/InkRoot.vue_vue_type_script_setup_true_lang.js +177 -164
- package/dist/components/InkRoot.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkSearchResults.js +7 -0
- package/dist/components/InkSearchResults.js.map +1 -0
- package/dist/components/InkSearchResults.vue.d.ts +9 -0
- package/dist/components/InkSearchResults.vue.d.ts.map +1 -0
- package/dist/components/InkSearchResults.vue_vue_type_script_setup_true_lang.js +52 -0
- package/dist/components/InkSearchResults.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkShapeMenu.js.map +1 -1
- package/dist/components/InkShapeMenu.vue.d.ts.map +1 -1
- package/dist/components/InkShapeMenu.vue_vue_type_script_setup_true_lang.js +58 -56
- package/dist/components/InkShapeMenu.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkSidebar.js +7 -0
- package/dist/components/InkSidebar.js.map +1 -0
- package/dist/components/InkSidebar.vue.d.ts +34 -0
- package/dist/components/InkSidebar.vue.d.ts.map +1 -0
- package/dist/components/InkSidebar.vue_vue_type_script_setup_true_lang.js +95 -0
- package/dist/components/InkSidebar.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkSignatureDialog.js.map +1 -1
- package/dist/components/InkSignatureDialog.vue.d.ts +3 -2
- package/dist/components/InkSignatureDialog.vue.d.ts.map +1 -1
- package/dist/components/InkSignatureDialog.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkSignatureMenu.js.map +1 -1
- package/dist/components/InkSignatureMenu.vue.d.ts.map +1 -1
- package/dist/components/InkSignatureMenu.vue_vue_type_script_setup_true_lang.js +77 -75
- package/dist/components/InkSignatureMenu.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkThumbnail.js +7 -0
- package/dist/components/InkThumbnail.js.map +1 -0
- package/dist/components/InkThumbnail.vue.d.ts +18 -0
- package/dist/components/InkThumbnail.vue.d.ts.map +1 -0
- package/dist/components/InkThumbnail.vue_vue_type_script_setup_true_lang.js +49 -0
- package/dist/components/InkThumbnail.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkThumbnails.js +7 -0
- package/dist/components/InkThumbnails.js.map +1 -0
- package/dist/components/InkThumbnails.vue.d.ts +27 -0
- package/dist/components/InkThumbnails.vue.d.ts.map +1 -0
- package/dist/components/InkThumbnails.vue_vue_type_script_setup_true_lang.js +107 -0
- package/dist/components/InkThumbnails.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkToolButton.js.map +1 -1
- package/dist/components/InkToolButton.vue.d.ts.map +1 -1
- package/dist/components/InkToolButton.vue_vue_type_script_setup_true_lang.js +39 -36
- package/dist/components/InkToolButton.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkToolbarButton.js +7 -0
- package/dist/components/InkToolbarButton.js.map +1 -0
- package/dist/components/InkToolbarButton.vue.d.ts +22 -0
- package/dist/components/InkToolbarButton.vue.d.ts.map +1 -0
- package/dist/components/InkToolbarButton.vue_vue_type_script_setup_true_lang.js +32 -0
- package/dist/components/InkToolbarButton.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/InkViewport.js.map +1 -1
- package/dist/components/InkViewport.vue.d.ts.map +1 -1
- package/dist/components/InkViewport.vue_vue_type_script_setup_true_lang.js +37 -36
- package/dist/components/InkViewport.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/InkZoomSelect.js.map +1 -1
- package/dist/components/InkZoomSelect.vue.d.ts.map +1 -1
- package/dist/components/InkZoomSelect.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/components/InkZoomSelect.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/RecordCards.js +7 -0
- package/dist/components/RecordCards.js.map +1 -0
- package/dist/components/RecordCards.vue.d.ts +25 -0
- package/dist/components/RecordCards.vue.d.ts.map +1 -0
- package/dist/components/RecordCards.vue_vue_type_script_setup_true_lang.js +120 -0
- package/dist/components/RecordCards.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/SidebarTrigger.js +7 -0
- package/dist/components/SidebarTrigger.js.map +1 -0
- package/dist/components/SidebarTrigger.vue.d.ts +9 -0
- package/dist/components/SidebarTrigger.vue.d.ts.map +1 -0
- package/dist/components/SidebarTrigger.vue_vue_type_script_setup_true_lang.js +33 -0
- package/dist/components/SidebarTrigger.vue_vue_type_script_setup_true_lang.js.map +1 -0
- package/dist/components/SignatureForm.js.map +1 -1
- package/dist/components/SignatureForm.vue.d.ts.map +1 -1
- package/dist/components/SignatureForm.vue_vue_type_script_setup_true_lang.js +56 -55
- package/dist/components/SignatureForm.vue_vue_type_script_setup_true_lang.js.map +1 -1
- package/dist/components/sidebar-context.d.ts +21 -0
- package/dist/components/sidebar-context.d.ts.map +1 -0
- package/dist/components/sidebar-context.js +7 -0
- package/dist/components/sidebar-context.js.map +1 -0
- package/dist/composables/useAnnotations.d.ts +91 -0
- package/dist/composables/useAnnotations.d.ts.map +1 -1
- package/dist/composables/useRecordSelection.d.ts +12 -0
- package/dist/composables/useRecordSelection.d.ts.map +1 -0
- package/dist/composables/useRecordSelection.js +15 -0
- package/dist/composables/useRecordSelection.js.map +1 -0
- package/dist/composables/useRecords.d.ts +14 -0
- package/dist/composables/useRecords.d.ts.map +1 -0
- package/dist/composables/useRecords.js +16 -0
- package/dist/composables/useRecords.js.map +1 -0
- package/dist/composables/useRegisteredTool.d.ts +21 -0
- package/dist/composables/useRegisteredTool.d.ts.map +1 -0
- package/dist/composables/useRegisteredTool.js +25 -0
- package/dist/composables/useRegisteredTool.js.map +1 -0
- package/dist/composables/useSearch.d.ts.map +1 -1
- package/dist/composables/useSearch.js +1 -0
- package/dist/composables/useSearch.js.map +1 -1
- package/dist/composables/useToolOptions.d.ts +8 -0
- package/dist/composables/useToolOptions.d.ts.map +1 -1
- package/dist/composables/useToolOptions.js +10 -5
- package/dist/composables/useToolOptions.js.map +1 -1
- package/dist/context.d.ts +5 -0
- package/dist/context.d.ts.map +1 -1
- package/dist/context.js.map +1 -1
- package/dist/index.d.ts +12 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +40 -29
- package/dist/to-readable.d.ts +7 -0
- package/dist/to-readable.d.ts.map +1 -0
- package/dist/to-readable.js +11 -0
- package/dist/to-readable.js.map +1 -0
- package/package.json +5 -5
|
@@ -1,99 +1,101 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import r from "
|
|
5
|
-
import i from "./
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
1
|
+
import { useRegisteredTool as e } from "../composables/useRegisteredTool.js";
|
|
2
|
+
import { useDocument as t } from "../composables/useDocument.js";
|
|
3
|
+
import { useTool as n } from "../composables/useTool.js";
|
|
4
|
+
import { useToolOptionsWhile as r } from "../composables/useToolOptions.js";
|
|
5
|
+
import i from "./InkIcon.js";
|
|
6
|
+
import a from "./InkColorMenu.js";
|
|
7
|
+
import { Fragment as o, computed as s, createBlock as c, createCommentVNode as l, createElementBlock as u, createElementVNode as d, createTextVNode as f, createVNode as p, defineComponent as m, guardReactiveProps as h, mergeProps as g, normalizeProps as _, openBlock as v, ref as y, renderList as b, renderSlot as x, toDisplayString as S, unref as C, withCtx as w } from "vue";
|
|
8
|
+
import { MARKUP_ICONS as T, MARKUP_KINDS as E, focusInitialMenuItem as D, handleMenuKeys as O, highlightMenuModel as k, menuItems as A } from "@inkbar/core/dom";
|
|
9
|
+
import { PopoverAnchor as j, PopoverContent as M, PopoverPortal as N, PopoverRoot as P, PopoverTrigger as F, ToolbarButton as I } from "reka-ui";
|
|
10
|
+
import { ChevronDown as L } from "@inkbar/icons";
|
|
10
11
|
//#region src/components/InkHighlightMenu.vue?vue&type=script&setup=true&lang.ts
|
|
11
|
-
var
|
|
12
|
+
var R = ["data-state"], z = {
|
|
12
13
|
role: "group",
|
|
13
14
|
"aria-label": "Kinds",
|
|
14
15
|
class: "ink-highlight-kinds"
|
|
15
|
-
},
|
|
16
|
+
}, B = [
|
|
16
17
|
"data-key",
|
|
17
18
|
"aria-checked",
|
|
18
19
|
"data-state",
|
|
19
20
|
"onClick"
|
|
20
|
-
],
|
|
21
|
+
], ee = {
|
|
21
22
|
role: "group",
|
|
22
23
|
"aria-label": "Colour",
|
|
23
24
|
class: "ink-highlight-colour"
|
|
24
|
-
},
|
|
25
|
+
}, V = /*@__PURE__*/ m({
|
|
25
26
|
inheritAttrs: !1,
|
|
26
27
|
__name: "InkHighlightMenu",
|
|
27
|
-
setup(
|
|
28
|
-
let { tool:
|
|
29
|
-
function
|
|
30
|
-
e.key !== "ArrowDown" || e.defaultPrevented ||
|
|
28
|
+
setup(m) {
|
|
29
|
+
let { tool: V, setTool: H } = n(), U = e("highlight"), { options: W, setOptions: G } = r("highlight", U), { document: K } = t(), q = y(!1), J = s(() => k(W.value, E)), Y = s(() => V.value === "highlight"), X = s(() => K.value?.annotations.defaults.color(J.value.kind)), Z = s(() => T[J.value.kind]), Q = !1;
|
|
30
|
+
function $(e) {
|
|
31
|
+
e.key !== "ArrowDown" || e.defaultPrevented || q.value || (e.preventDefault(), Q = !0, q.value = !0);
|
|
31
32
|
}
|
|
32
|
-
function
|
|
33
|
+
function te(e) {
|
|
33
34
|
e.preventDefault();
|
|
34
35
|
let t = document.querySelector("[data-ink-menu=\"highlight\"] [role=\"menu\"]");
|
|
35
|
-
t && (
|
|
36
|
+
t && (Q ? A(t)[0]?.focus({ preventScroll: !0 }) : D(t)), Q = !1;
|
|
36
37
|
}
|
|
37
|
-
function
|
|
38
|
-
|
|
38
|
+
function ne(e) {
|
|
39
|
+
G({ kind: e }), H("highlight"), q.value = !1;
|
|
39
40
|
}
|
|
40
|
-
let
|
|
41
|
-
"aria-pressed": String(
|
|
42
|
-
"aria-label":
|
|
43
|
-
title:
|
|
44
|
-
onClick: () =>
|
|
45
|
-
})),
|
|
41
|
+
let re = s(() => ({
|
|
42
|
+
"aria-pressed": String(Y.value),
|
|
43
|
+
"aria-label": J.value.label,
|
|
44
|
+
title: J.value.label,
|
|
45
|
+
onClick: () => H("highlight")
|
|
46
|
+
})), ie = {
|
|
46
47
|
"aria-label": "Choose highlight",
|
|
47
48
|
title: "Choose highlight",
|
|
48
49
|
"aria-haspopup": "menu",
|
|
49
|
-
onKeydown:
|
|
50
|
-
},
|
|
50
|
+
onKeydown: $
|
|
51
|
+
}, ae = { "aria-label": "Highlights" }, oe = {
|
|
51
52
|
role: "menuitem",
|
|
52
53
|
tabindex: -1
|
|
53
|
-
},
|
|
54
|
+
}, se = {
|
|
54
55
|
role: "menu",
|
|
55
56
|
"aria-label": "Highlights",
|
|
56
|
-
onKeydownCapture: (e) =>
|
|
57
|
+
onKeydownCapture: (e) => O(e, e.currentTarget)
|
|
57
58
|
};
|
|
58
|
-
return (e, t) => (
|
|
59
|
-
|
|
60
|
-
|
|
59
|
+
return (e, t) => C(U) ? (v(), c(C(P), {
|
|
60
|
+
key: 0,
|
|
61
|
+
open: q.value,
|
|
62
|
+
"onUpdate:open": t[0] ||= (e) => q.value = e
|
|
61
63
|
}, {
|
|
62
|
-
default:
|
|
63
|
-
default:
|
|
64
|
+
default: w(() => [p(C(j), { "as-child": "" }, {
|
|
65
|
+
default: w(() => [d("div", g({
|
|
64
66
|
role: "group",
|
|
65
67
|
"aria-label": "Highlight",
|
|
66
68
|
class: "ink-split-button ink-highlight-menu",
|
|
67
69
|
"data-ink-highlight-menu": ""
|
|
68
70
|
}, e.$attrs), [
|
|
69
|
-
|
|
71
|
+
p(C(I), g({
|
|
70
72
|
class: "ink-tool-button ink-highlight-button",
|
|
71
73
|
"data-ink-tool-button": "",
|
|
72
74
|
"data-ink-highlight-button": "",
|
|
73
75
|
"data-tool": "highlight",
|
|
74
|
-
"data-kind":
|
|
75
|
-
"data-state":
|
|
76
|
-
},
|
|
77
|
-
default:
|
|
78
|
-
active:
|
|
79
|
-
kind:
|
|
80
|
-
}, () => [
|
|
76
|
+
"data-kind": J.value.kind,
|
|
77
|
+
"data-state": Y.value ? "on" : "off"
|
|
78
|
+
}, re.value), {
|
|
79
|
+
default: w(() => [x(e.$slots, "default", {
|
|
80
|
+
active: Y.value,
|
|
81
|
+
kind: J.value.kind
|
|
82
|
+
}, () => [p(i, { icon: Z.value }, null, 8, ["icon"])])]),
|
|
81
83
|
_: 3
|
|
82
84
|
}, 16, ["data-kind", "data-state"]),
|
|
83
|
-
|
|
84
|
-
default:
|
|
85
|
-
default:
|
|
85
|
+
p(C(I), { "as-child": "" }, {
|
|
86
|
+
default: w(() => [p(C(F), { "as-child": "" }, {
|
|
87
|
+
default: w(() => [d("button", g({
|
|
86
88
|
type: "button",
|
|
87
89
|
class: "ink-menu-trigger ink-highlight-menu-trigger",
|
|
88
90
|
"data-ink-highlight-menu-trigger": "",
|
|
89
|
-
"data-state":
|
|
90
|
-
},
|
|
91
|
+
"data-state": q.value ? "open" : "closed"
|
|
92
|
+
}, ie), [p(i, { icon: C(L) }, null, 8, ["icon"])], 16, R)]),
|
|
91
93
|
_: 1
|
|
92
94
|
})]),
|
|
93
95
|
_: 1
|
|
94
96
|
}),
|
|
95
|
-
|
|
96
|
-
default:
|
|
97
|
+
p(C(N), null, {
|
|
98
|
+
default: w(() => [p(C(M), g({
|
|
97
99
|
class: "ink-select-content ink-menu-content",
|
|
98
100
|
"data-ink-select-content": "",
|
|
99
101
|
"data-ink-menu": "highlight",
|
|
@@ -101,9 +103,9 @@ var ee = ["data-state"], I = {
|
|
|
101
103
|
align: "start",
|
|
102
104
|
"side-offset": 4,
|
|
103
105
|
"collision-padding": 8
|
|
104
|
-
},
|
|
105
|
-
default:
|
|
106
|
-
|
|
106
|
+
}, ae, { onOpenAutoFocus: te }), {
|
|
107
|
+
default: w(() => [d("div", _(h(se)), [
|
|
108
|
+
d("div", z, [(v(!0), u(o, null, b(J.value.items, (e) => (v(), u("button", {
|
|
107
109
|
key: e.kind,
|
|
108
110
|
type: "button",
|
|
109
111
|
role: "menuitemradio",
|
|
@@ -113,25 +115,25 @@ var ee = ["data-state"], I = {
|
|
|
113
115
|
"data-key": e.kind,
|
|
114
116
|
"aria-checked": e.checked,
|
|
115
117
|
"data-state": e.checked ? "checked" : "unchecked",
|
|
116
|
-
onClick: (t) =>
|
|
117
|
-
}, [
|
|
118
|
-
icon:
|
|
118
|
+
onClick: (t) => ne(e.kind)
|
|
119
|
+
}, [p(i, {
|
|
120
|
+
icon: C(T)[e.kind],
|
|
119
121
|
size: 16
|
|
120
|
-
}, null, 8, ["icon"]),
|
|
121
|
-
t[2] ||=
|
|
122
|
+
}, null, 8, ["icon"]), f(" " + S(e.label), 1)], 8, B))), 128))]),
|
|
123
|
+
t[2] ||= d("div", {
|
|
122
124
|
role: "separator",
|
|
123
125
|
class: "ink-select-separator"
|
|
124
126
|
}, null, -1),
|
|
125
|
-
|
|
127
|
+
d("div", ee, [t[1] ||= d("span", {
|
|
126
128
|
class: "ink-highlight-colour-label",
|
|
127
129
|
"aria-hidden": "true"
|
|
128
|
-
}, "Colour", -1),
|
|
130
|
+
}, "Colour", -1), p(a, g({
|
|
129
131
|
property: "border",
|
|
130
132
|
group: "markup",
|
|
131
133
|
label: "Highlight colour",
|
|
132
134
|
standalone: "",
|
|
133
|
-
fallback:
|
|
134
|
-
},
|
|
135
|
+
fallback: X.value
|
|
136
|
+
}, oe), null, 16, ["fallback"])])
|
|
135
137
|
], 16)]),
|
|
136
138
|
_: 1
|
|
137
139
|
}, 16)]),
|
|
@@ -141,10 +143,10 @@ var ee = ["data-state"], I = {
|
|
|
141
143
|
_: 3
|
|
142
144
|
})]),
|
|
143
145
|
_: 3
|
|
144
|
-
}, 8, ["open"]));
|
|
146
|
+
}, 8, ["open"])) : l("", !0);
|
|
145
147
|
}
|
|
146
148
|
});
|
|
147
149
|
//#endregion
|
|
148
|
-
export {
|
|
150
|
+
export { V as default };
|
|
149
151
|
|
|
150
152
|
//# sourceMappingURL=InkHighlightMenu.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InkHighlightMenu.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_openBlock","_createBlock","_unref","_withCtx","_createVNode","_createElementVNode","_mergeProps","_renderSlot","InkIcon","_normalizeProps","_guardReactiveProps","_createElementBlock","_Fragment","_renderList","_createTextVNode","_toDisplayString","InkColorMenu","InkIcon_default","InkColorMenu_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","InkHighlightMenu_vue_vue_type_script_setup_true_lang_default","useTool","useToolOptions","doc","useDocument","open","ref","model","computed","highlightMenuModel","options","MARKUP_KINDS","active","tool","fallback","icon","MARKUP_ICONS","focusFirst","onTriggerKeydown","onOpenAutoFocus","menu","menuItems","focusInitialMenuItem","choose","setOptions","setTool","mainAttrs","triggerAttrs","menuAttrs","colourAttrs","innerAttrs","handleMenuKeys","openBlock","createBlock","unref","PopoverRoot","_cache","$event","withCtx","createVNode","PopoverAnchor","createElementVNode","mergeProps","_ctx","ToolbarButton","renderSlot","PopoverTrigger","ChevronDown","PopoverPortal","PopoverContent","normalizeProps","guardReactiveProps","createElementBlock","Fragment","renderList","item","createTextVNode","toDisplayString"],"sources":["../../src/components/InkHighlightMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A split button for the highlight tool. The main part activates the tool with the current\n * markup kind and draws that kind's icon; the chevron opens a menu of the four kinds plus\n * the markup colour. Choosing a kind switches to the tool with it. The colour is a nested\n * `InkColorMenu` scoped to the `markup` style group, so it works whatever tool is active.\n */\nimport {\n focusInitialMenuItem,\n handleMenuKeys,\n highlightMenuModel,\n MARKUP_ICONS,\n MARKUP_KINDS,\n menuItems,\n type HighlightOptions,\n type MarkupKind,\n} from '@inkbar/core/dom'\nimport { ChevronDown } from '@inkbar/icons'\nimport {\n PopoverAnchor,\n PopoverContent,\n PopoverPortal,\n PopoverRoot,\n PopoverTrigger,\n ToolbarButton,\n} from 'reka-ui'\nimport { computed, ref } from 'vue'\n\nimport { useDocument } from '../composables/useDocument'\nimport { useTool } from '../composables/useTool'\nimport { useToolOptions } from '../composables/useToolOptions'\n\nimport InkColorMenu from './InkColorMenu.vue'\nimport InkIcon from './InkIcon.vue'\n\ndefineOptions({ inheritAttrs: false })\nconst { tool, setTool } = useTool()\nconst { options, setOptions } = useToolOptions<HighlightOptions>('highlight')\nconst { document: doc } = useDocument()\nconst open = ref(false)\n\nconst model = computed(() => highlightMenuModel(options.value, MARKUP_KINDS))\nconst active = computed(() => tool.value === 'highlight')\n/** The colour the chosen kind gets while the markup style leaves it unset. */\nconst fallback = computed(() => doc.value?.annotations.defaults.color(model.value.kind))\nconst icon = computed(() => MARKUP_ICONS[model.value.kind])\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\nfunction onTriggerKeydown(e: KeyboardEvent): void {\n if (e.key !== 'ArrowDown' || e.defaultPrevented || open.value) return\n e.preventDefault()\n focusFirst = true\n open.value = true\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n e.preventDefault()\n // One highlight menu is open at a time.\n const menu = document.querySelector('[data-ink-menu=\"highlight\"] [role=\"menu\"]')\n if (menu) {\n if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n else focusInitialMenuItem(menu)\n }\n focusFirst = false\n}\n\nfunction choose(kind: MarkupKind): void {\n setOptions({ kind })\n setTool('highlight')\n open.value = false\n}\n\n// Reka's typed props stop at its own; ARIA and listeners go through bound objects.\nconst mainAttrs = computed(() => ({\n 'aria-pressed': String(active.value),\n 'aria-label': model.value.label,\n title: model.value.label,\n onClick: () => setTool('highlight'),\n}))\nconst triggerAttrs = {\n 'aria-label': 'Choose highlight',\n title: 'Choose highlight',\n 'aria-haspopup': 'menu' as const,\n onKeydown: onTriggerKeydown,\n}\nconst menuAttrs = { 'aria-label': 'Highlights' }\n/** The colour trigger is an item of this menu, reached with the arrow keys. */\nconst colourAttrs = { role: 'menuitem', tabindex: -1 }\nconst innerAttrs = {\n role: 'menu',\n 'aria-label': 'Highlights',\n // Capture, so the arrow keys move on from the colour item before its own ArrowDown\n // opens the nested menu.\n onKeydownCapture: (e: KeyboardEvent) =>\n handleMenuKeys(e, e.currentTarget as HTMLElement),\n}\n</script>\n\n<template>\n <PopoverRoot v-model:open=\"open\">\n <PopoverAnchor as-child>\n <div\n role=\"group\"\n aria-label=\"Highlight\"\n class=\"ink-split-button ink-highlight-menu\"\n data-ink-highlight-menu\n v-bind=\"$attrs\"\n >\n <ToolbarButton\n class=\"ink-tool-button ink-highlight-button\"\n data-ink-tool-button\n data-ink-highlight-button\n data-tool=\"highlight\"\n :data-kind=\"model.kind\"\n :data-state=\"active ? 'on' : 'off'\"\n v-bind=\"mainAttrs\"\n >\n <slot :active=\"active\" :kind=\"model.kind\"><InkIcon :icon=\"icon\" /></slot>\n </ToolbarButton>\n <ToolbarButton as-child>\n <PopoverTrigger as-child>\n <button\n type=\"button\"\n class=\"ink-menu-trigger ink-highlight-menu-trigger\"\n data-ink-highlight-menu-trigger\n :data-state=\"open ? 'open' : 'closed'\"\n v-bind=\"triggerAttrs\"\n >\n <InkIcon :icon=\"ChevronDown\" />\n </button>\n </PopoverTrigger>\n </ToolbarButton>\n <PopoverPortal>\n <PopoverContent\n class=\"ink-select-content ink-menu-content\"\n data-ink-select-content\n data-ink-menu=\"highlight\"\n side=\"bottom\"\n align=\"start\"\n :side-offset=\"4\"\n :collision-padding=\"8\"\n v-bind=\"menuAttrs\"\n @open-auto-focus=\"onOpenAutoFocus\"\n >\n <div v-bind=\"innerAttrs\">\n <div role=\"group\" aria-label=\"Kinds\" class=\"ink-highlight-kinds\">\n <button\n v-for=\"item in model.items\"\n :key=\"item.kind\"\n type=\"button\"\n role=\"menuitemradio\"\n class=\"ink-select-item ink-menu-item ink-highlight-item\"\n data-ink-select-item\n tabindex=\"-1\"\n :data-key=\"item.kind\"\n :aria-checked=\"item.checked\"\n :data-state=\"item.checked ? 'checked' : 'unchecked'\"\n @click=\"choose(item.kind)\"\n >\n <InkIcon :icon=\"MARKUP_ICONS[item.kind]\" :size=\"16\" />\n {{ item.label }}\n </button>\n </div>\n <div role=\"separator\" class=\"ink-select-separator\" />\n <div role=\"group\" aria-label=\"Colour\" class=\"ink-highlight-colour\">\n <span class=\"ink-highlight-colour-label\" aria-hidden=\"true\">Colour</span>\n <InkColorMenu\n property=\"border\"\n group=\"markup\"\n label=\"Highlight colour\"\n standalone\n :fallback=\"fallback\"\n v-bind=\"colourAttrs\"\n />\n </div>\n </div>\n </PopoverContent>\n </PopoverPortal>\n </div>\n </PopoverAnchor>\n </PopoverRoot>\n</template>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"InkHighlightMenu.vue_vue_type_script_setup_true_lang.js","names":["$attrs","_unref","_openBlock","_createBlock","_withCtx","_createVNode","_createElementVNode","_mergeProps","_renderSlot","InkIcon","_normalizeProps","_guardReactiveProps","_createElementBlock","_Fragment","_renderList","_createTextVNode","_toDisplayString","InkColorMenu","_createCommentVNode","InkIcon_default","InkColorMenu_default","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","InkHighlightMenu_vue_vue_type_script_setup_true_lang_default","useTool","registered","useRegisteredTool","useToolOptionsWhile","doc","useDocument","open","ref","model","computed","highlightMenuModel","options","MARKUP_KINDS","active","tool","fallback","icon","MARKUP_ICONS","focusFirst","onTriggerKeydown","onOpenAutoFocus","menu","menuItems","focusInitialMenuItem","choose","setOptions","setTool","mainAttrs","triggerAttrs","menuAttrs","colourAttrs","innerAttrs","handleMenuKeys","unref","openBlock","createBlock","PopoverRoot","_cache","$event","withCtx","createVNode","PopoverAnchor","createElementVNode","mergeProps","_ctx","ToolbarButton","renderSlot","PopoverTrigger","ChevronDown","PopoverPortal","PopoverContent","normalizeProps","guardReactiveProps","createElementBlock","Fragment","renderList","item","createTextVNode","toDisplayString","createCommentVNode"],"sources":["../../src/components/InkHighlightMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * A split button for the highlight tool. The main part activates the tool with the current\n * markup kind and draws that kind's icon; the chevron opens a menu of the four kinds plus\n * the markup colour. Choosing a kind switches to the tool with it. The colour is a nested\n * `InkColorMenu` scoped to the `markup` style group, so it works whatever tool is active.\n */\nimport {\n focusInitialMenuItem,\n handleMenuKeys,\n highlightMenuModel,\n MARKUP_ICONS,\n MARKUP_KINDS,\n menuItems,\n type HighlightOptions,\n type MarkupKind,\n} from '@inkbar/core/dom'\nimport { ChevronDown } from '@inkbar/icons'\nimport {\n PopoverAnchor,\n PopoverContent,\n PopoverPortal,\n PopoverRoot,\n PopoverTrigger,\n ToolbarButton,\n} from 'reka-ui'\nimport { computed, ref } from 'vue'\n\nimport { useDocument } from '../composables/useDocument'\nimport { useRegisteredTool } from '../composables/useRegisteredTool'\nimport { useTool } from '../composables/useTool'\nimport { useToolOptionsWhile } from '../composables/useToolOptions'\n\nimport InkColorMenu from './InkColorMenu.vue'\nimport InkIcon from './InkIcon.vue'\n\ndefineOptions({ inheritAttrs: false })\nconst { tool, setTool } = useTool()\n// Nothing renders while no `highlight` tool is registered.\nconst registered = useRegisteredTool('highlight')\nconst { options, setOptions } = useToolOptionsWhile<HighlightOptions>(\n 'highlight',\n registered\n)\nconst { document: doc } = useDocument()\nconst open = ref(false)\n\nconst model = computed(() => highlightMenuModel(options.value, MARKUP_KINDS))\nconst active = computed(() => tool.value === 'highlight')\n/** The colour the chosen kind gets while the markup style leaves it unset. */\nconst fallback = computed(() => doc.value?.annotations.defaults.color(model.value.kind))\nconst icon = computed(() => MARKUP_ICONS[model.value.kind])\n\n/** ArrowDown opens on the first item; a click opens on the checked one. */\nlet focusFirst = false\nfunction onTriggerKeydown(e: KeyboardEvent): void {\n if (e.key !== 'ArrowDown' || e.defaultPrevented || open.value) return\n e.preventDefault()\n focusFirst = true\n open.value = true\n}\n\nfunction onOpenAutoFocus(e: Event): void {\n e.preventDefault()\n // One highlight menu is open at a time.\n const menu = document.querySelector('[data-ink-menu=\"highlight\"] [role=\"menu\"]')\n if (menu) {\n if (focusFirst) menuItems(menu)[0]?.focus({ preventScroll: true })\n else focusInitialMenuItem(menu)\n }\n focusFirst = false\n}\n\nfunction choose(kind: MarkupKind): void {\n setOptions({ kind })\n setTool('highlight')\n open.value = false\n}\n\n// Reka's typed props stop at its own; ARIA and listeners go through bound objects.\nconst mainAttrs = computed(() => ({\n 'aria-pressed': String(active.value),\n 'aria-label': model.value.label,\n title: model.value.label,\n onClick: () => setTool('highlight'),\n}))\nconst triggerAttrs = {\n 'aria-label': 'Choose highlight',\n title: 'Choose highlight',\n 'aria-haspopup': 'menu' as const,\n onKeydown: onTriggerKeydown,\n}\nconst menuAttrs = { 'aria-label': 'Highlights' }\n/** The colour trigger is an item of this menu, reached with the arrow keys. */\nconst colourAttrs = { role: 'menuitem', tabindex: -1 }\nconst innerAttrs = {\n role: 'menu',\n 'aria-label': 'Highlights',\n // Capture, so the arrow keys move on from the colour item before its own ArrowDown\n // opens the nested menu.\n onKeydownCapture: (e: KeyboardEvent) =>\n handleMenuKeys(e, e.currentTarget as HTMLElement),\n}\n</script>\n\n<template>\n <PopoverRoot v-if=\"registered\" v-model:open=\"open\">\n <PopoverAnchor as-child>\n <div\n role=\"group\"\n aria-label=\"Highlight\"\n class=\"ink-split-button ink-highlight-menu\"\n data-ink-highlight-menu\n v-bind=\"$attrs\"\n >\n <ToolbarButton\n class=\"ink-tool-button ink-highlight-button\"\n data-ink-tool-button\n data-ink-highlight-button\n data-tool=\"highlight\"\n :data-kind=\"model.kind\"\n :data-state=\"active ? 'on' : 'off'\"\n v-bind=\"mainAttrs\"\n >\n <slot :active=\"active\" :kind=\"model.kind\"><InkIcon :icon=\"icon\" /></slot>\n </ToolbarButton>\n <ToolbarButton as-child>\n <PopoverTrigger as-child>\n <button\n type=\"button\"\n class=\"ink-menu-trigger ink-highlight-menu-trigger\"\n data-ink-highlight-menu-trigger\n :data-state=\"open ? 'open' : 'closed'\"\n v-bind=\"triggerAttrs\"\n >\n <InkIcon :icon=\"ChevronDown\" />\n </button>\n </PopoverTrigger>\n </ToolbarButton>\n <PopoverPortal>\n <PopoverContent\n class=\"ink-select-content ink-menu-content\"\n data-ink-select-content\n data-ink-menu=\"highlight\"\n side=\"bottom\"\n align=\"start\"\n :side-offset=\"4\"\n :collision-padding=\"8\"\n v-bind=\"menuAttrs\"\n @open-auto-focus=\"onOpenAutoFocus\"\n >\n <div v-bind=\"innerAttrs\">\n <div role=\"group\" aria-label=\"Kinds\" class=\"ink-highlight-kinds\">\n <button\n v-for=\"item in model.items\"\n :key=\"item.kind\"\n type=\"button\"\n role=\"menuitemradio\"\n class=\"ink-select-item ink-menu-item ink-highlight-item\"\n data-ink-select-item\n tabindex=\"-1\"\n :data-key=\"item.kind\"\n :aria-checked=\"item.checked\"\n :data-state=\"item.checked ? 'checked' : 'unchecked'\"\n @click=\"choose(item.kind)\"\n >\n <InkIcon :icon=\"MARKUP_ICONS[item.kind]\" :size=\"16\" />\n {{ item.label }}\n </button>\n </div>\n <div role=\"separator\" class=\"ink-select-separator\" />\n <div role=\"group\" aria-label=\"Colour\" class=\"ink-highlight-colour\">\n <span class=\"ink-highlight-colour-label\" aria-hidden=\"true\">Colour</span>\n <InkColorMenu\n property=\"border\"\n group=\"markup\"\n label=\"Highlight colour\"\n standalone\n :fallback=\"fallback\"\n v-bind=\"colourAttrs\"\n />\n </div>\n </div>\n </PopoverContent>\n </PopoverPortal>\n </div>\n </PopoverAnchor>\n </PopoverRoot>\n</template>\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPanel.js","names":["_sfc_main","InkPanel_vue_vue_type_script_setup_true_lang_default","InkPanel_default"],"sources":["../../src/components/InkPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * One panel of an `InkSidebar`, holding your content in its default slot. `id` names it in\n * `v-model:open`, `label` names its trigger, `icon` (an `@inkbar/icons` node) shows on the rail,\n * and `badge` (a count or short text) shows beside it, hidden when empty or 0. Closed, the panel\n * stays mounted and hidden. In a stack it renders its own header above its content.\n */\nimport { computed, onBeforeUnmount, onMounted, useTemplateRef } from 'vue'\n\nimport { injectSidebarContext } from './sidebar-context'\nimport SidebarTrigger from './SidebarTrigger.vue'\n\nimport type { SidebarPanelInfo } from '@inkbar/core/dom'\nimport type { IconNode } from '@inkbar/icons'\n\nconst props = defineProps<{\n id: string\n label: string\n icon?: IconNode | undefined\n badge?: string | number | undefined\n}>()\n\nconst ctx = injectSidebarContext()\nconst wrapper = useTemplateRef<HTMLElement>('wrapper')\n\nconst info = (): SidebarPanelInfo => ({\n id: props.id,\n label: props.label,\n ...(props.icon !== undefined && { icon: props.icon }),\n ...(props.badge !== undefined && { badge: props.badge }),\n})\n// Registered now, so the server renders this panel's attributes; ordered once in the DOM.\nconst unregister = ctx.register({ info, element: () => wrapper.value })\nonMounted(() => ctx.arrange())\nonBeforeUnmount(unregister)\n\nconst view = computed(() => {\n const s = ctx.state.value\n return {\n stack: s.layout === 'stack',\n trigger: ctx.controller.triggerAttrs(props.id),\n panel: ctx.controller.panelAttrs(props.id),\n }\n})\n</script>\n\n<template>\n <!-- A section in a stack; in rail and tabs the theme leaves the layout to the panel. Kept in\n every layout, so the content is never remounted. -->\n <div ref=\"wrapper\" :class=\"['ink-sidebar-slot', { 'ink-sidebar-section': view.stack }]\">\n <button v-if=\"view.stack\" class=\"ink-sidebar-header\" v-bind=\"view.trigger\">\n <SidebarTrigger :panel=\"info()\" :rail=\"false\" />\n </button>\n <div class=\"ink-sidebar-panel\" v-bind=\"view.panel\">\n <!-- The rail button names the panel for assistive technology; this repeats it on screen. -->\n <div class=\"ink-sidebar-panel-title\" aria-hidden=\"true\">{{ label }}</div>\n <div class=\"ink-sidebar-panel-body\"><slot /></div>\n </div>\n </div>\n</template>\n"],"mappings":""}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import { IconNode } from '@inkbar/icons';
|
|
2
|
+
type __VLS_Props = {
|
|
3
|
+
id: string;
|
|
4
|
+
label: string;
|
|
5
|
+
icon?: IconNode | undefined;
|
|
6
|
+
badge?: string | number | undefined;
|
|
7
|
+
};
|
|
8
|
+
declare var __VLS_6: {};
|
|
9
|
+
type __VLS_Slots = {} & {
|
|
10
|
+
default?: (props: typeof __VLS_6) => any;
|
|
11
|
+
};
|
|
12
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
13
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
14
|
+
declare const _default: typeof __VLS_export;
|
|
15
|
+
export default _default;
|
|
16
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
17
|
+
new (): {
|
|
18
|
+
$slots: S;
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
//# sourceMappingURL=InkPanel.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPanel.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkPanel.vue"],"names":[],"mappings":"AA0EA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAG7C,KAAK,WAAW,GAAG;IACjB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAC3B,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;CACpC,CAAC;AAiFF,QAAA,IAAI,OAAO,IAAW,CAAC;AACvB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAG/C,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"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { injectSidebarContext as e } from "./sidebar-context.js";
|
|
2
|
+
import t from "./SidebarTrigger.js";
|
|
3
|
+
import { computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, mergeProps as c, normalizeClass as l, onBeforeUnmount as u, onMounted as d, openBlock as f, renderSlot as p, toDisplayString as m, useTemplateRef as h } from "vue";
|
|
4
|
+
//#region src/components/InkPanel.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
+
var g = {
|
|
6
|
+
class: "ink-sidebar-panel-title",
|
|
7
|
+
"aria-hidden": "true"
|
|
8
|
+
}, _ = { class: "ink-sidebar-panel-body" }, v = /*@__PURE__*/ s({
|
|
9
|
+
__name: "InkPanel",
|
|
10
|
+
props: {
|
|
11
|
+
id: {},
|
|
12
|
+
label: {},
|
|
13
|
+
icon: {},
|
|
14
|
+
badge: {}
|
|
15
|
+
},
|
|
16
|
+
setup(s) {
|
|
17
|
+
let v = s, y = e(), b = h("wrapper"), x = () => ({
|
|
18
|
+
id: v.id,
|
|
19
|
+
label: v.label,
|
|
20
|
+
...v.icon !== void 0 && { icon: v.icon },
|
|
21
|
+
...v.badge !== void 0 && { badge: v.badge }
|
|
22
|
+
}), S = y.register({
|
|
23
|
+
info: x,
|
|
24
|
+
element: () => b.value
|
|
25
|
+
});
|
|
26
|
+
d(() => y.arrange()), u(S);
|
|
27
|
+
let C = n(() => ({
|
|
28
|
+
stack: y.state.value.layout === "stack",
|
|
29
|
+
trigger: y.controller.triggerAttrs(v.id),
|
|
30
|
+
panel: y.controller.panelAttrs(v.id)
|
|
31
|
+
}));
|
|
32
|
+
return (e, n) => (f(), i("div", {
|
|
33
|
+
ref_key: "wrapper",
|
|
34
|
+
ref: b,
|
|
35
|
+
class: l(["ink-sidebar-slot", { "ink-sidebar-section": C.value.stack }])
|
|
36
|
+
}, [C.value.stack ? (f(), i("button", c({
|
|
37
|
+
key: 0,
|
|
38
|
+
class: "ink-sidebar-header"
|
|
39
|
+
}, C.value.trigger), [o(t, {
|
|
40
|
+
panel: x(),
|
|
41
|
+
rail: !1
|
|
42
|
+
}, null, 8, ["panel"])], 16)) : r("", !0), a("div", c({ class: "ink-sidebar-panel" }, C.value.panel), [a("div", g, m(s.label), 1), a("div", _, [p(e.$slots, "default")])], 16)], 2));
|
|
43
|
+
}
|
|
44
|
+
});
|
|
45
|
+
//#endregion
|
|
46
|
+
export { v as default };
|
|
47
|
+
|
|
48
|
+
//# sourceMappingURL=InkPanel.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPanel.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createElementBlock","_normalizeClass","_mergeProps","_createVNode","SidebarTrigger","_createCommentVNode","_createElementVNode","_toDisplayString","_renderSlot","SidebarTrigger_default","_hoisted_1","_hoisted_2","InkPanel_vue_vue_type_script_setup_true_lang_default","props","__props","ctx","injectSidebarContext","wrapper","useTemplateRef","info","unregister","onMounted","onBeforeUnmount","view","computed","openBlock","createElementBlock","normalizeClass","mergeProps","createVNode","createCommentVNode","createElementVNode","toDisplayString","renderSlot","_ctx"],"sources":["../../src/components/InkPanel.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * One panel of an `InkSidebar`, holding your content in its default slot. `id` names it in\n * `v-model:open`, `label` names its trigger, `icon` (an `@inkbar/icons` node) shows on the rail,\n * and `badge` (a count or short text) shows beside it, hidden when empty or 0. Closed, the panel\n * stays mounted and hidden. In a stack it renders its own header above its content.\n */\nimport { computed, onBeforeUnmount, onMounted, useTemplateRef } from 'vue'\n\nimport { injectSidebarContext } from './sidebar-context'\nimport SidebarTrigger from './SidebarTrigger.vue'\n\nimport type { SidebarPanelInfo } from '@inkbar/core/dom'\nimport type { IconNode } from '@inkbar/icons'\n\nconst props = defineProps<{\n id: string\n label: string\n icon?: IconNode | undefined\n badge?: string | number | undefined\n}>()\n\nconst ctx = injectSidebarContext()\nconst wrapper = useTemplateRef<HTMLElement>('wrapper')\n\nconst info = (): SidebarPanelInfo => ({\n id: props.id,\n label: props.label,\n ...(props.icon !== undefined && { icon: props.icon }),\n ...(props.badge !== undefined && { badge: props.badge }),\n})\n// Registered now, so the server renders this panel's attributes; ordered once in the DOM.\nconst unregister = ctx.register({ info, element: () => wrapper.value })\nonMounted(() => ctx.arrange())\nonBeforeUnmount(unregister)\n\nconst view = computed(() => {\n const s = ctx.state.value\n return {\n stack: s.layout === 'stack',\n trigger: ctx.controller.triggerAttrs(props.id),\n panel: ctx.controller.panelAttrs(props.id),\n }\n})\n</script>\n\n<template>\n <!-- A section in a stack; in rail and tabs the theme leaves the layout to the panel. Kept in\n every layout, so the content is never remounted. -->\n <div ref=\"wrapper\" :class=\"['ink-sidebar-slot', { 'ink-sidebar-section': view.stack }]\">\n <button v-if=\"view.stack\" class=\"ink-sidebar-header\" v-bind=\"view.trigger\">\n <SidebarTrigger :panel=\"info()\" :rail=\"false\" />\n </button>\n <div class=\"ink-sidebar-panel\" v-bind=\"view.panel\">\n <!-- The rail button names the panel for assistive technology; this repeats it on screen. -->\n <div class=\"ink-sidebar-panel-title\" aria-hidden=\"true\">{{ label }}</div>\n <div class=\"ink-sidebar-panel-body\"><slot /></div>\n </div>\n </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAeA,IAAMc,IAAQC,GAORC,IAAMC,EAAqB,GAC3BC,IAAUC,EAA4B,SAAS,GAE/CC,WAAgC;GACpC,IAAIN,EAAM;GACV,OAAOA,EAAM;GACb,GAAIA,EAAM,SAAS,KAAA,KAAa,EAAE,MAAMA,EAAM,KAAK;GACnD,GAAIA,EAAM,UAAU,KAAA,KAAa,EAAE,OAAOA,EAAM,MAAM;EACxD,IAEMO,IAAaL,EAAI,SAAS;GAAE;GAAM,eAAeE,EAAQ;EAAM,CAAC;EAEtE,AADAI,QAAgBN,EAAI,QAAQ,CAAC,GAC7BO,EAAgBF,CAAU;EAE1B,IAAMG,IAAOC,SAEJ;GACL,OAFQT,EAAI,MAAM,MAET,WAAW;GACpB,SAASA,EAAI,WAAW,aAAaF,EAAM,EAAE;GAC7C,OAAOE,EAAI,WAAW,WAAWF,EAAM,EAAE;EAC3C,EACD;oBAMCd,EAAA,GAAAC,EASM,OAAA;GATG,SAAA;GAAJ,KAAIiB;GAAW,OAAKhB,EAAA,CAAA,oBAAA,EAAA,uBAAgDsB,EAAA,MAAK,MAAK,CAAA,CAAA;EACnE,GAAA,CAAAA,EAAA,MAAK,SAAnBxB,EAAA,GAAAC,EAES,UAFTE,EAES;;GAFiB,OAAM;EAA6B,GAAAqB,EAAA,MAAK,OAAO,GAAA,CACvEpB,EAAgDC,GAAA;GAA/B,OAAOe,EAAI;GAAK,MAAM;EAEzCb,GAAAA,MAAAA,GAAAA,CAAAA,OAAAA,CAAAA,CAAAA,GAAAA,EAAAA,KAAAA,EAAAA,IAAAA,EAAAA,GAAAA,EAIM,OAJNJ,EAIM,EAJD,OAAM,oBAAmB,GAASqB,EAAA,MAAK,KAAK,GAAA,CAE/CjB,EAAyE,OAAzEI,GAAyEH,EAAdO,EAAA,KAAK,GAAA,CAAA,GAChER,EAAkD,OAAlDK,GAAkD,CAAdH,EAAQ0B,EAAA,QAAA,SAAA,CAAA,CAAA,CAAA,GAAA,EAAA,CAAA,GAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPrintButton.js","names":["_sfc_main","InkPrintButton_vue_vue_type_script_setup_true_lang_default","InkPrintButton_default"],"sources":["../../src/components/InkPrintButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Prints the open document's file with the browser's own PDF viewer (on iOS, in a new\n * tab). Disabled until the document is ready. Today that is the file as it was\n * opened, without this session's annotations.\n */\nimport { printDocument } from '@inkbar/core/dom'\nimport { Printer } from '@inkbar/icons'\nimport { ToolbarButton } from 'reka-ui'\nimport { computed } from 'vue'\n\nimport { useInkContext } from '../context'\n\nimport InkIcon from './InkIcon.vue'\n\nwithDefaults(defineProps<{ asChild?: boolean }>(), {\n asChild: false,\n})\nconst ctx = useInkContext('InkPrintButton')\nconst ready = computed(\n () => ctx.document.value !== null && ctx.status.value.state === 'ready'\n)\n\nfunction run(): void {\n const doc = ctx.document.value\n if (doc) void printDocument(doc).catch(() => undefined)\n}\n// Reka's typed props stop at its own; ARIA and listeners go through a bound object.\nconst attrs = { 'aria-label': 'Print', title: 'Print', onClick: run }\n</script>\n\n<template>\n <ToolbarButton\n :as-child=\"asChild\"\n :disabled=\"!ready\"\n class=\"ink-print\"\n data-ink-print\n v-bind=\"attrs\"\n >\n <slot><InkIcon :icon=\"Printer\" /></slot>\n </ToolbarButton>\n</template>\n"],"mappings":""}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
asChild?: boolean;
|
|
3
|
+
};
|
|
4
|
+
declare var __VLS_7: {};
|
|
5
|
+
type __VLS_Slots = {} & {
|
|
6
|
+
default?: (props: typeof __VLS_7) => any;
|
|
7
|
+
};
|
|
8
|
+
declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
|
|
9
|
+
asChild: boolean;
|
|
10
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
|
|
11
|
+
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
12
|
+
declare const _default: typeof __VLS_export;
|
|
13
|
+
export default _default;
|
|
14
|
+
type __VLS_WithSlots<T, S> = T & {
|
|
15
|
+
new (): {
|
|
16
|
+
$slots: S;
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=InkPrintButton.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPrintButton.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkPrintButton.vue"],"names":[],"mappings":"AA2DA,KAAK,WAAW,GAAG;IAAE,OAAO,CAAC,EAAE,OAAO,CAAA;CAAE,CAAC;AAiEzC,QAAA,IAAI,OAAO,IAAW,CAAC;AACvB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAG/C,QAAA,MAAM,UAAU;;6EAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { useInkContext as e } from "../context.js";
|
|
2
|
+
import t from "./InkIcon.js";
|
|
3
|
+
import { computed as n, createBlock as r, createVNode as i, defineComponent as a, mergeProps as o, openBlock as s, renderSlot as c, unref as l, withCtx as u } from "vue";
|
|
4
|
+
import { printDocument as d } from "@inkbar/core/dom";
|
|
5
|
+
import { ToolbarButton as f } from "reka-ui";
|
|
6
|
+
import { Printer as p } from "@inkbar/icons";
|
|
7
|
+
//#region src/components/InkPrintButton.vue?vue&type=script&setup=true&lang.ts
|
|
8
|
+
var m = /*@__PURE__*/ a({
|
|
9
|
+
__name: "InkPrintButton",
|
|
10
|
+
props: { asChild: {
|
|
11
|
+
type: Boolean,
|
|
12
|
+
default: !1
|
|
13
|
+
} },
|
|
14
|
+
setup(a) {
|
|
15
|
+
let m = e("InkPrintButton"), h = n(() => m.document.value !== null && m.status.value.state === "ready");
|
|
16
|
+
function g() {
|
|
17
|
+
let e = m.document.value;
|
|
18
|
+
e && d(e).catch(() => void 0);
|
|
19
|
+
}
|
|
20
|
+
let _ = {
|
|
21
|
+
"aria-label": "Print",
|
|
22
|
+
title: "Print",
|
|
23
|
+
onClick: g
|
|
24
|
+
};
|
|
25
|
+
return (e, n) => (s(), r(l(f), o({
|
|
26
|
+
"as-child": a.asChild,
|
|
27
|
+
disabled: !h.value,
|
|
28
|
+
class: "ink-print",
|
|
29
|
+
"data-ink-print": ""
|
|
30
|
+
}, _), {
|
|
31
|
+
default: u(() => [c(e.$slots, "default", {}, () => [i(t, { icon: l(p) }, null, 8, ["icon"])])]),
|
|
32
|
+
_: 3
|
|
33
|
+
}, 16, ["as-child", "disabled"]));
|
|
34
|
+
}
|
|
35
|
+
});
|
|
36
|
+
//#endregion
|
|
37
|
+
export { m as default };
|
|
38
|
+
|
|
39
|
+
//# sourceMappingURL=InkPrintButton.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkPrintButton.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_mergeProps","_withCtx","_renderSlot","_createVNode","InkIcon","InkIcon_default","InkPrintButton_vue_vue_type_script_setup_true_lang_default","ctx","useInkContext","ready","computed","run","doc","printDocument","attrs","openBlock","createBlock","unref","ToolbarButton","mergeProps","__props","withCtx","renderSlot","_ctx","createVNode","Printer"],"sources":["../../src/components/InkPrintButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/*\n * Prints the open document's file with the browser's own PDF viewer (on iOS, in a new\n * tab). Disabled until the document is ready. Today that is the file as it was\n * opened, without this session's annotations.\n */\nimport { printDocument } from '@inkbar/core/dom'\nimport { Printer } from '@inkbar/icons'\nimport { ToolbarButton } from 'reka-ui'\nimport { computed } from 'vue'\n\nimport { useInkContext } from '../context'\n\nimport InkIcon from './InkIcon.vue'\n\nwithDefaults(defineProps<{ asChild?: boolean }>(), {\n asChild: false,\n})\nconst ctx = useInkContext('InkPrintButton')\nconst ready = computed(\n () => ctx.document.value !== null && ctx.status.value.state === 'ready'\n)\n\nfunction run(): void {\n const doc = ctx.document.value\n if (doc) void printDocument(doc).catch(() => undefined)\n}\n// Reka's typed props stop at its own; ARIA and listeners go through a bound object.\nconst attrs = { 'aria-label': 'Print', title: 'Print', onClick: run }\n</script>\n\n<template>\n <ToolbarButton\n :as-child=\"asChild\"\n :disabled=\"!ready\"\n class=\"ink-print\"\n data-ink-print\n v-bind=\"attrs\"\n >\n <slot><InkIcon :icon=\"Printer\" /></slot>\n </ToolbarButton>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAkBA,IAAMU,IAAMC,EAAc,gBAAgB,GACpCC,IAAQC,QACNH,EAAI,SAAS,UAAU,QAAQA,EAAI,OAAO,MAAM,UAAU,OAClE;EAEA,SAASI,IAAY;GACnB,IAAMC,IAAML,EAAI,SAAS;GACzB,AAAIK,KAAKC,EAAmBD,CAAG,CAAC,CAAC,YAAY,KAAA,CAAS;EACxD;EAEA,IAAME,IAAQ;GAAE,cAAc;GAAS,OAAO;GAAS,SAASH;EAAI;oBAIlEd,EAAA,GAAAC,EAQgBC,EAAAmB,CAAA,GARhBlB,EAQgB;GAPb,YAAUoB,EAAA;GACV,UAAQ,CAAGX,EAAA;GACZ,OAAM;GACN,kBAAA;EACQ,GAAAK,CAAK,GAAA;GAEb,SAAAb,QAAwC,CAAxCC,EAAwCqB,EAAA,QAAA,WAAA,CAAA,SAAA,CAAlCpB,EAA2BC,GAAA,EAAjB,MAAML,EAAA0B,CAAA,EAAO,GAAA,MAAA,GAAA,CAAA,MAAA,CAAA,CAAA,CAAA,CAAA,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkRecordList.js","names":["_sfc_main","InkRecordList_vue_vue_type_script_setup_true_lang_default","InkRecordList_default"],"sources":["../../src/components/InkRecordList.vue"],"sourcesContent":["<script\n setup\n lang=\"ts\"\n generic=\"T extends RecordBase & { page: number } = RecordBase & { page: number }\"\n>\n/*\n * The records a plugin keeps under `records` (`<plugin>.<name>`) as a list of cards, the same\n * cards their marks open, with the same actions: `createRecordList` on core's record list\n * controller. The list, the marks and `useRecordSelection` share one selection. `card`, `where`\n * and `sort` replace the marks' card, filter and reading order; changing one rebuilds the list,\n * so pass functions defined once rather than inline. `update:count` gives the number listed\n * whenever it changes; the `empty` slot replaces \"Nothing here yet.\". It fills its parent's\n * height. Inside `InkRoot`; it renders empty on the server.\n *\n * In place of `records`, `source` takes a host's own `RecordListSource` and lists it with the\n * same controller and cards; `card`, `where` and `sort` do not apply to it. Give one of the two:\n * with both, `source` wins and a development build warns.\n */\nimport {\n recordsSource,\n type CardSpec,\n type RecordListSource,\n type RecordsSourceOptions,\n} from '@inkbar/core/dom'\nimport { computed, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\nimport { toReadable } from '../to-readable'\n\nimport RecordCards from './RecordCards.vue'\n\nimport type { RecordBase } from '@inkbar/core'\n\nconst props = defineProps<{\n records?: string | undefined\n source?: RecordListSource | undefined\n card?: ((record: T) => CardSpec) | undefined\n where?: ((record: T) => boolean) | undefined\n sort?: ((a: T, b: T) => number) | undefined\n}>()\n\ndefineEmits<{ 'update:count': [count: number] }>()\n\ndefineSlots<{ empty?(): unknown }>()\n\nconst ctx = injectInkContext()\nconst viewport = toReadable(() => ctx.viewport.value)\n\nif (import.meta.env.DEV)\n watch(\n () => props.records !== undefined && props.source !== undefined,\n (both) => {\n if (both)\n console.warn(\n '[inkbar] InkRecordList takes `records` or `source`, not both: it lists `source`.'\n )\n },\n { immediate: true }\n )\n\nconst source = computed((): RecordListSource | null => {\n if (props.source) return props.source\n const pluginHost = ctx.pluginHost.value\n if (!pluginHost || props.records === undefined) return null\n const opts: RecordsSourceOptions<T> = {}\n if (props.card) opts.card = props.card\n if (props.where) opts.where = props.where\n if (props.sort) opts.sort = props.sort\n return recordsSource<T>({ pluginHost, viewport }, props.records, opts)\n})\n</script>\n\n<template>\n <RecordCards :source=\"source\" @update:count=\"$emit('update:count', $event)\">\n <template v-if=\"$slots.empty\" #empty><slot name=\"empty\" /></template>\n </RecordCards>\n</template>\n"],"mappings":""}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { CardSpec, RecordListSource } from '@inkbar/core/dom';
|
|
2
|
+
import { RecordBase } from '@inkbar/core';
|
|
3
|
+
declare const __VLS_export: <T extends RecordBase & {
|
|
4
|
+
page: number;
|
|
5
|
+
} = RecordBase & {
|
|
6
|
+
page: number;
|
|
7
|
+
}>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
|
|
8
|
+
props: import('vue').PublicProps & __VLS_PrettifyLocal<{
|
|
9
|
+
records?: string | undefined;
|
|
10
|
+
source?: RecordListSource | undefined;
|
|
11
|
+
card?: ((record: T) => CardSpec) | undefined;
|
|
12
|
+
where?: ((record: T) => boolean) | undefined;
|
|
13
|
+
sort?: ((a: T, b: T) => number) | undefined;
|
|
14
|
+
} & {
|
|
15
|
+
"onUpdate:count"?: (count: number) => any;
|
|
16
|
+
}> & (typeof globalThis extends {
|
|
17
|
+
__VLS_PROPS_FALLBACK: infer P;
|
|
18
|
+
} ? P : {});
|
|
19
|
+
expose: (exposed: {}) => void;
|
|
20
|
+
attrs: any;
|
|
21
|
+
slots: {
|
|
22
|
+
empty?(): unknown;
|
|
23
|
+
};
|
|
24
|
+
emit: (evt: "update:count", count: number) => void;
|
|
25
|
+
}>) => import('vue').VNode & {
|
|
26
|
+
__ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
|
|
27
|
+
};
|
|
28
|
+
declare const _default: typeof __VLS_export;
|
|
29
|
+
export default _default;
|
|
30
|
+
type __VLS_PrettifyLocal<T> = (T extends any ? {
|
|
31
|
+
[K in keyof T]: T[K];
|
|
32
|
+
} : {
|
|
33
|
+
[K in keyof T as K]: T[K];
|
|
34
|
+
}) & {};
|
|
35
|
+
//# sourceMappingURL=InkRecordList.vue.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkRecordList.vue.d.ts","sourceRoot":"","sources":["../../src/components/InkRecordList.vue"],"names":[],"mappings":"AA4FA,OAAO,EAEL,KAAK,QAAQ,EACb,KAAK,gBAAgB,EAEtB,MAAM,kBAAkB,CAAA;AAQzB,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAG9C,QAAA,MAAM,YAAY,GAAK,CAAC,SAAS,UAAU,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,GAAG,UAAU,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,EAC7F,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,gBAAgB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EAClE;WAkGO,OAAO,KAAK,EAAE,WAAW,GAAG,mBAAmB,CAAC;kBAhG5C,MAAM,GAAG,SAAS;iBACnB,gBAAgB,GAAG,SAAS;eAC9B,CAAC,CAAC,MAAM,EAAE,CAAC,KAAK,QAAQ,CAAC,GAAG,SAAS;gBACpC,CAAC,CAAC,MAAM,EAAE,CAAC,KAAK,OAAO,CAAC,GAAG,SAAS;eACrC,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,KAAK,MAAM,CAAC,GAAG,SAAS;;;KA4F8C,CAAC,GAAG,CAAC,OAAO,UAAU,SAAS;QAAE,oBAAoB,EAAE,MAAM,CAAC,CAAA;KAAE,GAAG,CAAC,GAAG,EAAE,CAAC;YAC5J,CAAC,OAAO,EAAE,EAAE,KAAK,IAAI;WACtB,GAAG;;kBAvFoB,OAAO;;;EA2FlC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAA;CAAI,CAAC;wBACpE,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG;KAAG,CAAC,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,CAAC,GAAG,EAAE,CAAC"}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { injectInkContext as e } from "../context.js";
|
|
2
|
+
import { toReadable as t } from "../to-readable.js";
|
|
3
|
+
import n from "./RecordCards.js";
|
|
4
|
+
import { computed as r, createBlock as i, createSlots as a, defineComponent as o, openBlock as s, renderSlot as c, withCtx as l } from "vue";
|
|
5
|
+
import { recordsSource as u } from "@inkbar/core/dom";
|
|
6
|
+
//#region src/components/InkRecordList.vue?vue&type=script&setup=true&lang.ts
|
|
7
|
+
var d = /*@__PURE__*/ o({
|
|
8
|
+
__name: "InkRecordList",
|
|
9
|
+
props: {
|
|
10
|
+
records: {},
|
|
11
|
+
source: {},
|
|
12
|
+
card: { type: Function },
|
|
13
|
+
where: { type: Function },
|
|
14
|
+
sort: { type: Function }
|
|
15
|
+
},
|
|
16
|
+
emits: ["update:count"],
|
|
17
|
+
setup(o) {
|
|
18
|
+
let d = o, f = e(), p = t(() => f.viewport.value), m = r(() => {
|
|
19
|
+
if (d.source) return d.source;
|
|
20
|
+
let e = f.pluginHost.value;
|
|
21
|
+
if (!e || d.records === void 0) return null;
|
|
22
|
+
let t = {};
|
|
23
|
+
return d.card && (t.card = d.card), d.where && (t.where = d.where), d.sort && (t.sort = d.sort), u({
|
|
24
|
+
pluginHost: e,
|
|
25
|
+
viewport: p
|
|
26
|
+
}, d.records, t);
|
|
27
|
+
});
|
|
28
|
+
return (e, t) => (s(), i(n, {
|
|
29
|
+
source: m.value,
|
|
30
|
+
"onUpdate:count": t[0] ||= (t) => e.$emit("update:count", t)
|
|
31
|
+
}, a({ _: 2 }, [e.$slots.empty ? {
|
|
32
|
+
name: "empty",
|
|
33
|
+
fn: l(() => [c(e.$slots, "empty")]),
|
|
34
|
+
key: "0"
|
|
35
|
+
} : void 0]), 1032, ["source"]));
|
|
36
|
+
}
|
|
37
|
+
});
|
|
38
|
+
//#endregion
|
|
39
|
+
export { d as default };
|
|
40
|
+
|
|
41
|
+
//# sourceMappingURL=InkRecordList.vue_vue_type_script_setup_true_lang.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InkRecordList.vue_vue_type_script_setup_true_lang.js","names":["$emit","$slots","_openBlock","_createBlock","RecordCards","_createSlots","_withCtx","_renderSlot","RecordCards_default","InkRecordList_vue_vue_type_script_setup_true_lang_default","props","__props","ctx","injectInkContext","viewport","toReadable","source","computed","pluginHost","opts","recordsSource","openBlock","createBlock","_cache","_ctx","$event","createSlots","withCtx","renderSlot"],"sources":["../../src/components/InkRecordList.vue"],"sourcesContent":["<script\n setup\n lang=\"ts\"\n generic=\"T extends RecordBase & { page: number } = RecordBase & { page: number }\"\n>\n/*\n * The records a plugin keeps under `records` (`<plugin>.<name>`) as a list of cards, the same\n * cards their marks open, with the same actions: `createRecordList` on core's record list\n * controller. The list, the marks and `useRecordSelection` share one selection. `card`, `where`\n * and `sort` replace the marks' card, filter and reading order; changing one rebuilds the list,\n * so pass functions defined once rather than inline. `update:count` gives the number listed\n * whenever it changes; the `empty` slot replaces \"Nothing here yet.\". It fills its parent's\n * height. Inside `InkRoot`; it renders empty on the server.\n *\n * In place of `records`, `source` takes a host's own `RecordListSource` and lists it with the\n * same controller and cards; `card`, `where` and `sort` do not apply to it. Give one of the two:\n * with both, `source` wins and a development build warns.\n */\nimport {\n recordsSource,\n type CardSpec,\n type RecordListSource,\n type RecordsSourceOptions,\n} from '@inkbar/core/dom'\nimport { computed, watch } from 'vue'\n\nimport { injectInkContext } from '../context'\nimport { toReadable } from '../to-readable'\n\nimport RecordCards from './RecordCards.vue'\n\nimport type { RecordBase } from '@inkbar/core'\n\nconst props = defineProps<{\n records?: string | undefined\n source?: RecordListSource | undefined\n card?: ((record: T) => CardSpec) | undefined\n where?: ((record: T) => boolean) | undefined\n sort?: ((a: T, b: T) => number) | undefined\n}>()\n\ndefineEmits<{ 'update:count': [count: number] }>()\n\ndefineSlots<{ empty?(): unknown }>()\n\nconst ctx = injectInkContext()\nconst viewport = toReadable(() => ctx.viewport.value)\n\nif (import.meta.env.DEV)\n watch(\n () => props.records !== undefined && props.source !== undefined,\n (both) => {\n if (both)\n console.warn(\n '[inkbar] InkRecordList takes `records` or `source`, not both: it lists `source`.'\n )\n },\n { immediate: true }\n )\n\nconst source = computed((): RecordListSource | null => {\n if (props.source) return props.source\n const pluginHost = ctx.pluginHost.value\n if (!pluginHost || props.records === undefined) return null\n const opts: RecordsSourceOptions<T> = {}\n if (props.card) opts.card = props.card\n if (props.where) opts.where = props.where\n if (props.sort) opts.sort = props.sort\n return recordsSource<T>({ pluginHost, viewport }, props.records, opts)\n})\n</script>\n\n<template>\n <RecordCards :source=\"source\" @update:count=\"$emit('update:count', $event)\">\n <template v-if=\"$slots.empty\" #empty><slot name=\"empty\" /></template>\n </RecordCards>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAiCA,IAAMU,IAAQC,GAYRC,IAAMC,EAAiB,GACvBC,IAAWC,QAAiBH,EAAI,SAAS,KAAK,GAc9CI,IAASC,QAAwC;GACrD,IAAIP,EAAM,QAAQ,OAAOA,EAAM;GAC/B,IAAMQ,IAAaN,EAAI,WAAW;GAClC,IAAI,CAACM,KAAcR,EAAM,YAAY,KAAA,GAAW,OAAO;GACvD,IAAMS,IAAgC,CAAC;GAIvC,OAHIT,EAAM,SAAM,EAAK,OAAOA,EAAM,OAC9BA,EAAM,UAAO,EAAK,QAAQA,EAAM,QAChCA,EAAM,SAAM,EAAK,OAAOA,EAAM,OAC3BU,EAAiB;IAAE;IAAY;GAAS,GAAGV,EAAM,SAASS,CAAI;EACvE,CAAC;oBAICjB,EAAA,GAAAC,EAEcC,GAAA;GAFA,QAAQY,EAAA;GAAS,kBAAY,AAAAO,EAAA,QAAA,MAAEvB,EAAAA,MAAK,gBAAiByB,CAAM;EACvDxB,GAAAA,EAAAA,EAAAA,GAAAA,EAAAA,GAAAA,CAAAA,EAAAA,OAAO,QAAA;GAAQ,MAAA;GAAM,IAAAK,QAAqB,CAArBC,EAAqBiB,EAAA,QAAA,OAAA,CAAA,CAAA"}
|