@winchsa/ui 0.1.34 → 0.1.35
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/components/cards/AppCardActions.d.vue.ts +2 -2
- package/dist/components/cards/AppCardActions.vue.d.ts +2 -2
- package/dist/components/forms/AppSelect.d.vue.ts +7 -3
- package/dist/components/forms/AppSelect.vue +9 -6
- package/dist/components/forms/AppSelect.vue.d.ts +7 -3
- package/dist/components/forms/AppSwitch.d.vue.ts +2 -0
- package/dist/components/forms/AppSwitch.vue +6 -5
- package/dist/components/forms/AppSwitch.vue.d.ts +2 -0
- package/dist/components/forms/AppTextField.d.vue.ts +5 -1
- package/dist/components/forms/AppTextField.vue +9 -6
- package/dist/components/forms/AppTextField.vue.d.ts +5 -1
- package/dist/components/forms/AppTextarea.d.vue.ts +5 -1
- package/dist/components/forms/AppTextarea.vue +9 -6
- package/dist/components/forms/AppTextarea.vue.d.ts +5 -1
- package/dist/components/forms/AutocompleteInput.d.vue.ts +5 -3
- package/dist/components/forms/AutocompleteInput.vue +35 -17
- package/dist/components/forms/AutocompleteInput.vue.d.ts +5 -3
- package/dist/components/forms/CustomRadiosWithIcon.vue +1 -1
- package/dist/components/forms/LicensePlateInput.vue +2 -2
- package/dist/components/table/EditableDataTable.vue +2 -2
- package/dist/components/table/EditableDataTableRow.vue +2 -3
- package/dist/styles/core/template/_components.scss +12 -3
- package/dist/styles/core/template/index.css +10 -3
- package/dist/types.d.ts +1 -1
- package/package.json +67 -67
|
@@ -15,12 +15,12 @@ type __VLS_Slots = {} & {
|
|
|
15
15
|
default?: (props: typeof __VLS_76) => any;
|
|
16
16
|
};
|
|
17
17
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
18
|
-
collapsed: (isContentCollapsed: boolean) => any;
|
|
19
18
|
refresh: (hideOverlay: () => void) => any;
|
|
19
|
+
collapsed: (isContentCollapsed: boolean) => any;
|
|
20
20
|
trash: () => any;
|
|
21
21
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
22
|
-
onCollapsed?: ((isContentCollapsed: boolean) => any) | undefined;
|
|
23
22
|
onRefresh?: ((hideOverlay: () => void) => any) | undefined;
|
|
23
|
+
onCollapsed?: ((isContentCollapsed: boolean) => any) | undefined;
|
|
24
24
|
onTrash?: (() => any) | undefined;
|
|
25
25
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
26
26
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -15,12 +15,12 @@ type __VLS_Slots = {} & {
|
|
|
15
15
|
default?: (props: typeof __VLS_76) => any;
|
|
16
16
|
};
|
|
17
17
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
18
|
-
collapsed: (isContentCollapsed: boolean) => any;
|
|
19
18
|
refresh: (hideOverlay: () => void) => any;
|
|
19
|
+
collapsed: (isContentCollapsed: boolean) => any;
|
|
20
20
|
trash: () => any;
|
|
21
21
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
22
|
-
onCollapsed?: ((isContentCollapsed: boolean) => any) | undefined;
|
|
23
22
|
onRefresh?: ((hideOverlay: () => void) => any) | undefined;
|
|
23
|
+
onCollapsed?: ((isContentCollapsed: boolean) => any) | undefined;
|
|
24
24
|
onTrash?: (() => any) | undefined;
|
|
25
25
|
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
26
26
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_18: string | number, __VLS_19: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_18>]?: (props: typeof __VLS_19) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
6
10
|
"update:model-value": (value: string | null) => any;
|
|
7
|
-
}, string, import("vue").PublicProps, Readonly<
|
|
11
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
8
12
|
"onUpdate:model-value"?: ((value: string | null) => any) | undefined;
|
|
9
|
-
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions,
|
|
13
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
10
14
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
11
15
|
declare const _default: typeof __VLS_export;
|
|
12
16
|
export default _default;
|
|
@@ -6,18 +6,21 @@ defineOptions({
|
|
|
6
6
|
name: "AppSelect",
|
|
7
7
|
inheritAttrs: false
|
|
8
8
|
});
|
|
9
|
+
const props = defineProps({
|
|
10
|
+
label: { type: String, required: false },
|
|
11
|
+
title: { type: String, required: false }
|
|
12
|
+
});
|
|
9
13
|
const { t } = useI18n();
|
|
10
14
|
const attrs = useAttrs();
|
|
11
15
|
const emit = defineEmits(["update:model-value"]);
|
|
12
16
|
const uid = Math.random().toString(36).slice(2, 7);
|
|
13
|
-
const
|
|
14
|
-
const langLabel = computed(() => label.value ? t(label.value) : "");
|
|
17
|
+
const langLabel = computed(() => props.label ? t(props.label) : "");
|
|
15
18
|
const elementId = computed(() => {
|
|
16
|
-
const token = attrs.id || label
|
|
19
|
+
const token = attrs.id || props.label;
|
|
17
20
|
return token ? `app-select-${token}-${uid}` : void 0;
|
|
18
21
|
});
|
|
19
22
|
const placeholder = computed(() => {
|
|
20
|
-
return attrs.placeholder || (label
|
|
23
|
+
return attrs.placeholder || (props.label ? t("inputs.placeholder_select", { name: langLabel.value }) : "");
|
|
21
24
|
});
|
|
22
25
|
const handleMenuToggle = ($event) => {
|
|
23
26
|
const container = document.getElementsByClassName("v-overlay-container");
|
|
@@ -39,10 +42,10 @@ const handleMenuToggle = ($event) => {
|
|
|
39
42
|
:class="$attrs.class"
|
|
40
43
|
>
|
|
41
44
|
<VLabel
|
|
42
|
-
v-if="label"
|
|
45
|
+
v-if="title ?? label"
|
|
43
46
|
:for="elementId"
|
|
44
47
|
class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
|
|
45
|
-
:text="langLabel"
|
|
48
|
+
:text="title ?? langLabel"
|
|
46
49
|
/>
|
|
47
50
|
|
|
48
51
|
<VSelect
|
|
@@ -1,12 +1,16 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_18: string | number, __VLS_19: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_18>]?: (props: typeof __VLS_19) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
6
10
|
"update:model-value": (value: string | null) => any;
|
|
7
|
-
}, string, import("vue").PublicProps, Readonly<
|
|
11
|
+
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
8
12
|
"onUpdate:model-value"?: ((value: string | null) => any) | undefined;
|
|
9
|
-
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions,
|
|
13
|
+
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
10
14
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
11
15
|
declare const _default: typeof __VLS_export;
|
|
12
16
|
export default _default;
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
import { computed, useAttrs } from "vue";
|
|
3
3
|
import { VLabel, VSwitch } from "vuetify/components";
|
|
4
4
|
import { useI18n } from "vue-i18n";
|
|
5
|
-
defineProps({
|
|
5
|
+
const props = defineProps({
|
|
6
|
+
label: { type: String, required: false },
|
|
7
|
+
title: { type: String, required: false },
|
|
6
8
|
labelSwitch: { type: String, required: false }
|
|
7
9
|
});
|
|
8
10
|
defineOptions({
|
|
@@ -15,8 +17,7 @@ const elementId = computed(() => {
|
|
|
15
17
|
const _elementIdToken = attrs.id || attrs.label;
|
|
16
18
|
return _elementIdToken ? `app-switch-${_elementIdToken}-${Math.random().toString(36).slice(2, 7)}` : void 0;
|
|
17
19
|
});
|
|
18
|
-
const
|
|
19
|
-
const LangLabel = computed(() => label.value ? t(label.value) : "");
|
|
20
|
+
const LangLabel = computed(() => props.label ? t(props.label) : "");
|
|
20
21
|
</script>
|
|
21
22
|
|
|
22
23
|
<template>
|
|
@@ -26,10 +27,10 @@ const LangLabel = computed(() => label.value ? t(label.value) : "");
|
|
|
26
27
|
>
|
|
27
28
|
<div>
|
|
28
29
|
<VLabel
|
|
29
|
-
v-if="label"
|
|
30
|
+
v-if="title ?? label"
|
|
30
31
|
:for="elementId"
|
|
31
32
|
class="mb-2 text-body-2 text-high-emphasis"
|
|
32
|
-
:text="LangLabel"
|
|
33
|
+
:text="title ?? LangLabel"
|
|
33
34
|
/>
|
|
34
35
|
</div>
|
|
35
36
|
<div>
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_15: string | number, __VLS_16: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
10
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
7
11
|
declare const _default: typeof __VLS_export;
|
|
8
12
|
export default _default;
|
|
@@ -6,17 +6,20 @@ defineOptions({
|
|
|
6
6
|
name: "AppTextField",
|
|
7
7
|
inheritAttrs: false
|
|
8
8
|
});
|
|
9
|
+
const props = defineProps({
|
|
10
|
+
label: { type: String, required: false },
|
|
11
|
+
title: { type: String, required: false }
|
|
12
|
+
});
|
|
9
13
|
const { t } = useI18n();
|
|
10
14
|
const attrs = useAttrs();
|
|
11
15
|
const uid = Math.random().toString(36).slice(2, 7);
|
|
12
|
-
const
|
|
13
|
-
const langLabel = computed(() => label.value ? t(label.value) : "");
|
|
16
|
+
const langLabel = computed(() => props.label ? t(props.label) : "");
|
|
14
17
|
const elementId = computed(() => {
|
|
15
|
-
const token = attrs.id || label
|
|
18
|
+
const token = attrs.id || props.label;
|
|
16
19
|
return token ? `AppTextField-${token}-${uid}` : void 0;
|
|
17
20
|
});
|
|
18
21
|
const placeholder = computed(() => {
|
|
19
|
-
return attrs.placeholder || (label
|
|
22
|
+
return attrs.placeholder || (props.label ? t("inputs.placeholder", { name: langLabel.value }) : "");
|
|
20
23
|
});
|
|
21
24
|
</script>
|
|
22
25
|
|
|
@@ -26,10 +29,10 @@ const placeholder = computed(() => {
|
|
|
26
29
|
:class="$attrs.class"
|
|
27
30
|
>
|
|
28
31
|
<VLabel
|
|
29
|
-
v-if="label"
|
|
32
|
+
v-if="title ?? label"
|
|
30
33
|
:for="elementId"
|
|
31
34
|
class="mb-2 text-body-2 text-high-emphasis app-font-size-13"
|
|
32
|
-
:text="langLabel"
|
|
35
|
+
:text="title ?? langLabel"
|
|
33
36
|
/>
|
|
34
37
|
<VTextField
|
|
35
38
|
v-bind="{
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_15: string | number, __VLS_16: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
10
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
7
11
|
declare const _default: typeof __VLS_export;
|
|
8
12
|
export default _default;
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_15: string | number, __VLS_16: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
10
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
7
11
|
declare const _default: typeof __VLS_export;
|
|
8
12
|
export default _default;
|
|
@@ -6,17 +6,20 @@ defineOptions({
|
|
|
6
6
|
name: "AppTextarea",
|
|
7
7
|
inheritAttrs: false
|
|
8
8
|
});
|
|
9
|
+
const props = defineProps({
|
|
10
|
+
label: { type: String, required: false },
|
|
11
|
+
title: { type: String, required: false }
|
|
12
|
+
});
|
|
9
13
|
const { t } = useI18n();
|
|
10
14
|
const attrs = useAttrs();
|
|
11
15
|
const uid = Math.random().toString(36).slice(2, 7);
|
|
12
|
-
const
|
|
13
|
-
const langLabel = computed(() => label.value ? t(label.value) : "");
|
|
16
|
+
const langLabel = computed(() => props.label ? t(props.label) : "");
|
|
14
17
|
const elementId = computed(() => {
|
|
15
|
-
const token = attrs.id || label
|
|
18
|
+
const token = attrs.id || props.label;
|
|
16
19
|
return token ? `app-textarea-${token}-${uid}` : void 0;
|
|
17
20
|
});
|
|
18
21
|
const placeholder = computed(() => {
|
|
19
|
-
return attrs.placeholder || (label
|
|
22
|
+
return attrs.placeholder || (props.label ? t("inputs.placeholder", { name: langLabel.value }) : "");
|
|
20
23
|
});
|
|
21
24
|
</script>
|
|
22
25
|
|
|
@@ -26,10 +29,10 @@ const placeholder = computed(() => {
|
|
|
26
29
|
:class="$attrs.class"
|
|
27
30
|
>
|
|
28
31
|
<VLabel
|
|
29
|
-
v-if="label"
|
|
32
|
+
v-if="title ?? label"
|
|
30
33
|
:for="elementId"
|
|
31
34
|
class="mb-2 text-body-2 text-high-emphasis"
|
|
32
|
-
:text="langLabel"
|
|
35
|
+
:text="title ?? langLabel"
|
|
33
36
|
/>
|
|
34
37
|
<VTextarea
|
|
35
38
|
v-bind="{
|
|
@@ -1,8 +1,12 @@
|
|
|
1
|
+
type __VLS_Props = {
|
|
2
|
+
label?: string;
|
|
3
|
+
title?: string;
|
|
4
|
+
};
|
|
1
5
|
declare var __VLS_15: string | number, __VLS_16: any;
|
|
2
6
|
type __VLS_Slots = {} & {
|
|
3
7
|
[K in NonNullable<typeof __VLS_15>]?: (props: typeof __VLS_16) => any;
|
|
4
8
|
};
|
|
5
|
-
declare const __VLS_base: import("vue").DefineComponent<
|
|
9
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
6
10
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
7
11
|
declare const _default: typeof __VLS_export;
|
|
8
12
|
export default _default;
|
|
@@ -24,6 +24,7 @@ type __VLS_Props = {
|
|
|
24
24
|
placeholder?: string;
|
|
25
25
|
url?: string;
|
|
26
26
|
label?: string;
|
|
27
|
+
title?: string;
|
|
27
28
|
deselectLabel?: string;
|
|
28
29
|
selectLabel?: string;
|
|
29
30
|
selectedLabel?: string;
|
|
@@ -35,11 +36,11 @@ type __VLS_Props = {
|
|
|
35
36
|
disableIfEmpty?: boolean;
|
|
36
37
|
clearable?: boolean;
|
|
37
38
|
};
|
|
38
|
-
declare var
|
|
39
|
+
declare var __VLS_71: string | number, __VLS_72: any, __VLS_136: string | number, __VLS_137: any;
|
|
39
40
|
type __VLS_Slots = {} & {
|
|
40
|
-
[K in NonNullable<typeof
|
|
41
|
+
[K in NonNullable<typeof __VLS_71>]?: (props: typeof __VLS_72) => any;
|
|
41
42
|
} & {
|
|
42
|
-
[K in NonNullable<typeof
|
|
43
|
+
[K in NonNullable<typeof __VLS_136>]?: (props: typeof __VLS_137) => any;
|
|
43
44
|
};
|
|
44
45
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
45
46
|
records: Ref<{
|
|
@@ -69,6 +70,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
|
69
70
|
children?: /*elided*/ any[] | undefined;
|
|
70
71
|
} | null)[]>;
|
|
71
72
|
loading: import("vue").ComputedRef<boolean>;
|
|
73
|
+
refetch: () => Promise<OptionItem[]>;
|
|
72
74
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
73
75
|
"update:model-value": (value: unknown) => any;
|
|
74
76
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script setup>
|
|
2
2
|
import MultiSelect from "vue-multiselect";
|
|
3
|
-
import { ref, computed, watch, useAttrs } from "vue";
|
|
3
|
+
import { ref, computed, watch, useAttrs, nextTick } from "vue";
|
|
4
4
|
import { useI18n } from "vue-i18n";
|
|
5
5
|
import { VLabel, VValidation, VListItem, VMessages, VIcon } from "vuetify/components";
|
|
6
6
|
import { client } from "../../utils/client";
|
|
@@ -33,6 +33,7 @@ const props = defineProps({
|
|
|
33
33
|
placeholder: { type: String, required: false },
|
|
34
34
|
url: { type: String, required: false },
|
|
35
35
|
label: { type: String, required: false },
|
|
36
|
+
title: { type: String, required: false },
|
|
36
37
|
deselectLabel: { type: String, required: false, default: "" },
|
|
37
38
|
selectLabel: { type: String, required: false, default: "" },
|
|
38
39
|
selectedLabel: { type: String, required: false, default: "" },
|
|
@@ -51,6 +52,7 @@ const loading = ref(false);
|
|
|
51
52
|
const showTeleport = ref(false);
|
|
52
53
|
const search = ref("");
|
|
53
54
|
const inputRef = ref({});
|
|
55
|
+
const teleportRef = ref(null);
|
|
54
56
|
const errorState = ref(false);
|
|
55
57
|
const isOpen = ref(false);
|
|
56
58
|
const emits = defineEmits(["update:model-value"]);
|
|
@@ -69,7 +71,7 @@ const params = computed(() => buildQueryString(props.params));
|
|
|
69
71
|
const elementId = computed(() => {
|
|
70
72
|
const attrs = useAttrs();
|
|
71
73
|
const _elementIdToken = attrs.id || attrs.label;
|
|
72
|
-
return _elementIdToken ? `autocomplete-input-${_elementIdToken}-${guid}` : `autocomplete-input-${
|
|
74
|
+
return _elementIdToken ? `autocomplete-input-${_elementIdToken}-${guid}` : `autocomplete-input-${guid}`;
|
|
73
75
|
});
|
|
74
76
|
const internalPlaceholder = computed(() => {
|
|
75
77
|
return props.placeholder ? props.placeholder : t("inputs.placeholder_select", {
|
|
@@ -198,7 +200,8 @@ watch(() => props.url, async () => {
|
|
|
198
200
|
displayedOptions.value = options;
|
|
199
201
|
}
|
|
200
202
|
}, {
|
|
201
|
-
immediate: true
|
|
203
|
+
immediate: true,
|
|
204
|
+
deep: true
|
|
202
205
|
});
|
|
203
206
|
watch(() => props.options, () => {
|
|
204
207
|
if (props.options && props.options.length > 0) {
|
|
@@ -209,29 +212,47 @@ watch(() => props.options, () => {
|
|
|
209
212
|
deep: true,
|
|
210
213
|
immediate: true
|
|
211
214
|
});
|
|
215
|
+
watch(showTeleport, (newValue) => {
|
|
216
|
+
if (newValue && props.teleported) {
|
|
217
|
+
nextTick(() => {
|
|
218
|
+
teleportRef.value?.activate();
|
|
219
|
+
});
|
|
220
|
+
}
|
|
221
|
+
});
|
|
222
|
+
const refetch = async () => {
|
|
223
|
+
if (props.url) {
|
|
224
|
+
const options = await getRecords();
|
|
225
|
+
defaultOptions.value = options;
|
|
226
|
+
displayedOptions.value = options;
|
|
227
|
+
return options;
|
|
228
|
+
}
|
|
229
|
+
return [];
|
|
230
|
+
};
|
|
212
231
|
defineExpose({
|
|
213
232
|
records: defaultOptions,
|
|
214
233
|
internalOptions: filteredOptions,
|
|
215
|
-
loading: isLoading
|
|
234
|
+
loading: isLoading,
|
|
235
|
+
refetch
|
|
216
236
|
});
|
|
217
237
|
</script>
|
|
218
238
|
|
|
219
239
|
<template>
|
|
220
240
|
<div :id="elementId" class="d-flex flex-column w-100">
|
|
221
241
|
<VLabel
|
|
222
|
-
v-if="label"
|
|
242
|
+
v-if="title || label"
|
|
223
243
|
class="text-body-2 text-high-emphasis mb-2"
|
|
224
|
-
:text="t(label)"
|
|
244
|
+
:text="title ?? t(label)"
|
|
225
245
|
/>
|
|
226
246
|
|
|
227
247
|
<Teleport v-if="teleported && showTeleport" to="body">
|
|
228
248
|
<VValidation
|
|
229
|
-
v-slot="{ errorMessages:
|
|
249
|
+
v-slot="{ errorMessages: _validationErrors, isValid }"
|
|
230
250
|
v-model="value"
|
|
231
251
|
:rules="rules"
|
|
232
252
|
validate-on="input lazy"
|
|
233
253
|
>
|
|
234
254
|
<MultiSelect
|
|
255
|
+
ref="teleportRef"
|
|
235
256
|
v-model="value"
|
|
236
257
|
:options="filteredOptions"
|
|
237
258
|
:multiple="multiple"
|
|
@@ -268,6 +289,7 @@ defineExpose({
|
|
|
268
289
|
:value="value"
|
|
269
290
|
@search-change="searchInternally ? customSearch($event) : fetchAndUpdateRecords($event)"
|
|
270
291
|
@select="errorState = false, resetTeleportState()"
|
|
292
|
+
@close="showTeleport = false, isOpen = false"
|
|
271
293
|
>
|
|
272
294
|
<template #caret>
|
|
273
295
|
<span class="multiselect-arrow">
|
|
@@ -347,7 +369,8 @@ defineExpose({
|
|
|
347
369
|
<VMessages
|
|
348
370
|
v-if="!hideDetails"
|
|
349
371
|
class="mt-1"
|
|
350
|
-
|
|
372
|
+
color="error"
|
|
373
|
+
:messages="[..._validationErrors.value, errorMessages]"
|
|
351
374
|
:active="isValid.value === false || errorMessages?.length !== 0"
|
|
352
375
|
/>
|
|
353
376
|
</VValidation>
|
|
@@ -477,7 +500,8 @@ defineExpose({
|
|
|
477
500
|
<VMessages
|
|
478
501
|
v-if="!hideDetails"
|
|
479
502
|
class="mt-1"
|
|
480
|
-
|
|
503
|
+
color="error"
|
|
504
|
+
:messages="[...validationErrors.value, errorMessages]"
|
|
481
505
|
:active="isValid.value === false || errorMessages?.length !== 0"
|
|
482
506
|
/>
|
|
483
507
|
</VValidation>
|
|
@@ -491,22 +515,16 @@ defineExpose({
|
|
|
491
515
|
<style>
|
|
492
516
|
.app-custom-input-teleport .multiselect__tags {
|
|
493
517
|
display: none !important;
|
|
494
|
-
height: 100%;
|
|
495
|
-
display: flex;
|
|
496
|
-
align-items: center;
|
|
497
|
-
cursor: pointer;
|
|
498
|
-
padding-top: 0;
|
|
499
518
|
}
|
|
500
519
|
.app-custom-input-teleport .multiselect-arrow {
|
|
501
520
|
display: none !important;
|
|
502
521
|
}
|
|
503
522
|
.app-custom-input-teleport .multiselect__placeholder {
|
|
504
|
-
|
|
505
|
-
padding-top: 0;
|
|
523
|
+
display: none !important;
|
|
506
524
|
}
|
|
507
525
|
.app-custom-input-teleport .multiselect__content-wrapper {
|
|
508
526
|
margin-top: 53px;
|
|
509
|
-
z-index:
|
|
527
|
+
z-index: 9999;
|
|
510
528
|
display: block !important;
|
|
511
529
|
}
|
|
512
530
|
|
|
@@ -24,6 +24,7 @@ type __VLS_Props = {
|
|
|
24
24
|
placeholder?: string;
|
|
25
25
|
url?: string;
|
|
26
26
|
label?: string;
|
|
27
|
+
title?: string;
|
|
27
28
|
deselectLabel?: string;
|
|
28
29
|
selectLabel?: string;
|
|
29
30
|
selectedLabel?: string;
|
|
@@ -35,11 +36,11 @@ type __VLS_Props = {
|
|
|
35
36
|
disableIfEmpty?: boolean;
|
|
36
37
|
clearable?: boolean;
|
|
37
38
|
};
|
|
38
|
-
declare var
|
|
39
|
+
declare var __VLS_71: string | number, __VLS_72: any, __VLS_136: string | number, __VLS_137: any;
|
|
39
40
|
type __VLS_Slots = {} & {
|
|
40
|
-
[K in NonNullable<typeof
|
|
41
|
+
[K in NonNullable<typeof __VLS_71>]?: (props: typeof __VLS_72) => any;
|
|
41
42
|
} & {
|
|
42
|
-
[K in NonNullable<typeof
|
|
43
|
+
[K in NonNullable<typeof __VLS_136>]?: (props: typeof __VLS_137) => any;
|
|
43
44
|
};
|
|
44
45
|
declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
45
46
|
records: Ref<{
|
|
@@ -69,6 +70,7 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
|
|
|
69
70
|
children?: /*elided*/ any[] | undefined;
|
|
70
71
|
} | null)[]>;
|
|
71
72
|
loading: import("vue").ComputedRef<boolean>;
|
|
73
|
+
refetch: () => Promise<OptionItem[]>;
|
|
72
74
|
}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
73
75
|
"update:model-value": (value: unknown) => any;
|
|
74
76
|
}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
@@ -25,7 +25,7 @@ const labelLang = computed(() => props.label ? t("inputs.placeholder_select", {
|
|
|
25
25
|
<template>
|
|
26
26
|
<div v-if="radioContent">
|
|
27
27
|
<VLabel
|
|
28
|
-
class="
|
|
28
|
+
class="mb-2 text-body-2 text-high-emphasis"
|
|
29
29
|
:text="labelLang"
|
|
30
30
|
/>
|
|
31
31
|
|
|
@@ -125,7 +125,8 @@ watch(() => model.value, (newVal) => {
|
|
|
125
125
|
</div>
|
|
126
126
|
<VMessages
|
|
127
127
|
v-if="!hideDetails"
|
|
128
|
-
class="mt-
|
|
128
|
+
class="mt-1"
|
|
129
|
+
color="error"
|
|
129
130
|
:messages="errorMessages || validationErrors.value"
|
|
130
131
|
:active="!isValid.value"
|
|
131
132
|
/>
|
|
@@ -151,7 +152,6 @@ watch(() => model.value, (newVal) => {
|
|
|
151
152
|
grid-template-columns: 60px 60px 60px 1fr;
|
|
152
153
|
width: 100%;
|
|
153
154
|
min-height: 40px;
|
|
154
|
-
height: 100%;
|
|
155
155
|
align-items: center;
|
|
156
156
|
border: 1px solid rgba(var(--v-border-color), 0.29);
|
|
157
157
|
border-radius: 6px;
|
|
@@ -93,7 +93,7 @@ const moduleIdentifier = computed(() => props.module ?? "rows");
|
|
|
93
93
|
width: header.width
|
|
94
94
|
}"
|
|
95
95
|
>
|
|
96
|
-
<template v-for="(field) in header.fields" :key="`row.${index}.${field.key}`">
|
|
96
|
+
<template v-for="(field) in header.fields" :key="`row.${index}.fields.${field.key}`">
|
|
97
97
|
<EditableDataTableRow
|
|
98
98
|
v-model="items[index]"
|
|
99
99
|
:header="field"
|
|
@@ -108,7 +108,7 @@ const moduleIdentifier = computed(() => props.module ?? "rows");
|
|
|
108
108
|
|
|
109
109
|
<template v-else>
|
|
110
110
|
<EditableDataTableRow
|
|
111
|
-
:key="`row.${index}.${header.key}
|
|
111
|
+
:key="`row.${index}.${header.key}`"
|
|
112
112
|
v-model="items[index]"
|
|
113
113
|
:header="header"
|
|
114
114
|
:index="index"
|
|
@@ -82,13 +82,13 @@ const autoCompleteParams = computed(() => {
|
|
|
82
82
|
};
|
|
83
83
|
});
|
|
84
84
|
const placeholder = (header) => {
|
|
85
|
-
return header
|
|
85
|
+
return header?.placeholder ?? (header?.title ? t(header.title) : "");
|
|
86
86
|
};
|
|
87
87
|
</script>
|
|
88
88
|
|
|
89
89
|
<template>
|
|
90
90
|
<AppTextField
|
|
91
|
-
v-if="header.type === 'text'"
|
|
91
|
+
v-if="(header.type === 'text' || header.type === undefined ) && !(['actions', 'index']).includes(header.key)"
|
|
92
92
|
v-model="item[header.key]"
|
|
93
93
|
class="h-100 app-input-outline"
|
|
94
94
|
:placeholder="placeholder(header)"
|
|
@@ -101,7 +101,6 @@ const placeholder = (header) => {
|
|
|
101
101
|
flat
|
|
102
102
|
hide-details
|
|
103
103
|
/>
|
|
104
|
-
|
|
105
104
|
<AppNumberField
|
|
106
105
|
v-if="header.type === 'number'"
|
|
107
106
|
v-model="item[header.key]"
|
|
@@ -636,9 +636,9 @@ $btn-hover-overlay-opacity: (
|
|
|
636
636
|
--v-selection-control-size: 1.5rem;
|
|
637
637
|
|
|
638
638
|
.v-switch__thumb {
|
|
639
|
-
background:
|
|
640
|
-
block-size: 1rem;
|
|
641
|
-
inline-size: 1rem;
|
|
639
|
+
background: rgb(var(--v-theme-on-success));
|
|
640
|
+
// block-size: 1rem;
|
|
641
|
+
// inline-size: 1rem;
|
|
642
642
|
}
|
|
643
643
|
}
|
|
644
644
|
|
|
@@ -685,6 +685,15 @@ $btn-hover-overlay-opacity: (
|
|
|
685
685
|
}
|
|
686
686
|
}
|
|
687
687
|
|
|
688
|
+
.v-switch--inset .v-selection-control--dirty .v-switch__thumb {
|
|
689
|
+
transform: scale(0.6666666667) !important;
|
|
690
|
+
}
|
|
691
|
+
|
|
692
|
+
.v-switch--inset .v-switch__thumb {
|
|
693
|
+
width: 20px !important;
|
|
694
|
+
height: 20px !important;
|
|
695
|
+
}
|
|
696
|
+
|
|
688
697
|
.v-switch.v-input,
|
|
689
698
|
.v-checkbox-btn,
|
|
690
699
|
.v-radio-btn,
|
|
@@ -18405,9 +18405,7 @@ body {
|
|
|
18405
18405
|
--v-selection-control-size: 1.5rem;
|
|
18406
18406
|
}
|
|
18407
18407
|
.v-switch.v-switch--inset .v-selection-control__input .v-switch__thumb {
|
|
18408
|
-
background:
|
|
18409
|
-
block-size: 1rem;
|
|
18410
|
-
inline-size: 1rem;
|
|
18408
|
+
background: rgb(var(--v-theme-on-success));
|
|
18411
18409
|
}
|
|
18412
18410
|
.v-switch.v-switch--inset .v-selection-control--dirty .v-switch__track {
|
|
18413
18411
|
border-color: rgba(var(--v-border-color), var(--v-switch-opacity));
|
|
@@ -18452,6 +18450,15 @@ body {
|
|
|
18452
18450
|
opacity: var(--v-switch-checked-disabled-opacity);
|
|
18453
18451
|
}
|
|
18454
18452
|
|
|
18453
|
+
.v-switch--inset .v-selection-control--dirty .v-switch__thumb {
|
|
18454
|
+
transform: scale(0.6666666667) !important;
|
|
18455
|
+
}
|
|
18456
|
+
|
|
18457
|
+
.v-switch--inset .v-switch__thumb {
|
|
18458
|
+
width: 20px !important;
|
|
18459
|
+
height: 20px !important;
|
|
18460
|
+
}
|
|
18461
|
+
|
|
18455
18462
|
.v-switch.v-input,
|
|
18456
18463
|
.v-checkbox-btn,
|
|
18457
18464
|
.v-radio-btn,
|
package/dist/types.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,70 +1,70 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
},
|
|
9
|
-
"files": [
|
|
10
|
-
"dist/*"
|
|
11
|
-
],
|
|
12
|
-
"exports": {
|
|
13
|
-
".": {
|
|
14
|
-
"require": "./dist/index.js",
|
|
15
|
-
"import": "./dist/index.mjs",
|
|
16
|
-
"types": "./dist/index.d.ts"
|
|
2
|
+
"name": "@winchsa/ui",
|
|
3
|
+
"version": "0.1.35",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"private": false,
|
|
6
|
+
"publishConfig": {
|
|
7
|
+
"access": "public"
|
|
17
8
|
},
|
|
18
|
-
"
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
9
|
+
"files": [
|
|
10
|
+
"dist/*"
|
|
11
|
+
],
|
|
12
|
+
"exports": {
|
|
13
|
+
".": {
|
|
14
|
+
"require": "./dist/index.js",
|
|
15
|
+
"import": "./dist/index.mjs",
|
|
16
|
+
"types": "./dist/index.d.ts"
|
|
17
|
+
},
|
|
18
|
+
"./utils": {
|
|
19
|
+
"require": "./dist/utils/index.js",
|
|
20
|
+
"import": "./dist/utils/index.mjs",
|
|
21
|
+
"types": "./dist/utils/index.d.ts"
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
"main": "./dist/index.js",
|
|
25
|
+
"module": "./dist/index.mjs",
|
|
26
|
+
"scripts": {
|
|
27
|
+
"dev": "vite",
|
|
28
|
+
"build": "unbuild",
|
|
29
|
+
"lint": "eslint \"**/*.{ts,vue,mjs}\"",
|
|
30
|
+
"lint:fix": "eslint \"**/*.{ts,vue,mjs}\" --fix",
|
|
31
|
+
"bump": "pnpm version patch && pnpm run build && git add . && git commit -m \"chore: release v$(node -p \"require('./package.json').version\")\""
|
|
32
|
+
},
|
|
33
|
+
"peerDependencies": {
|
|
34
|
+
"@intlify/unplugin-vue-i18n": "^4.0.0",
|
|
35
|
+
"@tanstack/vue-query": "^5.74.5",
|
|
36
|
+
"@vueuse/core": "11.3.0",
|
|
37
|
+
"@vueuse/router": "^13.1.0",
|
|
38
|
+
"ofetch": "^1.4.1",
|
|
39
|
+
"vue": "^3.5.13",
|
|
40
|
+
"vue-i18n": "9.14.5",
|
|
41
|
+
"vue-router": "4.4.5",
|
|
42
|
+
"vue-sonner": "^1.3.0",
|
|
43
|
+
"vue3-perfect-scrollbar": "2.0.0",
|
|
44
|
+
"vuetify": "3.10.11"
|
|
45
|
+
},
|
|
46
|
+
"dependencies": {
|
|
47
|
+
"@vuepic/vue-datepicker": "^11.0.0",
|
|
48
|
+
"cropperjs": "^1.6.2",
|
|
49
|
+
"print-js": "^1.6.0",
|
|
50
|
+
"v-calendar": "^3.1.2",
|
|
51
|
+
"vue-multiselect": "^3.1.0"
|
|
52
|
+
},
|
|
53
|
+
"devDependencies": {
|
|
54
|
+
"@tanstack/eslint-plugin-query": "^5.73.3",
|
|
55
|
+
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
56
|
+
"@types/node": "^22.12.0",
|
|
57
|
+
"@vitejs/plugin-vue": "^6.0.1",
|
|
58
|
+
"eslint": "^8.57.1",
|
|
59
|
+
"eslint-import-resolver-typescript": "^4.3.3",
|
|
60
|
+
"eslint-plugin-import": "^2.31.0",
|
|
61
|
+
"eslint-plugin-vue": "^9.32.0",
|
|
62
|
+
"sass": "1.92.1",
|
|
63
|
+
"typescript": "^5.9.3",
|
|
64
|
+
"unbuild": "^3.0.0",
|
|
65
|
+
"vite": "^5.4.21",
|
|
66
|
+
"vite-plugin-vuetify": "^2.1.2",
|
|
67
|
+
"vue-sfc-transformer": "^0.1.16",
|
|
68
|
+
"vue-tsc": "^3.1.1"
|
|
22
69
|
}
|
|
23
|
-
|
|
24
|
-
"main": "./dist/index.js",
|
|
25
|
-
"module": "./dist/index.mjs",
|
|
26
|
-
"peerDependencies": {
|
|
27
|
-
"@intlify/unplugin-vue-i18n": "^4.0.0",
|
|
28
|
-
"@tanstack/vue-query": "^5.74.5",
|
|
29
|
-
"@vueuse/core": "11.3.0",
|
|
30
|
-
"@vueuse/router": "^13.1.0",
|
|
31
|
-
"ofetch": "^1.4.1",
|
|
32
|
-
"vue": "^3.5.13",
|
|
33
|
-
"vue-i18n": "9.14.5",
|
|
34
|
-
"vue-router": "4.4.5",
|
|
35
|
-
"vue-sonner": "^1.3.0",
|
|
36
|
-
"vue3-perfect-scrollbar": "2.0.0",
|
|
37
|
-
"vuetify": "3.10.11"
|
|
38
|
-
},
|
|
39
|
-
"dependencies": {
|
|
40
|
-
"@vuepic/vue-datepicker": "^11.0.0",
|
|
41
|
-
"cropperjs": "^1.6.2",
|
|
42
|
-
"print-js": "^1.6.0",
|
|
43
|
-
"v-calendar": "^3.1.2",
|
|
44
|
-
"vue-multiselect": "^3.1.0"
|
|
45
|
-
},
|
|
46
|
-
"devDependencies": {
|
|
47
|
-
"@tanstack/eslint-plugin-query": "^5.73.3",
|
|
48
|
-
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
49
|
-
"@types/node": "^22.12.0",
|
|
50
|
-
"@vitejs/plugin-vue": "^6.0.1",
|
|
51
|
-
"eslint": "^8.57.1",
|
|
52
|
-
"eslint-import-resolver-typescript": "^4.3.3",
|
|
53
|
-
"eslint-plugin-import": "^2.31.0",
|
|
54
|
-
"eslint-plugin-vue": "^9.32.0",
|
|
55
|
-
"sass": "1.92.1",
|
|
56
|
-
"typescript": "^5.9.3",
|
|
57
|
-
"unbuild": "^3.0.0",
|
|
58
|
-
"vite": "^5.4.21",
|
|
59
|
-
"vite-plugin-vuetify": "^2.1.2",
|
|
60
|
-
"vue-sfc-transformer": "^0.1.16",
|
|
61
|
-
"vue-tsc": "^3.1.1"
|
|
62
|
-
},
|
|
63
|
-
"scripts": {
|
|
64
|
-
"dev": "vite",
|
|
65
|
-
"build": "unbuild",
|
|
66
|
-
"lint": "eslint \"**/*.{ts,vue,mjs}\"",
|
|
67
|
-
"lint:fix": "eslint \"**/*.{ts,vue,mjs}\" --fix",
|
|
68
|
-
"bump": "pnpm version patch && pnpm run build && git add . && git commit -m \"chore: release v$(node -p \"require('./package.json').version\")\""
|
|
69
|
-
}
|
|
70
|
-
}
|
|
70
|
+
}
|