@jblehm/super-list 1.0.13 → 1.0.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/dist/index.css +1 -1
- package/dist/super-list.js +195 -193
- package/package.json +3 -2
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.list-filter-text-input[data-v-
|
|
1
|
+
.list-filter-text-input[data-v-0a7e1379]{color:var(--superlist-text-colour, rgb(17, 24, 39));text-align:center;padding:.125rem 2rem .125rem .5rem!important;width:100%;height:100%;margin:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background-color:transparent;border:0 none;pointer-events:auto;cursor:text}.list-filter-text-input[data-v-0a7e1379]:focus,.list-filter-text-input[data-v-0a7e1379]:focus-visible,.list-filter-text-input[data-v-0a7e1379]:active{text-align:left}.click-through[data-v-0a7e1379]{pointer-events:none}.dark-placeholder-text[data-v-0a7e1379]::placeholder{color:var(--superlist-text-colour, rgb(17, 24, 39))}.light-placeholder-text[data-v-0a7e1379]::placeholder{color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.text-filter-disabled[data-v-0a7e1379]{background-color:transparent;border:none;outline:none;box-shadow:none;filter:none}@media (min-width: 640px){.list-filter-text-input[data-v-0a7e1379]{font-size:.875rem;line-height:1.5rem}}.list-option[data-v-f1a723a6]{text-transform:capitalize;display:inline-flex;width:100%;position:relative;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:transparent;color:var(--superlist-text-colour, rgb(55, 60, 65));transition-property:font-weight,background-color,color,text-shadow;transition-duration:.5s;transition-timing-function:ease;font-weight:400;text-shadow:1px 1px 3px var(--superlist-background-colour, white)}.list-option[data-v-f1a723a6]:focus-visible,.list-option>span[data-v-f1a723a6]:focus-visible{outline:none}.list-option-selected[data-v-f1a723a6]{font-weight:600}.list-option-message[data-v-f1a723a6]{text-shadow:1px 1px 3px var(--superlist-background-colour, white);text-transform:capitalize;display:inline-flex;width:100%;position:relative;cursor:default;-webkit-user-select:none;-moz-user-select:none;user-select:none;background-color:transparent;color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.list-option-active[data-v-f1a723a6]:hover,.list-option-active[data-v-f1a723a6],.list-option-selected[data-v-f1a723a6]:hover,.list-option[data-v-f1a723a6]:hover{font-weight:600;background-color:var(--superlist-theme-colour, rgb(77, 168, 11, .8));color:var(--superlist-background-colour, white);text-shadow:1px 1px 3px var(--superlist-theme-colour, rgb(77, 168, 11, .8));transition-duration:0s!important}.list-item-icon[data-v-f1a723a6]{display:flex;height:1rem;width:1rem;position:absolute;right:.7rem;margin-top:-.1rem;align-self:center}.list-item-span[data-v-f1a723a6]{padding:.5rem 1.75rem .5rem .75rem;width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-normal[data-v-84dc0bfc]{top:var(--parent-y)}.list-reverse[data-v-84dc0bfc]{bottom:var(--parent-y)}.select-list[data-v-84dc0bfc]{--parent-width: var(--3f25a304);--parent-x: var(--39d34c36);--parent-y: var(--39d34ff7);--duration: var(--0cc221d8);--border-radius: var(--superlist-list-border-radius, 0);border-radius:var(--border-radius);width:var(--parent-width);min-width:var(--parent-width);left:var(--parent-x);display:block;transition-property:max-height,opacity,visibility;transition-duration:var(--duration, .3s);transition-timing-function:cubic-bezier(.1,.9,.35,.98);position:absolute;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);background-color:#ffffffb3;align-items:baseline;opacity:.25;z-index:999;visibility:collapse;overflow:auto;max-height:0;border:none!important}.select-list[data-v-84dc0bfc]:focus-visible,.select-list>ul[data-v-84dc0bfc]:focus-visible,.super-list-button-container[data-v-84dc0bfc]:focus-visible{outline:none}.super-list-button-container[data-v-84dc0bfc]{height:100%;width:100%}.select-list.select-list-open[data-v-84dc0bfc]{z-index:999999;--max-height: var(--faf36f1e);max-height:var(--max-height, 0)}.select-list.no-scroll[data-v-84dc0bfc]{overflow:hidden}.select-list-fixed[data-v-84dc0bfc]{position:fixed;opacity:1;visibility:visible}.list-content[data-v-84dc0bfc]{--duration: var(--0cc221d8);overflow:visible;margin:0;padding:0;border-style:none;color:var(--superlist-text-colour, rgb(55, 60, 65));list-style:none;max-width:100%}.select-list.select-list-scrollable[data-v-84dc0bfc]{border-radius:var(--border-radius)}@media (min-width: 640px){.select-list.select-list-scrollable[data-v-84dc0bfc]{border-radius:var(--border-radius) 0 0 var(--border-radius)}.list-content[data-v-84dc0bfc]{font-size:.875rem;line-height:1.25rem}}.list-button-icon[data-v-01ef8e37]{display:flex;transition-timing-function:ease-in-out;transition-duration:.2s;transition-property:transform;width:.6rem;transform:rotate(0);color:var(--superlist-text-colour, rgb(17, 24, 39));justify-content:center;max-height:18%}.list-button-icon.custom-icon[data-v-01ef8e37]{max-height:100%;width:1.25rem}.list-button-icon.rotate-180[data-v-01ef8e37]{transform:rotate(180deg)}.list-button[data-v-01ef8e37]{position:relative;padding:0;margin:0;width:100%;max-height:100%;height:100%;background-color:var(--superlist-background-colour, white);align-items:center;pointer-events:auto;cursor:pointer}.list-button[data-v-01ef8e37]:focus,.list-button[data-v-01ef8e37]:focus-visible,.list-button[data-v-01ef8e37]:active{text-align:left}.list-button-icon-div[data-v-01ef8e37]{pointer-events:none;position:absolute;top:0;bottom:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding-right:.75rem;max-height:100%;height:100%;gap:max(.15rem,calc(6.25% + .075rem));transition:gap .2s}.list-button-icon-div.bigger-gap[data-v-01ef8e37]{gap:calc(40% - .25rem)}.click-through[data-v-01ef8e37]{pointer-events:none}[data-v-e1f079fa]{box-sizing:border-box}
|
package/dist/super-list.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as Z, ref as
|
|
1
|
+
import { defineComponent as Z, ref as f, computed as O, openBlock as x, createElementBlock as M, withKeys as m, normalizeClass as R, createElementVNode as N, useTemplateRef as Ee, watch as F, Fragment as de, renderList as Ae, withModifiers as te, toDisplayString as ve, createBlock as ce, createCommentVNode as $, useCssVars as Fe, onMounted as we, onUnmounted as Se, renderSlot as Le, createVNode as Q, nextTick as Ne, resolveDynamicComponent as Be, withCtx as me } from "vue";
|
|
2
2
|
import './index.css';class He {
|
|
3
3
|
eventsTypes = ["resize", "load", "scroll", "wheel", "touchmove"];
|
|
4
4
|
config = {
|
|
@@ -9,7 +9,7 @@ import './index.css';class He {
|
|
|
9
9
|
mutationObserver;
|
|
10
10
|
callbackFunction;
|
|
11
11
|
constructor(i, a = document.body) {
|
|
12
|
-
this.targetNode = a, this.callbackFunction = (
|
|
12
|
+
this.targetNode = a, this.callbackFunction = (v) => i(v), this.mutationObserver = new MutationObserver(() => i());
|
|
13
13
|
}
|
|
14
14
|
observe() {
|
|
15
15
|
this.mutationObserver.observe(this.targetNode, this.config);
|
|
@@ -46,8 +46,8 @@ import './index.css';class He {
|
|
|
46
46
|
window.removeEventListener("resize", this.callbackFunction);
|
|
47
47
|
}
|
|
48
48
|
}
|
|
49
|
-
function Re(e, i, a,
|
|
50
|
-
return i != null ? i(e) : e == null ? "" : typeof e == "object" ? e[a] :
|
|
49
|
+
function Re(e, i, a, v) {
|
|
50
|
+
return i != null ? i(e) : e == null ? "" : typeof e == "object" ? e[a] : v ? Pe(e, v) : "" + e;
|
|
51
51
|
}
|
|
52
52
|
function Pe(e, i) {
|
|
53
53
|
return i.find((a) => a.type === e)?.label ?? "";
|
|
@@ -58,10 +58,10 @@ class qe {
|
|
|
58
58
|
}, this.then = () => {
|
|
59
59
|
};
|
|
60
60
|
}
|
|
61
|
-
async abortablePromise(i, a,
|
|
61
|
+
async abortablePromise(i, a, v) {
|
|
62
62
|
const o = await a();
|
|
63
63
|
if (!i.aborted)
|
|
64
|
-
return
|
|
64
|
+
return v(o);
|
|
65
65
|
}
|
|
66
66
|
setFunc(i) {
|
|
67
67
|
this.func = i;
|
|
@@ -109,59 +109,61 @@ const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Z({
|
|
|
109
109
|
"update:press": null
|
|
110
110
|
},
|
|
111
111
|
setup(e, { expose: i, emit: a }) {
|
|
112
|
-
const
|
|
113
|
-
function
|
|
114
|
-
|
|
115
|
-
}
|
|
116
|
-
function t(
|
|
117
|
-
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
112
|
+
const v = a, o = e, d = f(null);
|
|
113
|
+
function w() {
|
|
114
|
+
o.parentMethods.openList();
|
|
115
|
+
}
|
|
116
|
+
function t(g) {
|
|
117
|
+
o.parentMethods.unfocus(g);
|
|
118
|
+
}
|
|
119
|
+
function s(g) {
|
|
120
|
+
g.target && g.target.value != null && v("update:query", g.target.value);
|
|
121
|
+
}
|
|
122
|
+
const c = O(() => {
|
|
123
|
+
const g = d?.value ? d.value.length : 0, b = o.placeholder?.length || 0;
|
|
124
|
+
return g > 0 ? g : b > 0 ? b : 5;
|
|
125
|
+
}), l = O(() => o.enableButtonClick === !0 && o.enableTextFilter === !0 ? "" : "click-through"), y = O(() => o.showDropDown && !o.enableTextFilter || !o.showDropDown ? "dark-placeholder-text" : "light-placeholder-text");
|
|
126
|
+
function k() {
|
|
124
127
|
if (d?.value) {
|
|
125
|
-
const
|
|
126
|
-
|
|
128
|
+
const g = d.value;
|
|
129
|
+
g.blur(), g.value = "";
|
|
127
130
|
}
|
|
128
131
|
}
|
|
129
|
-
function
|
|
132
|
+
function I() {
|
|
130
133
|
d?.value && d.value.focus();
|
|
131
134
|
}
|
|
132
|
-
return i({ blurInput:
|
|
135
|
+
return i({ blurInput: k, focusInput: I, textInputRef: d }), (g, b) => (x(), M("input", {
|
|
133
136
|
ref_key: "textInputRef",
|
|
134
137
|
ref: d,
|
|
135
138
|
tabindex: e.enableTextFilter ? 0 : -1,
|
|
136
139
|
onKeydown: [
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
140
|
+
b[0] || (b[0] = m((h) => e.parentMethods.press(h), ["enter"])),
|
|
141
|
+
b[1] || (b[1] = m((h) => e.parentMethods.press(), ["space"])),
|
|
142
|
+
b[2] || (b[2] = m((h) => e.parentMethods.press(h), ["esc"])),
|
|
143
|
+
b[3] || (b[3] = m((h) => e.parentMethods.press(h), ["up"])),
|
|
144
|
+
b[4] || (b[4] = m((h) => e.parentMethods.press(h), ["down"]))
|
|
142
145
|
],
|
|
143
|
-
onFocusin:
|
|
144
|
-
onFocusout:
|
|
145
|
-
|
|
146
|
-
onInput: p[8] || (p[8] = (L) => t(L)),
|
|
146
|
+
onFocusin: b[5] || (b[5] = (h) => w()),
|
|
147
|
+
onFocusout: b[6] || (b[6] = (h) => t(h)),
|
|
148
|
+
onInput: b[7] || (b[7] = (h) => s(h)),
|
|
147
149
|
type: "text",
|
|
148
150
|
"aria-autocomplete": "none",
|
|
149
151
|
autocomplete: "off",
|
|
150
152
|
placeholder: e.placeholder,
|
|
151
|
-
size:
|
|
153
|
+
size: c.value,
|
|
152
154
|
class: R([[
|
|
153
|
-
f.value,
|
|
154
155
|
l.value,
|
|
156
|
+
y.value,
|
|
155
157
|
{ "text-filter-disabled": !e.enableTextFilter }
|
|
156
158
|
], "list-filter-text-input"])
|
|
157
159
|
}, null, 42, je));
|
|
158
160
|
}
|
|
159
161
|
}), K = (e, i) => {
|
|
160
162
|
const a = e.__vccOpts || e;
|
|
161
|
-
for (const [
|
|
162
|
-
a[
|
|
163
|
+
for (const [v, o] of i)
|
|
164
|
+
a[v] = o;
|
|
163
165
|
return a;
|
|
164
|
-
}, be = /* @__PURE__ */ K($e, [["__scopeId", "data-v-
|
|
166
|
+
}, be = /* @__PURE__ */ K($e, [["__scopeId", "data-v-0a7e1379"]]), Ke = {}, Ve = {
|
|
165
167
|
xmlns: "http://www.w3.org/2000/svg",
|
|
166
168
|
fill: "currentColor",
|
|
167
169
|
"aria-hidden": "true",
|
|
@@ -169,8 +171,8 @@ const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Z({
|
|
|
169
171
|
viewBox: "0 -16 16 17"
|
|
170
172
|
};
|
|
171
173
|
function ze(e, i) {
|
|
172
|
-
return x(),
|
|
173
|
-
|
|
174
|
+
return x(), M("svg", Ve, i[0] || (i[0] = [
|
|
175
|
+
N("path", {
|
|
174
176
|
"shape-rendering": "geometricPrecision",
|
|
175
177
|
d: "M 6 -2.25 L 13.75 -14 A 0.5 0.5 90 0 1 15 -13 L 6.5 -0.5 A 2 1 90 0 1 5.5 -0.5 L 1 -6 A 0.5 0.5 90 0 1 2.25 -7 Z"
|
|
176
178
|
}, null, -1)
|
|
@@ -213,7 +215,7 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
213
215
|
}
|
|
214
216
|
},
|
|
215
217
|
setup(e) {
|
|
216
|
-
const i = e, a = Ee("items"),
|
|
218
|
+
const i = e, a = Ee("items"), v = O(() => {
|
|
217
219
|
if (!a?.value) return null;
|
|
218
220
|
const t = (Array.isArray(a.value) ? a.value : [a.value])[i.focusedIndex];
|
|
219
221
|
return t && typeof t == "object" && "scrollIntoView" in t && typeof t.scrollIntoView == "function" ? t : null;
|
|
@@ -225,85 +227,85 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
225
227
|
() => i.listElementOpenAndVisible,
|
|
226
228
|
() => d()
|
|
227
229
|
), F(
|
|
228
|
-
() =>
|
|
230
|
+
() => v.value,
|
|
229
231
|
() => d()
|
|
230
232
|
);
|
|
231
233
|
function o() {
|
|
232
|
-
!i.showDropDown || !
|
|
234
|
+
!i.showDropDown || !v?.value?.parentElement?.parentElement || (v.value.parentElement.parentElement.scrollTop = v.value.offsetTop);
|
|
233
235
|
}
|
|
234
236
|
function d() {
|
|
235
|
-
const
|
|
236
|
-
if (!i.showDropDown || !
|
|
237
|
-
const s =
|
|
238
|
-
s && (t.scrollTop =
|
|
239
|
-
}
|
|
240
|
-
return (
|
|
241
|
-
(x(!0),
|
|
242
|
-
key:
|
|
237
|
+
const w = v.value, t = w?.parentElement?.parentElement;
|
|
238
|
+
if (!i.showDropDown || !w || !t) return;
|
|
239
|
+
const s = w.offsetTop - t.scrollTop < 0, c = w.offsetTop + w.offsetHeight - t.scrollTop > t.clientHeight;
|
|
240
|
+
s && (t.scrollTop = w.offsetTop), c && (t.scrollTop = w.offsetTop + w.clientHeight - t.clientHeight);
|
|
241
|
+
}
|
|
242
|
+
return (w, t) => (x(), M(de, null, [
|
|
243
|
+
(x(!0), M(de, null, Ae(e.filteredListItems, (s, c) => (x(), M("li", {
|
|
244
|
+
key: c,
|
|
243
245
|
ref_for: !0,
|
|
244
246
|
ref: "items",
|
|
245
247
|
onKeyup: [
|
|
246
|
-
t[0] || (t[0] =
|
|
247
|
-
t[1] || (t[1] =
|
|
248
|
-
t[2] || (t[2] =
|
|
248
|
+
t[0] || (t[0] = m((l) => e.parentMethods.press(l), ["enter"])),
|
|
249
|
+
t[1] || (t[1] = m((l) => e.parentMethods.press(l), ["space"])),
|
|
250
|
+
t[2] || (t[2] = m((l) => e.parentMethods.press(l), ["esc"]))
|
|
249
251
|
],
|
|
250
252
|
onKeydown: [
|
|
251
|
-
t[3] || (t[3] =
|
|
252
|
-
t[4] || (t[4] =
|
|
253
|
+
t[3] || (t[3] = m((l) => e.parentMethods.press(l), ["up"])),
|
|
254
|
+
t[4] || (t[4] = m((l) => e.parentMethods.press(l), ["down"]))
|
|
253
255
|
],
|
|
254
256
|
onFocusout: t[5] || (t[5] = (l) => e.parentMethods.unfocus(l)),
|
|
255
257
|
tabindex: "-1",
|
|
256
258
|
onMousedown: te((l) => e.parentMethods.updatedSelected(s), ["left"]),
|
|
257
259
|
class: R([
|
|
258
|
-
{ "list-option-selected": e.selectedIndex ===
|
|
260
|
+
{ "list-option-selected": e.selectedIndex === c },
|
|
259
261
|
{
|
|
260
|
-
"list-option-active": e.filteredListItems.length === 1 || e.focusedIndex ===
|
|
262
|
+
"list-option-active": e.filteredListItems.length === 1 || e.focusedIndex === c && !e.mouseHoveringOnList
|
|
261
263
|
},
|
|
262
264
|
"list-option"
|
|
263
265
|
])
|
|
264
266
|
}, [
|
|
265
|
-
|
|
266
|
-
e.selectedIndex ===
|
|
267
|
+
N("span", Je, ve(e.parentMethods.getLabel(s)), 1),
|
|
268
|
+
e.selectedIndex === c ? (x(), ce(Xe, {
|
|
267
269
|
key: 0,
|
|
268
270
|
class: "list-item-icon",
|
|
269
271
|
"aria-hidden": "true"
|
|
270
272
|
})) : $("", !0)
|
|
271
273
|
], 42, Ue))), 128)),
|
|
272
|
-
e.filteredListItems.length === 0 ? (x(),
|
|
274
|
+
e.filteredListItems.length === 0 ? (x(), M("li", {
|
|
273
275
|
key: 0,
|
|
274
276
|
onKeyup: [
|
|
275
|
-
t[6] || (t[6] =
|
|
276
|
-
t[7] || (t[7] =
|
|
277
|
-
t[8] || (t[8] =
|
|
277
|
+
t[6] || (t[6] = m((s) => e.parentMethods.press(s), ["enter"])),
|
|
278
|
+
t[7] || (t[7] = m((s) => e.parentMethods.press(s), ["space"])),
|
|
279
|
+
t[8] || (t[8] = m((s) => e.parentMethods.press(s), ["esc"]))
|
|
278
280
|
],
|
|
279
281
|
onKeydown: [
|
|
280
|
-
t[9] || (t[9] =
|
|
281
|
-
t[10] || (t[10] =
|
|
282
|
+
t[9] || (t[9] = m((s) => e.parentMethods.press(s), ["up"])),
|
|
283
|
+
t[10] || (t[10] = m((s) => e.parentMethods.press(s), ["down"]))
|
|
282
284
|
],
|
|
283
285
|
onFocusout: t[11] || (t[11] = (s) => e.parentMethods.unfocus(s)),
|
|
284
286
|
onMousedown: t[12] || (t[12] = te((s) => e.parentMethods.closeList(s), ["left"])),
|
|
285
287
|
tabindex: "-1",
|
|
286
288
|
class: "list-option-message"
|
|
287
289
|
}, t[20] || (t[20] = [
|
|
288
|
-
|
|
290
|
+
N("span", { class: "list-item-span" }, "No Items To Display.", -1)
|
|
289
291
|
]), 32)) : $("", !0),
|
|
290
|
-
e.totalOptionsCount && e.totalOptionsCount > (e.filteredListItems?.length || 0) ? (x(),
|
|
292
|
+
e.totalOptionsCount && e.totalOptionsCount > (e.filteredListItems?.length || 0) ? (x(), M("li", {
|
|
291
293
|
key: 1,
|
|
292
294
|
onKeyup: [
|
|
293
|
-
t[13] || (t[13] =
|
|
294
|
-
t[14] || (t[14] =
|
|
295
|
-
t[15] || (t[15] =
|
|
295
|
+
t[13] || (t[13] = m((s) => e.parentMethods.press(s), ["enter"])),
|
|
296
|
+
t[14] || (t[14] = m((s) => e.parentMethods.press(s), ["space"])),
|
|
297
|
+
t[15] || (t[15] = m((s) => e.parentMethods.press(s), ["esc"]))
|
|
296
298
|
],
|
|
297
299
|
onKeydown: [
|
|
298
|
-
t[16] || (t[16] =
|
|
299
|
-
t[17] || (t[17] =
|
|
300
|
+
t[16] || (t[16] = m((s) => e.parentMethods.press(s), ["up"])),
|
|
301
|
+
t[17] || (t[17] = m((s) => e.parentMethods.press(s), ["down"]))
|
|
300
302
|
],
|
|
301
303
|
onFocusout: t[18] || (t[18] = (s) => e.parentMethods.unfocus(s)),
|
|
302
304
|
onMousedown: t[19] || (t[19] = te((s) => e.parentMethods.closeList(s), ["left"])),
|
|
303
305
|
tabindex: "-1",
|
|
304
306
|
class: "list-option-message"
|
|
305
307
|
}, [
|
|
306
|
-
|
|
308
|
+
N("span", We, " +" + ve(e.totalOptionsCount - e.filteredListItems?.length || 0) + " More Items...", 1)
|
|
307
309
|
], 32)) : $("", !0)
|
|
308
310
|
], 64));
|
|
309
311
|
}
|
|
@@ -363,27 +365,27 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
363
365
|
setup(e, { expose: i, emit: a }) {
|
|
364
366
|
Fe((u) => ({
|
|
365
367
|
"3f25a304": k.value,
|
|
366
|
-
"39d34c36":
|
|
368
|
+
"39d34c36": S.value,
|
|
367
369
|
"39d34ff7": ne.value,
|
|
368
370
|
"0cc221d8": q.value,
|
|
369
371
|
faf36f1e: Y.value
|
|
370
372
|
}));
|
|
371
|
-
const
|
|
373
|
+
const v = a, o = e, d = f(null), w = f(null), t = f(null), s = f(0), c = f(0), l = f(0), y = f(0), k = f("0px"), I = f(!1), g = f([]), b = f(0), h = O(() => !I.value || window?.innerHeight == null ? !1 : X() && se()), V = O(() => o.maxListHeightPX >= b.value);
|
|
372
374
|
F(
|
|
373
|
-
() =>
|
|
374
|
-
(u) =>
|
|
375
|
+
() => h.value,
|
|
376
|
+
(u) => v("reverseDropDownList", u),
|
|
375
377
|
{ immediate: !0 }
|
|
376
378
|
);
|
|
377
|
-
const
|
|
379
|
+
const S = O(() => s.value + "px"), ne = O(() => y.value + "px");
|
|
378
380
|
i({ listContainerRef: t });
|
|
379
381
|
const P = (u) => {
|
|
380
382
|
u?.key && u.key === " " && u.preventDefault();
|
|
381
383
|
}, oe = (u) => {
|
|
382
|
-
const
|
|
383
|
-
(!(
|
|
384
|
+
const L = t?.value, D = u.target;
|
|
385
|
+
(!(L && D && L.contains(D)) || L.isEqualNode(D)) && o.parentMethods.focusInput();
|
|
384
386
|
};
|
|
385
387
|
function B() {
|
|
386
|
-
return
|
|
388
|
+
return w?.value ? (w?.value).clientHeight : 0;
|
|
387
389
|
}
|
|
388
390
|
function E() {
|
|
389
391
|
if (!o.showDropDown || B() === 0) return o.maxListHeightPX;
|
|
@@ -391,43 +393,43 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
391
393
|
return o.maxListHeightPX && o.maxListHeightPX > u ? u : o.maxListHeightPX;
|
|
392
394
|
}
|
|
393
395
|
function X() {
|
|
394
|
-
return
|
|
396
|
+
return c.value > E();
|
|
395
397
|
}
|
|
396
398
|
function se() {
|
|
397
399
|
return l.value < E();
|
|
398
400
|
}
|
|
399
|
-
const Y =
|
|
401
|
+
const Y = O(() => (o.maxListHeightPX || 0) + "px"), q = O(() => (o.listAnimationDurationMs || 0) + "ms"), G = O(() => o.blockListChange ? g.value : o.filteredListItems);
|
|
400
402
|
F(
|
|
401
403
|
() => G,
|
|
402
404
|
(u) => {
|
|
403
|
-
u && (
|
|
405
|
+
u && (g.value = u.value);
|
|
404
406
|
},
|
|
405
407
|
{ immediate: !1, deep: !0 }
|
|
406
408
|
);
|
|
407
|
-
let
|
|
409
|
+
let C = setTimeout(() => {
|
|
408
410
|
}, 0), A = null;
|
|
409
411
|
function j() {
|
|
410
|
-
|
|
412
|
+
b.value = B(), clearTimeout(C), A && A.observe(), I.value = !0, z(void 0);
|
|
411
413
|
}
|
|
412
414
|
function ie() {
|
|
413
|
-
clearTimeout(
|
|
414
|
-
o.showDropDown || (
|
|
415
|
+
clearTimeout(C), C = setTimeout(() => {
|
|
416
|
+
o.showDropDown || (I.value = !1, A && A.unobserve());
|
|
415
417
|
}, o.listAnimationDurationMs + 50);
|
|
416
418
|
}
|
|
417
419
|
F(
|
|
418
420
|
() => o.showDropDown,
|
|
419
|
-
(u,
|
|
420
|
-
u !==
|
|
421
|
+
(u, L) => {
|
|
422
|
+
u !== L && (u ? j() : ie());
|
|
421
423
|
},
|
|
422
424
|
{ immediate: !0 }
|
|
423
425
|
);
|
|
424
426
|
function z(u) {
|
|
425
|
-
U(),
|
|
427
|
+
U(), Ne(() => U()), _(u);
|
|
426
428
|
}
|
|
427
429
|
function _(u) {
|
|
428
430
|
if (!o.enableScrollClose || !u?.target || typeof t?.value?.contains != "function" || u?.target?.nodeType == null) return;
|
|
429
|
-
const
|
|
430
|
-
o.showDropDown &&
|
|
431
|
+
const L = ["scroll", "wheel", "touchmove"].includes(u?.type), D = !t.value.contains(u.target);
|
|
432
|
+
o.showDropDown && L && D && o.parentMethods.closeList();
|
|
431
433
|
}
|
|
432
434
|
function U() {
|
|
433
435
|
le(), J();
|
|
@@ -435,12 +437,12 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
435
437
|
function le() {
|
|
436
438
|
if (d?.value == null) return;
|
|
437
439
|
const u = d.value.getBoundingClientRect();
|
|
438
|
-
|
|
440
|
+
c.value = u.top, l.value = window.innerHeight - u.bottom, k.value = u.width + "px";
|
|
439
441
|
}
|
|
440
442
|
function J() {
|
|
441
443
|
if (d?.value == null || t?.value == null) return;
|
|
442
|
-
const u = re().getBoundingClientRect(),
|
|
443
|
-
|
|
444
|
+
const u = re().getBoundingClientRect(), L = t.value.getBoundingClientRect(), D = y.value, ee = s.value;
|
|
445
|
+
h.value ? y.value = D - (u.top - L.bottom) : y.value = D - (L.top - u.bottom), s.value = ee - (L.left - u.left);
|
|
444
446
|
}
|
|
445
447
|
function W() {
|
|
446
448
|
return (d?.value).getElementsByTagName("button")[0];
|
|
@@ -450,44 +452,44 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
450
452
|
}
|
|
451
453
|
return we(() => {
|
|
452
454
|
A = new He(z, W()), setTimeout(() => z(void 0), 250);
|
|
453
|
-
}),
|
|
455
|
+
}), Se(() => {
|
|
454
456
|
A?.unobserve();
|
|
455
|
-
}), (u,
|
|
456
|
-
|
|
457
|
+
}), (u, L) => (x(), M(de, null, [
|
|
458
|
+
N("div", {
|
|
457
459
|
ref_key: "dropDownButtonContainer",
|
|
458
460
|
ref: d,
|
|
459
461
|
class: "super-list-button-container"
|
|
460
462
|
}, [
|
|
461
463
|
Le(u.$slots, "default", {}, void 0, !0)
|
|
462
464
|
], 512),
|
|
463
|
-
|
|
465
|
+
N("div", {
|
|
464
466
|
ref_key: "listContainerRef",
|
|
465
467
|
ref: t,
|
|
466
|
-
onMouseenter:
|
|
468
|
+
onMouseenter: L[0] || (L[0] = (D) => e.parentMethods.mouseOverList()),
|
|
467
469
|
tabindex: "-1",
|
|
468
470
|
class: R([
|
|
469
471
|
"select-list",
|
|
470
|
-
|
|
472
|
+
h.value ? "list-reverse" : "list-normal",
|
|
471
473
|
{ "select-list-open": e.showDropDown },
|
|
472
|
-
{ "no-scroll": V.value &&
|
|
473
|
-
{ "select-list-fixed":
|
|
474
|
+
{ "no-scroll": V.value && I.value },
|
|
475
|
+
{ "select-list-fixed": I.value },
|
|
474
476
|
{ "select-list-scrollable": !V.value }
|
|
475
477
|
]),
|
|
476
|
-
onKeydown:
|
|
477
|
-
onMouseup:
|
|
478
|
+
onKeydown: L[1] || (L[1] = m((D) => P(D), ["space"])),
|
|
479
|
+
onMouseup: L[2] || (L[2] = te((D) => oe(D), ["left"]))
|
|
478
480
|
}, [
|
|
479
|
-
|
|
481
|
+
N("ul", {
|
|
480
482
|
tabindex: "-1",
|
|
481
483
|
ref_key: "dropDownListUL",
|
|
482
|
-
ref:
|
|
484
|
+
ref: w,
|
|
483
485
|
class: "list-content"
|
|
484
486
|
}, [
|
|
485
487
|
Q(Ze, {
|
|
486
|
-
filteredListItems:
|
|
488
|
+
filteredListItems: g.value,
|
|
487
489
|
mouseHoveringOnList: e.mouseHoveringOnList,
|
|
488
490
|
focusedIndex: e.focusedIndex,
|
|
489
491
|
selectedIndex: e.selectedIndex,
|
|
490
|
-
listElementOpenAndVisible:
|
|
492
|
+
listElementOpenAndVisible: I.value,
|
|
491
493
|
"parent-methods": e.parentMethods,
|
|
492
494
|
"show-drop-down": e.showDropDown,
|
|
493
495
|
"total-options-count": e.totalOptionsCount
|
|
@@ -504,8 +506,8 @@ const Xe = /* @__PURE__ */ K(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
|
|
|
504
506
|
viewBox: "0 0 12 6"
|
|
505
507
|
};
|
|
506
508
|
function et(e, i) {
|
|
507
|
-
return x(),
|
|
508
|
-
|
|
509
|
+
return x(), M("svg", _e, i[0] || (i[0] = [
|
|
510
|
+
N("path", {
|
|
509
511
|
"shape-rendering": "geometricPrecision",
|
|
510
512
|
d: "M 6 4 L 10 0.25 A 0.5 0.5 90 0 1 11 1.25 L 6.5 5.75 A 15 3 90 0 1 5.5 5.75 L 1 1.25 A 0.5 0.5 90 0 1 2 0.25 Z"
|
|
511
513
|
}, null, -1)
|
|
@@ -540,49 +542,49 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
540
542
|
}
|
|
541
543
|
},
|
|
542
544
|
setup(e, { expose: i }) {
|
|
543
|
-
const a = e,
|
|
545
|
+
const a = e, v = f(null);
|
|
544
546
|
function o() {
|
|
545
547
|
a.enableTextFilter || a.parentMethods.openList();
|
|
546
548
|
}
|
|
547
|
-
function d(
|
|
548
|
-
a.enableTextFilter ? (a.parentMethods.focusInput(),
|
|
549
|
+
function d(c) {
|
|
550
|
+
a.enableTextFilter ? (a.parentMethods.focusInput(), c.stopPropagation(), c.preventDefault()) : a.parentMethods.press(c);
|
|
549
551
|
}
|
|
550
|
-
function
|
|
551
|
-
a.enableTextFilter || a.parentMethods.press(
|
|
552
|
+
function w(c) {
|
|
553
|
+
a.enableTextFilter || a.parentMethods.press(c);
|
|
552
554
|
}
|
|
553
555
|
function t() {
|
|
554
|
-
|
|
556
|
+
v?.value && v.value.blur();
|
|
555
557
|
}
|
|
556
558
|
function s() {
|
|
557
|
-
|
|
559
|
+
v?.value && v.value.focus();
|
|
558
560
|
}
|
|
559
|
-
return i({ blurInput: t, focusInput: s, buttonRef:
|
|
561
|
+
return i({ blurInput: t, focusInput: s, buttonRef: v }), (c, l) => (x(), M("button", {
|
|
560
562
|
ref_key: "buttonRef",
|
|
561
|
-
ref:
|
|
563
|
+
ref: v,
|
|
562
564
|
tabindex: e.enableTextFilter ? -1 : 0,
|
|
563
565
|
onKeydown: [
|
|
564
|
-
l[0] || (l[0] =
|
|
565
|
-
l[1] || (l[1] =
|
|
566
|
-
l[2] || (l[2] =
|
|
567
|
-
l[3] || (l[3] =
|
|
568
|
-
l[4] || (l[4] =
|
|
566
|
+
l[0] || (l[0] = m((y) => d(y), ["enter"])),
|
|
567
|
+
l[1] || (l[1] = m((y) => w(y), ["space"])),
|
|
568
|
+
l[2] || (l[2] = m((y) => e.parentMethods.press(y), ["esc"])),
|
|
569
|
+
l[3] || (l[3] = m((y) => e.parentMethods.press(y), ["up"])),
|
|
570
|
+
l[4] || (l[4] = m((y) => e.parentMethods.press(y), ["down"]))
|
|
569
571
|
],
|
|
570
|
-
onFocusout: l[5] || (l[5] = (
|
|
571
|
-
onClick: l[6] || (l[6] = (
|
|
572
|
+
onFocusout: l[5] || (l[5] = (y) => e.parentMethods.unfocus(y)),
|
|
573
|
+
onClick: l[6] || (l[6] = (y) => o()),
|
|
572
574
|
type: "button",
|
|
573
575
|
class: R([[{ "click-through": a.enableTextFilter || a.showDropDown }], "list-button"])
|
|
574
576
|
}, [
|
|
575
|
-
Le(
|
|
576
|
-
|
|
577
|
+
Le(c.$slots, "default", {}, void 0, !0),
|
|
578
|
+
N("span", {
|
|
577
579
|
class: R(["list-button-icon-div", { "bigger-gap": a.showDropDown }])
|
|
578
580
|
}, [
|
|
579
|
-
e.customIcon ? $("", !0) : (x(),
|
|
581
|
+
e.customIcon ? $("", !0) : (x(), M("span", {
|
|
580
582
|
key: 0,
|
|
581
583
|
class: R(["list-button-icon", [{ "rotate-180": !a.showDropDown }]])
|
|
582
584
|
}, [
|
|
583
585
|
Q(ge, { "aria-hidden": "true" })
|
|
584
586
|
], 2)),
|
|
585
|
-
e.customIcon ? $("", !0) : (x(),
|
|
587
|
+
e.customIcon ? $("", !0) : (x(), M("span", {
|
|
586
588
|
key: 1,
|
|
587
589
|
class: R(["list-button-icon", [{ "rotate-180": a.showDropDown }]])
|
|
588
590
|
}, [
|
|
@@ -591,7 +593,7 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
591
593
|
"aria-hidden": "true"
|
|
592
594
|
})) : $("", !0)
|
|
593
595
|
], 2)),
|
|
594
|
-
e.customIcon ? (x(),
|
|
596
|
+
e.customIcon ? (x(), M("span", nt, [
|
|
595
597
|
(x(), ce(Be(e.customIcon), { "aria-hidden": "true" }))
|
|
596
598
|
])) : $("", !0)
|
|
597
599
|
], 2)
|
|
@@ -650,19 +652,19 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
650
652
|
},
|
|
651
653
|
emits: { "update:selected": null },
|
|
652
654
|
setup(e, { expose: i, emit: a }) {
|
|
653
|
-
const
|
|
655
|
+
const v = a, o = e, d = f([]), w = new qe(), t = f(0), s = O(() => o.forceTextFilterVisibilityTo != null ? o.forceTextFilterVisibilityTo : t.value > o.maxListOptions), c = f(!1), l = f(!1), y = f(!1), k = f(!0), I = f(!1), g = f(!1), b = f(he), h = f(be), V = f(ye), S = f("");
|
|
654
656
|
F(
|
|
655
|
-
() =>
|
|
657
|
+
() => S.value,
|
|
656
658
|
(n, r) => {
|
|
657
659
|
n !== r && typeof o.options == "function" && ee(n);
|
|
658
660
|
}
|
|
659
661
|
);
|
|
660
662
|
const ne = () => {
|
|
661
|
-
s.value &&
|
|
663
|
+
s.value && h?.value?.blurInput();
|
|
662
664
|
}, P = () => {
|
|
663
|
-
clearTimeout(W), ne(),
|
|
664
|
-
}, oe =
|
|
665
|
-
n &&
|
|
665
|
+
clearTimeout(W), ne(), S.value = "", c.value = !1, k.value = !0;
|
|
666
|
+
}, oe = O(() => g?.value === !0 ? "Error loading data" : I?.value === !0 ? "Loading..." : E(o.selected)), B = (n) => {
|
|
667
|
+
n && v("update:selected", n), P();
|
|
666
668
|
}, E = (n) => Re(
|
|
667
669
|
n,
|
|
668
670
|
o.customPlaceHolderFunction,
|
|
@@ -670,20 +672,20 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
670
672
|
o.enumKeyToLabelObjectArray
|
|
671
673
|
);
|
|
672
674
|
function X() {
|
|
673
|
-
throw
|
|
675
|
+
throw I.value = !0, g.value = !0, new Error("Invalid options argument provided to ListInputComponent");
|
|
674
676
|
}
|
|
675
677
|
function se() {
|
|
676
|
-
throw
|
|
678
|
+
throw I.value = !0, g.value = !0, new Error("Invalid response provided to ListInputComponent, no total count key found");
|
|
677
679
|
}
|
|
678
680
|
function Y() {
|
|
679
|
-
throw
|
|
681
|
+
throw I.value = !0, g.value = !0, new Error("Invalid objectLabelKeyName for provided Dropdown list value.");
|
|
680
682
|
}
|
|
681
683
|
we(() => {
|
|
682
|
-
typeof o.options != "function" && !Array.isArray(o.options) ? X() :
|
|
684
|
+
typeof o.options != "function" && !Array.isArray(o.options) ? X() : L();
|
|
683
685
|
});
|
|
684
|
-
const q =
|
|
686
|
+
const q = f(!1), G = f(0), C = f(0), A = f(0);
|
|
685
687
|
F(
|
|
686
|
-
() =>
|
|
688
|
+
() => C.value,
|
|
687
689
|
(n, r) => {
|
|
688
690
|
n != r && !l.value && (A.value = n);
|
|
689
691
|
},
|
|
@@ -691,14 +693,14 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
691
693
|
), F(
|
|
692
694
|
() => l.value,
|
|
693
695
|
(n) => {
|
|
694
|
-
n || (A.value =
|
|
696
|
+
n || (A.value = C.value);
|
|
695
697
|
},
|
|
696
698
|
{ immediate: !0 }
|
|
697
699
|
);
|
|
698
|
-
const j =
|
|
700
|
+
const j = O(() => {
|
|
699
701
|
if (typeof o.options == "function" && !Array.isArray(o.options)) return d.value;
|
|
700
|
-
const n =
|
|
701
|
-
return n === "" ? r : r.filter((
|
|
702
|
+
const n = S.value, r = d.value;
|
|
703
|
+
return n === "" ? r : r.filter((p) => E(p).toLowerCase().includes(n.toLowerCase()));
|
|
702
704
|
});
|
|
703
705
|
F(
|
|
704
706
|
() => j.value,
|
|
@@ -711,75 +713,75 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
711
713
|
q.value = !0;
|
|
712
714
|
}, z = () => {
|
|
713
715
|
const n = _();
|
|
714
|
-
G.value = n,
|
|
716
|
+
G.value = n, C.value = n > -1 ? n : 0;
|
|
715
717
|
};
|
|
716
718
|
function _() {
|
|
717
719
|
if (o.selected == null) return -1;
|
|
718
|
-
const n = d.value.map((
|
|
720
|
+
const n = d.value.map((p) => E(p)), r = n.filter((p) => p === E(o.selected));
|
|
719
721
|
if (r.length > 1) {
|
|
720
|
-
const
|
|
721
|
-
for (let
|
|
722
|
-
const H = JSON.stringify(d.value[
|
|
723
|
-
if (H === ae) return
|
|
722
|
+
const p = r.map((T) => n.indexOf(T));
|
|
723
|
+
for (let T = 0; T < p.length; T++) {
|
|
724
|
+
const H = JSON.stringify(d.value[p[T]]), ae = JSON.stringify(o.selected);
|
|
725
|
+
if (H === ae) return p[T];
|
|
724
726
|
}
|
|
725
727
|
return -1;
|
|
726
728
|
}
|
|
727
729
|
return n.indexOf(E(o.selected));
|
|
728
730
|
}
|
|
729
731
|
const U = () => {
|
|
730
|
-
|
|
732
|
+
I.value || (c.value || (l.value = !1, z(), le(), c.value = !0), q.value = !1, k.value = !1);
|
|
731
733
|
}, le = () => {
|
|
732
|
-
const n = window
|
|
733
|
-
n && s.value && (re(),
|
|
734
|
-
}, J =
|
|
734
|
+
const n = window?.innerWidth != null && window.innerWidth < 640, r = screen?.width != null && screen.width < 640, p = h.value.textInputRef;
|
|
735
|
+
(n || r) && s.value && (re(), p?.scrollIntoView({ block: "start" }));
|
|
736
|
+
}, J = f(!0);
|
|
735
737
|
let W = setTimeout(() => {
|
|
736
738
|
}, 0);
|
|
737
739
|
function re() {
|
|
738
|
-
|
|
740
|
+
h.value.textInputRef && (clearTimeout(W), J.value = !1, W = setTimeout(() => {
|
|
739
741
|
J.value = !0;
|
|
740
742
|
}, 300));
|
|
741
743
|
}
|
|
742
744
|
const u = () => {
|
|
743
|
-
s?.value == !0 ?
|
|
745
|
+
s?.value == !0 ? h.value.focusInput() : V?.value?.focusInput && V?.value?.focusInput();
|
|
744
746
|
};
|
|
745
|
-
async function
|
|
746
|
-
typeof o.options == "function" ? await ee(
|
|
747
|
+
async function L() {
|
|
748
|
+
typeof o.options == "function" ? await ee(S.value ? S.value : void 0, !0) : (pe(o.options), t.value = d.value.length), D();
|
|
747
749
|
}
|
|
748
|
-
i({ initializeOptions:
|
|
749
|
-
function
|
|
750
|
+
i({ initializeOptions: L, getLabel: E });
|
|
751
|
+
function D() {
|
|
750
752
|
_() == -1 && d.value && !!d.value[0] && B(d.value[0]);
|
|
751
753
|
}
|
|
752
754
|
async function ee(n, r = !0) {
|
|
753
|
-
|
|
754
|
-
const
|
|
755
|
+
I.value = r;
|
|
756
|
+
const p = async () => o.options(o.maxListOptions, n || ""), T = (H) => {
|
|
755
757
|
(!H || !("data" in H)) && X(), pe(H.data), xe(H?.data?.length ?? 0).then(() => {
|
|
756
|
-
|
|
758
|
+
I.value = !1;
|
|
757
759
|
});
|
|
758
760
|
};
|
|
759
|
-
await
|
|
761
|
+
await w.resetAndExecute(p, T);
|
|
760
762
|
}
|
|
761
763
|
async function xe(n) {
|
|
762
|
-
const r = async () => o.options(1, ""),
|
|
763
|
-
(!
|
|
764
|
+
const r = async () => o.options(1, ""), p = (T) => {
|
|
765
|
+
(!T || !("totalNum" in T)) && se(), t.value = T.totalNum ?? n;
|
|
764
766
|
};
|
|
765
|
-
await
|
|
767
|
+
await w.resetAndExecute(r, p);
|
|
766
768
|
}
|
|
767
|
-
const fe = () =>
|
|
768
|
-
|
|
769
|
+
const fe = () => h?.value?.textInputRef?.getElementsByTagName("li")[C.value] ?? null, Ie = (n) => {
|
|
770
|
+
c.value == !1 ? U() : n && De(n);
|
|
769
771
|
}, De = (n) => {
|
|
770
772
|
const r = n.key || n.code;
|
|
771
773
|
(r === "Tab" || r === "Escape") && P(), r === "ArrowDown" && Oe(n), r === "ArrowUp" && Me(n), (r === "Enter" || r === " ") && Te(), n.preventDefault(), n.stopPropagation();
|
|
772
774
|
}, Te = () => {
|
|
773
|
-
j.value.length > 0 ? (l.value = !0, B(j.value[
|
|
775
|
+
j.value.length > 0 ? (l.value = !0, B(j.value[C.value])) : P();
|
|
774
776
|
}, Oe = (n) => {
|
|
775
|
-
k.value = !0,
|
|
777
|
+
k.value = !0, C.value < j.value.length - 1 && (n.preventDefault(), q.value = !1, C.value++, fe()?.focus());
|
|
776
778
|
}, Me = (n) => {
|
|
777
|
-
k.value = !0,
|
|
779
|
+
k.value = !0, C.value > 0 && (n.preventDefault(), q.value = !1, C.value--, fe()?.focus());
|
|
778
780
|
}, Ce = (n) => {
|
|
779
|
-
if (
|
|
780
|
-
|
|
781
|
-
const r =
|
|
782
|
-
if (!(H ||
|
|
781
|
+
if (c?.value === !1) return;
|
|
782
|
+
S.value.length > 0 && (l.value = !0);
|
|
783
|
+
const r = b?.value?.listContainerRef, p = h?.value?.textInputRef, T = n?.relatedTarget && p?.isEqualNode(n?.relatedTarget), H = n?.relatedTarget && r && r.contains(n?.relatedTarget), ae = n?.relatedTarget && r && r.isEqualNode(n?.relatedTarget);
|
|
784
|
+
if (!(H || T)) {
|
|
783
785
|
if (ae) {
|
|
784
786
|
u();
|
|
785
787
|
return;
|
|
@@ -793,8 +795,8 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
793
795
|
function ke(n) {
|
|
794
796
|
(!o.objectLabelKeyName || o.objectLabelKeyName.length === 0) && Y();
|
|
795
797
|
const r = o.objectLabelKeyName;
|
|
796
|
-
for (let
|
|
797
|
-
(typeof n[
|
|
798
|
+
for (let p = 0; p < n.length; p++)
|
|
799
|
+
(typeof n[p] != "object" || !(r in n[p])) && Y();
|
|
798
800
|
}
|
|
799
801
|
const ue = {
|
|
800
802
|
openList: U,
|
|
@@ -806,14 +808,14 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
806
808
|
focusInput: u,
|
|
807
809
|
closeList: P
|
|
808
810
|
};
|
|
809
|
-
return (n, r) => (x(),
|
|
811
|
+
return (n, r) => (x(), M("div", {
|
|
810
812
|
style: { position: "relative" },
|
|
811
813
|
class: R(n.$attrs.class)
|
|
812
814
|
}, [
|
|
813
815
|
Q(he, {
|
|
814
816
|
ref_key: "itemListRef",
|
|
815
|
-
ref:
|
|
816
|
-
"show-drop-down":
|
|
817
|
+
ref: b,
|
|
818
|
+
"show-drop-down": c.value,
|
|
817
819
|
filteredListItems: j.value,
|
|
818
820
|
mouseHoveringOnList: q.value,
|
|
819
821
|
focusedIndex: A.value,
|
|
@@ -822,9 +824,9 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
822
824
|
"list-animation-duration-ms": e.listAnimationDurationMs,
|
|
823
825
|
"parent-methods": ue,
|
|
824
826
|
blockListChange: l.value,
|
|
825
|
-
"onUpdate:blockListChange": r[1] || (r[1] = (
|
|
827
|
+
"onUpdate:blockListChange": r[1] || (r[1] = (p) => l.value = p),
|
|
826
828
|
"total-options-count": t.value,
|
|
827
|
-
onReverseDropDownList: r[2] || (r[2] = (
|
|
829
|
+
onReverseDropDownList: r[2] || (r[2] = (p) => y.value = p),
|
|
828
830
|
enableScrollClose: J.value,
|
|
829
831
|
"enable-text-filter": s.value
|
|
830
832
|
}, {
|
|
@@ -833,21 +835,21 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
833
835
|
ref_key: "dropDownButtonInput",
|
|
834
836
|
ref: V,
|
|
835
837
|
"parent-methods": ue,
|
|
836
|
-
"show-drop-down":
|
|
838
|
+
"show-drop-down": c.value,
|
|
837
839
|
"enable-text-filter": s.value,
|
|
838
840
|
"custom-icon": e.customIcon,
|
|
839
|
-
"reverse-drop-down-list":
|
|
841
|
+
"reverse-drop-down-list": y.value
|
|
840
842
|
}, {
|
|
841
843
|
default: me(() => [
|
|
842
844
|
Q(be, {
|
|
843
845
|
ref_key: "dropDownTextInput",
|
|
844
|
-
ref:
|
|
846
|
+
ref: h,
|
|
845
847
|
"enable-text-filter": s.value,
|
|
846
|
-
"show-drop-down":
|
|
848
|
+
"show-drop-down": c.value,
|
|
847
849
|
placeholder: oe.value,
|
|
848
850
|
"enable-button-click": k.value,
|
|
849
851
|
"parent-methods": ue,
|
|
850
|
-
"onUpdate:query": r[0] || (r[0] = (
|
|
852
|
+
"onUpdate:query": r[0] || (r[0] = (p) => S.value = p)
|
|
851
853
|
}, null, 8, ["enable-text-filter", "show-drop-down", "placeholder", "enable-button-click"])
|
|
852
854
|
]),
|
|
853
855
|
_: 1
|
|
@@ -857,7 +859,7 @@ const ge = /* @__PURE__ */ K(Ge, [["render", et]]), tt = ["tabindex"], nt = {
|
|
|
857
859
|
}, 8, ["show-drop-down", "filteredListItems", "mouseHoveringOnList", "focusedIndex", "selectedIndex", "max-list-height-p-x", "list-animation-duration-ms", "blockListChange", "total-options-count", "enableScrollClose", "enable-text-filter"])
|
|
858
860
|
], 2));
|
|
859
861
|
}
|
|
860
|
-
}), lt = /* @__PURE__ */ K(st, [["__scopeId", "data-v-
|
|
862
|
+
}), lt = /* @__PURE__ */ K(st, [["__scopeId", "data-v-e1f079fa"]]);
|
|
861
863
|
export {
|
|
862
864
|
lt as default
|
|
863
865
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jblehm/super-list",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.15",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist/ListInputComponents",
|
|
@@ -28,7 +28,8 @@
|
|
|
28
28
|
"types": "vue-tsc",
|
|
29
29
|
"preview": "vite preview",
|
|
30
30
|
"lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
|
|
31
|
-
"format": "prettier --write src/"
|
|
31
|
+
"format": "prettier --write src/",
|
|
32
|
+
"serve": "vite serve --host"
|
|
32
33
|
},
|
|
33
34
|
"dependencies": {
|
|
34
35
|
"vue": "^3.5.10"
|