adverich-kun-ui 0.1.195 → 0.1.197

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 (5) hide show
  1. package/dist/components/KunList/src/components/KunList.vue.js +50 -40
  2. package/dist/components/KunList/src/composables/useKunList.js +26 -0
  3. package/dist/components/KunTabs/src/components/KunTab.vue.js +70 -0
  4. package/dist/index.js +38 -35
  5. package/package.json +1 -1
package/dist/components/KunList/src/components/KunList.vue.js CHANGED
@@ -1,5 +1,6 @@
1
- import { ref as f, provide as p, computed as A, createElementBlock as D, openBlock as h, mergeProps as B, withModifiers as I, renderSlot as S } from "vue";
2
- const L = {
1
+ import { ref as m, provide as A, createElementBlock as k, openBlock as v, mergeProps as h, withModifiers as B, renderSlot as D } from "vue";
2
+ import { useKunList as x } from "../composables/useKunList.js";
3
+ const K = {
3
4
  __name: "KunList",
4
5
  props: {
5
6
  nav: Boolean,
@@ -8,7 +9,11 @@ const L = {
8
9
  selectable: {
9
10
  type: [Boolean, String],
10
11
  default: !1,
11
- validator: (o) => ["single", "multiple", !0, !1].includes(o)
12
+ validator: (l) => ["single", "multiple", !0, !1].includes(l)
13
+ },
14
+ selected: {
15
+ type: [Array, String, Number, Boolean, Object, null],
16
+ default: null
12
17
  },
13
18
  bgList: {
14
19
  type: String,
@@ -20,74 +25,79 @@ const L = {
20
25
  }
21
26
  },
22
27
  emits: ["keyDown", "click:select", "update:selected"],
23
- setup(o, { expose: g, emit: w }) {
24
- const d = o, i = w, m = f(null), c = f([]), s = f([]);
25
- p("registerListItemRef", (e) => {
28
+ setup(l, { expose: w, emit: p }) {
29
+ const u = l, i = p, d = m(null), c = m([]), { selectedValues: f } = x(u);
30
+ watch(
31
+ () => u.selected,
32
+ (e) => {
33
+ f.value = u.selectable === "multiple" ? Array.isArray(e) ? [...e] : [] : e != null ? [e] : [];
34
+ },
35
+ { immediate: !0 }
36
+ ), watch(
37
+ f,
38
+ (e) => {
39
+ i(
40
+ "update:selected",
41
+ u.selectable === "multiple" ? [...e] : e[0] ?? null
42
+ );
43
+ }
44
+ ), A("registerListItemRef", (e) => {
26
45
  e && !c.value.includes(e) && c.value.push(e);
27
46
  });
28
- const b = A(
29
- () => d.selectable === "multiple" || d.selectable === !0
30
- );
31
- function v(e) {
32
- !d.selectable || e == null || (b.value ? (s.value.includes(e) ? s.value = s.value.filter((n) => n !== e) : s.value.push(e), i("update:selected", [...s.value])) : (s.value = [e], i("update:selected", e)));
33
- }
34
- p("kunListContext", {
35
- toggleItem: v
36
- });
37
- function y(e) {
38
- var r;
47
+ function g(e) {
48
+ var o;
39
49
  i("keyDown", e);
40
50
  const t = e.key, n = c.value.filter(Boolean);
41
51
  if (!(!n.length || !["ArrowUp", "ArrowDown", "Enter"].includes(t))) {
42
52
  if (t === "Enter") {
43
- const l = document.activeElement;
44
- (l == null ? void 0 : l.getAttribute("role")) === "menuitem" && l.click();
53
+ const r = document.activeElement;
54
+ (r == null ? void 0 : r.getAttribute("role")) === "menuitem" && r.click();
45
55
  return;
46
56
  }
47
57
  if (t === "ArrowUp" || t === "ArrowDown") {
48
58
  e.preventDefault();
49
- const l = n.findIndex((x) => x === document.activeElement);
59
+ const r = n.findIndex((b) => b === document.activeElement);
50
60
  let a = -1;
51
- l === -1 ? a = t === "ArrowDown" ? 0 : n.length - 1 : t === "ArrowDown" ? a = (l + 1) % n.length : t === "ArrowUp" && (a = (l - 1 + n.length) % n.length);
52
- const u = n[a];
53
- (r = u == null ? void 0 : u.focus) == null || r.call(u);
61
+ r === -1 ? a = t === "ArrowDown" ? 0 : n.length - 1 : t === "ArrowDown" ? a = (r + 1) % n.length : t === "ArrowUp" && (a = (r - 1 + n.length) % n.length);
62
+ const s = n[a];
63
+ (o = s == null ? void 0 : s.focus) == null || o.call(s);
54
64
  return;
55
65
  }
56
66
  }
57
67
  }
58
- function k(e = "ArrowDown") {
59
- var l;
68
+ function y(e = "ArrowDown") {
69
+ var r;
60
70
  const t = c.value.filter(Boolean);
61
71
  if (!t.length) return;
62
- const n = e === "ArrowDown" ? 0 : t.length - 1, r = t[n];
63
- (l = r == null ? void 0 : r.focus) == null || l.call(r);
72
+ const n = e === "ArrowDown" ? 0 : t.length - 1, o = t[n];
73
+ (r = o == null ? void 0 : o.focus) == null || r.call(o);
64
74
  }
65
- return g({ focusWithKey: k, focus: () => {
75
+ return w({ focusWithKey: y, focus: () => {
66
76
  var e, t;
67
- return (t = (e = m.value) == null ? void 0 : e.focus) == null ? void 0 : t.call(e);
68
- } }), (e, t) => (h(), D("ul", B({
77
+ return (t = (e = d.value) == null ? void 0 : e.focus) == null ? void 0 : t.call(e);
78
+ } }), (e, t) => (v(), k("ul", h({
69
79
  ref_key: "ulRef",
70
- ref: m,
80
+ ref: d,
71
81
  role: "list",
72
82
  class: ["w-full kun-list", [
73
- o.bgList,
74
- o.borderColor,
83
+ l.bgList,
84
+ l.borderColor,
75
85
  {
76
- "space-y-1": !o.dense,
77
- "space-y-0.5": o.dense,
78
- "pl-4 border-l-2": o.sub,
79
- "p-2 rounded-md": o.nav
86
+ "space-y-1": !l.dense,
87
+ "space-y-0.5": l.dense,
88
+ "pl-4 border-l-2": l.sub,
89
+ "p-2 rounded-md": l.nav
80
90
  }
81
91
  ]],
82
92
  tabindex: "-1",
83
- onKeydown: I(y, ["prevent"]),
93
+ onKeydown: B(g, ["prevent"]),
84
94
  onSelect: t[0] || (t[0] = (n) => i("click:select", n.detail)),
85
95
  onSelected: t[1] || (t[1] = (n) => i("update:selected", n.detail))
86
96
  }, e.$attrs), [
87
- S(e.$slots, "default")
97
+ D(e.$slots, "default")
88
98
  ], 16));
89
99
  }
90
100
  };
91
101
  export {
92
- L as default
102
+ K as default
93
103
  };
package/dist/components/KunList/src/composables/useKunList.js ADDED
@@ -0,0 +1,26 @@
1
+ import { ref as c, provide as f } from "vue";
2
+ const a = Symbol("kun-list");
3
+ function g(i) {
4
+ const e = c([]);
5
+ function t(l) {
6
+ if (!i.selectable || i.disabled || l == null) return;
7
+ const s = i.selectable === "multiple";
8
+ i.selectable === "single" ? e.value[0] !== l && (e.value = [l]) : s && (e.value.indexOf(l) === -1 ? e.value = [...e.value, l] : e.value = e.value.filter((u) => u !== l));
9
+ }
10
+ function n(l) {
11
+ return e.value.includes(l);
12
+ }
13
+ return f(a, {
14
+ toggleItem: t,
15
+ isSelected: n,
16
+ isMultiple: () => i.selectable === "multiple",
17
+ isSingle: () => i.selectable === "single"
18
+ }), {
19
+ selectedValues: e,
20
+ toggleItem: t,
21
+ isSelected: n
22
+ };
23
+ }
24
+ export {
25
+ g as useKunList
26
+ };
package/dist/components/KunTabs/src/components/KunTab.vue.js ADDED
@@ -0,0 +1,70 @@
1
+ import { inject as i, ref as b, computed as C, onMounted as S, createBlock as p, openBlock as d, resolveDynamicComponent as g, normalizeClass as x, withCtx as I, renderSlot as c, createCommentVNode as r, createVNode as u, createElementBlock as B, toDisplayString as h } from "vue";
2
+ import m from "../../../KunIcon/src/components/KunIcon.vue.js";
3
+ const N = { key: 0 }, A = {
4
+ __name: "KunTab",
5
+ props: {
6
+ value: [String, Number],
7
+ text: [String, Number],
8
+ prependIcon: String,
9
+ appendIcon: String,
10
+ disabled: Boolean,
11
+ stacked: Boolean,
12
+ selectedClass: {
13
+ type: String,
14
+ default: "text-primary font-medium"
15
+ },
16
+ baseColor: {
17
+ type: String,
18
+ default: "text-slate-500 dark:text-slate-300"
19
+ },
20
+ colorClass: {
21
+ type: String,
22
+ default: ""
23
+ },
24
+ tag: {
25
+ type: String,
26
+ default: "button"
27
+ },
28
+ to: [String, Object]
29
+ },
30
+ emits: ["update:modelValue"],
31
+ setup(e, { emit: f }) {
32
+ const n = e, v = f, t = i("modelValue"), a = i("updateModelValue"), l = i("registerTab"), s = b(null), y = C(() => Array.isArray(t == null ? void 0 : t.value) ? t.value.includes(n.value) : (t == null ? void 0 : t.value) === n.value);
33
+ S(() => {
34
+ l == null || l(s.value);
35
+ });
36
+ const k = () => {
37
+ !n.disabled && n.value !== void 0 && (a == null || a(n.value), v("update:modelValue", n.value));
38
+ };
39
+ return (o, $) => (d(), p(g(e.to ? "router-link" : e.tag), {
40
+ to: e.to,
41
+ "data-value": e.value,
42
+ class: x([
43
+ "relative inline-flex items-center justify-center whitespace-nowrap transition-all px-4 py-2 cursor-pointer",
44
+ e.stacked ? "flex-col gap-1" : "",
45
+ y.value ? e.selectedClass : e.baseColor,
46
+ e.disabled ? "opacity-50 pointer-events-none" : "",
47
+ e.colorClass
48
+ ]),
49
+ onClick: k,
50
+ ref_key: "tabRef",
51
+ ref: s
52
+ }, {
53
+ default: I(() => [
54
+ e.prependIcon ? c(o.$slots, "prepend", { key: 0 }, () => [
55
+ u(m, { icon: e.prependIcon }, null, 8, ["icon"])
56
+ ]) : r("", !0),
57
+ c(o.$slots, "default", {}, () => [
58
+ e.text ? (d(), B("span", N, h(e.text), 1)) : r("", !0)
59
+ ]),
60
+ e.appendIcon ? c(o.$slots, "append", { key: 1 }, () => [
61
+ u(m, { icon: e.appendIcon }, null, 8, ["icon"])
62
+ ]) : r("", !0)
63
+ ]),
64
+ _: 3
65
+ }, 8, ["to", "data-value", "class"]));
66
+ }
67
+ };
68
+ export {
69
+ A as default
70
+ };
package/dist/index.js CHANGED
@@ -1,8 +1,8 @@
1
1
  /* empty css */
2
2
  import o from "./components/KunAlert/src/components/KunAlert.vue.js";
3
3
  import i from "./components/KunAppbar/src/components/KunAppbar.vue.js";
4
- import t from "./components/KunAppbarTitle/src/components/KunAppbarTitle.vue.js";
5
- import a from "./components/KunAutocomplete/src/components/KunAutocomplete.vue.js";
4
+ import a from "./components/KunAppbarTitle/src/components/KunAppbarTitle.vue.js";
5
+ import t from "./components/KunAutocomplete/src/components/KunAutocomplete.vue.js";
6
6
  import s from "./components/KunAvatar/src/components/KunAvatar.vue.js";
7
7
  import u from "./components/KunBtn/src/components/KunBtn.vue.js";
8
8
  import f from "./components/KunBadge/src/components/KunBadge.vue.js";
@@ -15,9 +15,9 @@ import l from "./components/KunCardTitle/src/components/KunCardTitle.vue.js";
15
15
  import $ from "./components/KunChip/src/components/KunChip.vue.js";
16
16
  import d from "./components/KunCol/src/components/KunCol.vue.js";
17
17
  import T from "./components/KunContainer/src/components/KunContainer.vue.js";
18
- import C from "./components/KunCurrency/src/components/KunCurrency.vue.js";
19
- import L from "./components/KunDialog/src/components/KunDialog.vue.js";
20
- import b from "./components/KunDivider/src/components/KunDivider.vue.js";
18
+ import b from "./components/KunCurrency/src/components/KunCurrency.vue.js";
19
+ import C from "./components/KunDialog/src/components/KunDialog.vue.js";
20
+ import L from "./components/KunDivider/src/components/KunDivider.vue.js";
21
21
  import I from "./components/KunDrawer/src/components/KunDrawer.vue.js";
22
22
  import A from "./components/KunForm/src/components/KunForm.vue.js";
23
23
  import S from "./components/KunIcon/src/components/KunIcon.vue.js";
@@ -41,17 +41,18 @@ import E from "./components/KunSlider/src/components/KunSlider.vue.js";
41
41
  import N from "./components/KunSpacer/src/components/KunSpacer.vue.js";
42
42
  import H from "./components/KunSwitch/src/components/KunSwitch.vue.js";
43
43
  import J from "./components/KunTable/src/components/KunTable.vue.js";
44
- import O from "./components/KunTabs/src/components/KunTabs.vue.js";
45
- import P from "./components/KunTextarea/src/components/KunTextarea.vue.js";
46
- import Q from "./components/KunTextField/src/components/KunTextField.vue.js";
47
- import U from "./components/KunToolbar/src/components/KunToolbar.vue.js";
48
- import V from "./components/KunToolbar/src/components/KunToolbarTitle.vue.js";
49
- import W from "./components/KunTooltip/src/components/KunTooltip.vue.js";
44
+ import O from "./components/KunTabs/src/components/KunTab.vue.js";
45
+ import P from "./components/KunTabs/src/components/KunTabs.vue.js";
46
+ import Q from "./components/KunTextarea/src/components/KunTextarea.vue.js";
47
+ import U from "./components/KunTextField/src/components/KunTextField.vue.js";
48
+ import V from "./components/KunToolbar/src/components/KunToolbar.vue.js";
49
+ import W from "./components/KunToolbar/src/components/KunToolbarTitle.vue.js";
50
+ import X from "./components/KunTooltip/src/components/KunTooltip.vue.js";
50
51
  const n = {
51
52
  KunAlert: o,
52
53
  KunAppbar: i,
53
- KunAppbarTitle: t,
54
- KunAutocomplete: a,
54
+ KunAppbarTitle: a,
55
+ KunAutocomplete: t,
55
56
  KunAvatar: s,
56
57
  KunBtn: u,
57
58
  KunBadge: f,
@@ -65,9 +66,9 @@ const n = {
65
66
  KunChip: $,
66
67
  KunCol: d,
67
68
  KunContainer: T,
68
- KunCurrency: C,
69
- KunDialog: L,
70
- KunDivider: b,
69
+ KunCurrency: b,
70
+ KunDialog: C,
71
+ KunDivider: L,
71
72
  KunDrawer: I,
72
73
  KunForm: A,
73
74
  KunIcon: S,
@@ -90,22 +91,23 @@ const n = {
90
91
  KunSpacer: N,
91
92
  KunSwitch: H,
92
93
  KunTable: J,
93
- KunTabs: O,
94
- KunTextarea: P,
95
- KunTextField: Q,
96
- KunToolbar: U,
97
- KunToolbarTitle: V,
98
- KunTooltip: W
94
+ KunTab: O,
95
+ KunTabs: P,
96
+ KunTextarea: Q,
97
+ KunTextField: U,
98
+ KunToolbar: V,
99
+ KunToolbarTitle: W,
100
+ KunTooltip: X
99
101
  };
100
- function Pm(r) {
102
+ function Um(r) {
101
103
  for (const m in n)
102
104
  r.component(m, n[m]);
103
105
  }
104
106
  export {
105
107
  o as KunAlert,
106
108
  i as KunAppbar,
107
- t as KunAppbarTitle,
108
- a as KunAutocomplete,
109
+ a as KunAppbarTitle,
110
+ t as KunAutocomplete,
109
111
  s as KunAvatar,
110
112
  f as KunBadge,
111
113
  u as KunBtn,
@@ -118,9 +120,9 @@ export {
118
120
  $ as KunChip,
119
121
  d as KunCol,
120
122
  T as KunContainer,
121
- C as KunCurrency,
122
- L as KunDialog,
123
- b as KunDivider,
123
+ b as KunCurrency,
124
+ C as KunDialog,
125
+ L as KunDivider,
124
126
  I as KunDrawer,
125
127
  A as KunForm,
126
128
  S as KunIcon,
@@ -142,12 +144,13 @@ export {
142
144
  E as KunSlider,
143
145
  N as KunSpacer,
144
146
  H as KunSwitch,
147
+ O as KunTab,
145
148
  J as KunTable,
146
- O as KunTabs,
147
- Q as KunTextField,
148
- P as KunTextarea,
149
- U as KunToolbar,
150
- V as KunToolbarTitle,
151
- W as KunTooltip,
152
- Pm as install
149
+ P as KunTabs,
150
+ U as KunTextField,
151
+ Q as KunTextarea,
152
+ V as KunToolbar,
153
+ W as KunToolbarTitle,
154
+ X as KunTooltip,
155
+ Um as install
153
156
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "adverich-kun-ui",
3
- "version": "0.1.195",
3
+ "version": "0.1.197",
4
4
  "type": "module",
5
5
  "description": "Una librería de componentes Vue.js con Tailwind CSS",
6
6
  "main": "dist/index.js",