@hostlink/nuxt-light 1.1.1 → 1.1.2
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/module.json
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
2
|
import { computed, ref } from "vue";
|
|
3
|
-
import { useLight } from '
|
|
3
|
+
import { useLight } from '#imports';
|
|
4
4
|
import { type QSelectProps } from "quasar";
|
|
5
|
+
import { useI18n } from "vue-i18n";
|
|
6
|
+
import { normalizeOptions } from "@formkit/inputs"
|
|
5
7
|
|
|
6
8
|
const emits = defineEmits(["update:modelValue"]);
|
|
7
9
|
|
|
10
|
+
const { t } = useI18n();
|
|
8
11
|
const light = useLight();
|
|
9
12
|
interface LSelectProps extends QSelectProps {
|
|
10
13
|
required?: boolean
|
|
@@ -18,15 +21,16 @@ const props = withDefaults(defineProps<LSelectProps>(), {
|
|
|
18
21
|
options: () => {
|
|
19
22
|
return []
|
|
20
23
|
},
|
|
21
|
-
optionLabel:
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
24
|
+
optionLabel: "label",
|
|
25
|
+
emitValue: true,
|
|
26
|
+
mapOptions: true,
|
|
27
|
+
filled: undefined,
|
|
28
|
+
outlined: undefined,
|
|
29
|
+
standout: undefined,
|
|
30
|
+
rounded: undefined,
|
|
31
|
+
dense: undefined,
|
|
32
|
+
square: undefined,
|
|
33
|
+
stackLabel: undefined,
|
|
30
34
|
})
|
|
31
35
|
|
|
32
36
|
|
|
@@ -44,9 +48,11 @@ let select_options = ref(props.options);
|
|
|
44
48
|
|
|
45
49
|
const filterFn = (val, update, abort) => {
|
|
46
50
|
|
|
51
|
+
const opts = normalizeOptions(props.options);
|
|
52
|
+
|
|
47
53
|
if (val === "") {
|
|
48
54
|
update(() => {
|
|
49
|
-
select_options.value =
|
|
55
|
+
select_options.value = opts
|
|
50
56
|
});
|
|
51
57
|
return;
|
|
52
58
|
}
|
|
@@ -54,7 +60,7 @@ const filterFn = (val, update, abort) => {
|
|
|
54
60
|
update(() => {
|
|
55
61
|
const needle = val.toLowerCase();
|
|
56
62
|
|
|
57
|
-
select_options.value =
|
|
63
|
+
select_options.value = opts.filter(v => v[props.optionLabel].toLowerCase().indexOf(needle) > -1);
|
|
58
64
|
})
|
|
59
65
|
}
|
|
60
66
|
|
|
@@ -63,21 +69,24 @@ const clearable = computed(() => {
|
|
|
63
69
|
});
|
|
64
70
|
|
|
65
71
|
const attrs = computed(() => {
|
|
66
|
-
|
|
67
|
-
...
|
|
68
|
-
filled: light.getStyle("inputFilled"),
|
|
69
|
-
outlined: light.getStyle("inputOutlined"),
|
|
70
|
-
standout: light.getStyle("inputStandout"),
|
|
71
|
-
rounded: light.getStyle("inputRounded"),
|
|
72
|
-
dense: light.getStyle("inputDense"),
|
|
73
|
-
square: light.getStyle("inputSquare"),
|
|
74
|
-
stackLabel: light.getStyle("inputStackLabel")
|
|
75
|
-
},
|
|
76
|
-
...{
|
|
77
|
-
emitValue: props.emitValue,
|
|
78
|
-
mapOptions: props.mapOptions
|
|
79
|
-
}
|
|
72
|
+
const a = {
|
|
73
|
+
...props,
|
|
80
74
|
}
|
|
75
|
+
|
|
76
|
+
if (props.fillInput === undefined) a.fillInput = light.getStyle("inputFilled")
|
|
77
|
+
if (props.outlined === undefined) a.outlined = light.getStyle("inputOutlined")
|
|
78
|
+
if (props.standout === undefined) a.standout = light.getStyle("inputStandout")
|
|
79
|
+
if (props.rounded === undefined) a.rounded = light.getStyle("inputRounded")
|
|
80
|
+
if (props.dense === undefined) a.dense = light.getStyle("inputDense")
|
|
81
|
+
if (props.square === undefined) a.square = light.getStyle("inputSquare")
|
|
82
|
+
if (props.stackLabel === undefined) a.stackLabel = light.getStyle("inputStackLabel")
|
|
83
|
+
|
|
84
|
+
if (props.label) {
|
|
85
|
+
a.label = t(props.label);
|
|
86
|
+
}
|
|
87
|
+
|
|
88
|
+
return a;
|
|
89
|
+
|
|
81
90
|
});
|
|
82
91
|
|
|
83
92
|
const localValue = computed({
|
|
@@ -87,6 +96,6 @@ const localValue = computed({
|
|
|
87
96
|
|
|
88
97
|
</script>
|
|
89
98
|
<template>
|
|
90
|
-
<q-select v-bind="attrs" v-model="localValue" :
|
|
91
|
-
|
|
99
|
+
<q-select v-bind="attrs" v-model="localValue" :options="select_options" @filter="filterFn" :option-label="optionLabel"
|
|
100
|
+
hide-bottom-space :rules="rules" :clearable="clearable" />
|
|
92
101
|
</template>
|