@veltra/desktop 1.3.9 → 1.3.10
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/action/action-group.vue.d.ts +1 -1
- package/dist/components/auto-complete/auto-complete.js +6 -1
- package/dist/components/auto-complete/auto-complete.js.map +1 -1
- package/dist/components/auto-complete/style2.css +6 -4
- package/dist/components/grid-input/grid-input.vue.d.ts +1 -1
- package/dist/components/number-range-input/number-range-input.vue.d.ts +1 -1
- package/dist/components/steps/steps.vue.d.ts +2 -2
- package/dist/components/tabs/tabs-horizontal.vue.d.ts +2 -2
- package/dist/components/tabs/tabs-vertical.vue.d.ts +2 -2
- package/dist/components/tabs/tabs.vue.d.ts +2 -2
- package/package.json +6 -6
- package/src/components/auto-complete/auto-complete.vue +8 -0
- package/src/components/auto-complete/style.scss +6 -4
|
@@ -8,9 +8,9 @@ type __VLS_Slots = {
|
|
|
8
8
|
declare const __VLS_base: import("vue").DefineComponent<ActionGroupProps, _ActionGroupExposed, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<ActionGroupProps> & Readonly<{}>, {
|
|
9
9
|
size: "small" | "default" | "large";
|
|
10
10
|
type: import("@veltra/utils").ColorType;
|
|
11
|
+
max: number;
|
|
11
12
|
text: boolean;
|
|
12
13
|
circle: boolean;
|
|
13
|
-
max: number;
|
|
14
14
|
loading: boolean;
|
|
15
15
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
16
16
|
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
|
|
@@ -112,6 +112,10 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
112
112
|
}
|
|
113
113
|
handleKeydown(event);
|
|
114
114
|
};
|
|
115
|
+
/** 用户输入时展开建议面板(选中项不会触发原生 input 事件,因此不会误展开) */
|
|
116
|
+
const handleNativeInput = () => {
|
|
117
|
+
if (!dropdownVisible.value) dropdownVisible.value = true;
|
|
118
|
+
};
|
|
115
119
|
watch([point, keyboardOptions], ([currentPoint, options]) => {
|
|
116
120
|
if (!scrollRef.value || currentPoint < 0) return;
|
|
117
121
|
const currentOption = options[currentPoint];
|
|
@@ -160,7 +164,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
|
|
|
160
164
|
clearable: __props.clearable,
|
|
161
165
|
modelValue: model.value,
|
|
162
166
|
"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
|
|
163
|
-
onKeydown: handleInputKeydown
|
|
167
|
+
onKeydown: handleInputKeydown,
|
|
168
|
+
"onNative:input": handleNativeInput
|
|
164
169
|
}, createSlots({ _: 2 }, [slots.suffix ? {
|
|
165
170
|
name: "suffix",
|
|
166
171
|
fn: withCtx(() => [renderSlot(_ctx.$slots, "suffix")]),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"auto-complete.js","names":["$attrs"],"sources":["../../../src/components/auto-complete/auto-complete.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n trigger=\"click\"\n :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n ref=\"dropdownRef\"\n v-model:visible=\"dropdownVisible\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size)]\"\n :disabled=\"disabled\"\n >\n <!-- 触发 -->\n <template #trigger>\n <!-- 单选 -->\n <u-input\n :size=\"size\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder\"\n :clearable=\"clearable\"\n v-model=\"model\"\n @keydown=\"handleInputKeydown\"\n >\n <template #suffix v-if=\"slots.suffix\">\n <slot name=\"suffix\" />\n </template>\n\n <template #prefix v-if=\"slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n </u-input>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <u-scroll tag=\"ul\" :class=\"cls.e('options')\" ref=\"scrollRef\">\n <li\n v-if=\"displayCachedSuggestion\"\n :class=\"[optionClass, bem.is('active', isCachedActive)]\"\n @click=\"handleSelectCachedOption(displayCachedSuggestion)\"\n v-ripple=\"cls.e('ripple')\"\n :data-key=\"displayCachedSuggestion\"\n :key=\"displayCachedSuggestion\"\n >\n <slot v-bind=\"{ option: displayCachedSuggestion, index: -1 }\">\n {{ displayCachedSuggestion }}\n </slot>\n </li>\n\n <li\n v-for=\"(option, index) of suggestions\"\n :class=\"[\n optionClass,\n bem.is('selected', option === model),\n bem.is('active', isActiveOption(index))\n ]\"\n @click=\"handleSelect(option)\"\n v-ripple=\"cls.e('ripple')\"\n :data-key=\"option\"\n :key=\"option\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ option }}\n </slot>\n </li>\n </u-scroll>\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ model || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { vRipple } from '@veltra/directives'\nimport { bem, FORM_EMPTY_CONTENT, scrollIntoContainerView } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { AutoCompleteEmits, AutoCompleteProps, _AutoCompleteExposed } from '../../types'\nimport type { DropdownExposed, ScrollExposed } from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useSuggestions } from './use-suggestions'\n\ndefineOptions({ name: 'UAutoComplete', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<AutoCompleteProps>(), {\n placeholder: '请输入',\n clearable: true,\n allowCustom: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<AutoCompleteEmits>()\n\nconst slots = defineSlots<{\n default?: (props: { option: string; index: number }) => any\n suffix?: () => any\n prefix?: () => any\n}>()\n\n// 当前输入框的值\nconst model = defineModel<string>()\n\nconst cls = bem('auto-complete')\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = injectFormContext()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst dropdownVisible = shallowRef(false)\nconst scrollRef = shallowRef<ScrollExposed>()\n\nwatch(scrollRef, (scroll) => {\n if (scroll && model.value !== undefined) {\n const li = scroll.contentRef!.querySelector(`li[data-key=\"${model.value}\"]`) as HTMLElement\n li && scrollIntoContainerView(li, scroll.containerRef ?? null)\n }\n})\n\nconst { suggestions, appendedSuggestions, cachedSuggestion } = useSuggestions({ props, model })\n\nconst displayCachedSuggestion = computed(() => {\n if (!props.allowCustom) return undefined\n return cachedSuggestion.value\n})\n\nconst keyboardOptions = computed(() => {\n const currentSuggestions = suggestions.value\n return displayCachedSuggestion.value\n ? [displayCachedSuggestion.value, ...currentSuggestions]\n : currentSuggestions\n})\n\nconst { point, handleKeydown } = useKeyboard({\n options: keyboardOptions,\n dropdownVisible,\n getDefaultIndex: (options) => {\n if (!options.length) return -1\n if (model.value) {\n const matchIndex = options.indexOf(model.value)\n if (matchIndex > -1) return matchIndex\n }\n return 0\n },\n onSelect: (option, index) => {\n if (displayCachedSuggestion.value && index === 0) {\n handleSelectCachedOption(option)\n return\n }\n handleSelect(option)\n }\n})\n\nconst isCachedActive = computed(() => !!displayCachedSuggestion.value && point.value === 0)\n\nconst isActiveOption = (index: number) => {\n const offset = displayCachedSuggestion.value ? 1 : 0\n return point.value === index + offset\n}\n\nconst handleInputKeydown = (event: KeyboardEvent) => {\n if (!dropdownVisible.value && event.key === 'Enter' && displayCachedSuggestion.value) {\n event.preventDefault()\n event.stopPropagation()\n handleSelectCachedOption(displayCachedSuggestion.value)\n return\n }\n handleKeydown(event)\n}\n\nwatch([point, keyboardOptions], ([currentPoint, options]) => {\n if (!scrollRef.value || currentPoint < 0) return\n const currentOption = options[currentPoint]\n if (!currentOption) return\n const target = scrollRef.value.contentRef?.querySelector(\n `li[data-key=\"${currentOption}\"]`\n ) as HTMLElement | null\n if (target) {\n scrollIntoContainerView(target, scrollRef.value.containerRef ?? null)\n }\n})\n\n/** 选中选项 */\nconst handleSelect = (option: string) => {\n model.value = option\n dropdownRef.value?.close()\n saveCache()\n emit('select', option)\n}\n\nfunction saveCache() {\n if (!model.value) return\n appendedSuggestions.value = [...appendedSuggestions.value, model.value]\n}\n\nconst handleSelectCachedOption = (cachedOption: string) => {\n appendedSuggestions.value = [...appendedSuggestions.value, cachedOption]\n dropdownRef.value?.close()\n}\n\ndefineExpose<_AutoCompleteExposed>({\n open: () => dropdownRef.value?.open(),\n close: () => dropdownRef.value?.close()\n})\n</script>\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"auto-complete.js","names":["$attrs"],"sources":["../../../src/components/auto-complete/auto-complete.vue"],"sourcesContent":["<template>\n <u-dropdown\n v-if=\"!readonly\"\n v-bind=\"$attrs\"\n trigger=\"click\"\n :class=\"[cls.b, cls.m(size), bem.is('disabled', disabled)]\"\n ref=\"dropdownRef\"\n v-model:visible=\"dropdownVisible\"\n :content-class=\"[cls.e('panel'), cls.em('panel', size)]\"\n :disabled=\"disabled\"\n >\n <!-- 触发 -->\n <template #trigger>\n <!-- 单选 -->\n <u-input\n :size=\"size\"\n :disabled=\"disabled\"\n :placeholder=\"placeholder\"\n :clearable=\"clearable\"\n v-model=\"model\"\n @keydown=\"handleInputKeydown\"\n @native:input=\"handleNativeInput\"\n >\n <template #suffix v-if=\"slots.suffix\">\n <slot name=\"suffix\" />\n </template>\n\n <template #prefix v-if=\"slots.prefix\">\n <slot name=\"prefix\" />\n </template>\n </u-input>\n </template>\n\n <!-- 下拉内容 -->\n <template #content>\n <u-scroll tag=\"ul\" :class=\"cls.e('options')\" ref=\"scrollRef\">\n <li\n v-if=\"displayCachedSuggestion\"\n :class=\"[optionClass, bem.is('active', isCachedActive)]\"\n @click=\"handleSelectCachedOption(displayCachedSuggestion)\"\n v-ripple=\"cls.e('ripple')\"\n :data-key=\"displayCachedSuggestion\"\n :key=\"displayCachedSuggestion\"\n >\n <slot v-bind=\"{ option: displayCachedSuggestion, index: -1 }\">\n {{ displayCachedSuggestion }}\n </slot>\n </li>\n\n <li\n v-for=\"(option, index) of suggestions\"\n :class=\"[\n optionClass,\n bem.is('selected', option === model),\n bem.is('active', isActiveOption(index))\n ]\"\n @click=\"handleSelect(option)\"\n v-ripple=\"cls.e('ripple')\"\n :data-key=\"option\"\n :key=\"option\"\n >\n <slot v-bind=\"{ option, index }\">\n {{ option }}\n </slot>\n </li>\n </u-scroll>\n </template>\n </u-dropdown>\n\n <template v-else>\n {{ model || FORM_EMPTY_CONTENT }}\n </template>\n</template>\n\n<script lang=\"ts\" setup>\nimport { useFormFallbackProps } from '@veltra/compositions'\nimport { vRipple } from '@veltra/directives'\nimport { bem, FORM_EMPTY_CONTENT, scrollIntoContainerView } from '@veltra/utils'\nimport { injectFormContext } from '@veltra/utils'\nimport { computed, shallowRef, watch } from 'vue'\n\nimport type { AutoCompleteEmits, AutoCompleteProps, _AutoCompleteExposed } from '../../types'\nimport type { DropdownExposed, ScrollExposed } from '../../types'\nimport { UDropdown } from '../dropdown'\nimport { UInput } from '../input'\nimport { UScroll } from '../scroll'\nimport { useKeyboard } from './use-keyboard'\nimport { useSuggestions } from './use-suggestions'\n\ndefineOptions({ name: 'UAutoComplete', inheritAttrs: false })\n\nconst props = withDefaults(defineProps<AutoCompleteProps>(), {\n placeholder: '请输入',\n clearable: true,\n allowCustom: true,\n disabled: undefined,\n readonly: undefined\n})\n\nconst emit = defineEmits<AutoCompleteEmits>()\n\nconst slots = defineSlots<{\n default?: (props: { option: string; index: number }) => any\n suffix?: () => any\n prefix?: () => any\n}>()\n\n// 当前输入框的值\nconst model = defineModel<string>()\n\nconst cls = bem('auto-complete')\n\nconst optionClass = cls.e('option')\n\nconst { formProps } = injectFormContext()\nconst { size, disabled, readonly } = useFormFallbackProps([formProps ?? {}, props], {\n size: 'default',\n disabled: false,\n readonly: false\n})\n\nconst dropdownRef = shallowRef<DropdownExposed>()\nconst dropdownVisible = shallowRef(false)\nconst scrollRef = shallowRef<ScrollExposed>()\n\nwatch(scrollRef, (scroll) => {\n if (scroll && model.value !== undefined) {\n const li = scroll.contentRef!.querySelector(`li[data-key=\"${model.value}\"]`) as HTMLElement\n li && scrollIntoContainerView(li, scroll.containerRef ?? null)\n }\n})\n\nconst { suggestions, appendedSuggestions, cachedSuggestion } = useSuggestions({ props, model })\n\nconst displayCachedSuggestion = computed(() => {\n if (!props.allowCustom) return undefined\n return cachedSuggestion.value\n})\n\nconst keyboardOptions = computed(() => {\n const currentSuggestions = suggestions.value\n return displayCachedSuggestion.value\n ? [displayCachedSuggestion.value, ...currentSuggestions]\n : currentSuggestions\n})\n\nconst { point, handleKeydown } = useKeyboard({\n options: keyboardOptions,\n dropdownVisible,\n getDefaultIndex: (options) => {\n if (!options.length) return -1\n if (model.value) {\n const matchIndex = options.indexOf(model.value)\n if (matchIndex > -1) return matchIndex\n }\n return 0\n },\n onSelect: (option, index) => {\n if (displayCachedSuggestion.value && index === 0) {\n handleSelectCachedOption(option)\n return\n }\n handleSelect(option)\n }\n})\n\nconst isCachedActive = computed(() => !!displayCachedSuggestion.value && point.value === 0)\n\nconst isActiveOption = (index: number) => {\n const offset = displayCachedSuggestion.value ? 1 : 0\n return point.value === index + offset\n}\n\nconst handleInputKeydown = (event: KeyboardEvent) => {\n if (!dropdownVisible.value && event.key === 'Enter' && displayCachedSuggestion.value) {\n event.preventDefault()\n event.stopPropagation()\n handleSelectCachedOption(displayCachedSuggestion.value)\n return\n }\n handleKeydown(event)\n}\n\n/** 用户输入时展开建议面板(选中项不会触发原生 input 事件,因此不会误展开) */\nconst handleNativeInput = () => {\n if (!dropdownVisible.value) {\n dropdownVisible.value = true\n }\n}\n\nwatch([point, keyboardOptions], ([currentPoint, options]) => {\n if (!scrollRef.value || currentPoint < 0) return\n const currentOption = options[currentPoint]\n if (!currentOption) return\n const target = scrollRef.value.contentRef?.querySelector(\n `li[data-key=\"${currentOption}\"]`\n ) as HTMLElement | null\n if (target) {\n scrollIntoContainerView(target, scrollRef.value.containerRef ?? null)\n }\n})\n\n/** 选中选项 */\nconst handleSelect = (option: string) => {\n model.value = option\n dropdownRef.value?.close()\n saveCache()\n emit('select', option)\n}\n\nfunction saveCache() {\n if (!model.value) return\n appendedSuggestions.value = [...appendedSuggestions.value, model.value]\n}\n\nconst handleSelectCachedOption = (cachedOption: string) => {\n appendedSuggestions.value = [...appendedSuggestions.value, cachedOption]\n dropdownRef.value?.close()\n}\n\ndefineExpose<_AutoCompleteExposed>({\n open: () => dropdownRef.value?.open(),\n close: () => dropdownRef.value?.close()\n})\n</script>\n"],"mappings":"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"}
|
|
@@ -41,14 +41,16 @@
|
|
|
41
41
|
white-space: nowrap;
|
|
42
42
|
}
|
|
43
43
|
.u-auto-complete__option:hover {
|
|
44
|
-
background-color: var(--u-
|
|
44
|
+
background-color: var(--u-nav-hover-bg);
|
|
45
|
+
color: var(--u-nav-hover-color);
|
|
45
46
|
}
|
|
46
47
|
.u-auto-complete__option.is-active {
|
|
47
|
-
background-color: var(--u-
|
|
48
|
+
background-color: var(--u-nav-hover-bg);
|
|
49
|
+
color: var(--u-nav-hover-color);
|
|
48
50
|
}
|
|
49
51
|
.u-auto-complete__option.is-selected {
|
|
50
|
-
background-color: var(--u-
|
|
51
|
-
color: var(--u-
|
|
52
|
+
background-color: var(--u-nav-active-bg);
|
|
53
|
+
color: var(--u-nav-active-color);
|
|
52
54
|
}
|
|
53
55
|
.u-auto-complete__ripple {
|
|
54
56
|
background-color: var(--u-color-primary-light-7);
|
|
@@ -10,8 +10,8 @@ declare const __VLS_export: import("vue").DefineComponent<GridInputProps, import
|
|
|
10
10
|
onInput?: ((value: string) => any) | undefined;
|
|
11
11
|
}>, {
|
|
12
12
|
length: number;
|
|
13
|
-
separator: string;
|
|
14
13
|
zero: boolean;
|
|
14
|
+
separator: string;
|
|
15
15
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
16
16
|
declare const _default: typeof __VLS_export;
|
|
17
17
|
//#endregion
|
|
@@ -26,9 +26,9 @@ declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {},
|
|
|
26
26
|
disabled: boolean;
|
|
27
27
|
readonly: boolean;
|
|
28
28
|
clearable: boolean;
|
|
29
|
+
separator: string;
|
|
29
30
|
startPlaceholder: string;
|
|
30
31
|
endPlaceholder: string;
|
|
31
|
-
separator: string;
|
|
32
32
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
33
33
|
declare const _default: typeof __VLS_export;
|
|
34
34
|
//#endregion
|
|
@@ -7,11 +7,11 @@ type __VLS_Slots = {
|
|
|
7
7
|
tip?: (scope: StepsSlotScope) => any;
|
|
8
8
|
};
|
|
9
9
|
declare const __VLS_base: import("vue").DefineComponent<StepsProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
|
|
10
|
-
"item-click": (item: Record<string, any>, index: number) => any;
|
|
11
10
|
"update:current": (value?: string | number | undefined) => any;
|
|
11
|
+
"item-click": (item: Record<string, any>, index: number) => any;
|
|
12
12
|
}, string, import("vue").PublicProps, Readonly<StepsProps> & Readonly<{
|
|
13
|
-
"onItem-click"?: ((item: Record<string, any>, index: number) => any) | undefined;
|
|
14
13
|
"onUpdate:current"?: ((value?: string | number | undefined) => any) | undefined;
|
|
14
|
+
"onItem-click"?: ((item: Record<string, any>, index: number) => any) | undefined;
|
|
15
15
|
}>, {
|
|
16
16
|
labelKey: string;
|
|
17
17
|
direction: "horizontal" | "vertical";
|
|
@@ -16,12 +16,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
|
|
|
16
16
|
"update:modelValue": (value: string | undefined) => any;
|
|
17
17
|
} & {
|
|
18
18
|
"update:modelValue": (value: string) => any;
|
|
19
|
-
close: (item: TabItem, index: number) => any;
|
|
20
19
|
click: (item: TabItem, index: number) => any;
|
|
20
|
+
close: (item: TabItem, index: number) => any;
|
|
21
21
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
22
22
|
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
23
|
-
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
24
23
|
onClick?: ((item: TabItem, index: number) => any) | undefined;
|
|
24
|
+
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
25
25
|
}>, {
|
|
26
26
|
closable: boolean;
|
|
27
27
|
block: boolean;
|
|
@@ -16,12 +16,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
|
|
|
16
16
|
"update:modelValue": (value: string | undefined) => any;
|
|
17
17
|
} & {
|
|
18
18
|
"update:modelValue": (value: string) => any;
|
|
19
|
-
close: (item: TabItem, index: number) => any;
|
|
20
19
|
click: (item: TabItem, index: number) => any;
|
|
20
|
+
close: (item: TabItem, index: number) => any;
|
|
21
21
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
22
22
|
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
23
|
-
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
24
23
|
onClick?: ((item: TabItem, index: number) => any) | undefined;
|
|
24
|
+
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
25
25
|
}>, {
|
|
26
26
|
closable: boolean;
|
|
27
27
|
rounded: boolean;
|
|
@@ -11,12 +11,12 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, {}, {
|
|
|
11
11
|
"update:modelValue": (value: string | undefined) => any;
|
|
12
12
|
} & {
|
|
13
13
|
"update:modelValue": (value: string) => any;
|
|
14
|
-
close: (item: TabItem, index: number) => any;
|
|
15
14
|
click: (item: TabItem, index: number) => any;
|
|
15
|
+
close: (item: TabItem, index: number) => any;
|
|
16
16
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
17
17
|
"onUpdate:modelValue"?: ((value: string) => any) | undefined;
|
|
18
|
-
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
19
18
|
onClick?: ((item: TabItem, index: number) => any) | undefined;
|
|
19
|
+
onClose?: ((item: TabItem, index: number) => any) | undefined;
|
|
20
20
|
}>, {
|
|
21
21
|
closable: boolean;
|
|
22
22
|
block: boolean;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@veltra/desktop",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.10",
|
|
4
4
|
"files": [
|
|
5
5
|
"dist",
|
|
6
6
|
"src"
|
|
@@ -57,11 +57,11 @@
|
|
|
57
57
|
"@cat-kit/core": ">=1.1.8",
|
|
58
58
|
"@cat-kit/excel": ">=1.0.0",
|
|
59
59
|
"@cat-kit/fe": "^1.1.8",
|
|
60
|
-
"@veltra/compositions": "1.3.
|
|
61
|
-
"@veltra/directives": "1.3.
|
|
62
|
-
"@veltra/icons": "1.3.
|
|
63
|
-
"@veltra/styles": "1.3.
|
|
64
|
-
"@veltra/utils": "1.3.
|
|
60
|
+
"@veltra/compositions": "1.3.10",
|
|
61
|
+
"@veltra/directives": "1.3.10",
|
|
62
|
+
"@veltra/icons": "1.3.10",
|
|
63
|
+
"@veltra/styles": "1.3.10",
|
|
64
|
+
"@veltra/utils": "1.3.10",
|
|
65
65
|
"vue": ">=3.5.40"
|
|
66
66
|
},
|
|
67
67
|
"devDependencies": {
|
|
@@ -19,6 +19,7 @@
|
|
|
19
19
|
:clearable="clearable"
|
|
20
20
|
v-model="model"
|
|
21
21
|
@keydown="handleInputKeydown"
|
|
22
|
+
@native:input="handleNativeInput"
|
|
22
23
|
>
|
|
23
24
|
<template #suffix v-if="slots.suffix">
|
|
24
25
|
<slot name="suffix" />
|
|
@@ -180,6 +181,13 @@ const handleInputKeydown = (event: KeyboardEvent) => {
|
|
|
180
181
|
handleKeydown(event)
|
|
181
182
|
}
|
|
182
183
|
|
|
184
|
+
/** 用户输入时展开建议面板(选中项不会触发原生 input 事件,因此不会误展开) */
|
|
185
|
+
const handleNativeInput = () => {
|
|
186
|
+
if (!dropdownVisible.value) {
|
|
187
|
+
dropdownVisible.value = true
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
|
|
183
191
|
watch([point, keyboardOptions], ([currentPoint, options]) => {
|
|
184
192
|
if (!scrollRef.value || currentPoint < 0) return
|
|
185
193
|
const currentOption = options[currentPoint]
|
|
@@ -32,16 +32,18 @@ $root-name: auto-complete;
|
|
|
32
32
|
@include m.ellipsis;
|
|
33
33
|
|
|
34
34
|
&:hover {
|
|
35
|
-
background-color:
|
|
35
|
+
background-color: var(--u-nav-hover-bg);
|
|
36
|
+
color: var(--u-nav-hover-color);
|
|
36
37
|
}
|
|
37
38
|
|
|
38
39
|
@include m.is(active) {
|
|
39
|
-
background-color:
|
|
40
|
+
background-color: var(--u-nav-hover-bg);
|
|
41
|
+
color: var(--u-nav-hover-color);
|
|
40
42
|
}
|
|
41
43
|
|
|
42
44
|
@include m.is(selected) {
|
|
43
|
-
background-color:
|
|
44
|
-
color:
|
|
45
|
+
background-color: var(--u-nav-active-bg);
|
|
46
|
+
color: var(--u-nav-active-color);
|
|
45
47
|
}
|
|
46
48
|
}
|
|
47
49
|
|