@wikicasa-dev/components 1.9.4 → 1.9.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.
- package/dist/AccessibleSelect.js +1 -1
- package/dist/BaseComplexToggle.js +9 -9
- package/dist/BaseFloatingLabel.js +5 -5
- package/dist/UIKit/BaseComplexToggle.vue.d.ts +6 -17
- package/dist/UIKit/BaseModal.vue.d.ts +17 -16
- package/dist/assets/BaseComplexToggle.css +1 -1
- package/dist/assets/BaseFloatingLabel.css +1 -1
- package/dist/chunks/{AccessibleSelect.vue_vue_type_script_setup_true_lang.BBl-_q6G.js → AccessibleSelect.vue_vue_type_script_setup_true_lang.Bq9DN0Vj.js} +5 -5
- package/dist/index.js +1 -1
- package/dist/types.d.ts +13 -1
- package/package.json +1 -1
package/dist/AccessibleSelect.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { defineComponent as v, mergeModels as T, useModel as y, computed as
|
|
1
|
+
import { defineComponent as v, mergeModels as T, useModel as y, computed as c, openBlock as r, createElementBlock as n, normalizeClass as o, createElementVNode as t, withModifiers as m, renderSlot as f, createCommentVNode as k } from "vue";
|
|
2
2
|
import { _ as C } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
3
3
|
import './assets/BaseComplexToggle.css';const $ = ["id", "data-cy"], B = ["data-btn-bg-color", "data-cy"], L = ["src", "alt"], M = ["innerHTML"], z = ["data-btn-bg-color", "data-cy"], V = ["src", "alt"], w = ["innerHTML"], H = /* @__PURE__ */ v({
|
|
4
4
|
__name: "BaseComplexToggle",
|
|
@@ -33,7 +33,7 @@ import './assets/BaseComplexToggle.css';const $ = ["id", "data-cy"], B = ["data-
|
|
|
33
33
|
}
|
|
34
34
|
s();
|
|
35
35
|
})();
|
|
36
|
-
const b = (e) => a.value?.label === e.label,
|
|
36
|
+
const b = (e) => a.value?.label === e.label, d = c(() => b(l.labels.leftToggle)), p = c(() => b(l.labels.rightToggle));
|
|
37
37
|
return (e, i) => (r(), n("div", {
|
|
38
38
|
id: e.$attrs.id || "",
|
|
39
39
|
"data-cy": e.$attrs["data-cy"] || "",
|
|
@@ -44,12 +44,12 @@ import './assets/BaseComplexToggle.css';const $ = ["id", "data-cy"], B = ["data-
|
|
|
44
44
|
"data-cy": `bct-left-btn${e.labels.leftToggle.label ? `-${e.labels.leftToggle.label}` : ""}`,
|
|
45
45
|
class: o(["left-button uikit-flex uikit-flex-1 uikit-items-center uikit-justify-center hover:uikit-cursor-pointer", [
|
|
46
46
|
{
|
|
47
|
-
"base-complex-toggle-active":
|
|
47
|
+
"base-complex-toggle-active": d.value
|
|
48
48
|
}
|
|
49
49
|
]]),
|
|
50
|
-
onClick: i[0] || (i[0] =
|
|
50
|
+
onClick: i[0] || (i[0] = m((h) => s(), ["stop"]))
|
|
51
51
|
}, [
|
|
52
|
-
|
|
52
|
+
f(e.$slots, "left_icon", {}, () => [
|
|
53
53
|
e.labels.leftToggle.icon ? (r(), n("img", {
|
|
54
54
|
key: 0,
|
|
55
55
|
class: "base-complex-toggle-icon uikit-relative uikit-z-10 uikit-mr-10px",
|
|
@@ -72,9 +72,9 @@ import './assets/BaseComplexToggle.css';const $ = ["id", "data-cy"], B = ["data-
|
|
|
72
72
|
"base-complex-toggle-active": p.value
|
|
73
73
|
}
|
|
74
74
|
]]),
|
|
75
|
-
onClick: i[1] || (i[1] =
|
|
75
|
+
onClick: i[1] || (i[1] = m((h) => u(), ["stop"]))
|
|
76
76
|
}, [
|
|
77
|
-
|
|
77
|
+
f(e.$slots, "right_icon", {}, () => [
|
|
78
78
|
e.labels.rightToggle.icon ? (r(), n("img", {
|
|
79
79
|
key: 0,
|
|
80
80
|
class: "base-complex-toggle-icon uikit-relative uikit-z-10 uikit-mr-10px",
|
|
@@ -94,12 +94,12 @@ import './assets/BaseComplexToggle.css';const $ = ["id", "data-cy"], B = ["data-
|
|
|
94
94
|
e.type === "full" ? "base-complex-toggle-active-bg" : "base-complex-toggle-active-padded-bg",
|
|
95
95
|
e.btnBgColor,
|
|
96
96
|
e.mode,
|
|
97
|
-
|
|
97
|
+
d.value ? "translateX-left" : "translateX-right"
|
|
98
98
|
]])
|
|
99
99
|
}, null, 2)
|
|
100
100
|
], 10, $));
|
|
101
101
|
}
|
|
102
|
-
}), N = /* @__PURE__ */ C(H, [["__scopeId", "data-v-
|
|
102
|
+
}), N = /* @__PURE__ */ C(H, [["__scopeId", "data-v-e67b01b8"]]);
|
|
103
103
|
export {
|
|
104
104
|
N as default
|
|
105
105
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { defineComponent as s, openBlock as l, createElementBlock as a, normalizeClass as t, withModifiers as o, createElementVNode as n, createCommentVNode as r } from "vue";
|
|
2
|
-
import { _ as
|
|
3
|
-
import './assets/BaseFloatingLabel.css';const
|
|
2
|
+
import { _ as d } from "./chunks/_plugin-vue_export-helper.CHgC5LLL.js";
|
|
3
|
+
import './assets/BaseFloatingLabel.css';const u = ["for"], k = ["innerHTML"], m = /* @__PURE__ */ s({
|
|
4
4
|
__name: "BaseFloatingLabel",
|
|
5
5
|
props: {
|
|
6
6
|
labelState: { default: "inline-label" },
|
|
@@ -12,7 +12,7 @@ import './assets/BaseFloatingLabel.css';const d = ["for"], k = ["innerHTML"], m
|
|
|
12
12
|
setup(p, { emit: b }) {
|
|
13
13
|
return (e, i) => (l(), a("label", {
|
|
14
14
|
for: e.$attrs.for,
|
|
15
|
-
class: t(["uikit-pointer-events-none uikit-absolute uikit-left-15px uikit-
|
|
15
|
+
class: t(["uikit-pointer-events-none uikit-absolute uikit-left-15px uikit-h-5 uikit-text-sm", [
|
|
16
16
|
e.labelState,
|
|
17
17
|
{ "uikit-text-w-secondary": e.disabled },
|
|
18
18
|
e.$attrs["label-classes"]
|
|
@@ -31,9 +31,9 @@ import './assets/BaseFloatingLabel.css';const d = ["for"], k = ["innerHTML"], m
|
|
|
31
31
|
{ "uikit-text-w-primary": (e.isValid || e.isValid === null) && !e.disabled }
|
|
32
32
|
]])
|
|
33
33
|
}, " *", 2)) : r("", !0)
|
|
34
|
-
], 10,
|
|
34
|
+
], 10, u));
|
|
35
35
|
}
|
|
36
|
-
}), y = /* @__PURE__ */
|
|
36
|
+
}), y = /* @__PURE__ */ d(m, [["__scopeId", "data-v-9f97558b"]]);
|
|
37
37
|
export {
|
|
38
38
|
y as default
|
|
39
39
|
};
|
|
@@ -1,22 +1,11 @@
|
|
|
1
|
-
import { Nullable
|
|
1
|
+
import { Nullable } from '@wikicasa-dev/types';
|
|
2
|
+
import { ComplexToggleType, ToggleType, TwPrefix } from '../types';
|
|
2
3
|
|
|
3
|
-
type ToggleType<T = unknown> = {
|
|
4
|
-
id?: string;
|
|
5
|
-
label: string;
|
|
6
|
-
icon?: Icon;
|
|
7
|
-
checked?: boolean;
|
|
8
|
-
payload?: T;
|
|
9
|
-
};
|
|
10
|
-
type ComplexToggleType<T = unknown> = {
|
|
11
|
-
leftToggle: ToggleType<T>;
|
|
12
|
-
rightToggle: ToggleType<T>;
|
|
13
|
-
};
|
|
14
|
-
type TailwindPrefixType = "uikit-";
|
|
15
4
|
type BgPrefix = "bg-w-";
|
|
16
5
|
type BorderPrefix = "border-w-";
|
|
17
6
|
type ColorsType = "black" | "primary" | "secondary" | "dark-primary" | "carbon" | "gray" | "warning" | "danger" | "lavender";
|
|
18
|
-
type BtnBgColorType = `${
|
|
19
|
-
type BorderColorType = `${
|
|
7
|
+
type BtnBgColorType = `${TwPrefix}${BgPrefix}${ColorsType}` | "";
|
|
8
|
+
type BorderColorType = `${TwPrefix}${BorderPrefix}${ColorsType}`;
|
|
20
9
|
declare function __VLS_template(): {
|
|
21
10
|
left_icon?(_: {}): any;
|
|
22
11
|
right_icon?(_: {}): any;
|
|
@@ -36,7 +25,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
36
25
|
default: string;
|
|
37
26
|
};
|
|
38
27
|
labels: {
|
|
39
|
-
type: import('vue').PropType<ComplexToggleType
|
|
28
|
+
type: import('vue').PropType<ComplexToggleType>;
|
|
40
29
|
required: true;
|
|
41
30
|
};
|
|
42
31
|
btnBgColor: {
|
|
@@ -62,7 +51,7 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
62
51
|
default: string;
|
|
63
52
|
};
|
|
64
53
|
labels: {
|
|
65
|
-
type: import('vue').PropType<ComplexToggleType
|
|
54
|
+
type: import('vue').PropType<ComplexToggleType>;
|
|
66
55
|
required: true;
|
|
67
56
|
};
|
|
68
57
|
btnBgColor: {
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
|
|
1
|
+
import { ClassType } from '@wikicasa-dev/types';
|
|
2
|
+
|
|
2
3
|
declare function __VLS_template(): {
|
|
3
4
|
header?(_: {
|
|
4
5
|
closeModal: () => Promise<void>;
|
|
@@ -14,11 +15,11 @@ declare function __VLS_template(): {
|
|
|
14
15
|
declare const __VLS_component: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
15
16
|
id?: string;
|
|
16
17
|
size?: "modal-sm" | "modal-md" | "modal-lg" | "modal-xxl" | "modal-full";
|
|
17
|
-
customBackdropClasses?:
|
|
18
|
-
customModalDialogClasses?:
|
|
19
|
-
customModalHeaderClasses?:
|
|
20
|
-
customModalBodyClasses?:
|
|
21
|
-
customModalFooterClasses?:
|
|
18
|
+
customBackdropClasses?: ClassType;
|
|
19
|
+
customModalDialogClasses?: ClassType;
|
|
20
|
+
customModalHeaderClasses?: ClassType;
|
|
21
|
+
customModalBodyClasses?: ClassType;
|
|
22
|
+
customModalFooterClasses?: ClassType;
|
|
22
23
|
withCloseIcon?: boolean;
|
|
23
24
|
showModal?: boolean;
|
|
24
25
|
closeIcon?: string;
|
|
@@ -51,11 +52,11 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
51
52
|
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<{
|
|
52
53
|
id?: string;
|
|
53
54
|
size?: "modal-sm" | "modal-md" | "modal-lg" | "modal-xxl" | "modal-full";
|
|
54
|
-
customBackdropClasses?:
|
|
55
|
-
customModalDialogClasses?:
|
|
56
|
-
customModalHeaderClasses?:
|
|
57
|
-
customModalBodyClasses?:
|
|
58
|
-
customModalFooterClasses?:
|
|
55
|
+
customBackdropClasses?: ClassType;
|
|
56
|
+
customModalDialogClasses?: ClassType;
|
|
57
|
+
customModalHeaderClasses?: ClassType;
|
|
58
|
+
customModalBodyClasses?: ClassType;
|
|
59
|
+
customModalFooterClasses?: ClassType;
|
|
59
60
|
withCloseIcon?: boolean;
|
|
60
61
|
showModal?: boolean;
|
|
61
62
|
closeIcon?: string;
|
|
@@ -89,11 +90,11 @@ declare const __VLS_component: import('vue').DefineComponent<import('vue').Extra
|
|
|
89
90
|
id: string;
|
|
90
91
|
size: "modal-sm" | "modal-md" | "modal-lg" | "modal-xxl" | "modal-full";
|
|
91
92
|
closeIcon: string;
|
|
92
|
-
customBackdropClasses:
|
|
93
|
-
customModalDialogClasses:
|
|
94
|
-
customModalHeaderClasses:
|
|
95
|
-
customModalBodyClasses:
|
|
96
|
-
customModalFooterClasses:
|
|
93
|
+
customBackdropClasses: ClassType;
|
|
94
|
+
customModalDialogClasses: ClassType;
|
|
95
|
+
customModalHeaderClasses: ClassType;
|
|
96
|
+
customModalBodyClasses: ClassType;
|
|
97
|
+
customModalFooterClasses: ClassType;
|
|
97
98
|
withCloseIcon: boolean;
|
|
98
99
|
showModal: boolean;
|
|
99
100
|
headerTitle: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.base-complex-toggle[data-v-
|
|
1
|
+
.base-complex-toggle[data-v-e67b01b8]{--base-complex-toggle-height: 42px;--base-complex-toggle-width: 230px;--base-complex-toggle-radius: 23px;--base-complex-toggle-border-width: 1px;--base-complex-toggle-active: #E9EFFE;--base-complex-border-color: #B4C2F0;--padding-x-bg: 7px;--padding-y-bg: 8px;--base-complex-toggle-bg-height: var(--base-complex-toggle-height);--base-complex-toggle-bg-width: calc(var(--base-complex-toggle-width) / 2);--base-complex-toggle-bg-padded-width: calc( var(--base-complex-toggle-bg-width) - var(--padding-x-bg) );--base-complex-toggle-bg-padded-height: calc( var(--base-complex-toggle-bg-height) - var(--padding-y-bg) );--padded-bg-dist-from-top: calc(var(--padding-y-bg) / 2);--round-interval: 1px;--translateX-value: calc(var(--base-complex-toggle-bg-width) / 2);--left-translateX: translateX(calc(var(--translateX-value) * -1));--right-translateX: translateX(var(--translateX-value));--toggle-width: var(--base-complex-toggle-width);--toggle-height: var(--base-complex-toggle-height);--toggle-border: var(--base-complex-toggle-border-width) var(--base-complex-toggle-active) solid;--toggle-border-radius: var(--base-complex-toggle-radius)}.base-complex-toggle.lg[data-v-e67b01b8]{--base-complex-toggle-height: 56px;--base-complex-toggle-width: 342px;--base-complex-toggle-radius: 28px}@media screen and (max-width: 576px){.base-complex-toggle.mobile[data-v-e67b01b8]{--base-complex-toggle-width: 342px }}.base-complex-toggle[data-v-e67b01b8]{width:var(--toggle-width);height:var(--toggle-height);border:var(--toggle-border);border-radius:var(--toggle-border-radius)}.base-complex-toggle-active[data-v-e67b01b8]{font-weight:500;cursor:default;color:#fff}.base-complex-toggle-active[data-btn-bg-color=uikit-bg-w-warning][data-v-e67b01b8],.base-complex-toggle-active[data-btn-bg-color=uikit-bg-w-lavender][data-v-e67b01b8],.base-complex-toggle-active[data-btn-bg-color=uikit-bg-w-secondary][data-v-e67b01b8]{color:#222}.base-complex-toggle-active-bg[data-v-e67b01b8]{--toggle-bg-width: var(--base-complex-toggle-bg-width);--toggle-bg-height: calc( var(--base-complex-toggle-bg-height) - (2 * var(--base-complex-toggle-border-width)) )}@media screen and (max-width: 576px){.base-complex-toggle-active-bg .mobile[data-v-e67b01b8]{--toggle-bg-width: var(--base-complex-toggle-bg-lg-width) }}.base-complex-toggle-active-bg[data-v-e67b01b8]{width:var(--toggle-bg-width);height:var(--toggle-bg-height);border-radius:var(--base-complex-toggle-radius);z-index:1}.base-complex-toggle-active-padded-bg[data-v-e67b01b8]{--toggle-bg-width: var(--base-complex-toggle-bg-padded-width);--toggle-bg-height: calc( var(--base-complex-toggle-bg-padded-height) - (2 * var(--base-complex-toggle-border-width)) )}@media screen and (max-width: 576px){.base-complex-toggle-active-padded-bg.mobile[data-v-e67b01b8]{--toggle-bg-width: var(--base-complex-toggle-bg-padded-width) }}.base-complex-toggle-active-padded-bg[data-v-e67b01b8]{border-radius:var(--base-complex-toggle-radius);z-index:1;top:var(--padded-bg-dist-from-top);width:var(--toggle-bg-width);height:var(--toggle-bg-height)}.translateX-left[data-v-e67b01b8]{transform:var(--left-translateX)}@media screen and (max-width: 576px){.translateX-left.mobile[data-v-e67b01b8]{transform:var(--left-translateX)}}.translateX-right[data-v-e67b01b8]{transform:var(--right-translateX)}@media screen and (max-width: 576px){.translateX-right.mobile[data-v-e67b01b8]{transform:var(--right-translateX)}}.uikit-bg-w-lavender-bordered[data-v-e67b01b8]{--tw-border-opacity: 1;border-color:rgb(180 194 240 / var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgb(233 239 254 / var(--tw-bg-opacity))}.uikit-bg-w-cultured-bordered[data-v-e67b01b8]{border-width:1px;--tw-border-opacity: 1;border-color:rgb(180 194 240 / var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgb(244 247 255 / var(--tw-bg-opacity))}.uikit-bg-facile[data-v-e67b01b8]{--tw-bg-opacity: 1;background-color:rgb(255 102 0 / var(--tw-bg-opacity))}.border-facile[data-v-e67b01b8]{--tw-border-opacity: 1;border-color:rgb(255 102 0 / var(--tw-border-opacity))}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.floating-label[data-v-
|
|
1
|
+
.floating-label[data-v-9f97558b]{top:-10px;left:1.25rem;border-radius:5px;font-size:14px;line-height:18px}.inline-label[data-v-9f97558b]{top:.75rem;background-color:transparent;font-size:16px;line-height:20px}.inline-label>span[data-v-9f97558b]{--tw-text-opacity: 1;color:rgb(109 118 135 / var(--tw-text-opacity))}.floating-label[data-v-9f97558b],.inline-label[data-v-9f97558b]{transition-property:top,left;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;will-change:top,left}
|
|
@@ -179,15 +179,15 @@ const N = (u, { attrs: d }) => {
|
|
|
179
179
|
{ "uikit-border-0 peer-focus:uikit-border-0": !e.border }
|
|
180
180
|
]])
|
|
181
181
|
}, [
|
|
182
|
-
|
|
183
|
-
key: 0,
|
|
182
|
+
r("legend", {
|
|
184
183
|
class: s([[e.$attrs["legend-classes"], { "uikit-m-0 uikit-w-0": !e.label }], "uikit-ml-2 uikit-h-3 uikit-px-0 uikit-text-sm"])
|
|
185
184
|
}, [
|
|
186
|
-
|
|
185
|
+
e.label ? (n(), k("span", {
|
|
186
|
+
key: 0,
|
|
187
187
|
class: s(["uikit-mx-5px", [e.modelValue.label ? "uikit-invisible" : "uikit-hidden"]]),
|
|
188
188
|
innerHTML: e.label
|
|
189
|
-
}, null, 10, J)
|
|
190
|
-
], 2)
|
|
189
|
+
}, null, 10, J)) : b("", !0)
|
|
190
|
+
], 2)
|
|
191
191
|
], 2),
|
|
192
192
|
r("ul", {
|
|
193
193
|
"data-cy": e.$attrs["data-cy"] && `${e.$attrs["data-cy"]}_dropdown`,
|
package/dist/index.js
CHANGED
|
@@ -9,7 +9,7 @@ import { _ } from "./chunks/BaseTab.vue_vue_type_script_setup_true_lang.Cu67jd8K
|
|
|
9
9
|
import { _ as S } from "./chunks/BaseTabView.vue_vue_type_script_setup_true_lang.DSlvTOkB.js";
|
|
10
10
|
import { _ as g } from "./chunks/RadioButton.vue_vue_type_script_setup_true_lang.DR6a7QAi.js";
|
|
11
11
|
import { _ as h } from "./chunks/RadioGroup.vue_vue_type_script_setup_true_lang.BYlMCUWP.js";
|
|
12
|
-
import { _ as I } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.
|
|
12
|
+
import { _ as I } from "./chunks/AccessibleSelect.vue_vue_type_script_setup_true_lang.Bq9DN0Vj.js";
|
|
13
13
|
import { _ as w } from "./chunks/BaseAlert.vue_vue_type_style_index_0_lang.BtqP_iYL.js";
|
|
14
14
|
import { _ as k } from "./chunks/BaseAutocomplete.vue_vue_type_script_setup_true_lang.CMkn7bj5.js";
|
|
15
15
|
import { _ as D } from "./chunks/BaseBadge.vue_vue_type_style_index_0_lang.BOA1gBKu.js";
|
package/dist/types.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ClassType } from '@wikicasa-dev/types';
|
|
1
|
+
import { ClassType, Icon } from '@wikicasa-dev/types';
|
|
2
2
|
|
|
3
3
|
export type TwPrefix = "uikit-";
|
|
4
4
|
export type BaseTabProps = Partial<{
|
|
@@ -13,3 +13,15 @@ export type TabType = {
|
|
|
13
13
|
} & BaseTabProps;
|
|
14
14
|
export type CardTypes = "mini" | "vertical" | "news" | "";
|
|
15
15
|
export type CardRootTypes = "div" | "article";
|
|
16
|
+
/** Toggle types */
|
|
17
|
+
export type ToggleType<TPayload = unknown, TId = string | number> = {
|
|
18
|
+
id?: TId;
|
|
19
|
+
label: string;
|
|
20
|
+
icon?: Icon;
|
|
21
|
+
checked?: boolean;
|
|
22
|
+
payload?: TPayload;
|
|
23
|
+
};
|
|
24
|
+
export type ComplexToggleType<T = unknown> = {
|
|
25
|
+
leftToggle: ToggleType<T>;
|
|
26
|
+
rightToggle: ToggleType<T>;
|
|
27
|
+
};
|