@wikicasa-dev/components 1.6.1 → 1.6.3
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.
- package/dist/BaseAutocomplete.js +1 -1
- package/dist/BaseInput.js +4 -4
- package/dist/BaseModal.js +99 -75
- package/dist/BaseTextarea.js +9 -9
- package/dist/assets/BaseInput.css +1 -1
- package/dist/assets/BaseModal.css +1 -1
- package/dist/assets/BaseTextarea.css +1 -1
- package/dist/chunks/{BaseAutocomplete.vue_vue_type_script_setup_true_lang.CFikyojk.js → BaseAutocomplete.vue_vue_type_script_setup_true_lang.Bl0xZfUY.js} +29 -29
- package/dist/index.js +1 -1
- package/package.json +2 -2
- package/dist/composables/useBreakpoints.d.ts +0 -10
- package/dist/useBreakpoints.js +0 -21
package/dist/BaseAutocomplete.js
CHANGED
package/dist/BaseInput.js
CHANGED
|
@@ -29,7 +29,7 @@ const W = ["id", "data-cy", "name", "autocomplete", "disabled", "aria-labelledby
|
|
|
29
29
|
handleFocusOut: V,
|
|
30
30
|
setInlineLabel: E,
|
|
31
31
|
setFloatingLabel: S
|
|
32
|
-
} = R(f), o = $(""), k = $({}), n = $(null), F = () => {
|
|
32
|
+
} = R(f), o = $("text"), k = $({}), n = $(null), F = () => {
|
|
33
33
|
t.feedback && (k.value = t.feedback, t.feedback.valid && typeof t.feedback.valid == "string" && (k.value.valid = [t.feedback.valid]), t.feedback.invalid && typeof t.feedback.invalid == "string" && (k.value.invalid = [t.feedback.invalid]));
|
|
34
34
|
}, m = (e, i) => {
|
|
35
35
|
if (!i)
|
|
@@ -69,8 +69,8 @@ const W = ["id", "data-cy", "name", "autocomplete", "disabled", "aria-labelledby
|
|
|
69
69
|
}
|
|
70
70
|
);
|
|
71
71
|
const A = O();
|
|
72
|
-
return j(() => {
|
|
73
|
-
|
|
72
|
+
return o.value = A.type || "text", j(() => {
|
|
73
|
+
F(), C(a.value);
|
|
74
74
|
}), D(() => {
|
|
75
75
|
if ((a.value != null || a.value != null) && (n.value.value = `${a.value}`), t.formatter) {
|
|
76
76
|
const e = m(
|
|
@@ -200,7 +200,7 @@ const W = ["id", "data-cy", "name", "autocomplete", "disabled", "aria-labelledby
|
|
|
200
200
|
])) : c("", !0)
|
|
201
201
|
], 2));
|
|
202
202
|
}
|
|
203
|
-
}), se = /* @__PURE__ */ U(ee, [["__scopeId", "data-v-
|
|
203
|
+
}), se = /* @__PURE__ */ U(ee, [["__scopeId", "data-v-18cefa01"]]);
|
|
204
204
|
export {
|
|
205
205
|
se as default
|
|
206
206
|
};
|
package/dist/BaseModal.js
CHANGED
|
@@ -1,19 +1,43 @@
|
|
|
1
1
|
import './assets/BaseModal.css';
|
|
2
|
-
import {
|
|
2
|
+
import { reactive as L, onBeforeMount as x, onUnmounted as E, toRefs as g, defineComponent as B, ref as m, watch as A, nextTick as T, openBlock as c, createBlock as b, Teleport as R, createElementVNode as u, normalizeClass as a, withModifiers as $, withCtx as z, createVNode as D, unref as I, createCommentVNode as w, renderSlot as r, createElementBlock as S } from "vue";
|
|
3
3
|
import "./chunks/js.cookie.BQua9eWh.js";
|
|
4
|
-
import { _
|
|
5
|
-
import { l as
|
|
6
|
-
import {
|
|
7
|
-
|
|
8
|
-
const _ = (l, n) => new Promise((a, u) => {
|
|
4
|
+
import { _ } from "./chunks/BaseButton.vue_vue_type_script_setup_true_lang.BrJbAMJ8.js";
|
|
5
|
+
import { l as G } from "./chunks/CloseIcon.DiRdm5zi.js";
|
|
6
|
+
import { _ as H } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
7
|
+
const O = (t, e) => new Promise((o, n) => {
|
|
9
8
|
setTimeout(() => {
|
|
10
9
|
try {
|
|
11
|
-
|
|
10
|
+
t && t(), o();
|
|
12
11
|
} catch {
|
|
13
|
-
|
|
12
|
+
n();
|
|
14
13
|
}
|
|
15
|
-
},
|
|
16
|
-
})
|
|
14
|
+
}, e);
|
|
15
|
+
});
|
|
16
|
+
var d = /* @__PURE__ */ ((t) => (t[t.SMALL = 576] = "SMALL", t[t.MEDIUM = 768] = "MEDIUM", t[t.LARGE = 992] = "LARGE", t[t.EXTRA_LARGE = 1200] = "EXTRA_LARGE", t))(d || {});
|
|
17
|
+
function W(t = {
|
|
18
|
+
breakpoints: {
|
|
19
|
+
sm: d.SMALL,
|
|
20
|
+
md: d.MEDIUM,
|
|
21
|
+
lg: d.LARGE,
|
|
22
|
+
xl: d.EXTRA_LARGE
|
|
23
|
+
}
|
|
24
|
+
}) {
|
|
25
|
+
const e = L({
|
|
26
|
+
isDesktopMode: !1,
|
|
27
|
+
isSmall: !1,
|
|
28
|
+
isLarge: !1,
|
|
29
|
+
isMedium: !1,
|
|
30
|
+
isExtraLarge: !1
|
|
31
|
+
}), o = () => {
|
|
32
|
+
e.isDesktopMode = window.innerWidth > t.breakpoints.sm, e.isSmall = window.innerWidth <= t.breakpoints.sm, e.isMedium = window.innerWidth > t.breakpoints.sm, e.isLarge = window.innerWidth > t.breakpoints.md, e.isExtraLarge = window.innerWidth > t.breakpoints.lg;
|
|
33
|
+
};
|
|
34
|
+
return x(() => {
|
|
35
|
+
o(), window.addEventListener("resize", o);
|
|
36
|
+
}), E(() => {
|
|
37
|
+
window.removeEventListener("resize", o);
|
|
38
|
+
}), g(e);
|
|
39
|
+
}
|
|
40
|
+
const F = ["id", "data-cy"], U = ["innerHTML"], K = /* @__PURE__ */ B({
|
|
17
41
|
__name: "BaseModal",
|
|
18
42
|
props: {
|
|
19
43
|
id: { default: "base-bt-modal" },
|
|
@@ -35,115 +59,115 @@ const _ = (l, n) => new Promise((a, u) => {
|
|
|
35
59
|
closeOnClickOut: { type: Boolean, default: !0 }
|
|
36
60
|
},
|
|
37
61
|
emits: ["closed", "opened"],
|
|
38
|
-
setup(
|
|
39
|
-
const
|
|
40
|
-
|
|
41
|
-
}, y = () => {
|
|
42
|
-
document.body.addEventListener("keydown", f);
|
|
62
|
+
setup(t, { emit: e }) {
|
|
63
|
+
const o = t, n = e, { isSmall: p } = W(), s = m(!1), k = m(null), v = m(null), f = ({ key: i }) => {
|
|
64
|
+
i === "Escape" && l();
|
|
43
65
|
}, h = () => {
|
|
66
|
+
document.body.addEventListener("keydown", f);
|
|
67
|
+
}, y = () => {
|
|
44
68
|
document.body.removeEventListener("keydown", f);
|
|
45
|
-
},
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
},
|
|
49
|
-
}, C = async ({ target:
|
|
50
|
-
!
|
|
51
|
-
!
|
|
52
|
-
},
|
|
53
|
-
|
|
54
|
-
|
|
69
|
+
}, M = async () => {
|
|
70
|
+
s.value = !0, h(), document.body.classList.add("uikit-no-scrolling", "sm:uikit-pr-15px"), n("opened"), o.autoClose !== void 0 && setTimeout(() => {
|
|
71
|
+
l();
|
|
72
|
+
}, o.autoClose);
|
|
73
|
+
}, C = async ({ target: i }) => {
|
|
74
|
+
!o.closeOnClickOut || p.value && !i.classList.contains("bbt-modal-wrapper") || //In mobile mode, the wrapper will be touched
|
|
75
|
+
!p.value && !i.classList.contains("bbt-backdrop") || await l();
|
|
76
|
+
}, l = async () => {
|
|
77
|
+
s.value = !1, y(), document.body.classList.remove("uikit-no-scrolling", "sm:uikit-pr-15px"), await O(() => {
|
|
78
|
+
k.value?.classList.add("uikit-hidden"), n("closed");
|
|
55
79
|
}, 250);
|
|
56
80
|
};
|
|
57
|
-
return
|
|
58
|
-
() =>
|
|
59
|
-
async (
|
|
60
|
-
!
|
|
61
|
-
|
|
62
|
-
}),
|
|
81
|
+
return A(
|
|
82
|
+
() => o.showModal,
|
|
83
|
+
async (i) => {
|
|
84
|
+
!i && !s.value && T(() => {
|
|
85
|
+
k.value?.classList.add("uikit-hidden");
|
|
86
|
+
}), i && !s.value && await M(), !i && s.value && await l(), s.value = i;
|
|
63
87
|
},
|
|
64
88
|
{ immediate: !0 }
|
|
65
|
-
), (
|
|
66
|
-
|
|
89
|
+
), (i, N) => (c(), b(R, { to: "body" }, [
|
|
90
|
+
u("div", {
|
|
67
91
|
ref_key: "backdropEl",
|
|
68
|
-
ref:
|
|
69
|
-
class:
|
|
70
|
-
|
|
71
|
-
{ "colored-backdrop":
|
|
72
|
-
{ "uikit-bg-transparent": !
|
|
92
|
+
ref: k,
|
|
93
|
+
class: a(["bbt-backdrop uikit-fixed uikit-left-0 uikit-start-0 uikit-top-0 uikit-h-full uikit-w-full uikit-overflow-y-auto uikit-px-0 uikit-pt-0 sm:uikit-px-5 sm:uikit-pt-[30px]", [
|
|
94
|
+
i.customBackdropClasses,
|
|
95
|
+
{ "colored-backdrop": s.value },
|
|
96
|
+
{ "uikit-bg-transparent": !s.value }
|
|
73
97
|
]]),
|
|
74
98
|
style: { "z-index": "1062" },
|
|
75
99
|
onClick: C
|
|
76
100
|
}, [
|
|
77
|
-
|
|
78
|
-
id:
|
|
101
|
+
u("dialog", {
|
|
102
|
+
id: i.id,
|
|
79
103
|
ref_key: "modalEl",
|
|
80
104
|
ref: v,
|
|
81
|
-
"data-cy":
|
|
82
|
-
class:
|
|
83
|
-
|
|
84
|
-
{ "show ":
|
|
85
|
-
{ "closed uikit-overflow-hidden": !
|
|
86
|
-
`base-${
|
|
105
|
+
"data-cy": i.$attrs["data-cy"],
|
|
106
|
+
class: a(["custom-modal safe-bottom base-bt-modal transition-y !uikit-relative uikit-m-0 uikit-mx-auto uikit-block uikit-h-full uikit-w-full uikit-overflow-x-hidden uikit-overflow-y-hidden uikit-rounded uikit-border-none uikit-bg-transparent uikit-p-0 uikit-no-scrollbar max-sm:uikit-fixed max-sm:uikit-w-full max-sm:uikit-max-w-full max-sm:uikit-rounded-bl-none max-sm:uikit-rounded-br-none max-sm:uikit-border-0 sm:uikit-h-auto", [
|
|
107
|
+
i.customModalClasses,
|
|
108
|
+
{ "show ": s.value },
|
|
109
|
+
{ "closed uikit-overflow-hidden": !s.value },
|
|
110
|
+
`base-${i.size}`
|
|
87
111
|
]])
|
|
88
112
|
}, [
|
|
89
|
-
|
|
90
|
-
class:
|
|
113
|
+
u("div", {
|
|
114
|
+
class: a(["bbt-modal-wrapper uikit-relative uikit-h-full", [i.customModalDialogClasses]])
|
|
91
115
|
}, [
|
|
92
|
-
|
|
93
|
-
class:
|
|
94
|
-
|
|
116
|
+
u("div", {
|
|
117
|
+
class: a(["uikit-modal-content uikit-fixed uikit-bottom-0 uikit-h-auto uikit-max-h-[90%] uikit-w-full uikit-overflow-x-hidden uikit-rounded uikit-bg-white uikit-py-0 uikit-no-scrollbar max-sm:uikit-rounded-bl-none max-sm:uikit-rounded-br-none sm:uikit-relative sm:uikit-flex sm:uikit-flex-col sm:uikit-overflow-y-auto sm:uikit-py-0 sm:uikit-shadow-[0_3px_6px_#00000029]", [
|
|
118
|
+
i.customModalContentClasses,
|
|
95
119
|
"transition-y",
|
|
96
|
-
{ "full-height-mobile":
|
|
120
|
+
{ "full-height-mobile": i.fullHeight }
|
|
97
121
|
]])
|
|
98
122
|
}, [
|
|
99
|
-
|
|
100
|
-
class:
|
|
123
|
+
u("div", {
|
|
124
|
+
class: a(["default-header uikit-border-0 uikit-px-4 sm:uikit-px-6", [i.customModalHeaderClasses]])
|
|
101
125
|
}, [
|
|
102
|
-
|
|
126
|
+
i.withCloseIcon ? (c(), b(_, {
|
|
103
127
|
key: 0,
|
|
104
128
|
id: "close-icon-btn",
|
|
105
129
|
"data-cy": "bbt-default-close-icon-btn",
|
|
106
|
-
class:
|
|
130
|
+
class: a(["uikit-z-10 uikit-bg-transparent", i.$attrs["close-icon-btn-classes"]]),
|
|
107
131
|
type: "button",
|
|
108
132
|
"aria-label": "Close",
|
|
109
133
|
"is-empty": !0,
|
|
110
|
-
onClick:
|
|
134
|
+
onClick: $(l, ["prevent", "stop"])
|
|
111
135
|
}, {
|
|
112
|
-
default:
|
|
113
|
-
|
|
136
|
+
default: z(() => [
|
|
137
|
+
D(I(G), {
|
|
114
138
|
class: "bbt-close-icon uikit-p-5px",
|
|
115
139
|
width: 30,
|
|
116
140
|
height: 30
|
|
117
141
|
})
|
|
118
142
|
]),
|
|
119
143
|
_: 1
|
|
120
|
-
}, 8, ["class"])) :
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
class:
|
|
124
|
-
innerHTML:
|
|
125
|
-
}, null, 10,
|
|
144
|
+
}, 8, ["class"])) : w("", !0),
|
|
145
|
+
r(i.$slots, "header", { closeModal: l }, () => [
|
|
146
|
+
u("span", {
|
|
147
|
+
class: a(["uikit-w-auto uikit-text-18 uikit-font-semibold sm:uikit-text-22", i.$attrs["title-classes"]]),
|
|
148
|
+
innerHTML: i.headerTitle
|
|
149
|
+
}, null, 10, U)
|
|
126
150
|
], !0)
|
|
127
151
|
], 2),
|
|
128
|
-
|
|
129
|
-
class:
|
|
152
|
+
u("div", {
|
|
153
|
+
class: a(["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", [i.customModalBodyClasses]])
|
|
130
154
|
}, [
|
|
131
|
-
|
|
155
|
+
r(i.$slots, "body", {}, void 0, !0)
|
|
132
156
|
], 2),
|
|
133
|
-
|
|
157
|
+
i.withCustomFooter ? (c(), S("div", {
|
|
134
158
|
key: 0,
|
|
135
|
-
class:
|
|
159
|
+
class: a(["uikit-bbt-footer uikit-border-0 uikit-bg-white uikit-px-4 uikit-py-15px sm:uikit-px-6", i.customModalFooterClasses])
|
|
136
160
|
}, [
|
|
137
|
-
|
|
138
|
-
], 2)) :
|
|
161
|
+
r(i.$slots, "footer", { closeModal: l }, void 0, !0)
|
|
162
|
+
], 2)) : w("", !0)
|
|
139
163
|
], 2)
|
|
140
164
|
], 2),
|
|
141
|
-
|
|
142
|
-
], 10,
|
|
165
|
+
r(i.$slots, "fixed-bottom", {}, void 0, !0)
|
|
166
|
+
], 10, F)
|
|
143
167
|
], 2)
|
|
144
168
|
]));
|
|
145
169
|
}
|
|
146
|
-
}), J = /* @__PURE__ */
|
|
170
|
+
}), J = /* @__PURE__ */ H(K, [["__scopeId", "data-v-1c56ba7a"]]);
|
|
147
171
|
export {
|
|
148
172
|
J as default
|
|
149
173
|
};
|
package/dist/BaseTextarea.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import './assets/BaseTextarea.css';
|
|
2
2
|
import f from "./BaseFloatingLabel.js";
|
|
3
3
|
import { useFloatingLabel as m } from "./useFloatingLabel.js";
|
|
4
|
-
import { defineComponent as h, resolveComponent as v, openBlock as
|
|
5
|
-
import { _ as
|
|
4
|
+
import { defineComponent as h, resolveComponent as v, openBlock as r, createElementBlock as o, normalizeClass as t, createElementVNode as l, withModifiers as s, createCommentVNode as b, createVNode as g } from "vue";
|
|
5
|
+
import { _ as w } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
6
6
|
const y = h({
|
|
7
7
|
name: "BaseTextarea",
|
|
8
8
|
components: { BaseFloatingLabel: f },
|
|
@@ -71,7 +71,7 @@ const y = h({
|
|
|
71
71
|
}, c = ["innerHTML"], T = ["innerHTML"];
|
|
72
72
|
function L(e, i, n, u, d, k) {
|
|
73
73
|
const p = v("base-floating-label");
|
|
74
|
-
return
|
|
74
|
+
return r(), o("div", {
|
|
75
75
|
class: t(e.$attrs["wrapper-classes"])
|
|
76
76
|
}, [
|
|
77
77
|
l("div", {
|
|
@@ -83,7 +83,7 @@ function L(e, i, n, u, d, k) {
|
|
|
83
83
|
id: e.$attrs.id,
|
|
84
84
|
ref: "textarea",
|
|
85
85
|
"data-cy": e.$attrs["data-cy"],
|
|
86
|
-
class: t(["textarea-scrollbar uikit-peer/fieldset uikit-w-full uikit-overflow-y-auto uikit-whitespace-pre-wrap uikit-rounded-xs uikit-border-0 uikit-bg-white uikit-bg-no-repeat uikit-px-15px uikit-pb-[8px] uikit-pt-15px uikit-outline-none", [
|
|
86
|
+
class: t(["textarea-scrollbar uikit-peer/fieldset uikit-w-full uikit-overflow-y-auto uikit-whitespace-pre-wrap uikit-rounded-xs uikit-border-0 uikit-bg-transparent uikit-bg-white uikit-bg-no-repeat uikit-px-15px uikit-pb-[8px] uikit-pt-15px uikit-outline-none", [
|
|
87
87
|
{ "uikit-bg-w-cultured": e.$attrs.disabled || e.isDisabled },
|
|
88
88
|
{ "is-invalid invalid-bg !uikit-pr-10": e.isValid === !1 },
|
|
89
89
|
{ "is-valid valid-bg !uikit-pr-10": e.isValid },
|
|
@@ -99,14 +99,14 @@ function L(e, i, n, u, d, k) {
|
|
|
99
99
|
innerHTML: e.modelValue
|
|
100
100
|
}, null, 42, V),
|
|
101
101
|
l("fieldset", {
|
|
102
|
-
class: t(["uikit-pointer-events-none uikit-absolute uikit-bottom-[3px] uikit-left-0 uikit-right-0 uikit-top-0 uikit-m-0 uikit-min-w-0 uikit-overflow-hidden uikit-rounded-xs uikit-border uikit-border-solid uikit-p-0 uikit-px-2 uikit-text-start uikit-transition-[border] uikit-duration-100 uikit-ease-out peer-focus/fieldset:uikit-border-2 peer-focus/fieldset:uikit-border-w-primary peer-focus/fieldset:[&.is-invalid]:uikit-border-w-danger", [
|
|
102
|
+
class: t(["uikit-pointer-events-none uikit-absolute uikit-bottom-[3px] uikit-left-0 uikit-right-0 uikit-top-0 uikit-m-0 uikit-min-w-0 uikit-overflow-hidden uikit-rounded-xs uikit-border uikit-border-solid uikit-bg-white uikit-p-0 uikit-px-2 uikit-text-start uikit-transition-[border] uikit-duration-100 uikit-ease-out peer-focus/fieldset:uikit-border-2 peer-focus/fieldset:uikit-border-w-primary peer-focus/fieldset:[&.is-invalid]:uikit-border-w-danger", [
|
|
103
103
|
{ "is-invalid": e.isValid === !1, "is-valid": e.isValid },
|
|
104
104
|
{ "uikit-border-w-danger": e.isValid === !1 },
|
|
105
105
|
{ "uikit-border-w-primary": e.isValid },
|
|
106
106
|
{ "uikit-border-w-secondary": e.isValid === null }
|
|
107
107
|
]])
|
|
108
108
|
}, [
|
|
109
|
-
e.labelText ? (
|
|
109
|
+
e.labelText ? (r(), o("legend", $, [
|
|
110
110
|
l("span", {
|
|
111
111
|
class: t(["uikit-px-5px uikit-opacity-0", [
|
|
112
112
|
{
|
|
@@ -120,7 +120,7 @@ function L(e, i, n, u, d, k) {
|
|
|
120
120
|
}, null, 10, c)
|
|
121
121
|
])) : b("", !0)
|
|
122
122
|
], 2),
|
|
123
|
-
|
|
123
|
+
g(p, {
|
|
124
124
|
for: e.$attrs.id,
|
|
125
125
|
"label-text": e.labelText,
|
|
126
126
|
"label-state": e.labelState,
|
|
@@ -133,7 +133,7 @@ function L(e, i, n, u, d, k) {
|
|
|
133
133
|
onClick: e.handleFloatingLabelClick
|
|
134
134
|
}, null, 8, ["for", "label-text", "label-state", "required", "is-valid", "label-classes", "onClick"])
|
|
135
135
|
], 2),
|
|
136
|
-
(e.isValid || e.isValid === !1) && e.feedback ? (
|
|
136
|
+
(e.isValid || e.isValid === !1) && e.feedback ? (r(), o("div", {
|
|
137
137
|
key: 0,
|
|
138
138
|
class: t(
|
|
139
139
|
e.isValid === !1 ? "uikit-mt-1 uikit-text-12 uikit-text-w-danger" : "uikit-mt-1 uikit-text-12 uikit-text-w-primary"
|
|
@@ -142,7 +142,7 @@ function L(e, i, n, u, d, k) {
|
|
|
142
142
|
}, null, 10, T)) : b("", !0)
|
|
143
143
|
], 2);
|
|
144
144
|
}
|
|
145
|
-
const B = /* @__PURE__ */
|
|
145
|
+
const B = /* @__PURE__ */ w(y, [["render", L], ["__scopeId", "data-v-6eb437d7"]]);
|
|
146
146
|
export {
|
|
147
147
|
B as default
|
|
148
148
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.input-wrapper[data-v-
|
|
1
|
+
.input-wrapper[data-v-18cefa01]{--icon-default-size: 44px}.invalid-bg[data-v-18cefa01]{--invalid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMicgZmlsbD0nbm9uZScgc3Ryb2tlPScjRkE0RjY0Jz48Y2lyY2xlIGN4PSc2JyBjeT0nNicgcj0nNC41Jy8+PHBhdGggc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgZD0nTTUuOCAzLjZoLjRMNiA2LjV6Jy8+PGNpcmNsZSBjeD0nNicgY3k9JzguMicgcj0nLjYnIGZpbGw9JyNGQTRGNjQnIHN0cm9rZT0nbm9uZScvPjwvc3ZnPg==);background-image:var(--invalid-img)}.valid-bg[data-v-18cefa01]{--valid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGZpbGw9JyMyQjVERkYnIGQ9J00yLjMgNi43My42IDQuNTNjLS40LTEuMDQuNDYtMS40IDEuMS0uOGwxLjEgMS40IDMuNC0zLjhjLjYtLjYzIDEuNi0uMjcgMS4yLjdsLTQgNC42Yy0uNDMuNS0uOC40LTEuMS4xeicvPjwvc3ZnPg==);background-image:var(--valid-img)}.invalid-bg[data-v-18cefa01],.valid-bg[data-v-18cefa01]{background-position:top 17px right 12px;background-size:20px}.has-right-icon[data-v-18cefa01]>label.inline-label{right:var(--icon-default-size)}.has-left-icon[data-v-18cefa01]>label.inline-label{left:var(--icon-default-size)}[data-v-18cefa01] .text-input-icon{position:absolute;z-index:20;box-sizing:border-box;--icon-size-sm: 16px;--icon-size-md: 20px;--icon-size-lg: 25px}[data-v-18cefa01] .text-input-icon.left{left:5px}[data-v-18cefa01] .text-input-icon.right{right:5px}[data-v-18cefa01] .text-input-icon{--icon-top: 5px;--icon-size: var(--icon-size-sm);width:var(--icon-default-size);height:var(--icon-default-size);padding:calc((var(--icon-default-size) - var(--icon-size)) / 2);top:var(--icon-top)}[data-v-18cefa01] .text-input-icon.md{--icon-size: var(--icon-size-md)}[data-v-18cefa01] .text-input-icon.lg{--icon-top: 0;--icon-size: var(--icon-size-lg)}.under-label[data-v-18cefa01]{left:4px;font-style:italic}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.custom-modal[data-v-
|
|
1
|
+
.custom-modal[data-v-1c56ba7a]{--modal-max-height: 690px;--modal-width-sm: 496px;--modal-width-md: 592px;--modal-width-lg: 670px;--modal-max-width: var(--modal-width-sm);max-width:var(--modal-max-width)}.base-modal-md[data-v-1c56ba7a]{--modal-max-width: var(--modal-width-md)}.base-modal-lg[data-v-1c56ba7a]{--modal-max-width: var(--modal-width-lg)}.base-modal-sm[data-v-1c56ba7a],.base-modal-md[data-v-1c56ba7a],.base-modal-lg[data-v-1c56ba7a]{max-height:var(--modal-max-height)}@media not all and (min-width: 576px){.base-modal-sm[data-v-1c56ba7a],.base-modal-md[data-v-1c56ba7a],.base-modal-lg[data-v-1c56ba7a]{max-height:none;max-width:none}}@media screen and (max-width: 576px){.base-modal-sm[data-v-1c56ba7a],.base-modal-md[data-v-1c56ba7a],.base-modal-lg[data-v-1c56ba7a]{width:100%!important}}.base-modal-xxl[data-v-1c56ba7a]{max-width:1500px}.base-modal-full[data-v-1c56ba7a]{width:100%}.default-header[data-v-1c56ba7a]{justify-content:space-between;padding-top:25px}.colored-backdrop[data-v-1c56ba7a]{animation:backdrop-opacity-1c56ba7a .3s ease-out 0s backwards;background-color:#b4c2f0b3}.custom-modal[data-v-1c56ba7a]{will-change:transform}@media (min-width: 576px){.custom-modal.show.transition-y[data-v-1c56ba7a]{animation:slide-down-1c56ba7a .5s ease-out 0s backwards}}@media not all and (min-width: 576px){.custom-modal.show .uikit-modal-content.transition-y[data-v-1c56ba7a]{animation:slide-up-1c56ba7a .5s ease-out 0s backwards}}.custom-modal.closed[data-v-1c56ba7a]{overflow-y:hidden!important}@media (min-width: 576px){.custom-modal.closed.transition-y[data-v-1c56ba7a]{animation:slide-down-back-1c56ba7a .25s both}}@media not all and (min-width: 576px){.custom-modal.closed .uikit-modal-content.transition-y[data-v-1c56ba7a]{animation:slide-up-back-1c56ba7a .25s both}}[data-v-1c56ba7a] #close-icon-btn{position:absolute;right:15px;top:15px}@media not all and (min-width: 576px){.full-height-mobile[data-v-1c56ba7a]{height:95%;max-height:none}}@keyframes slide-up-1c56ba7a{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes slide-up-back-1c56ba7a{0%{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes slide-down-1c56ba7a{0%{transform:translateY(-110%);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slide-down-back-1c56ba7a{0%{transform:translateY(0)}to{transform:translateY(-110%)}}@keyframes backdrop-opacity-1c56ba7a{0%{opacity:0}to{opacity:1}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.invalid-bg[data-v-
|
|
1
|
+
.invalid-bg[data-v-6eb437d7]{--invalid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPScxMicgaGVpZ2h0PScxMicgZmlsbD0nbm9uZScgc3Ryb2tlPScjRkE0RjY0Jz48Y2lyY2xlIGN4PSc2JyBjeT0nNicgcj0nNC41Jy8+PHBhdGggc3Ryb2tlLWxpbmVqb2luPSdyb3VuZCcgZD0nTTUuOCAzLjZoLjRMNiA2LjV6Jy8+PGNpcmNsZSBjeD0nNicgY3k9JzguMicgcj0nLjYnIGZpbGw9JyNGQTRGNjQnIHN0cm9rZT0nbm9uZScvPjwvc3ZnPg==);background-image:var(--invalid-img)}.valid-bg[data-v-6eb437d7]{--valid-img: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA4IDgnPjxwYXRoIGZpbGw9JyMyQjVERkYnIGQ9J00yLjMgNi43My42IDQuNTNjLS40LTEuMDQuNDYtMS40IDEuMS0uOGwxLjEgMS40IDMuNC0zLjhjLjYtLjYzIDEuNi0uMjcgMS4yLjdsLTQgNC42Yy0uNDMuNS0uOC40LTEuMS4xeicvPjwvc3ZnPg==);background-image:var(--valid-img)}.invalid-bg[data-v-6eb437d7],.valid-bg[data-v-6eb437d7]{background-position:top 12px right 12px;background-size:20px}.textarea-scrollbar[data-v-6eb437d7]::-webkit-scrollbar{width:8px;height:6px}.textarea-scrollbar[data-v-6eb437d7]::-webkit-scrollbar-track{--tw-bg-opacity: 1;background-color:rgb(244 247 255 / var(--tw-bg-opacity))}.textarea-scrollbar[data-v-6eb437d7]::-webkit-scrollbar-thumb{border-radius:5px;--tw-bg-opacity: 1;background-color:rgb(180 194 240 / var(--tw-bg-opacity))}.is-valid.textarea-scrollbar[data-v-6eb437d7]::-webkit-scrollbar-thumb{background-color:#2b5dff!important}.is-invalid.textarea-scrollbar[data-v-6eb437d7]::-webkit-scrollbar-thumb{background-color:#fa4f64!important}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import { defineComponent as P, mergeModels as S, useModel as z, ref as s, computed as k, onBeforeMount as
|
|
1
|
+
import { defineComponent as P, mergeModels as S, useModel as z, ref as s, computed as k, onBeforeMount as E, watch as f, openBlock as y, createBlock as V, normalizeClass as K, withCtx as c, createVNode as N, renderSlot as B, createElementBlock as U, Fragment as A, renderList as F, unref as W, createElementVNode as j } from "vue";
|
|
2
2
|
import q from "../BaseInput.js";
|
|
3
3
|
import { _ as G } from "./BaseDropDown.vue_vue_type_script_setup_true_lang.XCCbfFor.js";
|
|
4
4
|
import "./js.cookie.BQua9eWh.js";
|
|
5
5
|
import { _ as J } from "./SelectItem.vue_vue_type_script_setup_true_lang.Colhxc7n.js";
|
|
6
6
|
import { useKeyboardController as Q } from "../useKeyboardController.js";
|
|
7
7
|
function R(d, v) {
|
|
8
|
-
return (...m) => new Promise((
|
|
8
|
+
return (...m) => new Promise((t, i) => {
|
|
9
9
|
d.id && clearTimeout(d.id), d.id = setTimeout(() => {
|
|
10
10
|
try {
|
|
11
11
|
const r = v(...m);
|
|
12
|
-
|
|
12
|
+
t(r);
|
|
13
13
|
} catch (r) {
|
|
14
14
|
i(r);
|
|
15
15
|
}
|
|
@@ -40,16 +40,16 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
40
40
|
}),
|
|
41
41
|
emits: /* @__PURE__ */ S(["update:dropdownState", "changedValue", "click", "keydown"], ["update:modelValue"]),
|
|
42
42
|
setup(d, { expose: v, emit: m }) {
|
|
43
|
-
const
|
|
44
|
-
|
|
45
|
-
u.value = i.value?.label || "", h.value = R({ delay: 300 },
|
|
43
|
+
const t = d, i = z(d, "modelValue"), r = m, u = s(""), n = s([]), h = s(null), p = s(!1), o = s(!1), g = s(null), O = k(() => n.value.length);
|
|
44
|
+
E(() => {
|
|
45
|
+
u.value = i.value?.label || "", h.value = R({ delay: 300 }, t.onInputChangeCb);
|
|
46
46
|
});
|
|
47
47
|
const { activeIdx: w, selectedIdx: C } = Q({
|
|
48
48
|
optionsLength: O,
|
|
49
49
|
isDropdownOpen: o,
|
|
50
50
|
disableSpaceHandler: !0
|
|
51
51
|
}), M = k(() => {
|
|
52
|
-
switch (
|
|
52
|
+
switch (t.theme) {
|
|
53
53
|
case "bordered":
|
|
54
54
|
return "";
|
|
55
55
|
case "all-bordered":
|
|
@@ -60,7 +60,7 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
60
60
|
return "";
|
|
61
61
|
}
|
|
62
62
|
}), I = k(() => {
|
|
63
|
-
switch (
|
|
63
|
+
switch (t.theme) {
|
|
64
64
|
case "bordered":
|
|
65
65
|
return "";
|
|
66
66
|
case "all-bordered":
|
|
@@ -72,7 +72,7 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
72
72
|
}
|
|
73
73
|
}), D = k(() => {
|
|
74
74
|
const e = "uikit-rounded-b-xl uikit-shadow uikit-rounded-t-none uikit-mb-0 !uikit-mt-0 uikit-text-w-black !uikit-rounded-b-xl !uikit-rounded-t-none";
|
|
75
|
-
switch (
|
|
75
|
+
switch (t.theme) {
|
|
76
76
|
case "bordered":
|
|
77
77
|
return "before:uikit-content-[''] before:uikit-absolute before:uikit-w-1/2 before:uikit-border-b before:uikit-border-b-w-lavender before:[border-bottom-style:solid] before:uikit-right-1/4 uikit-rounded-b-xl uikit-shadow uikit-rounded-t-none uikit-mt-5px uikit-mb-0";
|
|
78
78
|
case "all-bordered":
|
|
@@ -83,29 +83,29 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
83
83
|
return "";
|
|
84
84
|
}
|
|
85
85
|
}), T = async (e) => {
|
|
86
|
-
if (u.value !== e && (r("changedValue", e), u.value = e, !!
|
|
86
|
+
if (u.value !== e && (r("changedValue", e), u.value = e, !!t.onInputChangeCb)) {
|
|
87
87
|
if (!e || p.value) {
|
|
88
88
|
n.value = [], p.value = !1, C.value = -1, w.value = -1, i.value && (i.value.label = ""), o.value = !1, await h.value(null);
|
|
89
89
|
return;
|
|
90
90
|
}
|
|
91
|
-
|
|
91
|
+
t.disableCb || (n.value = await h.value(e), o.value = !!n.value.length);
|
|
92
92
|
}
|
|
93
|
-
}, $ = (e,
|
|
94
|
-
|
|
93
|
+
}, $ = (e, l) => {
|
|
94
|
+
t.onOptionSelectedCb && t.onOptionSelectedCb(e), t.cleanupOnClose && (n.value = []), p.value = !0, u.value = e.label, i.value = e, o.value = !1, C.value = l;
|
|
95
95
|
}, L = () => {
|
|
96
|
-
n.value.length &&
|
|
96
|
+
n.value.length && t.keepState !== "closed" && (o.value = !0);
|
|
97
97
|
};
|
|
98
|
-
return f(i, (e,
|
|
99
|
-
|
|
98
|
+
return f(i, (e, l) => {
|
|
99
|
+
e !== l && (u.value = e?.label || "");
|
|
100
100
|
}), f(C, (e) => {
|
|
101
101
|
if (e === -1 || !n.value.length)
|
|
102
102
|
return;
|
|
103
|
-
const
|
|
104
|
-
p.value &&
|
|
103
|
+
const l = n.value[e];
|
|
104
|
+
p.value && l.label === i.value?.label || $(l, e);
|
|
105
105
|
}), f(
|
|
106
|
-
() =>
|
|
106
|
+
() => t.keepState,
|
|
107
107
|
(e) => {
|
|
108
|
-
e === "closed" ? (o.value = !1,
|
|
108
|
+
e === "closed" ? (o.value = !1, t.cleanupOnClose && (n.value = [])) : e === "open" && n.value.length && (o.value = !0);
|
|
109
109
|
}
|
|
110
110
|
), f(o, (e) => {
|
|
111
111
|
r("update:dropdownState", e);
|
|
@@ -113,8 +113,8 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
113
113
|
select: () => {
|
|
114
114
|
g.value?.select();
|
|
115
115
|
}
|
|
116
|
-
}), (e,
|
|
117
|
-
class:
|
|
116
|
+
}), (e, l) => (y(), V(G, {
|
|
117
|
+
class: K(e.$attrs["root-classes"]),
|
|
118
118
|
"data-cy": `ac_${e.$attrs.id}`,
|
|
119
119
|
"dropdown-element": "ul",
|
|
120
120
|
"dropdown-classes": [
|
|
@@ -129,15 +129,15 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
129
129
|
e.dropdownClasses
|
|
130
130
|
],
|
|
131
131
|
"open-dropdown": o.value,
|
|
132
|
-
"keep-state": !n.value.length ||
|
|
133
|
-
"onUpdate:dropdownState":
|
|
134
|
-
onClick:
|
|
132
|
+
"keep-state": !n.value.length || t.keepState === "closed" ? "closed" : "opened",
|
|
133
|
+
"onUpdate:dropdownState": l[2] || (l[2] = (a) => o.value = a),
|
|
134
|
+
onClick: l[3] || (l[3] = (a) => {
|
|
135
135
|
r("click"), L();
|
|
136
136
|
}),
|
|
137
137
|
"close-when-clicked-outside": e.closeDropdownOnBodyPressed
|
|
138
138
|
}, {
|
|
139
139
|
btn_slot: c(() => [
|
|
140
|
-
|
|
140
|
+
N(q, {
|
|
141
141
|
id: `ac_input_${e.$attrs.id}`,
|
|
142
142
|
ref_key: "baseInput",
|
|
143
143
|
ref: g,
|
|
@@ -151,8 +151,8 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
151
151
|
"with-right-icon": !!e.$slots.righticon,
|
|
152
152
|
"input-class": [M.value, e.$attrs["input-classes"]],
|
|
153
153
|
"fieldset-classes": [I.value, e.$attrs["fieldset-classes"]],
|
|
154
|
-
"onUpdate:modelValue":
|
|
155
|
-
onKeydown:
|
|
154
|
+
"onUpdate:modelValue": l[0] || (l[0] = (a) => T(a === void 0 ? "" : `${a}`)),
|
|
155
|
+
onKeydown: l[1] || (l[1] = (a) => r("keydown", a))
|
|
156
156
|
}, {
|
|
157
157
|
leftIcon: c(() => [
|
|
158
158
|
B(e.$slots, "lefticon")
|
|
@@ -164,7 +164,7 @@ const X = ["innerHTML"], oe = /* @__PURE__ */ P({
|
|
|
164
164
|
}, 8, ["id", "data-cy", "label-text", "model-value", "is-valid", "disabled", "placeholder", "with-left-icon", "with-right-icon", "input-class", "fieldset-classes"])
|
|
165
165
|
]),
|
|
166
166
|
default: c(() => [
|
|
167
|
-
(y(!0),
|
|
167
|
+
(y(!0), U(A, null, F(n.value, (a, b) => (y(), V(J, {
|
|
168
168
|
key: b,
|
|
169
169
|
active: W(w) === b,
|
|
170
170
|
class: "uikit-m-1 uikit-rounded-[5px] uikit-px-5 uikit-py-10px hover:uikit-cursor-pointer",
|
package/dist/index.js
CHANGED
|
@@ -10,7 +10,7 @@ import { _ as i } from "./chunks/RadioButton.vue_vue_type_script_setup_true_lang
|
|
|
10
10
|
import { _ as b } from "./chunks/RadioGroup.vue_vue_type_script_setup_true_lang.C-jm5z4e.js";
|
|
11
11
|
import { _ as A } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.5pqk7vlZ.js";
|
|
12
12
|
import { _ as S } from "./chunks/BaseAlert.vue_vue_type_style_index_0_lang.BtqP_iYL.js";
|
|
13
|
-
import { _ as T } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.
|
|
13
|
+
import { _ as T } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.Bl0xZfUY.js";
|
|
14
14
|
import { _ as v } from "./chunks/BaseBadge.vue_vue_type_style_index_0_lang.BOA1gBKu.js";
|
|
15
15
|
import { _ as h } from "./chunks/BaseButton.vue_vue_type_script_setup_true_lang.BrJbAMJ8.js";
|
|
16
16
|
import { _ as F } from "./chunks/BaseCard.vue_vue_type_style_index_0_lang.w5aEohzG.js";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@wikicasa-dev/components",
|
|
3
|
-
"version": "1.6.
|
|
3
|
+
"version": "1.6.3",
|
|
4
4
|
"description": "Wikicasa frontend components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"@wikicasa-dev/types": "^1.0.9",
|
|
52
52
|
"@wikicasa-dev/utilities": "^0.2.1",
|
|
53
53
|
"@wikicasa-dev/svg-icons": "^0.0.1",
|
|
54
|
-
"@wikicasa-dev/vue-composables": "^0.0.
|
|
54
|
+
"@wikicasa-dev/vue-composables": "^0.0.4",
|
|
55
55
|
"autoprefixer": "^10.4.15",
|
|
56
56
|
"chromatic": "^11.2.0",
|
|
57
57
|
"eslint": "^8.57.0",
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import type { ToRefs } from "vue";
|
|
2
|
-
interface UsableBreakpoints {
|
|
3
|
-
isDesktopMode: boolean;
|
|
4
|
-
isSmall: boolean;
|
|
5
|
-
isLarge: boolean;
|
|
6
|
-
isMedium: boolean;
|
|
7
|
-
isExtraLarge: boolean;
|
|
8
|
-
}
|
|
9
|
-
export declare function useBreakpoints(): ToRefs<UsableBreakpoints>;
|
|
10
|
-
export {};
|
package/dist/useBreakpoints.js
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { reactive as s, onBeforeMount as t, onUnmounted as o, toRefs as r } from "vue";
|
|
2
|
-
var i = /* @__PURE__ */ ((e) => (e[e.SMALL = 576] = "SMALL", e[e.MEDIUM = 768] = "MEDIUM", e[e.LARGE = 992] = "LARGE", e[e.EXTRA_LARGE = 1200] = "EXTRA_LARGE", e))(i || {});
|
|
3
|
-
function d() {
|
|
4
|
-
const e = s({
|
|
5
|
-
isDesktopMode: !1,
|
|
6
|
-
isSmall: !1,
|
|
7
|
-
isLarge: !1,
|
|
8
|
-
isMedium: !1,
|
|
9
|
-
isExtraLarge: !1
|
|
10
|
-
}), n = () => {
|
|
11
|
-
e.isDesktopMode = window.innerWidth > i.SMALL, e.isSmall = window.innerWidth <= i.SMALL, e.isMedium = window.innerWidth > i.SMALL, e.isLarge = window.innerWidth > i.MEDIUM, e.isExtraLarge = window.innerWidth > i.LARGE;
|
|
12
|
-
};
|
|
13
|
-
return t(() => {
|
|
14
|
-
n(), window.addEventListener("resize", n);
|
|
15
|
-
}), o(() => {
|
|
16
|
-
window.removeEventListener("resize", n);
|
|
17
|
-
}), r(e);
|
|
18
|
-
}
|
|
19
|
-
export {
|
|
20
|
-
d as useBreakpoints
|
|
21
|
-
};
|