adverich-kun-ui 0.1.55 → 0.1.57

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 (34) hide show
  1. package/dist/adverich-kun-ui.css +1 -1
  2. package/dist/components/KunAutocomplete/src/components/KunAutocomplete.vue.js +242 -202
  3. package/dist/components/KunAutocomplete/src/composables/KunAutocompleteProps.js +4 -1
  4. package/dist/components/KunAutocomplete/src/composables/useAutocomplete.js +82 -96
  5. package/dist/components/KunAutocomplete/src/utils/helpers.js +9 -1
  6. package/dist/components/KunBudge/src/components/KunBudge.vue.js +30 -38
  7. package/dist/components/KunInfiniteScroll/src/components/KunInfiniteScroll.vue.js +87 -0
  8. package/dist/components/KunInfiniteScroll/src/composables/useIntersectionObserver.js +51 -0
  9. package/dist/components/KunInfiniteScroll/src/composables/useKunInfiniteScroll.js +61 -0
  10. package/dist/components/KunList/src/components/KunList.vue.js +51 -15
  11. package/dist/components/KunListItem/src/components/KunListItem.vue.js +32 -15
  12. package/dist/components/KunListItemText/src/components/KunListItemText.vue.js +16 -7
  13. package/dist/components/KunListItemTitle/src/components/KunListItemTitle.vue.js +40 -0
  14. package/dist/components/KunTextField/src/components/KunTextField.vue.js +88 -62
  15. package/dist/components/KunVirtualScroller/src/components/KunVirtualScroller.vue.js +78 -0
  16. package/dist/components/kunMenu/src/components/kunMenu.vue.js +56 -145
  17. package/dist/components/kunMenu/src/composables/kunMenuProps.js +42 -23
  18. package/dist/components/kunMenu/src/composables/useKunMenu.js +42 -153
  19. package/dist/components/kunMenu/src/composables/useKunMenuStyles.js +29 -0
  20. package/dist/icons/IconAsterisk.vue.js +20 -0
  21. package/dist/icons/IconCheck.vue.js +20 -0
  22. package/dist/icons/IconClose.vue.js +16 -0
  23. package/dist/icons/IconDelete.vue.js +16 -0
  24. package/dist/icons/IconEdit.vue.js +16 -0
  25. package/dist/icons/IconMenuDownOutline.vue.js +20 -0
  26. package/dist/icons/IconMenuUpOutline.vue.js +20 -0
  27. package/dist/icons/IconSearch.vue.js +16 -0
  28. package/dist/icons/IconStar.vue.js +16 -0
  29. package/dist/icons/index.js +23 -0
  30. package/dist/index.js +33 -33
  31. package/package.json +7 -6
  32. package/dist/components/KunAutocomplete/src/composables/useIntersect.js +0 -23
  33. package/dist/components/kunMenu/src/composables/useKunMenuComposable.js +0 -25
  34. package/dist/components/kunMenu/src/composables/useKunScrollStrategy.js +0 -25
