@wikicasa-dev/components 2.2.9-alpha.29 → 2.2.9-alpha.30

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 (3) hide show
  1. package/dist/packages/components/lib/UIKit/AccessibleSelect.vue.js +1 -0
  2. package/dist/packages/components/lib/UIKit/BaseDropDown.vue.js +35 -32
  3. package/package.json +1 -1
package/dist/packages/components/lib/UIKit/AccessibleSelect.vue.js CHANGED
@@ -51,6 +51,7 @@ const S = { class: "uikit-relative uikit-flex uikit-h-12 uikit-items-center" },
51
51
  "toggle-dropdown": h.value,
52
52
  "onUpdate:toggleDropdown": c[2] || (c[2] = (s) => h.value = s),
53
53
  class: o([e.wrapperClasses]),
54
+ "activate-keyboard-controller": "",
54
55
  "close-when-clicked-outside": e.closeOnBodyPressed,
55
56
  direction: e.dropdownPosition === "top" ? "up" : "down",
56
57
  "dropdown-element": "ul",
package/dist/packages/components/lib/UIKit/BaseDropDown.vue.js CHANGED
@@ -1,11 +1,11 @@
1
- import { defineComponent as T, mergeModels as K, useId as N, useModel as v, shallowRef as R, computed as V, useTemplateRef as I, onMounted as z, onUnmounted as q, watch as l, nextTick as F, createElementBlock as P, openBlock as k, normalizeClass as d, renderSlot as B, createBlock as x, unref as a, createVNode as U, withCtx as A, createElementVNode as j, createCommentVNode as G, resolveDynamicComponent as J, mergeProps as Q } from "vue";
1
+ import { defineComponent as T, mergeModels as E, useId as N, useModel as k, shallowRef as R, computed as V, useTemplateRef as B, onMounted as z, onUnmounted as U, watch as l, nextTick as q, createElementBlock as F, openBlock as v, normalizeClass as d, renderSlot as I, createBlock as x, unref as a, createVNode as G, withCtx as A, createElementVNode as P, createCommentVNode as j, resolveDynamicComponent as J, mergeProps as Q } from "vue";
2
2
  import X from "./BaseButton.vue.js";
3
3
  import { ArrowIcon as Y } from "@wikicasa-dev/svg-icons";
4
4
  import { useKeyboardController as Z } from "@wikicasa-dev/vue-composables";
5
5
  const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
6
6
  inheritAttrs: !1,
7
7
  __name: "BaseDropDown",
