vlite3 0.6.6 → 0.6.8
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/components/DataTable/DataTable.vue.js +232 -209
- package/components/DataTable/types.d.ts +15 -0
- package/components/DataTable/types.js +4 -0
- package/components/Dropdown/Dropdown.vue.js +13 -21
- package/components/Modal.vue.js +2 -2
- package/components/Modal.vue2.js +58 -56
- package/components/PermissionMatrix/PermissionEditor.vue.d.ts +0 -12
- package/components/PermissionMatrix/PermissionEditor.vue.js +120 -524
- package/components/PermissionMatrix/PermissionEditorList.vue.d.ts +18 -0
- package/components/PermissionMatrix/PermissionEditorList.vue.js +7 -0
- package/components/PermissionMatrix/PermissionEditorList.vue2.js +162 -0
- package/components/PermissionMatrix/PermissionEditorMatrix.vue.d.ts +18 -0
- package/components/PermissionMatrix/PermissionEditorMatrix.vue.js +7 -0
- package/components/PermissionMatrix/PermissionEditorMatrix.vue2.js +206 -0
- package/components/PermissionMatrix/PermissionMatrix.vue.js +1 -1
- package/components/PermissionMatrix/PermissionMatrix.vue2.js +115 -126
- package/components/PermissionMatrix/PermissionTopBar.vue.d.ts +28 -0
- package/components/PermissionMatrix/PermissionTopBar.vue.js +132 -0
- package/components/PermissionMatrix/PermissionTopBar.vue2.js +4 -0
- package/components/PermissionMatrix/utils.d.ts +11 -0
- package/components/PermissionMatrix/utils.js +20 -0
- package/components/Screen/Screen.vue.js +113 -107
- package/components/SidePanel.vue.js +57 -53
- package/index.js +179 -177
- package/package.json +1 -1
- package/style.css +1 -1
|
@@ -1,20 +1,20 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
import
|
|
5
|
-
import
|
|
1
|
+
import { defineComponent as D, ref as S, computed as _, openBlock as n, createElementBlock as c, normalizeClass as r, createVNode as B, createCommentVNode as h, createElementVNode as a, Fragment as y, renderList as v, toDisplayString as x, createBlock as f, withCtx as F } from "vue";
|
|
2
|
+
import G from "../CheckBox.vue.js";
|
|
3
|
+
import L from "../Switch.vue.js";
|
|
4
|
+
import z from "../Icon.vue.js";
|
|
5
|
+
import Q from "../Input.vue.js";
|
|
6
6
|
/* empty css */
|
|
7
|
-
import
|
|
8
|
-
const
|
|
7
|
+
import R from "../Tooltip.vue.js";
|
|
8
|
+
const T = {
|
|
9
9
|
key: 0,
|
|
10
10
|
class: "mb-4"
|
|
11
|
-
},
|
|
11
|
+
}, U = {
|
|
12
12
|
key: 1,
|
|
13
13
|
class: "text-center py-12 text-muted-foreground"
|
|
14
14
|
}, I = {
|
|
15
15
|
key: 2,
|
|
16
16
|
class: "permission-matrix-wrapper border rounded-lg overflow-auto"
|
|
17
|
-
}, J = { class: "w-full border-collapse" }, O = { class: "bg-muted" }, W = { class: "flex flex-col items-center gap-0.5" }, X = { class: "bg-secondary/60" }, Y = ["onClick"], Z = { class: "flex items-center gap-2" }, K = ["onClick"], ee = { class: "flex items-center justify-center" }, te = { class: "flex items-center gap-2 pl-6" }, le = { class: "flex items-center justify-center" },
|
|
17
|
+
}, J = { class: "w-full border-collapse" }, O = { class: "bg-muted" }, W = { class: "flex flex-col items-center gap-0.5" }, X = { class: "bg-secondary/60" }, Y = ["onClick"], Z = { class: "flex items-center gap-2" }, K = ["onClick"], ee = { class: "flex items-center justify-center pointer-events-none" }, te = { class: "flex items-center gap-2 pl-6" }, se = ["onClick"], le = { class: "flex items-center justify-center pointer-events-none" }, ue = /* @__PURE__ */ D({
|
|
18
18
|
__name: "PermissionMatrix",
|
|
19
19
|
props: {
|
|
20
20
|
roles: {},
|
|
@@ -29,183 +29,169 @@ const R = {
|
|
|
29
29
|
class: { default: "" }
|
|
30
30
|
},
|
|
31
31
|
emits: ["update:modelValue"],
|
|
32
|
-
setup(
|
|
33
|
-
const o =
|
|
34
|
-
function
|
|
32
|
+
setup(i, { emit: M }) {
|
|
33
|
+
const o = i, P = M, g = S(""), p = S(/* @__PURE__ */ new Set());
|
|
34
|
+
function N(s) {
|
|
35
35
|
if (!o.collapsible) return;
|
|
36
|
-
const
|
|
37
|
-
|
|
36
|
+
const l = new Set(p.value);
|
|
37
|
+
l.has(s) ? l.delete(s) : l.add(s), p.value = l;
|
|
38
38
|
}
|
|
39
|
-
const
|
|
40
|
-
if (!
|
|
41
|
-
const
|
|
42
|
-
return o.groups.map((
|
|
43
|
-
const
|
|
44
|
-
(
|
|
39
|
+
const $ = _(() => {
|
|
40
|
+
if (!g.value.trim()) return o.groups;
|
|
41
|
+
const s = g.value.toLowerCase();
|
|
42
|
+
return o.groups.map((l) => {
|
|
43
|
+
const e = l.permissions.filter(
|
|
44
|
+
(t) => t.label.toLowerCase().includes(s) || t.key.toLowerCase().includes(s) || l.label.toLowerCase().includes(s)
|
|
45
45
|
);
|
|
46
|
-
return
|
|
46
|
+
return e.length === 0 ? null : { ...l, permissions: e };
|
|
47
47
|
}).filter(Boolean);
|
|
48
48
|
});
|
|
49
|
-
function
|
|
50
|
-
return o.modelValue[
|
|
49
|
+
function C(s, l) {
|
|
50
|
+
return o.modelValue[s]?.includes(l) ?? !1;
|
|
51
51
|
}
|
|
52
|
-
function
|
|
53
|
-
if (o.readonly || o.roles.find((u) => u.key ===
|
|
54
|
-
const
|
|
55
|
-
|
|
56
|
-
...o.modelValue,
|
|
57
|
-
[l]: i
|
|
58
|
-
});
|
|
52
|
+
function j(s, l) {
|
|
53
|
+
if (o.readonly || o.roles.find((u) => u.key === s)?.locked) return;
|
|
54
|
+
const t = o.modelValue[s] || [], d = t.includes(l) ? t.filter((u) => u !== l) : [...t, l];
|
|
55
|
+
P("update:modelValue", { ...o.modelValue, [s]: d });
|
|
59
56
|
}
|
|
60
|
-
function
|
|
61
|
-
const
|
|
62
|
-
return e.length === 0 ? "none" : e.length ===
|
|
57
|
+
function w(s, l) {
|
|
58
|
+
const e = l.permissions.filter((t) => C(s, t.key));
|
|
59
|
+
return e.length === 0 ? "none" : e.length === l.permissions.length ? "all" : "indeterminate";
|
|
63
60
|
}
|
|
64
|
-
function
|
|
65
|
-
if (o.readonly || o.roles.find((m) => m.key ===
|
|
66
|
-
const
|
|
67
|
-
let
|
|
68
|
-
if (
|
|
69
|
-
|
|
61
|
+
function E(s, l) {
|
|
62
|
+
if (o.readonly || o.roles.find((m) => m.key === s)?.locked) return;
|
|
63
|
+
const t = w(s, l), d = l.permissions.map((m) => m.key), u = o.modelValue[s] || [];
|
|
64
|
+
let V;
|
|
65
|
+
if (t === "all")
|
|
66
|
+
V = u.filter((m) => !d.includes(m));
|
|
70
67
|
else {
|
|
71
|
-
const m =
|
|
72
|
-
|
|
68
|
+
const m = d.filter((A) => !u.includes(A));
|
|
69
|
+
V = [...u, ...m];
|
|
73
70
|
}
|
|
74
|
-
|
|
75
|
-
...o.modelValue,
|
|
76
|
-
[l]: _
|
|
77
|
-
});
|
|
71
|
+
P("update:modelValue", { ...o.modelValue, [s]: V });
|
|
78
72
|
}
|
|
79
|
-
const k =
|
|
80
|
-
function
|
|
81
|
-
return o.modelValue[
|
|
73
|
+
const k = _(() => o.size === "sm" ? "px-2 py-1" : "px-3 py-2"), b = _(() => o.size === "sm" ? "text-xs" : "text-sm");
|
|
74
|
+
function H(s) {
|
|
75
|
+
return o.modelValue[s]?.length || 0;
|
|
82
76
|
}
|
|
83
|
-
function
|
|
84
|
-
return o.groups.reduce((
|
|
77
|
+
function q() {
|
|
78
|
+
return o.groups.reduce((s, l) => s + l.permissions.length, 0);
|
|
85
79
|
}
|
|
86
|
-
return (
|
|
87
|
-
class:
|
|
80
|
+
return (s, l) => (n(), c("div", {
|
|
81
|
+
class: r(["permission-matrix", o.class])
|
|
88
82
|
}, [
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
modelValue:
|
|
92
|
-
"onUpdate:modelValue":
|
|
83
|
+
i.searchable ? (n(), c("div", T, [
|
|
84
|
+
B(Q, {
|
|
85
|
+
modelValue: g.value,
|
|
86
|
+
"onUpdate:modelValue": l[0] || (l[0] = (e) => g.value = e),
|
|
93
87
|
placeholder: "Search permissions...",
|
|
94
88
|
icon: "lucide:search",
|
|
95
|
-
size:
|
|
89
|
+
size: i.size,
|
|
96
90
|
"show-clear-button": ""
|
|
97
91
|
}, null, 8, ["modelValue", "size"])
|
|
98
92
|
])) : h("", !0),
|
|
99
|
-
|
|
100
|
-
|
|
93
|
+
$.value.length === 0 ? (n(), c("div", U, [
|
|
94
|
+
B(z, {
|
|
101
95
|
icon: "lucide:search-x",
|
|
102
96
|
class: "w-8 h-8 mx-auto mb-3 opacity-50"
|
|
103
97
|
}),
|
|
104
98
|
a("p", {
|
|
105
|
-
class:
|
|
99
|
+
class: r(b.value)
|
|
106
100
|
}, "No permissions match your search.", 2)
|
|
107
101
|
])) : (n(), c("div", I, [
|
|
108
102
|
a("table", J, [
|
|
109
103
|
a("thead", {
|
|
110
|
-
class:
|
|
104
|
+
class: r(i.stickyHeader ? "sticky top-0 z-10" : "")
|
|
111
105
|
}, [
|
|
112
106
|
a("tr", O, [
|
|
113
107
|
a("th", {
|
|
114
|
-
class:
|
|
108
|
+
class: r([
|
|
115
109
|
k.value,
|
|
116
110
|
b.value,
|
|
117
111
|
"text-left font-semibold text-foreground min-w-[220px] sm:min-w-[260px] bg-muted border-b"
|
|
118
112
|
])
|
|
119
113
|
}, " Permission ", 2),
|
|
120
|
-
(n(!0), c(y, null, v(
|
|
121
|
-
key:
|
|
122
|
-
class:
|
|
114
|
+
(n(!0), c(y, null, v(i.roles, (e) => (n(), c("th", {
|
|
115
|
+
key: e.key,
|
|
116
|
+
class: r([k.value, "text-center border-b border-l bg-muted min-w-[100px]"])
|
|
123
117
|
}, [
|
|
124
118
|
a("div", W, [
|
|
125
119
|
a("span", {
|
|
126
|
-
class:
|
|
127
|
-
}, x(
|
|
120
|
+
class: r([b.value, "font-semibold text-foreground whitespace-nowrap"])
|
|
121
|
+
}, x(e.label), 3),
|
|
128
122
|
a("span", {
|
|
129
|
-
class:
|
|
130
|
-
|
|
131
|
-
"text-muted-foreground"
|
|
132
|
-
])
|
|
133
|
-
}, x(E(t.key)) + "/" + x(H()), 3)
|
|
123
|
+
class: r([o.size === "sm" ? "text-[10px]" : "text-xs", "text-muted-foreground"])
|
|
124
|
+
}, x(H(e.key)) + "/" + x(q()), 3)
|
|
134
125
|
])
|
|
135
126
|
], 2))), 128))
|
|
136
127
|
])
|
|
137
128
|
], 2),
|
|
138
129
|
a("tbody", null, [
|
|
139
|
-
(n(!0), c(y, null, v(
|
|
140
|
-
key:
|
|
130
|
+
(n(!0), c(y, null, v($.value, (e) => (n(), c(y, {
|
|
131
|
+
key: e.key
|
|
141
132
|
}, [
|
|
142
133
|
a("tr", X, [
|
|
143
134
|
a("td", {
|
|
144
|
-
class:
|
|
145
|
-
onClick: (
|
|
135
|
+
class: r([k.value, "border-b cursor-pointer select-none"]),
|
|
136
|
+
onClick: (t) => N(e.key)
|
|
146
137
|
}, [
|
|
147
138
|
a("div", Z, [
|
|
148
|
-
|
|
139
|
+
i.collapsible ? (n(), f(z, {
|
|
149
140
|
key: 0,
|
|
150
141
|
icon: "lucide:chevron-right",
|
|
151
|
-
class:
|
|
142
|
+
class: r(["w-3.5 h-3.5 transition-transform duration-200 text-muted-foreground", { "rotate-90": !p.value.has(e.key) }])
|
|
152
143
|
}, null, 8, ["class"])) : h("", !0),
|
|
153
|
-
|
|
144
|
+
e.icon ? (n(), f(z, {
|
|
154
145
|
key: 1,
|
|
155
|
-
icon:
|
|
146
|
+
icon: e.icon,
|
|
156
147
|
class: "w-3.5 h-3.5 text-muted-foreground"
|
|
157
148
|
}, null, 8, ["icon"])) : h("", !0),
|
|
158
149
|
a("span", {
|
|
159
|
-
class:
|
|
160
|
-
}, x(
|
|
150
|
+
class: r([b.value, "font-semibold text-foreground"])
|
|
151
|
+
}, x(e.label), 3),
|
|
161
152
|
a("span", {
|
|
162
|
-
class:
|
|
163
|
-
|
|
164
|
-
"text-muted-foreground ml-1"
|
|
165
|
-
])
|
|
166
|
-
}, " (" + x(t.permissions.length) + ") ", 3)
|
|
153
|
+
class: r([o.size === "sm" ? "text-[10px]" : "text-xs", "text-muted-foreground ml-1"])
|
|
154
|
+
}, " (" + x(e.permissions.length) + ") ", 3)
|
|
167
155
|
])
|
|
168
156
|
], 10, Y),
|
|
169
|
-
(n(!0), c(y, null, v(
|
|
170
|
-
key:
|
|
171
|
-
class:
|
|
172
|
-
onClick: (
|
|
157
|
+
(n(!0), c(y, null, v(i.roles, (t) => (n(), c("td", {
|
|
158
|
+
key: t.key,
|
|
159
|
+
class: r([k.value, "text-center border-b border-l cursor-pointer"]),
|
|
160
|
+
onClick: (d) => E(t.key, e)
|
|
173
161
|
}, [
|
|
174
162
|
a("div", ee, [
|
|
175
|
-
|
|
163
|
+
i.toggleMode === "checkbox" ? (n(), f(G, {
|
|
176
164
|
key: 0,
|
|
177
|
-
"model-value":
|
|
178
|
-
indeterminate:
|
|
179
|
-
disabled:
|
|
180
|
-
size:
|
|
181
|
-
|
|
182
|
-
}, null, 8, ["model-value", "indeterminate", "disabled", "size", "onUpdate:modelValue"])) : (n(), f(M, {
|
|
165
|
+
"model-value": w(t.key, e) === "all",
|
|
166
|
+
indeterminate: w(t.key, e) === "indeterminate",
|
|
167
|
+
disabled: i.readonly || t.locked,
|
|
168
|
+
size: i.size === "sm" ? "xs" : "sm"
|
|
169
|
+
}, null, 8, ["model-value", "indeterminate", "disabled", "size"])) : (n(), f(L, {
|
|
183
170
|
key: 1,
|
|
184
|
-
"model-value":
|
|
185
|
-
disabled:
|
|
186
|
-
|
|
187
|
-
}, null, 8, ["model-value", "disabled", "onUpdate:modelValue"]))
|
|
171
|
+
"model-value": w(t.key, e) === "all",
|
|
172
|
+
disabled: i.readonly || t.locked
|
|
173
|
+
}, null, 8, ["model-value", "disabled"]))
|
|
188
174
|
])
|
|
189
175
|
], 10, K))), 128))
|
|
190
176
|
]),
|
|
191
|
-
|
|
192
|
-
key:
|
|
177
|
+
p.value.has(e.key) ? h("", !0) : (n(!0), c(y, { key: 0 }, v(e.permissions, (t) => (n(), c("tr", {
|
|
178
|
+
key: t.key,
|
|
193
179
|
class: "hover:bg-accent/40 transition-colors duration-100"
|
|
194
180
|
}, [
|
|
195
181
|
a("td", {
|
|
196
|
-
class:
|
|
182
|
+
class: r([k.value, "border-b"])
|
|
197
183
|
}, [
|
|
198
184
|
a("div", te, [
|
|
199
185
|
a("span", {
|
|
200
|
-
class:
|
|
201
|
-
}, x(
|
|
202
|
-
|
|
186
|
+
class: r([b.value, "text-foreground"])
|
|
187
|
+
}, x(t.label), 3),
|
|
188
|
+
t.description ? (n(), f(R, {
|
|
203
189
|
key: 0,
|
|
204
|
-
content:
|
|
190
|
+
content: t.description,
|
|
205
191
|
placement: "top"
|
|
206
192
|
}, {
|
|
207
|
-
default:
|
|
208
|
-
|
|
193
|
+
default: F(() => [
|
|
194
|
+
B(z, {
|
|
209
195
|
icon: "lucide:info",
|
|
210
196
|
class: "w-3 h-3 text-muted-foreground cursor-auto shrink-0"
|
|
211
197
|
})
|
|
@@ -214,25 +200,28 @@ const R = {
|
|
|
214
200
|
}, 8, ["content"])) : h("", !0)
|
|
215
201
|
])
|
|
216
202
|
], 2),
|
|
217
|
-
(n(!0), c(y, null, v(
|
|
218
|
-
key:
|
|
219
|
-
class:
|
|
203
|
+
(n(!0), c(y, null, v(i.roles, (d) => (n(), c("td", {
|
|
204
|
+
key: d.key,
|
|
205
|
+
class: r([
|
|
206
|
+
k.value,
|
|
207
|
+
"text-center border-b border-l",
|
|
208
|
+
!i.readonly && !d.locked ? "cursor-pointer" : ""
|
|
209
|
+
]),
|
|
210
|
+
onClick: (u) => j(d.key, t.key)
|
|
220
211
|
}, [
|
|
221
212
|
a("div", le, [
|
|
222
|
-
|
|
213
|
+
i.toggleMode === "checkbox" ? (n(), f(G, {
|
|
223
214
|
key: 0,
|
|
224
|
-
"model-value":
|
|
225
|
-
disabled:
|
|
226
|
-
size:
|
|
227
|
-
|
|
228
|
-
}, null, 8, ["model-value", "disabled", "size", "onUpdate:modelValue"])) : (n(), f(M, {
|
|
215
|
+
"model-value": C(d.key, t.key),
|
|
216
|
+
disabled: i.readonly || d.locked,
|
|
217
|
+
size: i.size === "sm" ? "xs" : "sm"
|
|
218
|
+
}, null, 8, ["model-value", "disabled", "size"])) : (n(), f(L, {
|
|
229
219
|
key: 1,
|
|
230
|
-
"model-value":
|
|
231
|
-
disabled:
|
|
232
|
-
|
|
233
|
-
}, null, 8, ["model-value", "disabled", "onUpdate:modelValue"]))
|
|
220
|
+
"model-value": C(d.key, t.key),
|
|
221
|
+
disabled: i.readonly || d.locked
|
|
222
|
+
}, null, 8, ["model-value", "disabled"]))
|
|
234
223
|
])
|
|
235
|
-
],
|
|
224
|
+
], 10, se))), 128))
|
|
236
225
|
]))), 128))
|
|
237
226
|
], 64))), 128))
|
|
238
227
|
])
|
|
@@ -242,5 +231,5 @@ const R = {
|
|
|
242
231
|
}
|
|
243
232
|
});
|
|
244
233
|
export {
|
|
245
|
-
|
|
234
|
+
ue as default
|
|
246
235
|
};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { PermissionMatrixSize } from './types';
|
|
2
|
+
interface GroupOption {
|
|
3
|
+
label: string;
|
|
4
|
+
value: string;
|
|
5
|
+
icon?: string;
|
|
6
|
+
}
|
|
7
|
+
type __VLS_Props = {
|
|
8
|
+
searchQuery: string;
|
|
9
|
+
selectedGroupKeys: string[];
|
|
10
|
+
searchable: boolean;
|
|
11
|
+
size: PermissionMatrixSize;
|
|
12
|
+
readonly: boolean;
|
|
13
|
+
totalPerms: number;
|
|
14
|
+
selectedCount: number;
|
|
15
|
+
groupOptions: GroupOption[];
|
|
16
|
+
};
|
|
17
|
+
declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
|
|
18
|
+
clearAll: () => any;
|
|
19
|
+
"update:searchQuery": (val: string) => any;
|
|
20
|
+
"update:selectedGroupKeys": (val: string[]) => any;
|
|
21
|
+
selectAll: () => any;
|
|
22
|
+
}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
23
|
+
onClearAll?: () => any;
|
|
24
|
+
"onUpdate:searchQuery"?: (val: string) => any;
|
|
25
|
+
"onUpdate:selectedGroupKeys"?: (val: string[]) => any;
|
|
26
|
+
onSelectAll?: () => any;
|
|
27
|
+
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
28
|
+
export default _default;
|
|
@@ -0,0 +1,132 @@
|
|
|
1
|
+
import { defineComponent as w, computed as k, openBlock as l, createElementBlock as n, createElementVNode as r, createVNode as c, createCommentVNode as i, unref as C, withCtx as f, withModifiers as G, createBlock as $, toDisplayString as a, normalizeClass as u } from "vue";
|
|
2
|
+
import z from "../Input.vue.js";
|
|
3
|
+
/* empty css */
|
|
4
|
+
import h from "../Icon.vue.js";
|
|
5
|
+
import K from "../CheckBox.vue.js";
|
|
6
|
+
import B from "../Dropdown/Dropdown.vue.js";
|
|
7
|
+
import "../../core/config.js";
|
|
8
|
+
const S = { class: "flex flex-col sm:flex-row items-start sm:items-center gap-3 mb-4" }, V = { class: "flex items-center gap-2 flex-1 w-full sm:max-w-lg" }, A = {
|
|
9
|
+
key: 0,
|
|
10
|
+
class: "flex-1"
|
|
11
|
+
}, Q = {
|
|
12
|
+
key: 0,
|
|
13
|
+
class: "inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground text-[10px] font-bold min-w-[18px] h-[18px] px-1"
|
|
14
|
+
}, N = ["onClick"], P = { class: "text-sm" }, U = {
|
|
15
|
+
key: 0,
|
|
16
|
+
class: "border-t px-3 py-1.5"
|
|
17
|
+
}, E = { class: "flex items-center gap-3 ml-auto" }, H = /* @__PURE__ */ w({
|
|
18
|
+
__name: "PermissionTopBar",
|
|
19
|
+
props: {
|
|
20
|
+
searchQuery: {},
|
|
21
|
+
selectedGroupKeys: {},
|
|
22
|
+
searchable: { type: Boolean },
|
|
23
|
+
size: {},
|
|
24
|
+
readonly: { type: Boolean },
|
|
25
|
+
totalPerms: {},
|
|
26
|
+
selectedCount: {},
|
|
27
|
+
groupOptions: {}
|
|
28
|
+
},
|
|
29
|
+
emits: ["update:searchQuery", "update:selectedGroupKeys", "selectAll", "clearAll"],
|
|
30
|
+
setup(e, { emit: g }) {
|
|
31
|
+
const x = e, d = g, m = k(() => x.size === "sm" ? "text-xs" : "text-sm");
|
|
32
|
+
function y(s) {
|
|
33
|
+
const t = x.selectedGroupKeys, o = t.includes(s) ? t.filter((p) => p !== s) : [...t, s];
|
|
34
|
+
d("update:selectedGroupKeys", o);
|
|
35
|
+
}
|
|
36
|
+
function v() {
|
|
37
|
+
d("update:selectedGroupKeys", []);
|
|
38
|
+
}
|
|
39
|
+
function b(s) {
|
|
40
|
+
d("update:searchQuery", String(s));
|
|
41
|
+
}
|
|
42
|
+
return (s, t) => (l(), n("div", S, [
|
|
43
|
+
r("div", V, [
|
|
44
|
+
e.searchable ? (l(), n("div", A, [
|
|
45
|
+
c(z, {
|
|
46
|
+
"model-value": e.searchQuery,
|
|
47
|
+
"onUpdate:modelValue": b,
|
|
48
|
+
placeholder: "Search permissions...",
|
|
49
|
+
icon: "lucide:search",
|
|
50
|
+
size: e.size,
|
|
51
|
+
"show-clear-button": ""
|
|
52
|
+
}, null, 8, ["model-value", "size"])
|
|
53
|
+
])) : i("", !0),
|
|
54
|
+
c(C(B), {
|
|
55
|
+
options: e.groupOptions,
|
|
56
|
+
"close-on-select": !1,
|
|
57
|
+
selectable: !1,
|
|
58
|
+
position: "bottom-end"
|
|
59
|
+
}, {
|
|
60
|
+
trigger: f(() => [
|
|
61
|
+
r("button", {
|
|
62
|
+
type: "button",
|
|
63
|
+
class: u([
|
|
64
|
+
"inline-flex items-center gap-1.5 border rounded-md cursor-pointer transition-colors",
|
|
65
|
+
e.size === "sm" ? "px-2 py-1.5 text-xs" : "px-3 py-2 text-sm",
|
|
66
|
+
e.selectedGroupKeys.length > 0 ? "border-primary bg-primary/5 text-primary" : "border-border text-muted-foreground hover:text-foreground hover:bg-accent"
|
|
67
|
+
])
|
|
68
|
+
}, [
|
|
69
|
+
c(h, {
|
|
70
|
+
icon: "lucide:filter",
|
|
71
|
+
class: "w-3.5 h-3.5"
|
|
72
|
+
}),
|
|
73
|
+
t[2] || (t[2] = r("span", { class: "hidden sm:inline" }, "Modules", -1)),
|
|
74
|
+
e.selectedGroupKeys.length > 0 ? (l(), n("span", Q, a(e.selectedGroupKeys.length), 1)) : i("", !0)
|
|
75
|
+
], 2)
|
|
76
|
+
]),
|
|
77
|
+
item: f(({ option: o }) => [
|
|
78
|
+
r("div", {
|
|
79
|
+
class: "flex items-center gap-2 w-full cursor-pointer hover:bg-accent rounded-md",
|
|
80
|
+
onClick: G((p) => y(o.value), ["stop"])
|
|
81
|
+
}, [
|
|
82
|
+
c(K, {
|
|
83
|
+
"model-value": e.selectedGroupKeys.includes(o.value),
|
|
84
|
+
size: "xs",
|
|
85
|
+
"onUpdate:modelValue": (p) => y(o.value)
|
|
86
|
+
}, null, 8, ["model-value", "onUpdate:modelValue"]),
|
|
87
|
+
o?.icon ? (l(), $(h, {
|
|
88
|
+
key: 0,
|
|
89
|
+
icon: o.icon,
|
|
90
|
+
class: "w-3.5 h-3.5 text-muted-foreground"
|
|
91
|
+
}, null, 8, ["icon"])) : i("", !0),
|
|
92
|
+
r("span", P, a(o.label), 1)
|
|
93
|
+
], 8, N)
|
|
94
|
+
]),
|
|
95
|
+
footer: f(() => [
|
|
96
|
+
e.selectedGroupKeys.length > 0 ? (l(), n("div", U, [
|
|
97
|
+
r("button", {
|
|
98
|
+
type: "button",
|
|
99
|
+
class: "text-xs text-muted-foreground hover:text-foreground cursor-pointer",
|
|
100
|
+
onClick: v
|
|
101
|
+
}, " Clear filters ")
|
|
102
|
+
])) : i("", !0)
|
|
103
|
+
]),
|
|
104
|
+
_: 1
|
|
105
|
+
}, 8, ["options"])
|
|
106
|
+
]),
|
|
107
|
+
r("div", E, [
|
|
108
|
+
r("span", {
|
|
109
|
+
class: u([m.value, "text-muted-foreground whitespace-nowrap"])
|
|
110
|
+
}, a(e.selectedCount) + " / " + a(e.totalPerms) + " selected ", 3),
|
|
111
|
+
e.readonly ? i("", !0) : (l(), n("button", {
|
|
112
|
+
key: 0,
|
|
113
|
+
type: "button",
|
|
114
|
+
class: u([m.value, "text-primary hover:underline whitespace-nowrap cursor-pointer"]),
|
|
115
|
+
onClick: t[0] || (t[0] = (o) => s.$emit("selectAll"))
|
|
116
|
+
}, " Select All ", 2)),
|
|
117
|
+
!e.readonly && e.selectedCount > 0 ? (l(), n("button", {
|
|
118
|
+
key: 1,
|
|
119
|
+
type: "button",
|
|
120
|
+
class: u([
|
|
121
|
+
m.value,
|
|
122
|
+
"text-muted-foreground hover:text-foreground hover:underline whitespace-nowrap cursor-pointer"
|
|
123
|
+
]),
|
|
124
|
+
onClick: t[1] || (t[1] = (o) => s.$emit("clearAll"))
|
|
125
|
+
}, " Clear ", 2)) : i("", !0)
|
|
126
|
+
])
|
|
127
|
+
]));
|
|
128
|
+
}
|
|
129
|
+
});
|
|
130
|
+
export {
|
|
131
|
+
H as default
|
|
132
|
+
};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { PermissionMatrixRow, PermissionMatrixGroup } from './types';
|
|
2
|
+
/** Resolve permission key for a matrix cell */
|
|
3
|
+
export declare function getMatrixPermKey(groupKey: string, row: PermissionMatrixRow, actionKey: string): string;
|
|
4
|
+
/** Check if a row supports a given action */
|
|
5
|
+
export declare function isActionEnabled(row: PermissionMatrixRow, actionKey: string): boolean;
|
|
6
|
+
/** Get all enabled permission keys for a matrix row */
|
|
7
|
+
export declare function getMatrixRowPermKeys(groupKey: string, row: PermissionMatrixRow, actions: {
|
|
8
|
+
key: string;
|
|
9
|
+
}[]): string[];
|
|
10
|
+
/** Get all permission keys from all matrix groups */
|
|
11
|
+
export declare function getAllMatrixKeys(matrixGroups: PermissionMatrixGroup[]): string[];
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
function r(t, e, n) {
|
|
2
|
+
return e.singleKey ? `${t}-${e.key}` : `${t}-${e.key}-${n}`;
|
|
3
|
+
}
|
|
4
|
+
function a(t, e) {
|
|
5
|
+
return t.actions.includes(e);
|
|
6
|
+
}
|
|
7
|
+
function u(t, e, n) {
|
|
8
|
+
return n.filter((i) => a(e, i.key)).map((i) => r(t, e, i.key));
|
|
9
|
+
}
|
|
10
|
+
function c(t) {
|
|
11
|
+
return t.flatMap(
|
|
12
|
+
(e) => e.rows.flatMap((n) => u(e.key, n, e.actions))
|
|
13
|
+
);
|
|
14
|
+
}
|
|
15
|
+
export {
|
|
16
|
+
c as getAllMatrixKeys,
|
|
17
|
+
r as getMatrixPermKey,
|
|
18
|
+
u as getMatrixRowPermKeys,
|
|
19
|
+
a as isActionEnabled
|
|
20
|
+
};
|