@wikicasa-dev/components 2.4.1-alpha.4 → 2.4.1-alpha.6

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.
@@ -1,5 +1,5 @@
1
1
  import { Autoplay as t } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-controller.css';/* empty css */
3
3
  export {
4
4
  t as Autoplay
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Controller as e } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-controller.css';/* empty css */
3
3
  export {
4
4
  e as Controller
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Keyboard as m } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-controller.css';/* empty css */
3
3
  export {
4
4
  m as Keyboard
5
5
  };
@@ -1,5 +1,5 @@
1
1
  import { Thumbs as p } from "swiper/modules";
2
- import '../assets/swiper-keyboard.css';/* empty css */
2
+ import '../assets/swiper-controller.css';/* empty css */
3
3
  export {
4
4
  p as Thumbs
5
5
  };
@@ -12,7 +12,6 @@ type __VLS_Props = {
12
12
  classes?: ClassTypeProp;
13
13
  }>;
14
14
  withCloseIcon?: boolean;
15
- showModal?: boolean;
16
15
  headerTitle?: string;
17
16
  autoClose?: number;
18
17
  fullHeight?: boolean;
@@ -26,6 +25,9 @@ type __VLS_Props = {
26
25
  titleClasses?: ClassTypeProp;
27
26
  appear?: boolean;
28
27
  };
28
+ type __VLS_PublicProps = {
29
+ "showModal"?: boolean;
30
+ } & __VLS_Props;
29
31
  declare function __VLS_template(): {
30
32
  attrs: Partial<{}>;
31
33
  slots: {
@@ -47,14 +49,16 @@ declare function __VLS_template(): {
47
49
  rootEl: any;
48
50
  };
49
51
  type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
50
- declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
52
+ declare const __VLS_component: import('vue').DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
51
53
  opened: () => any;
52
54
  closed: () => any;
53
55
  dialogClick: (args_0: MouseEvent) => any;
54
- }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
56
+ "update:showModal": (value: boolean) => any;
57
+ }, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
55
58
  onOpened?: (() => any) | undefined;
56
59
  onClosed?: (() => any) | undefined;
57
60
  onDialogClick?: ((args_0: MouseEvent) => any) | undefined;
61
+ "onUpdate:showModal"?: ((value: boolean) => any) | undefined;
58
62
  }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
59
63
  backdrop: HTMLDivElement;
60
64
  modalDialog: HTMLDialogElement;