@@ -1,58 +1,58 @@
1
- import { ref as s, computed as i } from "vue";
2
- import { isArray as S, isObject as c } from "../utils/helpers.js";
3
- function ae(u, L, l, o, h) {
4
- const n = s(null), x = s(null), y = s(null), g = s(!1), v = s(""), R = s(!1), m = i(() => !u.searchableKeys.length), I = i(() => u.clearOnSelect), E = i(() => u.clearSearchOnSelect), D = i(() => u.focusOnSelect), N = i(() => u.closeOnSelect), j = (e, t) => t.split(".").reduce((r, a) => r && r[a] !== void 0 ? r[a] : null, e);
5
- function z() {
6
- S(l.value) && (l.value.length ? n.value = o.value.filter((e) => {
7
- let t = j(e, u.itemTitle);
8
- return c(e) ? l.value.some(
9
- (r) => j(r, u.itemTitle).includes(t)
1
+ import { ref as b, computed as d } from "vue";
2
+ import { isArray as o, isObject as a } from "../utils/helpers.js";
3
+ function W(u, C, l, h, G) {
4
+ const n = b(null), O = b(null), T = b(null), v = b(!1), c = b(""), g = (e, t) => t.split(".").reduce((r, i) => r && r[i] !== void 0 ? r[i] : null, e);
5
+ function L() {
6
+ o(l.value) && (l.value.length ? n.value = h.value.filter((e) => {
7
+ let t = g(e, u.itemTitle);
8
+ return a(e) ? l.value.some(
9
+ (r) => g(r, u.itemTitle).includes(t)
10
10
  ) : l.value.some((r) => r.includes(e));
11
- }) : n.value = []), (c(l.value) && Object.keys(l.value).length || typeof l.value == "number" && l.value || typeof l.value == "string" && l.value || typeof l.value == "boolean") && (n.value = o.value.find(
12
- (e) => c(e) ? u.returnObject ? u.itemValue ? e[u.itemValue] === l.value[u.itemValue] : e[u.itemTitle] === l.value[u.itemTitle] : e[u.itemValue] === l.value : e === l.value
11
+ }) : n.value = []), (a(l.value) && Object.keys(l.value).length || typeof l.value == "number" && l.value || typeof l.value == "string" && l.value || typeof l.value == "boolean") && (n.value = h.value.find(
12
+ (e) => a(e) ? u.returnObject ? u.itemValue ? e[u.itemValue] === l.value[u.itemValue] : e[u.itemTitle] === l.value[u.itemTitle] : e[u.itemValue] === l.value : e === l.value
13
13
  ));
14
14
  }
15
- const Z = i(() => n.value ? S(n.value) ? n.value.length ? d(n.value, u.itemTitle, "hasDefault") : u.placeholderText : c(n.value) ? d(n.value, u.itemTitle, "hasDefault") : n.value.toString() : o.value.length ? u.placeholderText : u.textNoItems), $ = i(() => u.startEmtpy && v.value.length < 3 ? [] : o.value.filter((t) => {
16
- if (c(t)) {
15
+ const M = d(() => n.value ? o(n.value) ? n.value.length ? x(n.value, u.itemTitle, "hasDefault") : u.placeholderText : a(n.value) ? x(n.value, u.itemTitle, "hasDefault") : n.value.toString() : h.value.length ? u.placeholderText : u.textNoItems), k = d(() => u.startEmtpy && c.value.length < 3 ? [] : h.value.filter((t) => {
16
+ if (a(t)) {
17
17
  const r = Object.values(t).filter((f) => {
18
- if (!c(f) && !S(f))
18
+ if (!a(f) && !o(f))
19
19
  return f;
20
- }), a = [t].reduce((f, w) => u.searchableKeys.map((T) => T.includes(".") ? T.split(".").reduce((M, ee) => M && M[ee], w) : w[T]), []), O = m.value ? r : a;
21
- return O ? O.some(
22
- (f) => f ? f.toString().toLowerCase().includes(v.value.toLowerCase()) : ""
23
- ) : v.value ? t == v.value : t;
20
+ }), i = [t].reduce((f, F) => u.searchableKeys.map((y) => y.includes(".") ? y.split(".").reduce((K, z) => K && K[z], F) : F[y]), []), s = u.searchableKeys.length ? i : r;
21
+ return s ? s.some(
22
+ (f) => f ? f.toString().toLowerCase().includes(c.value.toLowerCase()) : ""
23
+ ) : c.value ? t == c.value : t;
24
24
  }
25
- return t.toString().toLowerCase().includes(v.value.toLowerCase());
26
- }).slice(0, b.value)), q = i(() => u.itemText.includes(",") ? u.itemText.split(",") : u.itemText);
27
- function d(e, t, r) {
28
- if (c(e)) {
25
+ return t.toString().toLowerCase().includes(c.value.toLowerCase());
26
+ })), R = d(() => u.itemText.includes(",") ? u.itemText.split(",") : u.itemText);
27
+ function x(e, t, r) {
28
+ if (a(e)) {
29
29
  if (t) {
30
- if (S(t))
31
- return t.map((a) => e[a] ?? "No definido").join(" - ");
30
+ if (o(t))
31
+ return t.map((i) => e[i] ?? "No definido").join(" - ");
32
32
  if (t.includes(","))
33
- return t.split(",").map((a) => e[a]).join(" - ");
33
+ return t.split(",").map((i) => e[i]).join(" - ");
34
34
  if (t.includes(".")) {
35
- const a = t.split(".");
36
- let O = e;
37
- for (const f of a)
38
- O = O[f];
39
- return O;
35
+ const i = t.split(".");
36
+ let s = e;
37
+ for (const f of i)
38
+ s = s[f];
39
+ return s;
40
40
  }
41
41
  return !u.returnObject && typeof e[t] == "number" || e[t] ? e[t].toString() : "";
42
42
  }
43
43
  if (r)
44
44
  return Object.values(e)[0];
45
45
  }
46
- return S(e) ? u.returnObject ? e.map((a) => a[t]).join(" - ") : e.map((a) => a).join(" - ") : r && typeof e != "number" && e.includes(",") ? e.split(",") : e;
46
+ return o(e) ? u.returnObject ? e.map((i) => i[t]).join(" - ") : e.map((i) => i).join(" - ") : r && typeof e != "number" && e.includes(",") ? e.split(",") : e;
47
47
  }
48
- function G(e) {
48
+ function D(e) {
49
49
  let t = e[0];
50
50
  if (!u.multiple)
51
- n.value = e[0], u.returnObject && (l.value = t), !u.returnObject && c(t) && (u.itemValue ? l.value = t[u.itemValue] : l.value = Object.values(t)[0]), c(t) || (l.value = t), g.value = !1;
52
- else if (n.value || (n.value = []), A(t))
53
- t && C(t), l.value = n.value;
51
+ n.value = e[0], u.returnObject && (l.value = t), !u.returnObject && a(t) && (u.itemValue ? l.value = t[u.itemValue] : l.value = Object.values(t)[0]), a(t) || (l.value = t), v.value = !1;
52
+ else if (n.value || (n.value = []), S(t))
53
+ t && I(t), l.value = n.value;
54
54
  else {
55
- if (u.returnObject && n.value.push(t), !u.returnObject && c(t))
55
+ if (u.returnObject && n.value.push(t), !u.returnObject && a(t))
56
56
  if (u.itemValue)
57
57
  n.value.push(t[u.itemValue]);
58
58
  else {
@@ -61,17 +61,17 @@ function ae(u, L, l, o, h) {
61
61
  }
62
62
  l.value = n.value;
63
63
  }
64
- I.value && F(), x.value.focus();
64
+ u.clearOnSelect && w(), j();
65
65
  }
66
- function A(e) {
66
+ function S(e) {
67
67
  return n.value === null ? !1 : e ? n.value.some(
68
68
  (t) => u.returnObject ? t[u.itemValue] === e[u.itemValue] : t === e[u.itemValue]
69
69
  ) : !0;
70
70
  }
71
- function C(e) {
71
+ function I(e) {
72
72
  if (u.returnObject) {
73
73
  let t = n.value.find(
74
- (a) => a[u.itemValue] === e[u.itemValue]
74
+ (i) => i[u.itemValue] === e[u.itemValue]
75
75
  ), r = n.value.indexOf(t);
76
76
  n.value.splice(r, 1);
77
77
  } else {
@@ -79,79 +79,65 @@ function ae(u, L, l, o, h) {
79
79
  n.value.splice(t, 1);
80
80
  }
81
81
  }
82
- function H() {
83
- V(), E.value && (v.value = ""), D.value && x.value.focus();
82
+ function E() {
83
+ u.clearSearchOnSelect && (c.value = ""), u.focusOnSelect && j();
84
84
  }
85
- function J(e) {
86
- B(e.key) && (g.value = !0);
85
+ function m() {
86
+ v.value || (v.value = !0);
87
87
  }
88
- function B(e) {
89
- return /^[a-zA-Z0-9]$/.test(e);
88
+ function A(e) {
89
+ return e.length === 1 && e.match(/\w/);
90
+ }
91
+ function j() {
92
+ O.value.inputField.focus();
90
93
  }
91
- function Q() {
92
- g.value = !0, y.value && y.value.focus();
94
+ function N() {
95
+ v.value = !0, T.value && O.value.$el.focus();
93
96
  }
94
- function U(e) {
97
+ function B(e) {
95
98
  const t = e.key;
96
- (B(t) || t === "Backspace") && x.value.focus();
99
+ (A(t) || t === "Backspace") && (m(), j());
97
100
  }
98
- function W() {
99
- g.value = !1, L("createItem");
101
+ function P() {
102
+ v.value = !1, C("createItem");
100
103
  }
101
- function X(e) {
104
+ function $(e) {
102
105
  let t = n.value.indexOf(e);
103
106
  n.value.splice(t, 1), l.value = n.value;
104
107
  }
105
- function F() {
106
- v.value = "", S(l.value) && (n.value = []), c(l.value) && (n.value = {}), typeof l.value == "number" && l.value && (n.value = null), typeof l.value == "string" && l.value && (n.value = ""), typeof l.value == "boolean" && (n.value = !1), l.value = n.value;
108
+ function w() {
109
+ c.value = "", o(l.value) && (n.value = []), a(l.value) && (n.value = {}), typeof l.value == "number" && l.value && (n.value = null), typeof l.value == "string" && l.value && (n.value = ""), typeof l.value == "boolean" && (n.value = !1), l.value = n.value;
107
110
  }
108
- function Y(e) {
111
+ function q(e) {
109
112
  if (!e.disabledItem) return !1;
110
113
  if (e.disabledItem) return !0;
111
114
  }
112
- const K = s(null), b = s(h.value), _ = i(
113
- () => Math.ceil(o.value / h.value)
114
- ), k = i(() => _.length >= b.value);
115
- i(() => o.value.length);
116
- const P = i(
117
- () => h.value === b.value
118
- );
119
- function V() {
120
- b.value = h.value;
121
- }
122
- function p() {
123
- if (!(P.value && k.value) && !k.value)
124
- return b.value += h.value, K.value = b.value + h.value, o.value.slice(0, K.value);
125
- }
126
115
  return {
127
116
  selectedItem: n,
128
- textFieldRef: x,
129
- listRef: y,
130
- menuModel: g,
131
- search: v,
132
- isCloseOnSelect: N,
133
- isClearOnSelect: I,
134
- getItemText: j,
135
- setSelectedItemValue: z,
136
- placeholder: Z,
137
- filteredItems: $,
138
- textArr: q,
139
- itemToString: d,
140
- getSelectedItem: G,
141
- checkIfValueExist: A,
142
- removeFromArray: C,
143
- lightReset: H,
144
- openMenu: J,
145
- focusOnMenu: Q,
146
- onMenuKeydown: U,
147
- createItem: W,
148
- removeItem: X,
149
- clearSelection: F,
150
- checkDisabled: Y,
151
- handleIntersect: p,
152
- intersectObserved: R
117
+ textFieldRef: O,
118
+ listRef: T,
119
+ menuModel: v,
120
+ search: c,
121
+ getItemText: g,
122
+ setSelectedItemValue: L,
123
+ placeholder: M,
124
+ filteredItems: k,
125
+ textArr: R,
126
+ itemToString: x,
127
+ getSelectedItem: D,
128
+ checkIfValueExist: S,
129
+ removeFromArray: I,
130
+ lightReset: E,
131
+ openMenu: m,
132
+ focusOnMenu: N,
133
+ onMenuKeydown: B,
134
+ createItem: P,
135
+ removeItem: $,
136
+ clearSelection: w,
137
+ checkDisabled: q,
138
+ isAlphanumeric: A
153
139
  };
154
140
  }
155
141
  export {
156
- ae as useAutocomplete
142
+ W as useAutocomplete
157
143
  };
@@ -4,7 +4,15 @@ function t(r) {
4
4
  function n(r) {
5
5
  return Array.isArray(r);
6
6
  }
7
+ function i(r) {
8
+ return typeof r == "string";
9
+ }
10
+ function e(r) {
11
+ return t(r) ? Object.keys(r).length > 0 : n(r) || i(r) ? r.length > 0 : !1;
12
+ }
7
13
  export {
8
14
  n as isArray,
9
- t as isObject
15
+ e as isNotEmpty,
16
+ t as isObject,
17
+ i as isString
10
18
  };
@@ -1,43 +1,35 @@
1
- import { createElementBlock as e, openBlock as o, normalizeClass as r, toDisplayString as n } from "vue";
2
- import l from "../../../../_virtual/_plugin-vue_export-helper.js";
3
- const u = {
1
+ import { computed as i, createElementBlock as e, openBlock as l, renderSlot as r, createCommentVNode as n, normalizeClass as d, toDisplayString as s } from "vue";
2
+ const u = { class: "relative inline-block" }, f = { key: 0 }, x = {
3
+ __name: "KunBudge",
4
4
  props: {
5
- text: {
6
- type: String,
7
- default: ""
8
- },
9
- bgColor: {
10
- type: String,
11
- default: "bg-button"
12
- },
13
- textColor: {
14
- type: String,
15
- default: "text-on-color"
16
- },
17
- textSize: {
18
- type: String,
19
- default: "text-xs"
20
- },
21
- fontWeight: {
22
- type: String,
23
- default: "font-medium"
24
- },
25
- rounded: {
26
- type: String,
27
- default: "rounded-2xl"
28
- },
29
- cursor: {
30
- type: String,
31
- default: "cursor-default"
32
- }
5
+ text: { type: String, default: "" },
6
+ bgColor: { type: String, default: "bg-red-500" },
7
+ textColor: { type: String, default: "text-white" },
8
+ textSize: { type: String, default: "text-xs" },
9
+ fontWeight: { type: String, default: "font-bold" },
10
+ rounded: { type: String, default: "rounded-full" },
11
+ dot: { type: Boolean, default: !1 },
12
+ // Modo punto
13
+ visible: { type: Boolean, default: !0 }
14
+ // Mostrar u ocultar
15
+ },
16
+ setup(t) {
17
+ const o = i(() => [
18
+ "absolute top-0 right-0 flex items-center justify-center px-2 py-1",
19
+ "transform translate-x-1/2 -translate-y-1/2",
20
+ "min-w-[20px] min-h-[20px]"
21
+ ]);
22
+ return (a, c) => (l(), e("div", u, [
23
+ r(a.$slots, "default"),
24
+ t.visible ? (l(), e("div", {
25
+ key: 0,
26
+ class: d([...o.value, t.bgColor, t.textColor, t.textSize, t.fontWeight, t.rounded])
27
+ }, [
28
+ t.dot ? n("", !0) : (l(), e("span", f, s(t.text), 1))
29
+ ], 2)) : n("", !0)
30
+ ]));
33
31
  }
34
32
  };
35
- function d(i, a, t, f, c, x) {
36
- return o(), e("div", {
37
- class: r(["flex px-2.5 py-1.5", [t.bgColor, t.textColor, t.textSize, t.fontWeight, t.rounded, t.cursor]])
38
- }, n(t.text), 3);
39
- }
40
- const S = /* @__PURE__ */ l(u, [["render", d]]);
41
33
  export {
42
- S as default
34
+ x as default
43
35
  };
@@ -0,0 +1,87 @@
1
+ import { ref as o, computed as a, onMounted as y, createElementBlock as c, openBlock as i, createBlock as v, createElementVNode as I, resolveDynamicComponent as b, unref as u, withCtx as x, renderSlot as m, Fragment as _, renderList as g } from "vue";
2
+ import { useIntersectionObserver as S } from "../composables/useIntersectionObserver.js";
3
+ import { useKunInfiniteScroll as k } from "../composables/useKunInfiniteScroll.js";
4
+ import B from "../../../KunVirtualScroller/src/components/KunVirtualScroller.vue.js";
5
+ /* empty css */
6
+ import K from "../../../../_virtual/_plugin-vue_export-helper.js";
7
+ const N = {
8
+ __name: "KunInfiniteScroll",
9
+ props: {
10
+ items: Array,
11
+ search: String,
12
+ searchableKeys: {
13
+ type: Array,
14
+ default: () => []
15
+ },
16
+ itemsPerIntersection: {
17
+ type: Number,
18
+ default: 20
19
+ },
20
+ enabled: {
21
+ type: Boolean,
22
+ default: !0
23
+ },
24
+ rootMargin: {
25
+ type: String,
26
+ default: "0px"
27
+ },
28
+ virtual: {
29
+ type: Boolean,
30
+ default: !1
31
+ },
32
+ itemSize: {
33
+ type: Number,
34
+ default: 48
35
+ },
36
+ scrollToIndex: {
37
+ type: Number,
38
+ default: null
39
+ }
40
+ },
41
+ emits: ["update:items"],
42
+ setup(e, { emit: w }) {
43
+ const t = e, n = o(null), f = o(null), {
44
+ visibleItems: s,
45
+ loadNextBatch: d,
46
+ lastBatchReached: p
47
+ } = k({
48
+ items: a(() => t.items),
49
+ search: a(() => t.search),
50
+ searchableKeys: t.searchableKeys,
51
+ itemsPerIntersection: t.itemsPerIntersection
52
+ });
53
+ return y(() => {
54
+ S(n.value, ([r]) => {
55
+ r.isIntersecting && (console.log("visible"), p.value || d());
56
+ });
57
+ }), (r, C) => (i(), c("div", {
58
+ class: "w-full h-full overflow-auto",
59
+ ref_key: "scrollContainer",
60
+ ref: f
61
+ }, [
62
+ e.virtual ? (i(), v(b(B), {
63
+ key: 0,
64
+ items: u(s),
65
+ "estimated-item-height": e.itemSize,
66
+ "scroll-to-index": e.scrollToIndex,
67
+ class: "virtual-list"
68
+ }, {
69
+ default: x(({ item: l, index: h }) => [
70
+ m(r.$slots, "default", {
71
+ item: l,
72
+ index: h
73
+ }, void 0, !0)
74
+ ]),
75
+ _: 3
76
+ }, 8, ["items", "estimated-item-height", "scroll-to-index"])) : (i(!0), c(_, { key: 1 }, g(u(s), (l) => m(r.$slots, "default", { item: l }, void 0, !0)), 256)),
77
+ I("div", {
78
+ ref_key: "sentinel",
79
+ ref: n,
80
+ class: "w-full h-1"
81
+ }, null, 512)
82
+ ], 512));
83
+ }
84
+ }, T = /* @__PURE__ */ K(N, [["__scopeId", "data-v-3f5c96ae"]]);
85
+ export {
86
+ T as default
87
+ };
@@ -0,0 +1,51 @@
1
+ import { ref as m, watch as c, onBeforeUnmount as b } from "vue";
2
+ function f(s, v, r = {}) {
3
+ const o = m(null);
4
+ let t = null;
5
+ const i = {
6
+ root: null,
7
+ rootMargin: "0px",
8
+ threshold: 0
9
+ }, l = () => {
10
+ var u;
11
+ const e = s, a = ((u = r.root) == null ? void 0 : u.value) || r.root || null;
12
+ if (console.log("[observeElement] el:", e), console.log("[observeElement] rootEl:", a), console.log("[observeElement] observer.value:", o.value), !e) {
13
+ console.warn("[observeElement] ❌ el (target.value) no está listo"), t = setTimeout(() => {
14
+ console.log("[observeElement] 🔁 Reintentando..."), l();
15
+ }, 100);
16
+ return;
17
+ }
18
+ if (o.value) {
19
+ console.warn("[observeElement] ⚠️ ya hay un observer activo");
20
+ return;
21
+ }
22
+ clearTimeout(t), t = null, console.log("[Observer] ✅ Observando el:", e, "con root:", a), o.value = new IntersectionObserver(v, {
23
+ ...i,
24
+ ...r,
25
+ root: a
26
+ }), o.value.observe(e);
27
+ }, n = () => {
28
+ o.value && (console.log("[Observer] 🔴 Desconectando observer"), o.value.disconnect(), o.value = null), t && (clearTimeout(t), t = null);
29
+ };
30
+ c(
31
+ () => s,
32
+ (e) => {
33
+ console.log("[watch:target] target.value cambió:", e), n(), requestAnimationFrame(() => {
34
+ console.log("[watch:target] requestAnimationFrame ejecutado"), l();
35
+ });
36
+ },
37
+ { immediate: !0 }
38
+ ), r.root && r.root.value !== void 0 && c(
39
+ () => r.root.value,
40
+ (e) => {
41
+ console.log("[watch:root] root.value cambió:", e), n(), requestAnimationFrame(() => {
42
+ console.log("[watch:root] requestAnimationFrame ejecutado"), l();
43
+ });
44
+ }
45
+ ), b(() => {
46
+ console.log("[Observer] 🧹 Limpieza en beforeUnmount"), n();
47
+ });
48
+ }
49
+ export {
50
+ f as useIntersectionObserver
51
+ };
@@ -0,0 +1,61 @@
1
+ import { ref as I, computed as t, watch as A, nextTick as L } from "vue";
2
+ function q({
3
+ items: d,
4
+ search: i,
5
+ searchableKeys: v = [],
6
+ itemsPerIntersection: r = 20
7
+ }) {
8
+ const l = I(1), f = I(null), h = t(
9
+ () => Array.isArray(v) ? v : []
10
+ ), y = t(
11
+ () => typeof r == "number" && r > 0 ? r : 20
12
+ ), n = t(() => {
13
+ var u;
14
+ const e = d.value || [], a = (u = i.value) == null ? void 0 : u.trim().toLowerCase();
15
+ return !a || !h.value.length ? e : e.filter((S) => h.value.some((C) => {
16
+ const g = C.split(".").reduce((o, T) => o == null ? void 0 : o[T], S);
17
+ return typeof g == "string" && g.toLowerCase().includes(a);
18
+ }));
19
+ }), w = t(() => n.value.length), c = t(
20
+ () => n.value.slice(
21
+ 0,
22
+ l.value * y.value
23
+ )
24
+ ), s = t(
25
+ () => c.value.length >= n.value.length
26
+ ), x = t(() => l.value === 1);
27
+ function m() {
28
+ s.value || l.value++;
29
+ }
30
+ function p() {
31
+ l.value = 1;
32
+ }
33
+ A(
34
+ () => i.value,
35
+ () => {
36
+ p();
37
+ },
38
+ { flush: "pre" }
39
+ );
40
+ async function B(e) {
41
+ if (typeof e != "number" || e < 0) return;
42
+ f.value = e;
43
+ const a = n.value.length - 1, u = Math.min(e, a);
44
+ for (; u >= c.value.length && !s.value; )
45
+ m(), await L();
46
+ }
47
+ return {
48
+ visibleItems: c,
49
+ loadNextBatch: m,
50
+ resetCurrentBatchStep: p,
51
+ lastBatchReached: s,
52
+ isFirstBatch: x,
53
+ totalItems: w,
54
+ setScrollToIndex: B,
55
+ scrollToIndex: f
56
+ // opcional, si lo necesitás desde el componente padre
57
+ };
58
+ }
59
+ export {
60
+ q as useKunInfiniteScroll
61
+ };
@@ -1,6 +1,6 @@
1
- import { createElementBlock as a, openBlock as t, normalizeClass as r, renderSlot as s } from "vue";
2
- import { useKunList as n } from "../composables/useKunList.js";
3
- const c = {
1
+ import { ref as c, provide as y, createElementBlock as v, openBlock as k, normalizeClass as h, renderSlot as x } from "vue";
2
+ import { useKunList as A } from "../composables/useKunList.js";
3
+ const K = {
4
4
  __name: "KunList",
5
5
  props: {
6
6
  nav: Boolean,
@@ -9,30 +9,66 @@ const c = {
9
9
  selectable: {
10
10
  type: [Boolean, String],
11
11
  default: !1,
12
- validator: (e) => ["single", "multiple", !0, !1].includes(e)
12
+ validator: (l) => ["single", "multiple", !0, !1].includes(l)
13
13
  },
14
14
  selectedClass: {
15
15
  type: String,
16
16
  default: "bg-blue-100 text-blue-600 dark:bg-blue-900 dark:text-blue-300"
17
17
  }
18
18
  },
19
- setup(e) {
20
- return n(e), (l, u) => (t(), a("ul", {
19
+ emits: ["keyDown"],
20
+ setup(l, { expose: d, emit: g }) {
21
+ const m = l, w = g;
22
+ A(m);
23
+ const u = c(null), o = c([]);
24
+ d({
25
+ focusWithKey: (e) => {
26
+ var n, r;
27
+ const t = o.value.filter(Boolean);
28
+ t.length !== 0 && (e === "ArrowDown" ? (n = t[0]) == null || n.focus() : e === "ArrowUp" && ((r = t[t.length - 1]) == null || r.focus()));
29
+ },
30
+ focus: () => {
31
+ var e, t;
32
+ (t = (e = u.value) == null ? void 0 : e.focus) == null || t.call(e);
33
+ }
34
+ }), y("registerListItemRef", (e) => {
35
+ e ? o.value.includes(e) || o.value.push(e) : o.value = o.value.filter((t) => t !== e);
36
+ });
37
+ function p(e) {
38
+ var a, i, f;
39
+ const t = e.key;
40
+ if (w("keyDown", e), !["ArrowDown", "ArrowUp"].includes(t)) return;
41
+ e.preventDefault();
42
+ const n = o.value.filter(Boolean);
43
+ if (n.length === 0) return;
44
+ const r = n.findIndex((b) => b === document.activeElement);
45
+ if (r === -1) {
46
+ t === "ArrowDown" ? (a = n[0]) == null || a.focus() : t === "ArrowUp" && ((i = n[n.length - 1]) == null || i.focus());
47
+ return;
48
+ }
49
+ let s = r;
50
+ t === "ArrowDown" ? s = (r + 1) % n.length : t === "ArrowUp" && (s = (r - 1 + n.length) % n.length), (f = n[s]) == null || f.focus();
51
+ }
52
+ return (e, t) => (k(), v("ul", {
21
53
  role: "list",
22
- class: r([
54
+ class: h(["w-full", [
23
55
  "kun-list",
24
56
  {
25
- "space-y-1": !e.dense,
26
- "space-y-0.5": e.dense,
27
- "pl-4 border-l-2 border-gray-200 dark:border-gray-700": e.sub,
28
- "bg-gray-100 dark:bg-gray-800 p-2 rounded-md": e.nav
57
+ "space-y-1": !l.dense,
58
+ "space-y-0.5": l.dense,
59
+ "pl-4 border-l-2 border-gray-200 dark:border-gray-700": l.sub,
60
+ "bg-gray-100 dark:bg-gray-800 p-2 rounded-md": l.nav
29
61
  }
30
- ])
62
+ ]]),
63
+ ref_key: "ulRef",
64
+ ref: u,
65
+ tabindex: "-1",
66
+ onKeydown: p
31
67
  }, [
32
- s(l.$slots, "default")
33
- ], 2));
68
+ x(e.$slots, "default")
69
+ ], 34));
34
70
  }
35
71
  };
36
72
  export {
37
- c as default
73
+ K as default
38
74
  };