8
- props: /* @__PURE__ */ K({
8
+ props: /* @__PURE__ */ E({
9
9
  dropdownAttrs: {},
10
10
  dropdownClasses: { default: "" },
11
11
  btnClasses: { default: "" },
@@ -31,42 +31,45 @@ const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
31
31
  open: { type: Boolean, default: !1 },
32
32
  openModifiers: {}
33
33
  }),
34
- emits: /* @__PURE__ */ K(["click", "update:dropdownState"], ["update:toggleDropdown", "update:resetKeyboardController", "update:open"]),
34
+ emits: /* @__PURE__ */ E(["click", "update:dropdownState"], ["update:toggleDropdown", "update:resetKeyboardController", "update:open"]),
35
35
  setup(t, { expose: L, emit: S }) {
36
- const n = t, w = N(), m = S, p = v(t, "toggleDropdown"), y = v(
36
+ const n = t, w = N(), m = S, y = k(t, "toggleDropdown"), p = k(
37
37
  t,
38
38
  "resetKeyboardController"
39
- ), o = v(t, "open");
40
- let C = !1;
41
- const s = R([]), M = V(() => s.value.length), u = I("container"), c = I("dropdown"), { activeIdx: i, selectedIdx: r, onKeyDownHandler: O } = Z({
39
+ ), o = k(t, "open");
40
+ let h = !1;
41
+ const s = R([]), M = V(() => s.value.length), u = B("container"), c = B("dropdown"), { activeIdx: i, selectedIdx: r, onKeyDownHandler: O } = Z({
42
42
  optionsLength: M,
43
43
  isDropdownOpen: o,
44
44
  global: !1,
45
45
  closeKeys: n.closeKeys ? n.closeKeys : []
46
- }), h = () => {
46
+ }), C = () => {
47
47
  o.value = !1;
48
- }, b = ({ target: e }) => {
49
- u.value?.contains(e) || h();
50
- }, g = (e) => {
51
- o.value && (u.value?.contains(e.target) || h());
48
+ }, g = ({ target: e }) => {
49
+ u.value?.contains(e) || C();
50
+ }, b = (e) => {
51
+ o.value && (u.value?.contains(e.target) || C());
52
52
  }, W = (e) => {
53
- n.activateKeyboardController && O(e);
53
+ n.activateKeyboardController && (console.log("DEBUG:handleKeydown", {
54
+ key: e.key,
55
+ closeKeys: n.closeKeys ? n.closeKeys : []
56
+ }), O(e));
54
57
  }, f = () => {
55
58
  n.keepState === "closed" && !o.value || n.keepState === "opened" && o.value || (o.value = !o.value);
56
59
  }, $ = (e) => {
57
60
  e != null && (i.value = e);
58
61
  }, H = (e) => {
59
62
  e != null && (r.value = e);
60
- }, D = () => {
63
+ }, K = () => {
61
64
  c.value && (s.value = Array.from(c.value.children));
62
65
  };
63
66
  return z(() => {
64
- D();
65
- }), q(() => {
66
- n.closeWhenClickedOutside && (document.removeEventListener("click", b), document.removeEventListener("focusin", g));
67
- }), l(y, (e) => {
68
- e && (i.value = -1, r.value = -1, F(() => {
69
- D(), y.value = !1;
67
+ K();
68
+ }), U(() => {
69
+ n.closeWhenClickedOutside && (document.removeEventListener("click", g), document.removeEventListener("focusin", b));
70
+ }), l(p, (e) => {
71
+ e && (i.value = -1, r.value = -1, q(() => {
72
+ K(), p.value = !1;
70
73
  }));
71
74
  }), l(
72
75
  () => n.openDropdown,
@@ -79,9 +82,9 @@ const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
79
82
  ), l(o, (e) => {
80
83
  m("update:dropdownState", e);
81
84
  }), l(o, (e) => {
82
- !e || C || !n.closeWhenClickedOutside || (document.addEventListener("click", b), document.addEventListener("focusin", g), C = !0);
83
- }), l(p, (e) => {
84
- e && (o.value = !o.value, p.value = !1);
85
+ !e || h || !n.closeWhenClickedOutside || (document.addEventListener("click", g), document.addEventListener("focusin", b), h = !0);
86
+ }), l(y, (e) => {
87
+ e && (o.value = !o.value, y.value = !1);
85
88
  }), l(r, (e) => {
86
89
  e !== -1 && s.value[e]?.querySelector("a")?.click();
87
90
  }), L({
@@ -89,17 +92,17 @@ const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
89
92
  selectedIdx: r,
90
93
  getRootElement: () => u.value,
91
94
  getContentElement: () => c.value
92
- }), (e, E) => (k(), P("div", {
95
+ }), (e, D) => (v(), F("div", {
93
96
  ref: "container",
94
97
  class: d(["uikit-relative uikit-block", e.$attrs.class]),
95
98
  onKeydown: W
96
99
  }, [
97
- B(e.$slots, "btn_slot", {
100
+ I(e.$slots, "btn_slot", {
98
101
  toggleDropdown: f,
99
102
  isOpen: o.value,
100
103
  activeIdx: a(i)
101
104
  }, () => [
102
- U(X, {
105
+ G(X, {
103
106
  id: a(w),
104
107
  type: "button",
105
108
  "data-cy": t.dataCy,
@@ -109,27 +112,27 @@ const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
109
112
  ]),
110
113
  "aria-expanded": o.value,
111
114
  "btn-class": "uikit-btn-single-selection",
112
- onClick: E[0] || (E[0] = (ee) => {
115
+ onClick: D[0] || (D[0] = (ee) => {
113
116
  m("click"), f();
114
117
  })
115
118
  }, {
116
119
  default: A(() => [
117
- j("span", {
120
+ P("span", {
118
121
  class: d(["uikit-mr-5px", t.labelClasses]),
119
122
  innerHTML: t.btnLabel
120
123
  }, null, 10, _),
121
- t.withArrowIcon ? (k(), x(a(Y), {
124
+ t.withArrowIcon ? (v(), x(a(Y), {
122
125
  key: 0,
123
126
  class: d(["uikit-shrink-0 uikit-transition-transform motion-reduce:uikit-transition-none", o.value ? "uikit-rotate-180" : ""]),
124
127
  width: t.arrowWidth,
125
128
  height: t.arrowWidth,
126
129
  "stroke-color": t.arrowStrokeColor
127
- }, null, 8, ["class", "width", "height", "stroke-color"])) : G("", !0)
130
+ }, null, 8, ["class", "width", "height", "stroke-color"])) : j("", !0)
128
131
  ]),
129
132
  _: 1
130
133
  }, 8, ["id", "data-cy", "class", "aria-expanded"])
131
134
  ]),
132
- (k(), x(J(t.dropdownElement), Q({
135
+ (v(), x(J(t.dropdownElement), Q({
133
136
  id: "dropdown_" + a(w),
134
137
  ref: "dropdown",
135
138
  "data-cy": t.dataCy && `${t.dataCy}_dropdown`,
@@ -143,7 +146,7 @@ const _ = ["innerHTML"], ae = /* @__PURE__ */ T({
143
146
  "data-side": t.direction
144
147
  }, t.dropdownAttrs), {
145
148
  default: A(() => [
146
- B(e.$slots, "default", {
149
+ I(e.$slots, "default", {
147
150
  isOpen: o.value,
148
151
  toggleDropdown: f,
149
152
  activeIdx: a(i),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wikicasa-dev/components",
3
- "version": "2.2.9-alpha.29",
3
+ "version": "2.2.9-alpha.30",
4
4
  "description": "Wikicasa frontend components",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",