@@ -1,8 +1,8 @@
1
- import { defineComponent as D, shallowRef as v, useTemplateRef as h, onUnmounted as T, watch as $, createBlock as H, openBlock as c, Teleport as O, createVNode as y, Transition as F, withCtx as U, withDirectives as V, createElementVNode as l, normalizeClass as o, createElementBlock as w, createCommentVNode as C, renderSlot as d, withModifiers as K, unref as N, vShow as S } from "vue";
2
- import { CloseIcon as A } from "@wikicasa-dev/svg-icons";
3
- const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
1
+ import { defineComponent as z, mergeModels as h, useModel as T, useTemplateRef as v, shallowRef as $, onUnmounted as H, createBlock as O, openBlock as c, Teleport as F, createVNode as w, Transition as U, withCtx as K, withDirectives as N, createElementVNode as l, normalizeClass as i, createElementBlock as y, createCommentVNode as C, renderSlot as d, withModifiers as S, unref as V, vShow as A } from "vue";
2
+ import { CloseIcon as G } from "@wikicasa-dev/svg-icons";
3
+ const P = ["id", "data-cy"], R = ["innerHTML"], J = /* @__PURE__ */ z({
4
4
  __name: "BaseModal",
5
- props: {
5
+ props: /* @__PURE__ */ h({
6
6
  id: { default: "base-bt-modal" },
7
7
  size: { default: "modal-md" },
8
8
  customBackdropClasses: {},
@@ -12,7 +12,6 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
12
12
  customModalFooterClasses: {},
13
13
  closeIcon: {},
14
14
  withCloseIcon: { type: Boolean, default: !0 },
15
- showModal: { type: Boolean, default: !0 },
16
15
  headerTitle: { default: "" },
17
16
  autoClose: {},
18
17
  fullHeight: { type: Boolean, default: !1 },
@@ -22,38 +21,50 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
22
21
  closeIconBtnClasses: {},
23
22
  titleClasses: {},
24
23
  appear: { type: Boolean, default: !0 }
25
- },
26
- emits: ["closed", "opened", "dialogClick"],
27
- setup(e, { emit: x }) {
28
- const r = x, i = v(!1), k = h("backdrop"), s = h("modalDialog"), u = v(!1), m = ({ key: t }) => {
24
+ }, {
25
+ showModal: { type: Boolean, default: !0 },
26
+ showModalModifiers: {}
27
+ }),
28
+ emits: /* @__PURE__ */ h(["closed", "opened", "dialogClick"], ["update:showModal"]),
29
+ setup(e, { emit: p }) {
30
+ const r = p, o = T(e, "showModal"), k = v("backdrop"), s = v("modalDialog"), u = $(!1), m = ({ key: t }) => {
29
31
  t === "Escape" && a();
30
- }, p = () => {
32
+ }, x = () => {
31
33
  document?.body.addEventListener("keydown", m);
32
34
  }, f = () => {
33
35
  document?.body.removeEventListener("keydown", m);
34
- }, g = () => {
35
- console.log("DEBUG:onBeforeEnter called"), p(), document?.body.classList.add(
36
+ };
37
+ console.log("DEBUG: BaseModal setup called", {
38
+ showModal: o.value,
39
+ timestamp: Date.now()
40
+ });
41
+ const g = () => {
42
+ console.log("DEBUG:onBeforeEnter called", {
43
+ timestamp: Date.now(),
44
+ showModal: o.value,
45
+ stack: new Error().stack
46
+ }), x(), document?.body.classList.add(
36
47
  "sm:uikit-pr-15px",
37
48
  "sm:uikit-mr-0",
38
49
  "uikit-overflow-hidden"
39
50
  );
40
- }, B = () => {
51
+ }, M = () => {
41
52
  r("opened"), e.autoClose !== void 0 && setTimeout(() => {
42
53
  a();
43
54
  }, e.autoClose);
44
- }, M = () => {
55
+ }, B = () => {
45
56
  f(), document?.body.classList.remove(
46
57
  "sm:uikit-pr-15px",
47
58
  "sm:uikit-mr-0",
48
59
  "uikit-overflow-hidden"
49
60
  ), r("closed");
50
61
  }, a = () => {
51
- i.value = !1;
62
+ o.value = !1;
52
63
  }, E = (t) => {
53
64
  s.value && s.value.contains(t.target) && (u.value = !0);
54
65
  }, I = (t) => {
55
66
  s.value && s.value.contains(t.target) && (u.value = !1);
56
- }, L = async (t) => {
67
+ }, D = async (t) => {
57
68
  if (!(t.target !== k.value && k.value?.contains(t.target)) && e.closeOnClickOut) {
58
69
  if (u.value) {
59
70
  u.value = !1;
@@ -62,46 +73,37 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
62
73
  a();
63
74
  }
64
75
  };
65
- T(() => {
76
+ H(() => {
66
77
  f(), document?.body.classList.remove(
67
78
  "sm:uikit-pr-15px",
68
79
  "sm:uikit-mr-0",
69
80
  "uikit-overflow-hidden"
70
81
  );
71
82
  });
72
- const z = (t) => {
83
+ const L = (t) => {
73
84
  s.value === t.target && t.stopPropagation();
74
85
  };
75
- return $(
76
- () => e.showModal,
77
- async (t) => {
78
- t !== i.value && (console.log("DEBUG:showModal => watcher", {
79
- cur: t,
80
- showValue: i.value
81
- }), i.value = t);
82
- },
83
- { immediate: !0 }
84
- ), (t, n) => (c(), H(O, { to: "body" }, [
85
- y(F, {
86
+ return (t, n) => (c(), O(F, { to: "body" }, [
87
+ w(U, {
86
88
  appear: e.appear,
87
89
  name: "modal-transition",
88
90
  duration: { enter: 500, leave: 250 },
89
91
  onBeforeEnter: g,
90
- onAfterEnter: B,
91
- onAfterLeave: M
92
+ onAfterEnter: M,
93
+ onAfterLeave: B
92
94
  }, {
93
- default: U(() => [
94
- V(l("div", {
95
+ default: K(() => [
96
+ N(l("div", {
95
97
  ref: "backdrop",
96
- class: o(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-z-50 uikit-h-full uikit-w-full", [
98
+ class: i(["bbt-backdrop uikit-fixed uikit-left-0 uikit-top-0 uikit-z-50 uikit-h-full uikit-w-full", [
97
99
  e.customBackdropClasses,
98
100
  {
99
- "uikit-bg-w-secondary/70": i.value
101
+ "uikit-bg-w-secondary/70": o.value
100
102
  },
101
- { "uikit-bg-transparent": !i.value },
103
+ { "uikit-bg-transparent": !o.value },
102
104
  { "sm:uikit-pt-[30px]": !e.centered }
103
105
  ]]),
104
- onClick: L,
106
+ onClick: D,
105
107
  onMousedown: E,
106
108
  onMouseup: I
107
109
  }, [
@@ -109,7 +111,7 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
109
111
  id: e.id,
110
112
  ref: "modalDialog",
111
113
  "data-cy": e.dataCy,
112
- class: o(["uikit-modal-dialog uikit-mx-auto uikit-block uikit-w-full uikit-overflow-y-auto uikit-overflow-x-hidden uikit-rounded uikit-border-none uikit-bg-transparent uikit-bg-white uikit-p-0 uikit-shadow-lg uikit-no-scrollbar uikit-safe-bottom max-sm:uikit-fixed max-sm:uikit-bottom-0 max-sm:uikit-max-h-[95%] max-sm:uikit-rounded-bl-none max-sm:uikit-rounded-br-none sm:uikit-h-auto", [
114
+ class: i(["uikit-modal-dialog uikit-mx-auto uikit-block uikit-w-full uikit-overflow-y-auto uikit-overflow-x-hidden uikit-rounded uikit-border-none uikit-bg-transparent uikit-bg-white uikit-p-0 uikit-shadow-lg uikit-no-scrollbar uikit-safe-bottom max-sm:uikit-fixed max-sm:uikit-bottom-0 max-sm:uikit-max-h-[95%] max-sm:uikit-rounded-bl-none max-sm:uikit-rounded-br-none sm:uikit-h-auto", [
113
115
  e.customModalDialogClasses,
114
116
  {
115
117
  "centered sm:uikit-absolute sm:uikit-top-1/2 sm:-uikit-translate-y-1/2": e.centered
@@ -120,48 +122,48 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
120
122
  ]]),
121
123
  tabindex: "-1",
122
124
  onClick: n[1] || (n[1] = (b) => r("dialogClick", b)),
123
- onFocusin: z
125
+ onFocusin: L
124
126
  }, [
125
127
  l("div", {
126
- class: o(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [e.customModalHeaderClasses]])
128
+ class: i(["default-header uikit-sticky uikit-top-0 uikit-z-10 uikit-rounded-t uikit-border-0 uikit-bg-white uikit-px-4 uikit-pb-10px uikit-pt-20px sm:uikit-px-6", [e.customModalHeaderClasses]])
127
129
  }, [
128
- e.withCloseIcon ? (c(), w("button", {
130
+ e.withCloseIcon ? (c(), y("button", {
129
131
  key: 0,
130
132
  id: "close-icon-btn",
131
133
  "data-cy": "bbt-default-close-icon-btn",
132
- class: o(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px", e.closeIconBtnClasses]),
134
+ class: i(["uikit-absolute uikit-right-15px uikit-top-15px uikit-z-10 uikit-bg-transparent uikit-p-5px", e.closeIconBtnClasses]),
133
135
  type: "button",
134
136
  "aria-label": "Close",
135
- onClick: n[0] || (n[0] = K((b) => i.value = !1, ["prevent", "stop"]))
137
+ onClick: n[0] || (n[0] = S((b) => o.value = !1, ["prevent", "stop"]))
136
138
  }, [
137
- y(N(A), {
138
- class: o(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
139
+ w(V(G), {
140
+ class: i(["bbt-close-icon uikit-box-border", e.closeIcon?.classes]),
139
141
  width: e.closeIcon?.size || 20,
140
142
  height: e.closeIcon?.size || 20
141
143
  }, null, 8, ["class", "width", "height"])
142
144
  ], 2)) : C("", !0),
143
145
  d(t.$slots, "header", { closeModal: a }, () => [
144
146
  l("span", {
145
- class: o(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
147
+ class: i(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", e.titleClasses]),
146
148
  innerHTML: e.headerTitle
147
- }, null, 10, P)
149
+ }, null, 10, R)
148
150
  ])
149
151
  ], 2),
150
152
  l("div", {
151
- class: o(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [e.customModalBodyClasses]])
153
+ class: i(["uikit-bbt-body uikit-flex-auto uikit-overflow-y-auto uikit-overflow-x-hidden uikit-px-4 uikit-pb-0 uikit-no-scrollbar sm:uikit-px-6 sm:uikit-pb-25px", [e.customModalBodyClasses]])
152
154
  }, [
153
155
  d(t.$slots, "body", { closeModal: a })
154
156
  ], 2),
155
- t.$slots.footer ? (c(), w("div", {
157
+ t.$slots.footer ? (c(), y("div", {
156
158
  key: 0,
157
- class: o(["uikit-bbt-footer uikit-sticky uikit-bottom-0 uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6", e.customModalFooterClasses])
159
+ class: i(["uikit-bbt-footer uikit-sticky uikit-bottom-0 uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6", e.customModalFooterClasses])
158
160
  }, [
159
161
  d(t.$slots, "footer", { closeModal: a })
160
162
  ], 2)) : C("", !0),
161
163
  d(t.$slots, "fixed-bottom")
162
- ], 42, G)
164
+ ], 42, P)
163
165
  ], 34), [
164
- [S, i.value]
166
+ [A, o.value]
165
167
  ])
166
168
  ]),
167
169
  _: 3
@@ -170,5 +172,5 @@ const G = ["id", "data-cy"], P = ["innerHTML"], q = /* @__PURE__ */ D({
170
172
  }
171
173
  });
172
174
  export {
173
- q as default
175
+ J as default
174
176
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wikicasa-dev/components",
3
- "version": "2.4.1-alpha.4",
3
+ "version": "2.4.1-alpha.6",
4
4
  "description": "Wikicasa frontend components",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",