@jblehm/super-list 1.0.43 → 1.0.44

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.
Files changed (7) hide show
  1. package/README.md +1 -1
  2. package/dist/index.css +1 -1
  3. package/dist/super-list.js +109 -109
  4. package/dist/super-list.js.map +1 -1
  5. package/dist/super-list.umd.cjs +2 -2
  6. package/dist/super-list.umd.cjs.map +1 -1
  7. package/package.json +1 -1
package/README.md CHANGED
@@ -1,4 +1,4 @@
1
- # superlist V1.0.43
1
+ # superlist V1.0.44
2
2
  A minimally-styled, mobile supported searchable combobox for Vue.
3
3
 
4
4
  ![list_img_1.png](https://drive.google.com/thumbnail?id=1vccx8i3aOcXCjT1cflzeHJs0BNhj6I-u&sz=w1000)
package/dist/index.css CHANGED
@@ -1 +1 @@
1
- .list-filter-text-input[data-v-edeb41fa]{color:var(--superlist-text-colour, rgb(17, 24, 39));text-align:center;padding:.125rem 2rem .125rem .5rem;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-edeb41fa]:focus,.list-filter-text-input[data-v-edeb41fa]:focus-visible,.list-filter-text-input[data-v-edeb41fa]:active{text-align:left}.click-through[data-v-edeb41fa]{pointer-events:none}.dark-placeholder-text[data-v-edeb41fa]::placeholder{color:var(--superlist-text-colour, rgb(17, 24, 39))}.light-placeholder-text[data-v-edeb41fa]::placeholder{color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.text-filter-disabled[data-v-edeb41fa]{background-color:transparent;border:none;outline:none;box-shadow:none;filter:none}@media (min-width: 640px){.list-filter-text-input[data-v-edeb41fa]{font-size:.875rem;line-height:1.5rem}}.list-option[data-v-e4eeb2f7]{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-e4eeb2f7]:focus-visible,.list-option>span[data-v-e4eeb2f7]:focus-visible{outline:none}.list-option-selected[data-v-e4eeb2f7]{font-weight:600}.list-option-message[data-v-e4eeb2f7]{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-e4eeb2f7]:hover,.list-option-active[data-v-e4eeb2f7],.list-option-selected[data-v-e4eeb2f7]:hover,.list-option[data-v-e4eeb2f7]: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-e4eeb2f7]{display:flex;height:1rem;width:1rem;position:absolute;right:.7rem;margin-top:-.1rem;align-self:center}.list-item-span[data-v-e4eeb2f7]{padding:.5rem 1.75rem .5rem .75rem;width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-normal[data-v-bb412ce9]{top:var(--parent-y)}.list-reverse[data-v-bb412ce9]{bottom:var(--parent-y)}.select-list[data-v-bb412ce9]{--parent-width: var(--v15890c8c);--parent-x: var(--v4338b9be);--parent-y: var(--v4338bd7f);--duration: var(--v6e74f140);--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,box-shadow;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-bb412ce9]:focus-visible,.select-list>ul[data-v-bb412ce9]:focus-visible,.super-list-button-container[data-v-bb412ce9]:focus-visible{outline:none}.super-list-button-container[data-v-bb412ce9]{height:100%;width:100%}.select-list.select-list-open[data-v-bb412ce9]{z-index:999999;--max-height: var(--v4db56ff9);max-height:var(--max-height, 0)}.select-list.no-scroll[data-v-bb412ce9]{overflow:hidden}.select-list-fixed[data-v-bb412ce9]{position:fixed;opacity:1;visibility:visible}.list-content[data-v-bb412ce9]{--duration: var(--v6e74f140);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-bb412ce9]{border-radius:var(--border-radius)}.select-list[data-v-bb412ce9]:not(.select-list-fixed){transition:none;box-shadow:none!important}@media (min-width: 640px){.select-list.select-list-scrollable[data-v-bb412ce9]{border-radius:var(--border-radius) 0 0 var(--border-radius)}.list-content[data-v-bb412ce9]{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-c7006a45]{box-sizing:border-box}
1
+ .list-filter-text-input[data-v-edeb41fa]{color:var(--superlist-text-colour, rgb(17, 24, 39));text-align:center;padding:.125rem 2rem .125rem .5rem;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-edeb41fa]:focus,.list-filter-text-input[data-v-edeb41fa]:focus-visible,.list-filter-text-input[data-v-edeb41fa]:active{text-align:left}.click-through[data-v-edeb41fa]{pointer-events:none}.dark-placeholder-text[data-v-edeb41fa]::placeholder{color:var(--superlist-text-colour, rgb(17, 24, 39))}.light-placeholder-text[data-v-edeb41fa]::placeholder{color:var(--superlist-disabled-text-colour, rgb(120, 125, 130))}.text-filter-disabled[data-v-edeb41fa]{background-color:transparent;border:none;outline:none;box-shadow:none;filter:none}@media (min-width: 640px){.list-filter-text-input[data-v-edeb41fa]{font-size:.875rem;line-height:1.5rem}}.list-option[data-v-e4eeb2f7]{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-e4eeb2f7]:focus-visible,.list-option>span[data-v-e4eeb2f7]:focus-visible{outline:none}.list-option-selected[data-v-e4eeb2f7]{font-weight:600}.list-option-message[data-v-e4eeb2f7]{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-e4eeb2f7]:hover,.list-option-active[data-v-e4eeb2f7],.list-option-selected[data-v-e4eeb2f7]:hover,.list-option[data-v-e4eeb2f7]: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-e4eeb2f7]{display:flex;height:1rem;width:1rem;position:absolute;right:.7rem;margin-top:-.1rem;align-self:center}.list-item-span[data-v-e4eeb2f7]{padding:.5rem 1.75rem .5rem .75rem;width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.list-normal[data-v-bb412ce9]{top:var(--parent-y)}.list-reverse[data-v-bb412ce9]{bottom:var(--parent-y)}.select-list[data-v-bb412ce9]{--parent-width: var(--v15890c8c);--parent-x: var(--v4338b9be);--parent-y: var(--v4338bd7f);--duration: var(--v6e74f140);--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,box-shadow;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-bb412ce9]:focus-visible,.select-list>ul[data-v-bb412ce9]:focus-visible,.super-list-button-container[data-v-bb412ce9]:focus-visible{outline:none}.super-list-button-container[data-v-bb412ce9]{height:100%;width:100%}.select-list.select-list-open[data-v-bb412ce9]{z-index:999999;--max-height: var(--v4db56ff9);max-height:var(--max-height, 0)}.select-list.no-scroll[data-v-bb412ce9]{overflow:hidden}.select-list-fixed[data-v-bb412ce9]{position:fixed;opacity:1;visibility:visible}.list-content[data-v-bb412ce9]{--duration: var(--v6e74f140);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-bb412ce9]{border-radius:var(--border-radius)}.select-list[data-v-bb412ce9]:not(.select-list-fixed){transition:none;box-shadow:none!important}@media (min-width: 640px){.select-list.select-list-scrollable[data-v-bb412ce9]{border-radius:var(--border-radius) 0 0 var(--border-radius)}.list-content[data-v-bb412ce9]{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-55c6d2bd]{box-sizing:border-box}
package/dist/super-list.js CHANGED
@@ -1,5 +1,5 @@
1
- import { defineComponent as Y, ref as v, computed as M, openBlock as T, createElementBlock as C, withModifiers as Q, createElementVNode as B, normalizeClass as R, withKeys as h, useTemplateRef as Ee, watch as F, Fragment as fe, renderList as Ae, toDisplayString as me, createBlock as pe, createCommentVNode as K, useCssVars as Ne, onMounted as Le, onUnmounted as Se, renderSlot as xe, createVNode as Z, nextTick as Fe, resolveDynamicComponent as Be, withCtx as be } from "vue";
2
- class He {
1
+ import { defineComponent as Y, ref as v, computed as M, openBlock as T, createElementBlock as C, withModifiers as Q, createElementVNode as B, normalizeClass as R, withKeys as h, useTemplateRef as Ne, watch as F, Fragment as fe, renderList as Se, toDisplayString as me, createBlock as pe, createCommentVNode as K, useCssVars as Fe, onMounted as Le, onUnmounted as Be, renderSlot as xe, createVNode as Z, nextTick as He, resolveDynamicComponent as Re, withCtx as be } from "vue";
2
+ class Pe {
3
3
  eventsTypes = ["resize", "load", "scroll", "wheel", "touchmove"];
4
4
  config = {
5
5
  attributes: !0,
@@ -46,13 +46,13 @@ class He {
46
46
  window.removeEventListener("resize", this.callbackFunction);
47
47
  }
48
48
  }
49
- function Re(e, i, d, b) {
50
- return i != null ? i(e) : e == null ? "" : typeof e == "object" ? e[d] : b ? Pe(e, b) : "" + e;
49
+ function qe(e, i, d, b) {
50
+ return i != null ? i(e) : e == null ? "" : typeof e == "object" ? e[d] : b ? je(e, b) : "" + e;
51
51
  }
52
- function Pe(e, i) {
52
+ function je(e, i) {
53
53
  return i.find((d) => d.type === e)?.label ?? "";
54
54
  }
55
- class qe {
55
+ class $e {
56
56
  constructor() {
57
57
  this.abortController = new AbortController(), this.func = () => {
58
58
  }, this.then = () => {
@@ -79,7 +79,7 @@ class qe {
79
79
  return this.abort("New Request From Controller."), this.setFunc(i), this.setThen(d), this.execute();
80
80
  }
81
81
  }
82
- const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Y({
82
+ const Ke = ["tabindex", "placeholder", "size"], Ve = /* @__PURE__ */ Y({
83
83
  __name: "ListTextInput",
84
84
  props: {
85
85
  enableTextFilter: {
@@ -165,7 +165,7 @@ const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Y({
165
165
  A.value,
166
166
  { "text-filter-disabled": !e.enableTextFilter }
167
167
  ], "list-filter-text-input"])
168
- }, null, 42, je)
168
+ }, null, 42, Ke)
169
169
  ], 32));
170
170
  }
171
171
  }), V = (e, i) => {
@@ -173,22 +173,22 @@ const je = ["tabindex", "placeholder", "size"], $e = /* @__PURE__ */ Y({
173
173
  for (const [b, o] of i)
174
174
  d[b] = o;
175
175
  return d;
176
- }, he = /* @__PURE__ */ V($e, [["__scopeId", "data-v-edeb41fa"]]), Ke = {}, Ve = {
176
+ }, he = /* @__PURE__ */ V(Ve, [["__scopeId", "data-v-edeb41fa"]]), ze = {}, Xe = {
177
177
  xmlns: "http://www.w3.org/2000/svg",
178
178
  fill: "currentColor",
179
179
  "aria-hidden": "true",
180
180
  "data-slot": "icon",
181
181
  viewBox: "0 -16 16 17"
182
182
  };
183
- function ze(e, i) {
184
- return T(), C("svg", Ve, [...i[0] || (i[0] = [
183
+ function Ue(e, i) {
184
+ return T(), C("svg", Xe, [...i[0] || (i[0] = [
185
185
  B("path", {
186
186
  "shape-rendering": "geometricPrecision",
187
187
  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"
188
188
  }, null, -1)
189
189
  ])]);
190
190
  }
191
- const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = { class: "list-item-span" }, We = { class: "list-item-span" }, Qe = /* @__PURE__ */ Y({
191
+ const Je = /* @__PURE__ */ V(ze, [["render", Ue]]), We = ["onMousedown"], Qe = { class: "list-item-span" }, Ze = { class: "list-item-span" }, Ye = /* @__PURE__ */ Y({
192
192
  __name: "ListItem",
193
193
  props: {
194
194
  mouseHoveringOnList: {
@@ -225,7 +225,7 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
225
225
  }
226
226
  },
227
227
  setup(e) {
228
- const i = e, d = Ee("items"), b = M(() => {
228
+ const i = e, d = Ne("items"), b = M(() => {
229
229
  if (!d?.value) return null;
230
230
  const t = (Array.isArray(d.value) ? d.value : [d.value])[i.focusedIndex];
231
231
  return t && typeof t == "object" && "scrollIntoView" in t && typeof t.scrollIntoView == "function" ? t : null;
@@ -250,7 +250,7 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
250
250
  s && (t.scrollTop = L.offsetTop), c && (t.scrollTop = L.offsetTop + L.clientHeight - t.clientHeight);
251
251
  }
252
252
  return (L, t) => (T(), C(fe, null, [
253
- (T(!0), C(fe, null, Ae(e.filteredListItems, (s, c) => (T(), C("li", {
253
+ (T(!0), C(fe, null, Se(e.filteredListItems, (s, c) => (T(), C("li", {
254
254
  key: c,
255
255
  ref_for: !0,
256
256
  ref: "items",
@@ -274,13 +274,13 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
274
274
  "list-option"
275
275
  ])
276
276
  }, [
277
- B("span", Je, me(e.parentMethods.getLabel(s)), 1),
278
- e.selectedIndex === c ? (T(), pe(Xe, {
277
+ B("span", Qe, me(e.parentMethods.getLabel(s)), 1),
278
+ e.selectedIndex === c ? (T(), pe(Je, {
279
279
  key: 0,
280
280
  class: "list-item-icon",
281
281
  "aria-hidden": "true"
282
282
  })) : K("", !0)
283
- ], 42, Ue))), 128)),
283
+ ], 42, We))), 128)),
284
284
  e.filteredListItems.length === 0 ? (T(), C("li", {
285
285
  key: 0,
286
286
  onKeyup: [
@@ -315,11 +315,11 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
315
315
  tabindex: "-1",
316
316
  class: "list-option-message"
317
317
  }, [
318
- B("span", We, " +" + me(e.totalOptionsCount - e.filteredListItems?.length || 0) + " More Items...", 1)
318
+ B("span", Ze, " +" + me(e.totalOptionsCount - e.filteredListItems?.length || 0) + " More Items...", 1)
319
319
  ], 32)) : K("", !0)
320
320
  ], 64));
321
321
  }
322
- }), Ze = /* @__PURE__ */ V(Qe, [["__scopeId", "data-v-e4eeb2f7"]]), Ye = /* @__PURE__ */ Y({
322
+ }), Ge = /* @__PURE__ */ V(Ye, [["__scopeId", "data-v-e4eeb2f7"]]), _e = /* @__PURE__ */ Y({
323
323
  __name: "ItemList",
324
324
  props: {
325
325
  mouseHoveringOnList: {
@@ -369,7 +369,7 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
369
369
  },
370
370
  emits: ["reverseDropDownList"],
371
371
  setup(e, { expose: i, emit: d }) {
372
- Ne((l) => ({
372
+ Fe((r) => ({
373
373
  v15890c8c: A.value,
374
374
  v4338b9be: S.value,
375
375
  v4338bd7f: se.value,
@@ -379,17 +379,17 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
379
379
  const b = d, o = e, p = v(null), L = v(null), t = v(null), s = v(0), c = v(0), u = v(0), w = v(0), A = v("0px"), I = v(!1), N = v([]), g = v(0), a = M(() => !I.value || window?.innerHeight == null ? !1 : le() && G()), m = M(() => o.maxListHeightPX >= g.value);
380
380
  F(
381
381
  () => a.value,
382
- (l) => b("reverseDropDownList", l),
382
+ (r) => b("reverseDropDownList", r),
383
383
  { immediate: !0 }
384
384
  );
385
385
  const S = M(() => s.value + "px"), se = M(() => w.value + "px");
386
386
  i({ listContainerRef: t });
387
- const P = (l) => {
388
- l?.key && l.key === " " && l.preventDefault();
389
- }, ie = (l) => {
390
- o.parentMethods.unfocus(l);
391
- }, U = (l) => {
392
- const y = t?.value, x = l.target;
387
+ const P = (r) => {
388
+ r?.key && r.key === " " && r.preventDefault();
389
+ }, ie = (r) => {
390
+ o.parentMethods.unfocus(r);
391
+ }, U = (r) => {
392
+ const y = t?.value, x = r.target;
393
393
  (!(y && x && y.contains(x)) || y.isEqualNode(x)) && o.parentMethods.focusInput();
394
394
  };
395
395
  function k() {
@@ -397,8 +397,8 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
397
397
  }
398
398
  function z() {
399
399
  if (!I.value || k() === 0) return o.maxListHeightPX;
400
- const l = k() === 0 ? o.maxListHeightPX : +k();
401
- return o.maxListHeightPX && o.maxListHeightPX > l ? l : o.maxListHeightPX;
400
+ const r = k() === 0 ? o.maxListHeightPX : +k();
401
+ return o.maxListHeightPX && o.maxListHeightPX > r ? r : o.maxListHeightPX;
402
402
  }
403
403
  function le() {
404
404
  return c.value > z();
@@ -409,38 +409,38 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
409
409
  const q = M(() => (o.maxListHeightPX || 0) + "px"), _ = M(() => (o.listAnimationDurationMs || 0) + "ms"), E = M(() => o.blockListChange ? N.value : o.filteredListItems);
410
410
  F(
411
411
  () => E,
412
- (l) => {
413
- l && (N.value = l.value);
412
+ (r) => {
413
+ r && (N.value = r.value);
414
414
  },
415
415
  { immediate: !1, deep: !0 }
416
416
  );
417
417
  let j = setTimeout(() => {
418
- }, 0), D = null;
418
+ }, 0), O = null;
419
419
  function re() {
420
- g.value = k(), clearTimeout(j), D && D.observe(), I.value = !0, X(void 0);
420
+ g.value = k(), clearTimeout(j), O && O.observe(), I.value = !0, X(void 0);
421
421
  }
422
422
  function ee() {
423
423
  clearTimeout(j), j = setTimeout(() => {
424
- o.showDropDown || (I.value = !1, D && D.unobserve());
424
+ o.showDropDown || (I.value = !1, O && O.unobserve());
425
425
  }, o.listAnimationDurationMs + 50);
426
426
  }
427
427
  F(
428
428
  () => o.showDropDown,
429
- (l, y) => {
430
- l !== y && ($(), l ? re() : ee());
429
+ (r, y) => {
430
+ r !== y && ($(), r ? re() : ee());
431
431
  },
432
432
  { immediate: !0 }
433
433
  );
434
- function X(l) {
435
- $(), Fe(() => $()), te(l);
434
+ function X(r) {
435
+ $(), He(() => $()), te(r);
436
436
  }
437
- function te(l) {
438
- if (!o.enableScrollClose || !o.showDropDown || typeof t?.value?.contains != "function" || l?.target?.nodeType == null || ue(l)) return;
439
- const x = ["scroll", "wheel", "touchmove"].includes(l?.type);
437
+ function te(r) {
438
+ if (!o.enableScrollClose || !o.showDropDown || typeof t?.value?.contains != "function" || r?.target?.nodeType == null || ue(r)) return;
439
+ const x = ["scroll", "wheel", "touchmove"].includes(r?.type);
440
440
  o.showDropDown && x && o.parentMethods.closeList();
441
441
  }
442
- function ue(l) {
443
- const y = !!p.value?.contains(l?.target), x = !!t.value?.contains(l.target), W = [l?.srcElement?.id, l?.target?.id].includes("super-list-select-list");
442
+ function ue(r) {
443
+ const y = !!p.value?.contains(r?.target), x = !!t.value?.contains(r.target), W = [r?.srcElement?.id, r?.target?.id].includes("super-list-select-list");
444
444
  return y || x || W;
445
445
  }
446
446
  function $() {
@@ -448,13 +448,13 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
448
448
  }
449
449
  function J() {
450
450
  if (p?.value == null) return;
451
- const l = p.value.getBoundingClientRect();
452
- c.value = l.top, u.value = window.innerHeight - l.bottom, A.value = l.width + "px";
451
+ const r = p.value.getBoundingClientRect();
452
+ c.value = r.top, u.value = window.innerHeight - r.bottom, A.value = r.width + "px";
453
453
  }
454
454
  function ae() {
455
455
  if (p?.value == null || t?.value == null) return;
456
- const l = oe().getBoundingClientRect(), y = t.value.getBoundingClientRect(), x = w.value, W = s.value;
457
- a.value ? w.value = x - (l.top - y.bottom) : w.value = x - (y.top - l.bottom), s.value = W - (y.left - l.left);
456
+ const r = oe().getBoundingClientRect(), y = t.value.getBoundingClientRect(), x = w.value, W = s.value;
457
+ a.value ? w.value = x - (r.top - y.bottom) : w.value = x - (y.top - r.bottom), s.value = W - (y.left - r.left);
458
458
  }
459
459
  function ne() {
460
460
  return (p?.value).getElementsByTagName("button")[0];
@@ -463,16 +463,16 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
463
463
  return p?.value;
464
464
  }
465
465
  return Le(() => {
466
- D = new He(X, ne()), setTimeout(() => X(void 0), 250);
467
- }), Se(() => {
468
- D?.unobserve();
469
- }), (l, y) => (T(), C(fe, null, [
466
+ O = new Pe(X, ne()), setTimeout(() => X(void 0), 250);
467
+ }), Be(() => {
468
+ O?.unobserve();
469
+ }), (r, y) => (T(), C(fe, null, [
470
470
  B("div", {
471
471
  ref_key: "dropDownButtonContainer",
472
472
  ref: p,
473
473
  class: "super-list-button-container"
474
474
  }, [
475
- xe(l.$slots, "default", {}, void 0, !0)
475
+ xe(r.$slots, "default", {}, void 0, !0)
476
476
  ], 512),
477
477
  B("div", {
478
478
  id: "super-list-select-list",
@@ -498,7 +498,7 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
498
498
  ref: L,
499
499
  class: "list-content"
500
500
  }, [
501
- Z(Ze, {
501
+ Z(Ge, {
502
502
  filteredListItems: N.value,
503
503
  mouseHoveringOnList: e.mouseHoveringOnList,
504
504
  focusedIndex: e.focusedIndex,
@@ -512,25 +512,25 @@ const Xe = /* @__PURE__ */ V(Ke, [["render", ze]]), Ue = ["onMousedown"], Je = {
512
512
  ], 34)
513
513
  ], 64));
514
514
  }
515
- }), ge = /* @__PURE__ */ V(Ye, [["__scopeId", "data-v-bb412ce9"]]), Ge = {}, _e = {
515
+ }), ge = /* @__PURE__ */ V(_e, [["__scopeId", "data-v-bb412ce9"]]), et = {}, tt = {
516
516
  xmlns: "http://www.w3.org/2000/svg",
517
517
  fill: "currentColor",
518
518
  "aria-hidden": "true",
519
519
  "data-slot": "icon",
520
520
  viewBox: "0 0 12 6"
521
521
  };
522
- function et(e, i) {
523
- return T(), C("svg", _e, [...i[0] || (i[0] = [
522
+ function nt(e, i) {
523
+ return T(), C("svg", tt, [...i[0] || (i[0] = [
524
524
  B("path", {
525
525
  "shape-rendering": "geometricPrecision",
526
526
  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"
527
527
  }, null, -1)
528
528
  ])]);
529
529
  }
530
- const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
530
+ const ye = /* @__PURE__ */ V(et, [["render", nt]]), ot = ["tabindex"], st = {
531
531
  key: 2,
532
532
  class: "list-button-icon custom-icon"
533
- }, ot = /* @__PURE__ */ Y({
533
+ }, it = /* @__PURE__ */ Y({
534
534
  __name: "ListButton",
535
535
  props: {
536
536
  // eslint-disable-line
@@ -607,13 +607,13 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
607
607
  "aria-hidden": "true"
608
608
  })) : K("", !0)
609
609
  ], 2)),
610
- e.customIcon ? (T(), C("span", nt, [
611
- (T(), pe(Be(e.customIcon), { "aria-hidden": "true" }))
610
+ e.customIcon ? (T(), C("span", st, [
611
+ (T(), pe(Re(e.customIcon), { "aria-hidden": "true" }))
612
612
  ])) : K("", !0)
613
613
  ], 2)
614
- ], 42, tt));
614
+ ], 42, ot));
615
615
  }
616
- }), we = /* @__PURE__ */ V(ot, [["__scopeId", "data-v-01ef8e37"]]), st = /* @__PURE__ */ Y({
616
+ }), we = /* @__PURE__ */ V(it, [["__scopeId", "data-v-01ef8e37"]]), lt = /* @__PURE__ */ Y({
617
617
  __name: "super-list",
618
618
  props: {
619
619
  selected: {
@@ -662,11 +662,11 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
662
662
  },
663
663
  emits: { "update:selected": null },
664
664
  setup(e, { expose: i, emit: d }) {
665
- const b = d, o = e, p = v([]), L = new qe(), t = v(0), s = M(() => o.forceTextFilterVisibilityTo != null ? o.forceTextFilterVisibilityTo : t.value > o.maxListOptions), c = v(!1), u = v(!1), w = v(!1), A = v(!0), I = v(!1), N = v(!1), g = v(ge), a = v(he), m = v(we), S = v("");
665
+ const b = d, o = e, p = v([]), L = new $e(), t = v(0), s = M(() => o.forceTextFilterVisibilityTo != null ? o.forceTextFilterVisibilityTo : t.value > o.maxListOptions), c = v(!1), u = v(!1), w = v(!1), A = v(!0), I = v(!1), N = v(!1), g = v(ge), a = v(he), m = v(we), S = v("");
666
666
  F(
667
667
  () => S.value,
668
- (n, r) => {
669
- n !== r && typeof o.options == "function" && y(n);
668
+ (n, l) => {
669
+ n !== l && typeof o.options == "function" && y(n);
670
670
  }
671
671
  );
672
672
  const se = () => {
@@ -675,7 +675,7 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
675
675
  clearTimeout(J), se(), S.value = "", c.value = !1, A.value = !0;
676
676
  }, ie = M(() => N?.value === !0 ? "Error loading data" : I?.value === !0 ? "Loading..." : k(o.selected)), U = (n) => {
677
677
  n && b("update:selected", n), P();
678
- }, k = (n) => Re(
678
+ }, k = (n) => qe(
679
679
  n,
680
680
  o.customPlaceHolderFunction,
681
681
  o.objectLabelKeyName,
@@ -696,8 +696,8 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
696
696
  const q = v(!1), _ = v(0), E = v(0), j = v(0);
697
697
  F(
698
698
  () => E.value,
699
- (n, r) => {
700
- n != r && !u.value && (j.value = n);
699
+ (n, l) => {
700
+ n != l && !u.value && (j.value = n);
701
701
  },
702
702
  { immediate: !0 }
703
703
  ), F(
@@ -707,15 +707,15 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
707
707
  },
708
708
  { immediate: !0 }
709
709
  );
710
- const D = M(() => {
710
+ const O = M(() => {
711
711
  if (typeof o.options == "function" && !Array.isArray(o.options)) return p.value;
712
- const n = S.value, r = p.value;
713
- return n === "" ? r : r.filter((f) => k(f).toLowerCase().includes(n.toLowerCase()));
712
+ const n = S.value, l = p.value;
713
+ return n === "" ? l : l.filter((f) => k(f).toLowerCase().includes(n.toLowerCase()));
714
714
  });
715
715
  F(
716
- () => D.value,
717
- (n, r) => {
718
- JSON.stringify(n) !== JSON.stringify(r) && ee();
716
+ () => O.value,
717
+ (n, l) => {
718
+ JSON.stringify(n) !== JSON.stringify(l) && ee();
719
719
  },
720
720
  { immediate: !1, deep: !0 }
721
721
  );
@@ -727,14 +727,14 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
727
727
  };
728
728
  function X() {
729
729
  if (o.selected == null) return -1;
730
- const n = D.value.map((f) => k(f)), r = n.filter((f) => f === k(o.selected));
731
- if (r.length > 1) {
732
- const f = r.map((O) => n.indexOf(O));
733
- for (let O = 0; O < f.length; O++) {
730
+ const n = O.value.map((f) => k(f)), l = n.filter((f) => f === k(o.selected));
731
+ if (l.length > 1) {
732
+ const f = l.map((D) => n.indexOf(D));
733
+ for (let D = 0; D < f.length; D++) {
734
734
  const H = JSON.stringify(
735
- D.value[f[O]]
735
+ O.value[f[D]]
736
736
  ), ce = JSON.stringify(o.selected);
737
- if (H === ce) return f[O];
737
+ if (H === ce) return f[D];
738
738
  }
739
739
  return -1;
740
740
  }
@@ -743,8 +743,8 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
743
743
  const te = () => {
744
744
  I.value || (c.value || (u.value = !1, ee(), ue(), c.value = !0), q.value = !1, A.value = !1);
745
745
  }, ue = () => {
746
- const n = window?.innerWidth != null && window.innerWidth < 640, r = screen?.width != null && screen.width < 640, f = a.value.textInputRef;
747
- (n || r) && s.value && (ae(), o.scrollTextInputToTopOnMobile && f?.scrollIntoView({ block: "start", inline: "center" }));
746
+ const n = window?.innerWidth != null && window.innerWidth < 640, l = screen?.width != null && screen.width < 640, f = a.value.textInputRef;
747
+ (n || l) && s.value && (ae(), o.scrollTextInputToTopOnMobile && f?.scrollIntoView({ block: "start", inline: "center" }));
748
748
  }, $ = v(!0);
749
749
  let J = setTimeout(() => {
750
750
  }, 0);
@@ -752,13 +752,13 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
752
752
  const n = a.value.textInputRef;
753
753
  if (!n) return;
754
754
  $.value = !1;
755
- let r = null;
755
+ let l = null;
756
756
  const f = () => {
757
- r && clearInterval(r), clearTimeout(J), setTimeout(() => {
757
+ l && clearInterval(l), clearTimeout(J), setTimeout(() => {
758
758
  $.value = !0;
759
759
  }, 100);
760
760
  };
761
- J = setTimeout(f, 5e3), r = setInterval(() => {
761
+ J = setTimeout(f, 5e3), l = setInterval(() => {
762
762
  (c.value === !1 || n?.scrollTop === 0 && document.readyState === "complete") && f();
763
763
  }, 100);
764
764
  }
@@ -766,45 +766,45 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
766
766
  s?.value == !0 ? a.value.focusInput() : m?.value?.focusInput && m?.value?.focusInput();
767
767
  };
768
768
  async function oe() {
769
- typeof o.options == "function" ? await y(S.value ? S.value : void 0, !0) : (x(o.options), t.value = p.value.length), l();
769
+ typeof o.options == "function" ? await y(S.value ? S.value : void 0, !0) : (x(o.options), t.value = p.value.length), r();
770
770
  }
771
771
  i({ initializeOptions: oe, getLabel: k });
772
- function l() {
772
+ function r() {
773
773
  X() == -1 && p.value && !!p.value[0] && U(p.value[0]);
774
774
  }
775
- async function y(n, r = !0) {
776
- I.value = r;
777
- const f = async () => o.options(o.maxListOptions, n || ""), O = (H) => {
775
+ async function y(n, l = !0) {
776
+ I.value = l;
777
+ const f = async () => o.options(o.maxListOptions, n || ""), D = (H) => {
778
778
  (!H || !("data" in H)) && z(), x(H.data), Ie(H?.data?.length ?? 0).then(() => {
779
779
  I.value = !1;
780
780
  });
781
781
  };
782
- await L.resetAndExecute(f, O);
782
+ await L.resetAndExecute(f, D);
783
783
  }
784
784
  function x(n) {
785
785
  Array.isArray(n) || z(), n.length > 0 && typeof n[0] == "object" && W(n), p.value = n;
786
786
  }
787
787
  function W(n) {
788
788
  (!o.objectLabelKeyName || o.objectLabelKeyName.length === 0) && G();
789
- const r = o.objectLabelKeyName;
789
+ const l = o.objectLabelKeyName;
790
790
  for (let f = 0; f < n.length; f++)
791
- (typeof n[f] != "object" || !(r in n[f])) && G();
791
+ (typeof n[f] != "object" || !(l in n[f])) && G();
792
792
  }
793
793
  async function Ie(n) {
794
- const r = async () => o.options(1, ""), f = (O) => {
795
- (!O || !("totalNum" in O)) && le(), t.value = O.totalNum ?? n;
794
+ const l = async () => o.options(1, ""), f = (D) => {
795
+ (!D || !("totalNum" in D)) && le(), t.value = D.totalNum ?? n;
796
796
  };
797
- await L.resetAndExecute(r, f);
797
+ await L.resetAndExecute(l, f);
798
798
  }
799
799
  const ve = () => a?.value?.textInputRef?.getElementsByTagName("li")[E.value] ?? null, Te = (n) => {
800
800
  c.value == !1 ? te() : n && De(n);
801
801
  }, De = (n) => {
802
- const r = n.key || n.code;
803
- (r === "Tab" || r === "Escape") && P(), r === "ArrowDown" && Me(n), r === "ArrowUp" && Ce(n), (r === "Enter" || r === " ") && Oe(), n.preventDefault(), n.stopPropagation();
802
+ const l = n.key || n.code;
803
+ (l === "Tab" || l === "Escape") && P(), l === "ArrowDown" && Me(n), l === "ArrowUp" && Ce(n), (l === "Enter" || l === " ") && Oe(), n.preventDefault(), n.stopPropagation();
804
804
  }, Oe = () => {
805
- D.value.length > 0 ? (u.value = !0, U(D.value[E.value])) : P();
805
+ O.value.length > 0 ? (u.value = !0, U(O.value[E.value])) : P();
806
806
  }, Me = (n) => {
807
- A.value = !0, E.value < D.value.length - 1 && (n.preventDefault(), q.value = !1, E.value++, ve()?.focus());
807
+ A.value = !0, E.value < O.value.length - 1 && (n.preventDefault(), q.value = !1, E.value++, ve()?.focus());
808
808
  }, Ce = (n) => {
809
809
  A.value = !0, E.value > 0 && (n.preventDefault(), q.value = !1, E.value--, ve()?.focus());
810
810
  }, de = {
@@ -812,8 +812,8 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
812
812
  unfocus: (n) => {
813
813
  if (c?.value === !1) return;
814
814
  S.value.length > 0 && (u.value = !0);
815
- const r = g?.value?.listContainerRef, f = a?.value?.textInputRef, O = m?.value?.buttonRef, H = n?.relatedTarget && f?.isEqualNode(n?.relatedTarget), ce = r?.contains(n?.relatedTarget) || O?.isEqualNode(n.relatedTarget), ke = n?.relatedTarget && r && r.isEqualNode(n?.relatedTarget);
816
- ce || H || (ke ? ne() : P());
815
+ const l = g?.value?.listContainerRef, f = a?.value?.textInputRef, D = m?.value?.buttonRef, H = n?.relatedTarget && f?.isEqualNode(n?.relatedTarget), ce = n?.relatedTarget && l && l.contains(n?.relatedTarget), ke = n?.relatedTarget && D && D.isEqualNode(n.relatedTarget), Ee = ce || ke, Ae = n?.relatedTarget && l && l.isEqualNode(n?.relatedTarget);
816
+ Ee || H || (Ae ? ne() : P());
817
817
  },
818
818
  press: Te,
819
819
  mouseOverList: re,
@@ -822,7 +822,7 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
822
822
  focusInput: ne,
823
823
  closeList: P
824
824
  };
825
- return (n, r) => (T(), C("div", {
825
+ return (n, l) => (T(), C("div", {
826
826
  style: { position: "relative" },
827
827
  class: R(n.$attrs.class)
828
828
  }, [
@@ -830,7 +830,7 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
830
830
  ref_key: "itemListRef",
831
831
  ref: g,
832
832
  "show-drop-down": c.value,
833
- filteredListItems: D.value,
833
+ filteredListItems: O.value,
834
834
  mouseHoveringOnList: q.value,
835
835
  focusedIndex: j.value,
836
836
  selectedIndex: _.value,
@@ -838,9 +838,9 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
838
838
  "list-animation-duration-ms": e.listAnimationDurationMs,
839
839
  "parent-methods": de,
840
840
  blockListChange: u.value,
841
- "onUpdate:blockListChange": r[1] || (r[1] = (f) => u.value = f),
841
+ "onUpdate:blockListChange": l[1] || (l[1] = (f) => u.value = f),
842
842
  "total-options-count": t.value,
843
- onReverseDropDownList: r[2] || (r[2] = (f) => w.value = f),
843
+ onReverseDropDownList: l[2] || (l[2] = (f) => w.value = f),
844
844
  enableScrollClose: $.value
845
845
  }, {
846
846
  default: be(() => [
@@ -862,7 +862,7 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
862
862
  placeholder: ie.value,
863
863
  "enable-button-click": A.value,
864
864
  "parent-methods": de,
865
- "onUpdate:query": r[0] || (r[0] = (f) => S.value = f)
865
+ "onUpdate:query": l[0] || (l[0] = (f) => S.value = f)
866
866
  }, null, 8, ["enable-text-filter", "show-drop-down", "placeholder", "enable-button-click"])
867
867
  ]),
868
868
  _: 1
@@ -872,8 +872,8 @@ const ye = /* @__PURE__ */ V(Ge, [["render", et]]), tt = ["tabindex"], nt = {
872
872
  }, 8, ["show-drop-down", "filteredListItems", "mouseHoveringOnList", "focusedIndex", "selectedIndex", "max-list-height-p-x", "list-animation-duration-ms", "blockListChange", "total-options-count", "enableScrollClose"])
873
873
  ], 2));
874
874
  }
875
- }), rt = /* @__PURE__ */ V(st, [["__scopeId", "data-v-c7006a45"]]);
875
+ }), at = /* @__PURE__ */ V(lt, [["__scopeId", "data-v-55c6d2bd"]]);
876
876
  export {
877
- rt as default
877
+ at as default
878
878
  };
879
879
  //# sourceMappingURL=super-list.js.map