vlite3 0.7.13 → 0.7.15
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/Button.vue.js +1 -1
- package/components/ColorPicker/ColorIro.vue3.js +2 -2
- package/components/ColorPicker/ColorPicker.vue.js +18 -17
- package/components/{CommandPaletteContent.vue.d.ts → CommandPalette/CommandPaletteContent.vue.d.ts} +3 -3
- package/components/CommandPalette/CommandPaletteContent.vue.js +7 -0
- package/components/CommandPalette/CommandPaletteContent.vue2.js +180 -0
- package/components/CommandPalette/CommandPaletteItem.vue.d.ts +15 -0
- package/components/CommandPalette/CommandPaletteItem.vue2.js +7 -0
- package/components/CommandPalette/CommandPaletteItem.vue3.js +60 -0
- package/components/CommandPalette/index.d.ts +5 -0
- package/components/CommandPalette/types.d.ts +40 -0
- package/components/CommandPalette/useCommandPaletteItems.d.ts +15 -0
- package/components/CommandPalette/useCommandPaletteItems.js +99 -0
- package/components/CommandPalette/useCommandPaletteNav.d.ts +13 -0
- package/components/CommandPalette/useCommandPaletteNav.js +49 -0
- package/components/DataList/DataList.vue.js +53 -50
- package/components/DataTable/DataTable.vue.js +185 -173
- package/components/DatePicker.vue.js +3 -2
- package/components/DateRangePicker.vue.js +26 -25
- package/components/Dropdown/Dropdown.vue.js +20 -20
- package/components/Dropdown/DropdownMenu.vue.js +5 -256
- package/components/Dropdown/DropdownMenu.vue2.js +256 -2
- package/components/Form/CustomFields.vue.js +1 -1
- package/components/Form/CustomFields.vue2.js +102 -97
- package/components/Form/Form.vue.d.ts +0 -1
- package/components/Form/Form.vue.js +2 -2
- package/components/Form/Form.vue2.js +20 -20
- package/components/Form/FormFields.vue.js +2 -2
- package/components/Form/FormFields.vue2.js +90 -78
- package/components/IconPicker.vue.js +3 -2
- package/components/ImportData/ImportStep2.vue.js +10 -9
- package/components/List/List.vue.js +205 -180
- package/components/Modal.vue.js +2 -2
- package/components/Modal.vue2.js +82 -96
- package/components/MultiSelect/MultiSelect.vue.js +7 -7
- package/components/Navbar/Navbar.vue.js +12 -12
- package/components/NavbarCommandPalette.vue.d.ts +7 -30
- package/components/NavbarCommandPalette.vue.js +40 -40
- package/components/PermissionMatrix/PermissionEditorList.vue.js +1 -1
- package/components/PermissionMatrix/PermissionEditorList.vue2.js +84 -75
- package/components/PermissionMatrix/PermissionEditorMatrix.vue.js +2 -2
- package/components/PermissionMatrix/PermissionEditorMatrix.vue2.js +122 -107
- package/components/PermissionMatrix/PermissionMatrix.vue.js +2 -2
- package/components/PermissionMatrix/PermissionMatrix.vue2.js +161 -138
- package/components/PermissionMatrix/PermissionTopBar.vue.js +19 -18
- package/components/Screen/Screen.vue.js +169 -166
- package/components/Screen/ScreenFilter.vue.js +4 -3
- package/components/SidePanel.vue.js +5 -146
- package/components/SidePanel.vue2.js +146 -2
- package/components/SidebarMenu/SidebarMenuItem.vue.js +26 -25
- package/components/Workbook/Sheet.vue.js +3 -2
- package/index.d.ts +1 -1
- package/index.js +1 -1
- package/package.json +1 -1
- package/style.css +1 -1
- package/components/CommandPaletteContent.vue.js +0 -7
- package/components/CommandPaletteContent.vue2.js +0 -311
- /package/components/ColorPicker/{ColorIro.vue.js → ColorIro.vue2.js} +0 -0
|
@@ -1,15 +1,16 @@
|
|
|
1
|
-
import { defineComponent as V, ref as w, watch as L, computed as u, openBlock as d, createBlock as m, unref as h, withCtx as y, createElementVNode as
|
|
1
|
+
import { defineComponent as V, ref as w, watch as L, computed as u, openBlock as d, createBlock as m, unref as h, withCtx as y, createElementVNode as s, createElementBlock as x, Fragment as z, renderList as B, createCommentVNode as E, createVNode as g, normalizeClass as k, toDisplayString as R } from "vue";
|
|
2
2
|
import T from "./Dropdown/Dropdown.vue.js";
|
|
3
3
|
import f from "./Icon.vue.js";
|
|
4
4
|
import { $t as l } from "../utils/i18n.js";
|
|
5
5
|
/* empty css */
|
|
6
|
+
/* empty css */
|
|
6
7
|
import P from "./Button.vue.js";
|
|
7
8
|
import p from "v-datepicker-lite";
|
|
8
9
|
import "v-datepicker-lite/style.css";
|
|
9
10
|
const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { class: "flex flex-col sm:flex-row bg-background rounded-md" }, H = {
|
|
10
11
|
key: 0,
|
|
11
12
|
class: "flex flex-col gap-1 sm:pr-3 py-2 sm:border-r border-border max-h-[280px]"
|
|
12
|
-
}, Q = { class: "flex flex-col sm:flex-row items-center gap-4 py-2 p-3" }, O = { class: "border border-border rounded-md overflow-hidden bg-background" }, I = { class: "flex items-center justify-center shrink-0" }, U = { class: "border border-border rounded-md overflow-hidden bg-background" },
|
|
13
|
+
}, Q = { class: "flex flex-col sm:flex-row items-center gap-4 py-2 p-3" }, O = { class: "border border-border rounded-md overflow-hidden bg-background" }, I = { class: "flex items-center justify-center shrink-0" }, U = { class: "border border-border rounded-md overflow-hidden bg-background" }, ae = /* @__PURE__ */ V({
|
|
13
14
|
__name: "DateRangePicker",
|
|
14
15
|
props: {
|
|
15
16
|
modelValue: {},
|
|
@@ -107,37 +108,37 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
107
108
|
}
|
|
108
109
|
]), F = (t) => {
|
|
109
110
|
const e = /* @__PURE__ */ new Date();
|
|
110
|
-
let a = /* @__PURE__ */ new Date(),
|
|
111
|
-
switch (e.setHours(0, 0, 0, 0), a.setHours(0, 0, 0, 0),
|
|
111
|
+
let a = /* @__PURE__ */ new Date(), i = /* @__PURE__ */ new Date();
|
|
112
|
+
switch (e.setHours(0, 0, 0, 0), a.setHours(0, 0, 0, 0), i.setHours(0, 0, 0, 0), t.value) {
|
|
112
113
|
case "today":
|
|
113
|
-
a = new Date(e),
|
|
114
|
+
a = new Date(e), i = new Date(e);
|
|
114
115
|
break;
|
|
115
116
|
case "yesterday":
|
|
116
|
-
a = new Date(e), a.setDate(a.getDate() - 1),
|
|
117
|
+
a = new Date(e), a.setDate(a.getDate() - 1), i = new Date(a);
|
|
117
118
|
break;
|
|
118
119
|
case "last_7_days":
|
|
119
|
-
a = new Date(e), a.setDate(a.getDate() - 6),
|
|
120
|
+
a = new Date(e), a.setDate(a.getDate() - 6), i = new Date(e);
|
|
120
121
|
break;
|
|
121
122
|
case "last_30_days":
|
|
122
|
-
a = new Date(e), a.setDate(a.getDate() - 29),
|
|
123
|
+
a = new Date(e), a.setDate(a.getDate() - 29), i = new Date(e);
|
|
123
124
|
break;
|
|
124
125
|
case "this_month":
|
|
125
|
-
a = new Date(e.getFullYear(), e.getMonth(), 1),
|
|
126
|
+
a = new Date(e.getFullYear(), e.getMonth(), 1), i = new Date(e);
|
|
126
127
|
break;
|
|
127
128
|
case "last_month":
|
|
128
|
-
a = new Date(e.getFullYear(), e.getMonth() - 1, 1),
|
|
129
|
+
a = new Date(e.getFullYear(), e.getMonth() - 1, 1), i = new Date(e.getFullYear(), e.getMonth(), 0);
|
|
129
130
|
break;
|
|
130
131
|
case "last_6_months":
|
|
131
|
-
a = new Date(e.getFullYear(), e.getMonth() - 5, 1),
|
|
132
|
+
a = new Date(e.getFullYear(), e.getMonth() - 5, 1), i = new Date(e);
|
|
132
133
|
break;
|
|
133
134
|
case "this_year":
|
|
134
|
-
a = new Date(e.getFullYear(), 0, 1),
|
|
135
|
+
a = new Date(e.getFullYear(), 0, 1), i = new Date(e);
|
|
135
136
|
break;
|
|
136
137
|
case "last_year":
|
|
137
|
-
a = new Date(e.getFullYear() - 1, 0, 1),
|
|
138
|
+
a = new Date(e.getFullYear() - 1, 0, 1), i = new Date(e.getFullYear() - 1, 11, 31);
|
|
138
139
|
break;
|
|
139
140
|
}
|
|
140
|
-
n.value = { start: a, end:
|
|
141
|
+
n.value = { start: a, end: i }, c.value++, o.value = !1;
|
|
141
142
|
};
|
|
142
143
|
return (t, e) => (d(), m(h(T), {
|
|
143
144
|
isOpen: o.value,
|
|
@@ -156,15 +157,15 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
156
157
|
class: k(["w-max justify-between text-left font-normal", [r.triggerClass, { "ring-1 ring-ring ring-offset-[1]": a }]])
|
|
157
158
|
}, {
|
|
158
159
|
default: y(() => [
|
|
159
|
-
|
|
160
|
-
|
|
160
|
+
s("div", $, [
|
|
161
|
+
s("span", {
|
|
161
162
|
class: k({ "text-muted-foreground": !n.value.start })
|
|
162
163
|
}, R(n.value.start ? D(n.value.start) : r.placeholderStart), 3),
|
|
163
164
|
g(f, {
|
|
164
165
|
icon: "lucide:arrow-right",
|
|
165
166
|
class: "w-4 h-4 text-muted-foreground opacity-60 shrink-0"
|
|
166
167
|
}),
|
|
167
|
-
|
|
168
|
+
s("span", {
|
|
168
169
|
class: k({ "text-muted-foreground": !n.value.end })
|
|
169
170
|
}, R(n.value.end ? D(n.value.end) : r.placeholderEnd), 3)
|
|
170
171
|
])
|
|
@@ -173,9 +174,9 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
173
174
|
}, 8, ["variant", "size", "disabled", "class"])
|
|
174
175
|
]),
|
|
175
176
|
menu: y(() => [
|
|
176
|
-
|
|
177
|
+
s("div", j, [
|
|
177
178
|
r.showQuickRanges ? (d(), x("div", H, [
|
|
178
|
-
e[1] || (e[1] =
|
|
179
|
+
e[1] || (e[1] = s("div", { class: "text-xs pl-2 pb-2 font-semibold text-muted-foreground uppercase tracking-wider" }, " Quick Ranges ", -1)),
|
|
179
180
|
(d(!0), x(z, null, B(N.value, (a) => (d(), m(P, {
|
|
180
181
|
key: a.value,
|
|
181
182
|
text: a.label,
|
|
@@ -183,11 +184,11 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
183
184
|
variant: "ghost",
|
|
184
185
|
size: "sm",
|
|
185
186
|
class: "justify-start w-full font-normal",
|
|
186
|
-
onClick: (
|
|
187
|
+
onClick: (i) => F(a)
|
|
187
188
|
}, null, 8, ["text", "icon", "onClick"]))), 128))
|
|
188
189
|
])) : E("", !0),
|
|
189
|
-
|
|
190
|
-
|
|
190
|
+
s("div", Q, [
|
|
191
|
+
s("div", O, [
|
|
191
192
|
(d(), m(h(p), {
|
|
192
193
|
key: "start-" + c.value,
|
|
193
194
|
value: n.value.start,
|
|
@@ -199,7 +200,7 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
199
200
|
readonly: r.readonly
|
|
200
201
|
}, null, 8, ["value", "max-date", "min-date", "disabled", "readonly"]))
|
|
201
202
|
]),
|
|
202
|
-
|
|
203
|
+
s("div", I, [
|
|
203
204
|
g(f, {
|
|
204
205
|
icon: "lucide:arrow-right",
|
|
205
206
|
class: "w-5 h-5 text-muted-foreground hidden sm:block opacity-50"
|
|
@@ -209,7 +210,7 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
209
210
|
class: "w-5 h-5 text-muted-foreground sm:hidden opacity-50"
|
|
210
211
|
})
|
|
211
212
|
]),
|
|
212
|
-
|
|
213
|
+
s("div", U, [
|
|
213
214
|
(d(), m(h(p), {
|
|
214
215
|
key: "end-" + c.value,
|
|
215
216
|
value: n.value.end,
|
|
@@ -229,5 +230,5 @@ const $ = { class: "flex items-center justify-between gap-2 w-full" }, j = { cla
|
|
|
229
230
|
}
|
|
230
231
|
});
|
|
231
232
|
export {
|
|
232
|
-
|
|
233
|
+
ae as default
|
|
233
234
|
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as K, ref as i, computed as m, watch as T, provide as Q, reactive as W, toRefs as X, openBlock as
|
|
1
|
+
import { defineComponent as K, ref as i, computed as m, watch as T, provide as Q, reactive as W, toRefs as X, openBlock as A, createElementBlock as Y, normalizeStyle as Z, createVNode as B, unref as v, withCtx as c, renderSlot as d, createBlock as _, normalizeClass as ee, createSlots as te, normalizeProps as H, guardReactiveProps as L, createCommentVNode as le } from "vue";
|
|
2
2
|
import oe from "v-tooltip-lite";
|
|
3
3
|
import "v-tooltip-lite/style.css";
|
|
4
4
|
import ne from "./DropdownMenu.vue.js";
|
|
@@ -53,7 +53,7 @@ const be = /* @__PURE__ */ K({
|
|
|
53
53
|
confirmText: "Confirm",
|
|
54
54
|
cancelText: "Cancel",
|
|
55
55
|
variant: "primary"
|
|
56
|
-
}),
|
|
56
|
+
}), D = m(() => n.position ? n.position : n.direction === "rtl" ? "bottom-end" : "bottom-start"), R = m(() => n.nestedPosition ? n.nestedPosition : n.direction === "rtl" ? "left-start" : "right-start"), O = i(n.isOpen || !1), y = i(0);
|
|
57
57
|
T(
|
|
58
58
|
() => n.isOpen,
|
|
59
59
|
(e) => {
|
|
@@ -84,7 +84,7 @@ const be = /* @__PURE__ */ K({
|
|
|
84
84
|
} else
|
|
85
85
|
C.value = e;
|
|
86
86
|
!I.value && e.length > 0 && (I.value = !0, setTimeout(() => {
|
|
87
|
-
S.value = !0, N(
|
|
87
|
+
S.value = !0, N(w.value);
|
|
88
88
|
}, 10));
|
|
89
89
|
}
|
|
90
90
|
},
|
|
@@ -96,14 +96,14 @@ const be = /* @__PURE__ */ K({
|
|
|
96
96
|
return k.value.forEach((t, r) => {
|
|
97
97
|
o.has(r) || (e.unshift(t), o.add(r));
|
|
98
98
|
}), e;
|
|
99
|
-
}), { selectedBuffer: k, isHydrating:
|
|
99
|
+
}), { selectedBuffer: k, isHydrating: z, hydrateSelected: N } = ue({
|
|
100
100
|
fetchSelected: n.fetchSelected,
|
|
101
101
|
getAvailableOptions: () => u.value,
|
|
102
102
|
isReady: () => S.value
|
|
103
103
|
}), { getAllRecursiveIds: E } = se(), j = W({
|
|
104
104
|
...X(n),
|
|
105
105
|
options: u
|
|
106
|
-
}), { currentValue:
|
|
106
|
+
}), { currentValue: w, selectedLabel: x, selectOption: U } = re(
|
|
107
107
|
j,
|
|
108
108
|
p
|
|
109
109
|
), q = m(() => {
|
|
@@ -111,7 +111,7 @@ const be = /* @__PURE__ */ K({
|
|
|
111
111
|
return [.../* @__PURE__ */ new Set([...e, ...o, ".tooltip-container"])];
|
|
112
112
|
});
|
|
113
113
|
T(
|
|
114
|
-
() =>
|
|
114
|
+
() => w.value,
|
|
115
115
|
(e) => {
|
|
116
116
|
S.value && N(e);
|
|
117
117
|
},
|
|
@@ -130,28 +130,28 @@ const be = /* @__PURE__ */ K({
|
|
|
130
130
|
confirmText: "Confirm",
|
|
131
131
|
cancelText: "Cancel",
|
|
132
132
|
variant: "primary"
|
|
133
|
-
}, h.value = !0, g()) : (
|
|
134
|
-
},
|
|
133
|
+
}, h.value = !0, g()) : (M(e), n.closeOnSelect && g());
|
|
134
|
+
}, M = (e) => {
|
|
135
135
|
const o = e.value ?? e.label;
|
|
136
136
|
k.value.has(o) || k.value.set(o, e);
|
|
137
137
|
const t = U(e);
|
|
138
138
|
if (!n.isNested) {
|
|
139
139
|
const r = e._originalOption || e, a = r.value ?? r.label;
|
|
140
|
-
(e._path || [r]).forEach((
|
|
141
|
-
typeof
|
|
140
|
+
(e._path || [r]).forEach(($) => {
|
|
141
|
+
typeof $.onSelect == "function" && $.onSelect({
|
|
142
142
|
value: a,
|
|
143
|
-
option:
|
|
143
|
+
option: $,
|
|
144
144
|
data: u.value || [],
|
|
145
145
|
values: t
|
|
146
146
|
});
|
|
147
147
|
});
|
|
148
148
|
}
|
|
149
149
|
}, G = () => {
|
|
150
|
-
f.value && (
|
|
150
|
+
f.value && (M(f.value), f.value = null, h.value = !1);
|
|
151
151
|
}, J = () => {
|
|
152
152
|
f.value = null, h.value = !1;
|
|
153
153
|
};
|
|
154
|
-
return (e, o) => (
|
|
154
|
+
return (e, o) => (A(), Y("div", {
|
|
155
155
|
class: "relative inline-block text-left",
|
|
156
156
|
style: Z({ direction: l.direction })
|
|
157
157
|
}, [
|
|
@@ -161,7 +161,7 @@ const be = /* @__PURE__ */ K({
|
|
|
161
161
|
arrow: !1,
|
|
162
162
|
teleport: l.teleport,
|
|
163
163
|
offset: l.offset,
|
|
164
|
-
placement:
|
|
164
|
+
placement: D.value,
|
|
165
165
|
isOpen: O.value,
|
|
166
166
|
keepAlive: y.value > 0,
|
|
167
167
|
menuId: l.menuId,
|
|
@@ -175,7 +175,7 @@ const be = /* @__PURE__ */ K({
|
|
|
175
175
|
styles: { padding: "0" }
|
|
176
176
|
}, {
|
|
177
177
|
trigger: c(({ isOpen: t }) => [
|
|
178
|
-
d(e.$slots, "trigger",
|
|
178
|
+
d(e.$slots, "trigger", H(L({ selectedLabel: v(x), isOpen: t })), () => [
|
|
179
179
|
B(ae, {
|
|
180
180
|
"selected-label": v(x),
|
|
181
181
|
"is-open": t,
|
|
@@ -187,21 +187,21 @@ const be = /* @__PURE__ */ K({
|
|
|
187
187
|
]),
|
|
188
188
|
default: c(() => [
|
|
189
189
|
d(e.$slots, "default"),
|
|
190
|
-
b.value.length || u.value.length || e.$slots.menu || e.$slots.item || l.remote || l.searchable ? (
|
|
190
|
+
b.value.length || u.value.length || e.$slots.menu || e.$slots.item || l.remote || l.searchable ? (A(), _(ne, {
|
|
191
191
|
key: 0,
|
|
192
192
|
options: b.value,
|
|
193
193
|
cachedOptions: u.value,
|
|
194
194
|
class: ee(l.className),
|
|
195
|
-
selected: v(
|
|
195
|
+
selected: v(w),
|
|
196
196
|
selectedIndex: l.selectedIndex,
|
|
197
197
|
maxHeight: l.maxHeight,
|
|
198
|
-
nestedPosition:
|
|
198
|
+
nestedPosition: R.value,
|
|
199
199
|
nestedOffset: l.nestedOffset,
|
|
200
200
|
selectable: l.selectable,
|
|
201
201
|
direction: l.direction,
|
|
202
202
|
layout: l.layout,
|
|
203
203
|
columns: l.columns,
|
|
204
|
-
loading: l.loading || v(
|
|
204
|
+
loading: l.loading || v(z),
|
|
205
205
|
hasMore: l.hasMore,
|
|
206
206
|
searchable: l.searchable,
|
|
207
207
|
remote: l.remote,
|
|
@@ -221,7 +221,7 @@ const be = /* @__PURE__ */ K({
|
|
|
221
221
|
e.$slots.item ? {
|
|
222
222
|
name: "item",
|
|
223
223
|
fn: c((t) => [
|
|
224
|
-
d(e.$slots, "item",
|
|
224
|
+
d(e.$slots, "item", H(L(t)))
|
|
225
225
|
]),
|
|
226
226
|
key: "1"
|
|
227
227
|
} : void 0,
|
|
@@ -1,258 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
/*
|
|
5
|
-
import ie from "./DropdownItem.vue.js";
|
|
6
|
-
import de from "./DropdownBooleanItem.vue.js";
|
|
7
|
-
import ue from "./DropdownGroupedLayout.vue.js";
|
|
8
|
-
import { useDropdownNavigation as fe } from "./composables/useDropdownNavigation.js";
|
|
9
|
-
import { useDropdownIds as me } from "./composables/useDropdownIds.js";
|
|
10
|
-
import { $t as $ } from "../../utils/i18n.js";
|
|
11
|
-
import he from "./Dropdown.vue.js";
|
|
12
|
-
const ve = ["dir"], ye = {
|
|
13
|
-
key: 0,
|
|
14
|
-
class: "bg-body border-b z-10 rounded-t-md shrink-0"
|
|
15
|
-
}, ge = {
|
|
16
|
-
key: 1,
|
|
17
|
-
class: "shrink-0"
|
|
18
|
-
}, be = {
|
|
19
|
-
key: 0,
|
|
20
|
-
class: "px-2 py-6 text-center text-sm text-muted-foreground"
|
|
21
|
-
}, ke = {
|
|
22
|
-
key: 0,
|
|
23
|
-
class: "h-px bg-border my-1 mx-1"
|
|
24
|
-
}, we = ["onMouseenter"], pe = { class: "flex items-center flex-1 min-w-0" }, xe = { class: "truncate" }, Se = {
|
|
25
|
-
key: 3,
|
|
26
|
-
class: "flex justify-center py-2"
|
|
27
|
-
}, Oe = {
|
|
28
|
-
key: 3,
|
|
29
|
-
class: "shrink-0"
|
|
30
|
-
}, Ve = /* @__PURE__ */ ee({
|
|
31
|
-
__name: "DropdownMenu",
|
|
32
|
-
props: {
|
|
33
|
-
options: { default: () => [] },
|
|
34
|
-
cachedOptions: { default: () => [] },
|
|
35
|
-
selected: {},
|
|
36
|
-
selectedIndex: { default: null },
|
|
37
|
-
class: { default: "" },
|
|
38
|
-
maxHeight: { default: "300px" },
|
|
39
|
-
nestedPosition: { default: "right-start" },
|
|
40
|
-
nestedOffset: { default: () => [0, -5] },
|
|
41
|
-
selectable: { type: Boolean, default: !0 },
|
|
42
|
-
layout: { default: "default" },
|
|
43
|
-
columns: { default: 3 },
|
|
44
|
-
loading: { type: Boolean, default: !1 },
|
|
45
|
-
hasMore: { type: Boolean, default: !1 },
|
|
46
|
-
searchable: { type: Boolean, default: !0 },
|
|
47
|
-
remote: { type: Boolean, default: !1 },
|
|
48
|
-
debounceTime: { default: 300 },
|
|
49
|
-
direction: { default: "ltr" }
|
|
50
|
-
},
|
|
51
|
-
emits: ["select", "close", "load-more", "search"],
|
|
52
|
-
setup(a, { emit: V }) {
|
|
53
|
-
const t = a, f = V, _ = B(null), h = B(""), { getMenuId: D, getAllRecursiveIds: z } = me(), H = v(() => {
|
|
54
|
-
const e = $("vlite.dropdown.empty");
|
|
55
|
-
return e !== "vlite.dropdown.empty" ? e : "No options found";
|
|
56
|
-
}), L = v(() => {
|
|
57
|
-
const e = $("vlite.dropdown.search");
|
|
58
|
-
return e !== "vlite.dropdown.search" ? e : "Search...";
|
|
59
|
-
}), u = v(() => t.options ? t.options.map((e) => typeof e == "string" || typeof e == "number" ? { label: String(e), value: String(e) } : e) : []), R = v(() => t.remote ? t.searchable : t.searchable && (u.value.length || 0) > 9);
|
|
60
|
-
let k = null;
|
|
61
|
-
C(h, (e) => {
|
|
62
|
-
t.remote && (k && clearTimeout(k), k = setTimeout(() => {
|
|
63
|
-
e !== void 0 && f("search", e);
|
|
64
|
-
}, t.debounceTime));
|
|
65
|
-
});
|
|
66
|
-
const A = (e) => {
|
|
67
|
-
const s = e.target;
|
|
68
|
-
s.scrollTop + s.clientHeight >= s.scrollHeight - 50 && t.hasMore && !t.loading && f("load-more");
|
|
69
|
-
}, w = (e, s) => {
|
|
70
|
-
e.disabled || f("select", e);
|
|
71
|
-
}, {
|
|
72
|
-
focusedIndex: y,
|
|
73
|
-
isKeyboardMode: p,
|
|
74
|
-
filteredOptions: F,
|
|
75
|
-
handleKeyDown: I,
|
|
76
|
-
handleMouseMove: M,
|
|
77
|
-
onMouseEnterItem: x,
|
|
78
|
-
scrollToIndex: K
|
|
79
|
-
} = fe({
|
|
80
|
-
options: u,
|
|
81
|
-
searchQuery: h,
|
|
82
|
-
containerRef: _,
|
|
83
|
-
emit: (e, ...s) => f(e, ...s),
|
|
84
|
-
handleSelect: (e, s) => w(e)
|
|
85
|
-
}), g = v(() => t.remote ? h.value ? u.value : t.cachedOptions.length ? t.cachedOptions : u.value : F.value), U = (e) => {
|
|
86
|
-
if (!(!t.selected || typeof t.selected != "object") && e.key && e.key in t.selected)
|
|
87
|
-
return t.selected[e.key];
|
|
88
|
-
}, q = (e) => e.disabled ? !1 : Array.isArray(t.selected) ? t.selected.includes(e.value) : t.selected && typeof t.selected == "object" && e.key ? t.selected[e.key] === e.value : t.selected === e.value, G = (e) => !e.key || !t.selected || typeof t.selected != "object" ? !1 : !!t.selected[e.key], J = (e, s) => {
|
|
89
|
-
if (!s.key) return;
|
|
90
|
-
const l = {
|
|
91
|
-
label: s.label,
|
|
92
|
-
value: e,
|
|
93
|
-
key: s.key,
|
|
94
|
-
data: s.data,
|
|
95
|
-
_originalOption: s,
|
|
96
|
-
_path: [s]
|
|
97
|
-
};
|
|
98
|
-
f("select", l);
|
|
99
|
-
}, Q = (e, s) => {
|
|
100
|
-
let l = s.value;
|
|
101
|
-
e.key && (l = { [e.key]: l });
|
|
102
|
-
const o = s.option, i = o?._path || [o?._originalOption || o].filter(Boolean), Z = {
|
|
103
|
-
label: e.label,
|
|
104
|
-
value: l,
|
|
105
|
-
data: s.data,
|
|
106
|
-
key: e.key,
|
|
107
|
-
_originalOption: o?._originalOption || o,
|
|
108
|
-
_path: [e, ...i]
|
|
109
|
-
};
|
|
110
|
-
f("select", Z);
|
|
111
|
-
}, W = async () => {
|
|
112
|
-
await ae();
|
|
113
|
-
let e = -1;
|
|
114
|
-
t.layout !== "grouped" && (t.selectedIndex !== null && t.selectedIndex >= 0 ? e = t.selectedIndex : t.selected !== void 0 && typeof t.selected != "object" && (e = u.value.findIndex((s) => s.value === t.selected)), e !== -1 && K(e));
|
|
115
|
-
};
|
|
116
|
-
C(
|
|
117
|
-
() => g.value,
|
|
118
|
-
() => {
|
|
119
|
-
y.value = -1;
|
|
120
|
-
}
|
|
121
|
-
), te(() => {
|
|
122
|
-
W(), window.addEventListener("keydown", I);
|
|
123
|
-
}), le(() => {
|
|
124
|
-
window.removeEventListener("keydown", I);
|
|
125
|
-
});
|
|
126
|
-
const X = (e) => e.labelI18n ? $(e.labelI18n) : e.label, Y = (e) => e.showChevron !== !1;
|
|
127
|
-
return (e, s) => (n(), c("div", {
|
|
128
|
-
class: "dropdown-menu w-full min-w-[150px] flex flex-col",
|
|
129
|
-
dir: a.direction
|
|
130
|
-
}, [
|
|
131
|
-
R.value ? (n(), c("div", ye, [
|
|
132
|
-
j(ce, {
|
|
133
|
-
modelValue: h.value,
|
|
134
|
-
"onUpdate:modelValue": s[0] || (s[0] = (l) => h.value = l),
|
|
135
|
-
placeholder: L.value,
|
|
136
|
-
icon: "lucide:search",
|
|
137
|
-
size: "sm",
|
|
138
|
-
class: "font-medium!",
|
|
139
|
-
"input-class": "-ml-1",
|
|
140
|
-
variant: "transparent",
|
|
141
|
-
"icon-class": "h-3.5! w-3.5!",
|
|
142
|
-
"show-clear-button": !1
|
|
143
|
-
}, null, 8, ["modelValue", "placeholder"])
|
|
144
|
-
])) : d("", !0),
|
|
145
|
-
e.$slots.header ? (n(), c("div", ge, [
|
|
146
|
-
b(e.$slots, "header")
|
|
147
|
-
])) : d("", !0),
|
|
148
|
-
u.value.length > 0 || e.$slots.menu ? (n(), c("div", {
|
|
149
|
-
key: 2,
|
|
150
|
-
ref_key: "containerRef",
|
|
151
|
-
ref: _,
|
|
152
|
-
tabindex: "0",
|
|
153
|
-
role: "menu",
|
|
154
|
-
class: T([
|
|
155
|
-
"w-full p-1 space-y-0.5 overflow-y-auto overflow-x-hidden focus:outline-none flex-1",
|
|
156
|
-
t.class
|
|
157
|
-
]),
|
|
158
|
-
style: se({ maxHeight: t.maxHeight }),
|
|
159
|
-
onMousemove: s[1] || (s[1] = //@ts-ignore
|
|
160
|
-
(...l) => r(M) && r(M)(...l)),
|
|
161
|
-
onScroll: A
|
|
162
|
-
}, [
|
|
163
|
-
g.value.length === 0 && u.value.length > 0 && !a.loading ? (n(), c("div", be, E(H.value), 1)) : d("", !0),
|
|
164
|
-
a.layout === "grouped" ? (n(), m(ue, {
|
|
165
|
-
key: 1,
|
|
166
|
-
options: g.value,
|
|
167
|
-
selected: a.selected,
|
|
168
|
-
selectable: a.selectable,
|
|
169
|
-
columns: a.columns,
|
|
170
|
-
onSelect: w
|
|
171
|
-
}, null, 8, ["options", "selected", "selectable", "columns"])) : (n(!0), c(N, { key: 2 }, ne(g.value, (l, o) => (n(), c(N, { key: o }, [
|
|
172
|
-
l.label === "---" ? (n(), c("div", ke)) : l.data?.isBoolean ? (n(), m(de, {
|
|
173
|
-
key: 1,
|
|
174
|
-
option: l,
|
|
175
|
-
value: G(l),
|
|
176
|
-
focused: r(p) && r(y) === o,
|
|
177
|
-
onChange: J,
|
|
178
|
-
onMouseenter: (i) => r(x)(o)
|
|
179
|
-
}, null, 8, ["option", "value", "focused", "onMouseenter"])) : l.children && l.children.length > 0 ? (n(), m(he, {
|
|
180
|
-
key: 2,
|
|
181
|
-
"is-nested": !0,
|
|
182
|
-
position: l.position || t.nestedPosition,
|
|
183
|
-
offset: l.offset || t.nestedOffset,
|
|
184
|
-
class: "w-full",
|
|
185
|
-
options: l.children,
|
|
186
|
-
selected: U(l),
|
|
187
|
-
menuId: r(D)(l),
|
|
188
|
-
nestedPosition: t.nestedPosition,
|
|
189
|
-
nestedOffset: t.nestedOffset,
|
|
190
|
-
selectable: t.selectable,
|
|
191
|
-
ignoreClickOutside: r(z)(l.children),
|
|
192
|
-
direction: a.direction,
|
|
193
|
-
onOnSelect: (i) => Q(l, i)
|
|
194
|
-
}, {
|
|
195
|
-
trigger: P(() => [
|
|
196
|
-
S("div", {
|
|
197
|
-
tabindex: 0,
|
|
198
|
-
"data-dropdown-item": "",
|
|
199
|
-
class: T(["relative flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm font-medium outline-none transition-colors justify-between w-full focus-visible:bg-accent focus-visible:text-accent-foreground focus-visible:ring-1 focus-visible:ring-primary focus-visible:ring-offset-1", [
|
|
200
|
-
r(p) && r(y) === o ? "bg-accent text-accent-foreground" : "hover:bg-accent hover:text-accent-foreground",
|
|
201
|
-
l.disabled ? "opacity-50 cursor-not-allowed" : "",
|
|
202
|
-
l.triggerClass || l.class || ""
|
|
203
|
-
]]),
|
|
204
|
-
onMouseenter: (i) => r(x)(o)
|
|
205
|
-
}, [
|
|
206
|
-
S("div", pe, [
|
|
207
|
-
l.icon || l.emoji ? (n(), m(O, {
|
|
208
|
-
key: 0,
|
|
209
|
-
icon: l.icon,
|
|
210
|
-
emoji: l.emoji,
|
|
211
|
-
class: "mr-2 h-4 w-4 shrink-0 mt-0.5"
|
|
212
|
-
}, null, 8, ["icon", "emoji"])) : d("", !0),
|
|
213
|
-
S("span", xe, E(X(l)), 1)
|
|
214
|
-
]),
|
|
215
|
-
Y(l) ? (n(), m(O, {
|
|
216
|
-
key: 0,
|
|
217
|
-
icon: a.direction === "rtl" ? "lucide:chevron-left" : "lucide:chevron-right",
|
|
218
|
-
class: "h-4 w-4 text-muted-foreground shrink-0 ml-2"
|
|
219
|
-
}, null, 8, ["icon"])) : d("", !0)
|
|
220
|
-
], 42, we)
|
|
221
|
-
]),
|
|
222
|
-
_: 2
|
|
223
|
-
}, 1032, ["position", "offset", "options", "selected", "menuId", "nestedPosition", "nestedOffset", "selectable", "ignoreClickOutside", "direction", "onOnSelect"])) : (n(), m(ie, {
|
|
224
|
-
key: 3,
|
|
225
|
-
option: l,
|
|
226
|
-
index: o,
|
|
227
|
-
selected: q(l),
|
|
228
|
-
focused: r(p) && r(y) === o,
|
|
229
|
-
selectable: a.selectable,
|
|
230
|
-
onClick: (i) => w(l),
|
|
231
|
-
onMouseenter: (i) => r(x)(o)
|
|
232
|
-
}, oe({ _: 2 }, [
|
|
233
|
-
e.$slots.item ? {
|
|
234
|
-
name: "default",
|
|
235
|
-
fn: P((i) => [
|
|
236
|
-
b(e.$slots, "item", re({ ref_for: !0 }, i))
|
|
237
|
-
]),
|
|
238
|
-
key: "0"
|
|
239
|
-
} : void 0
|
|
240
|
-
]), 1032, ["option", "index", "selected", "focused", "selectable", "onClick", "onMouseenter"]))
|
|
241
|
-
], 64))), 128)),
|
|
242
|
-
a.loading ? (n(), c("div", Se, [
|
|
243
|
-
j(O, {
|
|
244
|
-
icon: "lucide:loader-2",
|
|
245
|
-
class: "w-4 h-4 animate-spin text-muted-foreground"
|
|
246
|
-
})
|
|
247
|
-
])) : d("", !0),
|
|
248
|
-
b(e.$slots, "menu")
|
|
249
|
-
], 38)) : d("", !0),
|
|
250
|
-
e.$slots.footer ? (n(), c("div", Oe, [
|
|
251
|
-
b(e.$slots, "footer")
|
|
252
|
-
])) : d("", !0)
|
|
253
|
-
], 8, ve));
|
|
254
|
-
}
|
|
255
|
-
});
|
|
1
|
+
import o from "./DropdownMenu.vue2.js";
|
|
2
|
+
/* empty css */
|
|
3
|
+
import r from "../../_virtual/_plugin-vue_export-helper.js";
|
|
4
|
+
const e = /* @__PURE__ */ r(o, [["__scopeId", "data-v-55a6a43e"]]);
|
|
256
5
|
export {
|
|
257
|
-
|
|
6
|
+
e as default
|
|
258
7
|
};
|