niuma-ui 2.0.3 → 2.0.4
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/CHANGELOG.md +38 -0
- package/dist/components/_shared/src/reka.d.ts +1 -1
- package/dist/components/_shared/src/reka.js +2 -2
- package/dist/components/anchor/index.d.ts +1 -1
- package/dist/components/anchor/src/RsAnchor.css +63 -32
- package/dist/components/anchor/src/RsAnchor.d.ts +29 -2
- package/dist/components/anchor/src/RsAnchor.impl.js +199 -81
- package/dist/components/anchor/src/RsAnchor.js +1 -1
- package/dist/components/anchor/src/anchor-utils.d.ts +36 -4
- package/dist/components/anchor/src/anchor-utils.js +81 -19
- package/dist/components/auto-complete/index.d.ts +2 -0
- package/dist/components/auto-complete/src/RsAutoComplete.css +122 -0
- package/dist/components/auto-complete/src/RsAutoComplete.d.ts +47 -7
- package/dist/components/auto-complete/src/RsAutoComplete.impl.js +180 -72
- package/dist/components/auto-complete/src/RsAutoComplete.js +4 -1
- package/dist/components/auto-complete/src/auto-complete-utils.d.ts +7 -0
- package/dist/components/auto-complete/src/auto-complete-utils.js +17 -0
- package/dist/components/avatar/index.d.ts +1 -0
- package/dist/components/avatar/src/RsAvatar.css +36 -19
- package/dist/components/avatar/src/RsAvatar.d.ts +9 -3
- package/dist/components/avatar/src/RsAvatar.impl.js +57 -33
- package/dist/components/avatar/src/RsAvatar.js +2 -1
- package/dist/components/avatar/src/avatar-utils.d.ts +16 -7
- package/dist/components/avatar/src/avatar-utils.js +41 -3
- package/dist/components/breadcrumb/index.d.ts +1 -1
- package/dist/components/breadcrumb/src/RsBreadcrumb.css +50 -17
- package/dist/components/breadcrumb/src/RsBreadcrumb.d.ts +45 -6
- package/dist/components/breadcrumb/src/RsBreadcrumb.impl.js +111 -12
- package/dist/components/breadcrumb/src/RsBreadcrumb.js +2 -1
- package/dist/components/breadcrumb/src/breadcrumb-utils.d.ts +37 -5
- package/dist/components/breadcrumb/src/breadcrumb-utils.js +70 -9
- package/dist/components/calendar-grid/index.d.ts +2 -0
- package/dist/components/calendar-grid/src/RsCalendarGrid.css +105 -45
- package/dist/components/calendar-grid/src/RsCalendarGrid.d.ts +62 -2
- package/dist/components/calendar-grid/src/RsCalendarGrid.impl.js +265 -94
- package/dist/components/calendar-grid/src/RsCalendarGrid.js +1 -1
- package/dist/components/calendar-grid/src/calendar-grid-utils.d.ts +72 -0
- package/dist/components/calendar-grid/src/calendar-grid-utils.js +122 -0
- package/dist/components/card/index.d.ts +1 -1
- package/dist/components/card/src/RsCard.css +108 -98
- package/dist/components/card/src/RsCard.d.ts +3 -12
- package/dist/components/card/src/RsCard.impl.js +29 -25
- package/dist/components/card/src/RsCard.js +2 -1
- package/dist/components/card/src/card-utils.d.ts +25 -0
- package/dist/components/card/src/card-utils.js +10 -0
- package/dist/components/cascader/index.d.ts +1 -0
- package/dist/components/cascader/src/RsCascader.css +175 -30
- package/dist/components/cascader/src/RsCascader.d.ts +15 -3
- package/dist/components/cascader/src/RsCascader.impl.js +277 -48
- package/dist/components/cascader/src/RsCascader.js +1 -1
- package/dist/components/cascader/src/cascader-utils.d.ts +2 -0
- package/dist/components/cascader/src/cascader-utils.js +8 -1
- package/dist/components/checkbox/index.d.ts +1 -0
- package/dist/components/checkbox/src/RsCheckbox.css +46 -23
- package/dist/components/checkbox/src/RsCheckbox.d.ts +11 -1
- package/dist/components/checkbox/src/RsCheckbox.impl.js +37 -9
- package/dist/components/checkbox/src/RsCheckbox.js +2 -1
- package/dist/components/checkbox/src/checkbox-utils.d.ts +4 -0
- package/dist/components/checkbox/src/checkbox-utils.js +12 -0
- package/dist/components/container/index.d.ts +1 -1
- package/dist/components/container/src/RsContainer.css +11 -11
- package/dist/components/container/src/RsContainer.d.ts +2 -12
- package/dist/components/container/src/RsContainer.impl.js +10 -57
- package/dist/components/container/src/RsContainer.js +1 -1
- package/dist/components/container/src/container-utils.d.ts +23 -0
- package/dist/components/container/src/container-utils.js +51 -0
- package/dist/components/date-picker/index.d.ts +4 -2
- package/dist/components/date-picker/src/RsDatePicker.css +42 -22
- package/dist/components/date-picker/src/RsDatePicker.d.ts +44 -20
- package/dist/components/date-picker/src/RsDatePicker.impl.js +484 -222
- package/dist/components/date-picker/src/RsDatePicker.js +1 -3
- package/dist/components/date-picker/src/RsDateTimePicker.d.ts +33 -6
- package/dist/components/date-picker/src/RsDateTimePicker.impl.js +47 -6
- package/dist/components/date-picker/src/date-picker-utils.d.ts +19 -0
- package/dist/components/date-picker/src/date-picker-utils.js +33 -10
- package/dist/components/dynamic-tags/index.d.ts +1 -1
- package/dist/components/dynamic-tags/src/RsDynamicTags.css +115 -38
- package/dist/components/dynamic-tags/src/RsDynamicTags.d.ts +58 -17
- package/dist/components/dynamic-tags/src/RsDynamicTags.impl.js +269 -106
- package/dist/components/dynamic-tags/src/RsDynamicTags.js +1 -1
- package/dist/components/dynamic-tags/src/dynamic-tags-utils.d.ts +19 -0
- package/dist/components/dynamic-tags/src/dynamic-tags-utils.js +60 -0
- package/dist/components/fieldset/src/RsFieldset.css +71 -41
- package/dist/components/fieldset/src/RsFieldset.d.ts +21 -2
- package/dist/components/fieldset/src/RsFieldset.impl.js +93 -26
- package/dist/components/fieldset/src/RsFieldset.js +1 -1
- package/dist/components/fieldset/src/fieldset-utils.d.ts +4 -0
- package/dist/components/fieldset/src/fieldset-utils.js +9 -1
- package/dist/components/form/index.d.ts +1 -0
- package/dist/components/form/src/RsForm.css +15 -12
- package/dist/components/form/src/RsForm.d.ts +20 -22
- package/dist/components/form/src/RsForm.impl.js +33 -20
- package/dist/components/form/src/RsForm.js +1 -1
- package/dist/components/form/src/form-utils.d.ts +7 -0
- package/dist/components/form/src/form-utils.js +28 -1
- package/dist/components/input/index.d.ts +1 -1
- package/dist/components/input/src/RsInput.css +78 -260
- package/dist/components/input/src/RsInput.d.ts +5 -3
- package/dist/components/input/src/RsInput.impl.js +8 -16
- package/dist/components/input/src/RsInput.js +1 -1
- package/dist/components/input/src/input-utils.d.ts +11 -0
- package/dist/components/input/src/input-utils.js +22 -0
- package/dist/components/input-number/index.d.ts +1 -0
- package/dist/components/input-number/src/RsInputNumber.css +31 -31
- package/dist/components/input-number/src/RsInputNumber.d.ts +15 -13
- package/dist/components/input-number/src/RsInputNumber.impl.js +17 -4
- package/dist/components/input-number/src/RsInputNumber.js +1 -1
- package/dist/components/label/src/RsLabel.css +30 -11
- package/dist/components/label/src/RsLabel.d.ts +18 -1
- package/dist/components/label/src/RsLabel.impl.js +63 -10
- package/dist/components/label/src/RsLabel.js +1 -1
- package/dist/components/label/src/label-utils.d.ts +6 -0
- package/dist/components/label/src/label-utils.js +16 -0
- package/dist/components/link/src/RsLink.d.ts +2 -2
- package/dist/components/loading/src/RsLoading.d.ts +1 -1
- package/dist/components/mentions/index.d.ts +2 -1
- package/dist/components/mentions/src/RsMentions.css +119 -3
- package/dist/components/mentions/src/RsMentions.d.ts +56 -4
- package/dist/components/mentions/src/RsMentions.impl.js +298 -79
- package/dist/components/mentions/src/RsMentions.js +1 -3
- package/dist/components/mentions/src/mentions-utils.d.ts +5 -1
- package/dist/components/mentions/src/mentions-utils.js +28 -9
- package/dist/components/popover/src/RsPopover.d.ts +1 -1
- package/dist/components/radio/index.d.ts +1 -1
- package/dist/components/radio/src/RsRadio.css +7 -6
- package/dist/components/radio/src/RsRadio.d.ts +8 -5
- package/dist/components/radio/src/RsRadio.impl.js +34 -24
- package/dist/components/radio/src/RsRadio.js +2 -1
- package/dist/components/radio/src/RsRadioItem.css +61 -44
- package/dist/components/radio/src/RsRadioItem.d.ts +2 -2
- package/dist/components/radio/src/RsRadioItem.impl.js +53 -20
- package/dist/components/radio/src/RsRadioItem.js +2 -1
- package/dist/components/radio/src/radio-utils.d.ts +12 -1
- package/dist/components/radio/src/radio-utils.js +15 -1
- package/dist/components/scrollbar/src/RsScrollbar.css +71 -24
- package/dist/components/scrollbar/src/RsScrollbar.d.ts +9 -5
- package/dist/components/scrollbar/src/RsScrollbar.impl.js +372 -47
- package/dist/components/scrollbar/src/RsScrollbar.js +2 -1
- package/dist/components/scrollbar/src/scrollbar-utils.d.ts +34 -2
- package/dist/components/scrollbar/src/scrollbar-utils.js +64 -1
- package/dist/components/select/index.d.ts +1 -0
- package/dist/components/select/src/RsSelect.css +54 -42
- package/dist/components/select/src/RsSelect.d.ts +19 -2
- package/dist/components/select/src/RsSelect.impl.js +727 -312
- package/dist/components/select/src/RsSelect.js +1 -1
- package/dist/components/select/src/select-utils.d.ts +4 -2
- package/dist/components/select/src/select-utils.js +8 -3
- package/dist/components/select/src/use-rs-select.d.ts +1 -0
- package/dist/components/select/src/use-rs-select.js +23 -17
- package/dist/components/switch/index.d.ts +2 -1
- package/dist/components/switch/src/RsSwitch.css +36 -18
- package/dist/components/switch/src/RsSwitch.d.ts +18 -5
- package/dist/components/switch/src/RsSwitch.impl.js +61 -29
- package/dist/components/switch/src/RsSwitch.js +2 -1
- package/dist/components/switch/src/switch-utils.d.ts +4 -0
- package/dist/components/switch/src/switch-utils.js +9 -0
- package/dist/components/textarea/src/RsTextarea.css +23 -23
- package/dist/components/textarea/src/RsTextarea.d.ts +6 -12
- package/dist/components/textarea/src/RsTextarea.impl.js +37 -46
- package/dist/components/textarea/src/RsTextarea.js +1 -1
- package/dist/components/textarea/src/textarea-utils.d.ts +27 -0
- package/dist/components/textarea/src/textarea-utils.js +61 -0
- package/dist/components/time-picker/index.d.ts +3 -2
- package/dist/components/time-picker/src/RsTimePicker.css +41 -24
- package/dist/components/time-picker/src/RsTimePicker.d.ts +52 -7
- package/dist/components/time-picker/src/RsTimePicker.impl.js +520 -156
- package/dist/components/time-picker/src/RsTimePicker.js +1 -3
- package/dist/components/time-picker/src/RsTimePickerColumns.css +26 -18
- package/dist/components/time-picker/src/RsTimePickerColumns.d.ts +3 -1
- package/dist/components/time-picker/src/RsTimePickerColumns.impl.js +62 -9
- package/dist/components/time-picker/src/RsTimePickerColumns.js +1 -1
- package/dist/components/time-picker/src/time-picker-utils.d.ts +38 -0
- package/dist/components/time-picker/src/time-picker-utils.js +97 -5
- package/dist/components/toaster/src/RsToaster.d.ts +1 -1
- package/dist/components/tooltip/src/RsTooltip.d.ts +1 -1
- package/dist/components/tree/src/RsTree.d.ts +3 -3
- package/dist/components/tree-select/index.d.ts +2 -0
- package/dist/components/tree-select/src/RsTreeSelect.css +100 -25
- package/dist/components/tree-select/src/RsTreeSelect.d.ts +91 -7
- package/dist/components/tree-select/src/RsTreeSelect.impl.js +464 -79
- package/dist/components/tree-select/src/RsTreeSelect.js +1 -1
- package/dist/components/tree-select/src/tree-select-utils.d.ts +20 -0
- package/dist/components/tree-select/src/tree-select-utils.js +60 -0
- package/dist/components/upload/index.d.ts +2 -1
- package/dist/components/upload/src/RsUpload.css +223 -75
- package/dist/components/upload/src/RsUpload.d.ts +77 -1
- package/dist/components/upload/src/RsUpload.impl.js +404 -90
- package/dist/components/upload/src/RsUpload.js +1 -1
- package/dist/components/upload/src/upload-utils.d.ts +21 -2
- package/dist/components/upload/src/upload-utils.js +139 -9
- package/dist/index.d.ts +21 -11
- package/dist/index.js +6 -0
- package/dist/locale/messages.js +46 -2
- package/dist/styles.css +518 -154
- package/dist/theme/brand.example.css +1 -1
- package/package.json +1 -1
- package/dist/components/breadcrumb/src/RsBreadcrumbItems.d.ts +0 -8
- package/dist/components/breadcrumb/src/RsBreadcrumbItems.impl.js +0 -40
- package/dist/components/breadcrumb/src/RsBreadcrumbItems.js +0 -5
- package/dist/components/date-picker/src/RsDatePicker-1.css +0 -157
- package/dist/components/mentions/src/RsMentions-1.css +0 -29
- package/dist/components/time-picker/src/RsTimePicker-1.css +0 -98
|
@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_exp
|
|
|
3
3
|
import RsSelect_vue_vue_type_script_setup_true_lang_default from "./RsSelect.impl.js";
|
|
4
4
|
|
|
5
5
|
//#region src/components/select/src/RsSelect.vue
|
|
6
|
-
var RsSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSelect_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-
|
|
6
|
+
var RsSelect_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSelect_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-be97668a"]]);
|
|
7
7
|
//#endregion
|
|
8
8
|
export { RsSelect_default as default };
|
|
@@ -53,10 +53,12 @@ export type RsSelectModelValue = RsSelectValue | RsSelectValue[] | RsSelectLabel
|
|
|
53
53
|
*/
|
|
54
54
|
export type RsSelectResolvedModel<Value extends RsSelectValue = string, Multiple extends boolean = false, LabelInValue extends boolean = false> = LabelInValue extends true ? Multiple extends true ? RsSelectLabeledValue[] : Multiple extends false ? RsSelectLabeledValue | '' : RsSelectLabeledValue | RsSelectLabeledValue[] | '' : Multiple extends true ? Value[] : Multiple extends false ? Value | '' : Value | Value[] | '';
|
|
55
55
|
/**
|
|
56
|
-
*
|
|
57
|
-
*
|
|
56
|
+
* 选项 value 为空串时,对内映射为此哨兵(空串对外仍表示「未选」)。
|
|
57
|
+
* 读写 v-model 时再还原成 ''。
|
|
58
58
|
*/
|
|
59
59
|
export declare const RS_SELECT_EMPTY_VALUE = "__rs_select_empty__";
|
|
60
|
+
/** 本地过滤:大小写不敏感包含。宿主要做 locale 匹配请传 filterOption。 */
|
|
61
|
+
export declare function selectContains(text: string, search: string): boolean;
|
|
60
62
|
/**
|
|
61
63
|
* Vue 对泛型 boolean prop 不会按 Boolean 收口。
|
|
62
64
|
* 模板写 `multiple` 时运行时可能是 '';个别版本还会落到 attrs 变成 'true' / 'multiple'。
|
|
@@ -28,10 +28,15 @@ function splitSelectLabelHighlight(label, keyword) {
|
|
|
28
28
|
return parts;
|
|
29
29
|
}
|
|
30
30
|
/**
|
|
31
|
-
*
|
|
32
|
-
*
|
|
31
|
+
* 选项 value 为空串时,对内映射为此哨兵(空串对外仍表示「未选」)。
|
|
32
|
+
* 读写 v-model 时再还原成 ''。
|
|
33
33
|
*/
|
|
34
34
|
var RS_SELECT_EMPTY_VALUE = "__rs_select_empty__";
|
|
35
|
+
/** 本地过滤:大小写不敏感包含。宿主要做 locale 匹配请传 filterOption。 */
|
|
36
|
+
function selectContains(text, search) {
|
|
37
|
+
if (!search) return true;
|
|
38
|
+
return text.toLowerCase().includes(search.toLowerCase());
|
|
39
|
+
}
|
|
35
40
|
/**
|
|
36
41
|
* Vue 对泛型 boolean prop 不会按 Boolean 收口。
|
|
37
42
|
* 模板写 `multiple` 时运行时可能是 '';个别版本还会落到 attrs 变成 'true' / 'multiple'。
|
|
@@ -244,4 +249,4 @@ function splitByTokenSeparators(raw, separators) {
|
|
|
244
249
|
return raw.split(found);
|
|
245
250
|
}
|
|
246
251
|
//#endregion
|
|
247
|
-
export { RS_SELECT_EMPTY_VALUE, buildOptionDisabledMap, buildOptionLabelMap, comboboxBindingToTokens, filterSelectOptions, findSelectOption, flattenSelectOptions, flattenSelectValues, fromComboboxValue, isSelectLabeledValue, isSelectMultiple, isSelectOptionGroup, normalizeSelectOptions, optionDisplayLabel, packSelectModel, restoreSelectValue, restoreSelectValues, selectModelEntries, sortSelectOptions, splitByTokenSeparators, splitSelectLabelHighlight, toComboboxValue, toLabeledValue, toSelectedTokens, unwrapSelectEntry };
|
|
252
|
+
export { RS_SELECT_EMPTY_VALUE, buildOptionDisabledMap, buildOptionLabelMap, comboboxBindingToTokens, filterSelectOptions, findSelectOption, flattenSelectOptions, flattenSelectValues, fromComboboxValue, isSelectLabeledValue, isSelectMultiple, isSelectOptionGroup, normalizeSelectOptions, optionDisplayLabel, packSelectModel, restoreSelectValue, restoreSelectValues, selectContains, selectModelEntries, sortSelectOptions, splitByTokenSeparators, splitSelectLabelHighlight, toComboboxValue, toLabeledValue, toSelectedTokens, unwrapSelectEntry };
|
|
@@ -66,6 +66,7 @@ export declare function useRsSelect<T extends RsSelectModelValue = RsSelectModel
|
|
|
66
66
|
omittedTagTitle: import("vue").ComputedRef<string>;
|
|
67
67
|
singleDisplayLabel: import("vue").ComputedRef<string>;
|
|
68
68
|
comboboxModel: import("vue").WritableComputedRef<string | string[] | undefined, string | string[] | undefined>;
|
|
69
|
+
pickToken: (token: string) => void;
|
|
69
70
|
tokenLabel: (token: string) => string;
|
|
70
71
|
truncateTagLabel: (label: string) => string;
|
|
71
72
|
optionFromToken: (token: string) => RsSelectOption | undefined;
|
|
@@ -1,13 +1,11 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import { computed, nextTick, onUnmounted, watch } from "vue";
|
|
1
|
+
import { buildOptionDisabledMap, buildOptionLabelMap, comboboxBindingToTokens, filterSelectOptions, findSelectOption, flattenSelectOptions, flattenSelectValues, fromComboboxValue, isSelectLabeledValue, isSelectMultiple, normalizeSelectOptions, optionDisplayLabel, packSelectModel, restoreSelectValue, restoreSelectValues, selectContains, selectModelEntries, sortSelectOptions, splitByTokenSeparators, toComboboxValue, toSelectedTokens } from "./select-utils.js";
|
|
2
|
+
import { computed, onUnmounted, watch } from "vue";
|
|
4
3
|
//#region src/components/select/src/use-rs-select.ts
|
|
5
4
|
/**
|
|
6
5
|
* Select 过滤、选中、多选 tag、creatable / 分隔符提交。
|
|
7
6
|
* 组件模板只消费返回值;表单校验仍留在 SFC。
|
|
8
7
|
*/
|
|
9
8
|
function useRsSelect(props, model, open, searchQuery, emit, t) {
|
|
10
|
-
const { contains } = useFilter({ sensitivity: "base" });
|
|
11
9
|
const isMultiple = computed(() => isSelectMultiple(props.multiple));
|
|
12
10
|
const normalizedOptions = computed(() => normalizeSelectOptions(props.options, props.fieldNames));
|
|
13
11
|
const resolvedPlaceholder = computed(() => props.placeholder ?? t("select.placeholder"));
|
|
@@ -20,16 +18,12 @@ function useRsSelect(props, model, open, searchQuery, emit, t) {
|
|
|
20
18
|
const flatOptions = computed(() => flattenSelectOptions(normalizedOptions.value));
|
|
21
19
|
const flatCount = computed(() => flatOptions.value.length);
|
|
22
20
|
const useVirtual = computed(() => Boolean(props.virtual) || flatCount.value > (props.virtualThreshold ?? 50));
|
|
23
|
-
/**
|
|
24
|
-
* 可搜索时一律走本地过滤,并关掉 Reka 内置 filter。
|
|
25
|
-
* Reka 的 filterSearch 与搜索框 searchQuery 不同步(打开时会被清空),
|
|
26
|
-
* 默认依赖内置过滤时会出现:手输「NVA」已出「使用 NVA」,但 NVARCHAR 仍被整表挡住。
|
|
27
|
-
*/
|
|
21
|
+
/** 可搜索 / 远程 / 自定义过滤一律走本函数,不再依赖外部 headless filter。 */
|
|
28
22
|
const useManualFilter = computed(() => Boolean(props.remote) || useVirtual.value || isSearchable.value || typeof props.filterOption === "function" || props.filterOption === false || Boolean(props.optionFilterProp && props.optionFilterProp !== "label") || Boolean(props.filterSort) || Boolean(props.fieldNames));
|
|
29
23
|
const displayOptions = computed(() => {
|
|
30
24
|
let next = normalizedOptions.value;
|
|
31
25
|
if (!props.remote && props.filterOption !== false) {
|
|
32
|
-
if (useManualFilter.value || props.filterOption) next = filterSelectOptions(normalizedOptions.value, searchQuery.value,
|
|
26
|
+
if (useManualFilter.value || props.filterOption) next = filterSelectOptions(normalizedOptions.value, searchQuery.value, selectContains, props.filterOption, props.optionFilterProp);
|
|
33
27
|
}
|
|
34
28
|
return sortSelectOptions(next, props.filterSort);
|
|
35
29
|
});
|
|
@@ -183,18 +177,29 @@ function useRsSelect(props, model, open, searchQuery, emit, t) {
|
|
|
183
177
|
onUnmounted(() => {
|
|
184
178
|
if (searchTimer) clearTimeout(searchTimer);
|
|
185
179
|
});
|
|
186
|
-
watch(open,
|
|
180
|
+
watch(open, (isOpen) => {
|
|
187
181
|
if (isOpen) {
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
await nextTick();
|
|
191
|
-
if (pending) searchQuery.value = pending;
|
|
192
|
-
else if (props.fillSearchWithValue && !isMultiple.value && hasValue.value) searchQuery.value = singleDisplayLabel.value;
|
|
193
|
-
else searchQuery.value = "";
|
|
182
|
+
if (searchQuery.value) return;
|
|
183
|
+
if (props.fillSearchWithValue && !isMultiple.value && hasValue.value) searchQuery.value = singleDisplayLabel.value;
|
|
194
184
|
return;
|
|
195
185
|
}
|
|
196
186
|
if (props.autoClearSearchValue) searchQuery.value = "";
|
|
197
187
|
});
|
|
188
|
+
function pickToken(token) {
|
|
189
|
+
if (isTokenDisabled(token)) return;
|
|
190
|
+
if (canCreate.value && token === createValue.value) {
|
|
191
|
+
commitCreatedValue(token);
|
|
192
|
+
return;
|
|
193
|
+
}
|
|
194
|
+
if (isMultiple.value) {
|
|
195
|
+
const prev = selectedValues.value;
|
|
196
|
+
const next = prev.includes(token) ? prev.filter((item) => item !== token) : [...prev, token];
|
|
197
|
+
comboboxModel.value = next;
|
|
198
|
+
return;
|
|
199
|
+
}
|
|
200
|
+
comboboxModel.value = token;
|
|
201
|
+
open.value = false;
|
|
202
|
+
}
|
|
198
203
|
function onSearchKeydown(event) {
|
|
199
204
|
if (event.key !== "Enter" || event.isComposing) return;
|
|
200
205
|
if (!canCreate.value) return;
|
|
@@ -258,6 +263,7 @@ function useRsSelect(props, model, open, searchQuery, emit, t) {
|
|
|
258
263
|
omittedTagTitle,
|
|
259
264
|
singleDisplayLabel,
|
|
260
265
|
comboboxModel,
|
|
266
|
+
pickToken,
|
|
261
267
|
tokenLabel,
|
|
262
268
|
truncateTagLabel,
|
|
263
269
|
optionFromToken,
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
|
|
2
2
|
/**
|
|
3
|
-
* 轨道高度 = control-height * 2/3
|
|
3
|
+
* 轨道高度 = control-height * 2/3(与 Input SM 24 / Switch SM 16 同比例)。
|
|
4
4
|
* 宽高、内边距、滑块均由 token / calc 推导,不写死档位 px。
|
|
5
5
|
* 外层 min-height = control-height,保证与同排输入垂直居中对齐。
|
|
6
6
|
*/
|
|
7
|
-
.rs-switch {
|
|
7
|
+
.rs-switch[data-v-ba0ee1d6] {
|
|
8
8
|
--rs-switch-pad: calc(var(--rs-switch-track-h) * 0.12);
|
|
9
9
|
--rs-switch-track-w: calc(var(--rs-switch-track-h) * 1.75);
|
|
10
10
|
--rs-switch-thumb: calc(var(--rs-switch-track-h) - var(--rs-switch-pad) * 2 - 2px);
|
|
11
|
+
position: relative;
|
|
11
12
|
display: inline-flex;
|
|
12
13
|
align-items: center;
|
|
13
14
|
gap: var(--rs-space-xs);
|
|
@@ -17,11 +18,22 @@
|
|
|
17
18
|
user-select: none;
|
|
18
19
|
color: var(--rs-text);
|
|
19
20
|
}
|
|
20
|
-
.rs-switch--disabled {
|
|
21
|
+
.rs-switch--disabled[data-v-ba0ee1d6] {
|
|
21
22
|
cursor: not-allowed;
|
|
22
23
|
opacity: 0.55;
|
|
23
24
|
}
|
|
24
|
-
.rs-
|
|
25
|
+
.rs-switch__input[data-v-ba0ee1d6] {
|
|
26
|
+
position: absolute;
|
|
27
|
+
width: 1px;
|
|
28
|
+
height: 1px;
|
|
29
|
+
margin: -1px;
|
|
30
|
+
padding: 0;
|
|
31
|
+
overflow: hidden;
|
|
32
|
+
clip: rect(0, 0, 0, 0);
|
|
33
|
+
white-space: nowrap;
|
|
34
|
+
border: 0;
|
|
35
|
+
}
|
|
36
|
+
.rs-switch__root[data-v-ba0ee1d6] {
|
|
25
37
|
position: relative;
|
|
26
38
|
display: inline-flex;
|
|
27
39
|
flex-shrink: 0;
|
|
@@ -39,36 +51,36 @@
|
|
|
39
51
|
background-color var(--rs-transition-fast),
|
|
40
52
|
border-color var(--rs-transition-fast);
|
|
41
53
|
}
|
|
42
|
-
.rs-switch--disabled .rs-switch__root {
|
|
54
|
+
.rs-switch--disabled .rs-switch__root[data-v-ba0ee1d6] {
|
|
43
55
|
cursor: not-allowed;
|
|
44
56
|
}
|
|
45
|
-
.rs-switch:hover:not(.rs-switch--disabled):not(.rs-switch--checked) .rs-switch__root {
|
|
57
|
+
.rs-switch:hover:not(.rs-switch--disabled):not(.rs-switch--checked) .rs-switch__root[data-v-ba0ee1d6] {
|
|
46
58
|
border-color: var(--rs-primary);
|
|
47
59
|
}
|
|
48
|
-
.rs-
|
|
60
|
+
.rs-switch__input:focus-visible + .rs-switch__root[data-v-ba0ee1d6] {
|
|
49
61
|
box-shadow: 0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
|
|
50
62
|
}
|
|
51
|
-
.rs-switch--checked .rs-switch__root {
|
|
63
|
+
.rs-switch--checked .rs-switch__root[data-v-ba0ee1d6] {
|
|
52
64
|
background: var(--rs-primary);
|
|
53
65
|
border-color: var(--rs-primary);
|
|
54
66
|
}
|
|
55
|
-
.rs-switch--ssm {
|
|
67
|
+
.rs-switch--ssm[data-v-ba0ee1d6] {
|
|
56
68
|
--rs-switch-track-h: calc(var(--rs-control-height-ssm) * 2 / 3);
|
|
57
69
|
min-height: var(--rs-control-height-ssm);
|
|
58
70
|
}
|
|
59
|
-
.rs-switch--sm {
|
|
71
|
+
.rs-switch--sm[data-v-ba0ee1d6] {
|
|
60
72
|
--rs-switch-track-h: calc(var(--rs-control-height-sm) * 2 / 3);
|
|
61
73
|
min-height: var(--rs-control-height-sm);
|
|
62
74
|
}
|
|
63
|
-
.rs-switch--md {
|
|
75
|
+
.rs-switch--md[data-v-ba0ee1d6] {
|
|
64
76
|
--rs-switch-track-h: calc(var(--rs-control-height-md) * 2 / 3);
|
|
65
77
|
min-height: var(--rs-control-height-md);
|
|
66
78
|
}
|
|
67
|
-
.rs-switch--lg {
|
|
79
|
+
.rs-switch--lg[data-v-ba0ee1d6] {
|
|
68
80
|
--rs-switch-track-h: calc(var(--rs-control-height-lg) * 2 / 3);
|
|
69
81
|
min-height: var(--rs-control-height-lg);
|
|
70
82
|
}
|
|
71
|
-
.rs-switch__thumb {
|
|
83
|
+
.rs-switch__thumb[data-v-ba0ee1d6] {
|
|
72
84
|
position: absolute;
|
|
73
85
|
top: 50%;
|
|
74
86
|
inset-inline-start: var(--rs-switch-pad);
|
|
@@ -81,19 +93,25 @@
|
|
|
81
93
|
transform: translateY(-50%);
|
|
82
94
|
transition: inset-inline var(--rs-transition-fast);
|
|
83
95
|
}
|
|
84
|
-
.rs-switch--checked .rs-switch__thumb {
|
|
96
|
+
.rs-switch--checked .rs-switch__thumb[data-v-ba0ee1d6] {
|
|
85
97
|
inset-inline-start: auto;
|
|
86
98
|
inset-inline-end: var(--rs-switch-pad);
|
|
87
99
|
}
|
|
88
|
-
.rs-switch__label {
|
|
100
|
+
.rs-switch__label[data-v-ba0ee1d6] {
|
|
89
101
|
font-size: var(--rs-font-size-sm);
|
|
90
102
|
line-height: var(--rs-line-height-normal);
|
|
91
103
|
cursor: pointer;
|
|
92
104
|
}
|
|
93
|
-
.rs-switch--disabled .rs-switch__label {
|
|
105
|
+
.rs-switch--disabled .rs-switch__label[data-v-ba0ee1d6] {
|
|
94
106
|
cursor: not-allowed;
|
|
95
107
|
}
|
|
96
|
-
.rs-switch--ssm .rs-switch__label,
|
|
97
|
-
.rs-switch--sm .rs-switch__label {
|
|
108
|
+
.rs-switch--ssm .rs-switch__label[data-v-ba0ee1d6],
|
|
109
|
+
.rs-switch--sm .rs-switch__label[data-v-ba0ee1d6] {
|
|
98
110
|
font-size: var(--rs-font-size-xs);
|
|
99
111
|
}
|
|
112
|
+
@media (prefers-reduced-motion: reduce) {
|
|
113
|
+
.rs-switch__root[data-v-ba0ee1d6],
|
|
114
|
+
.rs-switch__thumb[data-v-ba0ee1d6] {
|
|
115
|
+
transition: none;
|
|
116
|
+
}
|
|
117
|
+
}
|
|
@@ -1,12 +1,25 @@
|
|
|
1
1
|
import type { RsComponentSize } from '../../../theme/types';
|
|
2
|
-
|
|
3
|
-
export type RsSwitchValue
|
|
2
|
+
import { type RsSwitchValue } from './switch-utils';
|
|
3
|
+
export type { RsSwitchValue };
|
|
4
|
+
/**
|
|
5
|
+
* RsSwitch 模板 ref 请用此类型。
|
|
6
|
+
* 不要写 `InstanceType<typeof RsSwitch>`:组件实例类型过深,vue-tsc 会报 Excessive stack depth。
|
|
7
|
+
*/
|
|
8
|
+
export interface RsSwitchExpose {
|
|
9
|
+
focus: () => void;
|
|
10
|
+
}
|
|
11
|
+
/** 模板 ref 实例:expose + 根节点 */
|
|
12
|
+
export type RsSwitchInstance = RsSwitchExpose & {
|
|
13
|
+
$el: HTMLElement;
|
|
14
|
+
};
|
|
4
15
|
type __VLS_Props = {
|
|
5
16
|
disabled?: boolean;
|
|
6
17
|
size?: RsComponentSize;
|
|
7
18
|
/** 无障碍名称;有默认插槽文案时可省略 */
|
|
8
19
|
ariaLabel?: string;
|
|
9
20
|
id?: string;
|
|
21
|
+
/** 原生 name,供表单提交 */
|
|
22
|
+
name?: string;
|
|
10
23
|
/** 打开时写入 v-model 的值,默认 true */
|
|
11
24
|
checkedValue?: RsSwitchValue;
|
|
12
25
|
/** 关闭时写入 v-model 的值,默认 false */
|
|
@@ -16,11 +29,11 @@ type __VLS_ModelProps = {
|
|
|
16
29
|
modelValue?: RsSwitchValue;
|
|
17
30
|
};
|
|
18
31
|
type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
|
|
19
|
-
declare var
|
|
32
|
+
declare var __VLS_1: {};
|
|
20
33
|
type __VLS_Slots = {} & {
|
|
21
|
-
default?: (props: typeof
|
|
34
|
+
default?: (props: typeof __VLS_1) => any;
|
|
22
35
|
};
|
|
23
|
-
declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps,
|
|
36
|
+
declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, RsSwitchExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
24
37
|
change: (value: RsSwitchValue) => any;
|
|
25
38
|
"update:modelValue": (value: RsSwitchValue) => any;
|
|
26
39
|
}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
|
|
@@ -1,9 +1,22 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { useRsFormContext } from "../../form/src/form-utils.js";
|
|
2
2
|
import { useResolvedRsComponentSize } from "../../_shared/src/resolve-size.js";
|
|
3
|
-
import {
|
|
3
|
+
import { resolveRsSwitchChecked, resolveRsSwitchNext } from "./switch-utils.js";
|
|
4
|
+
import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, normalizeClass, openBlock, renderSlot, useId, useModel, useTemplateRef, withModifiers } from "vue";
|
|
4
5
|
//#region src/components/switch/src/RsSwitch.vue?vue&type=script&setup=true&lang.ts
|
|
5
|
-
var _hoisted_1 = [
|
|
6
|
+
var _hoisted_1 = [
|
|
7
|
+
"id",
|
|
8
|
+
"name",
|
|
9
|
+
"checked",
|
|
10
|
+
"disabled",
|
|
11
|
+
"aria-checked",
|
|
12
|
+
"aria-label"
|
|
13
|
+
];
|
|
14
|
+
var _hoisted_2 = {
|
|
15
|
+
key: 0,
|
|
16
|
+
class: "rs-switch__label"
|
|
17
|
+
};
|
|
6
18
|
var RsSwitch_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
|
|
19
|
+
name: "RsSwitch",
|
|
7
20
|
__name: "RsSwitch",
|
|
8
21
|
props: /*@__PURE__*/ mergeModels({
|
|
9
22
|
disabled: {
|
|
@@ -13,6 +26,7 @@ var RsSwitch_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineC
|
|
|
13
26
|
size: {},
|
|
14
27
|
ariaLabel: {},
|
|
15
28
|
id: {},
|
|
29
|
+
name: {},
|
|
16
30
|
checkedValue: {
|
|
17
31
|
type: [
|
|
18
32
|
Boolean,
|
|
@@ -41,50 +55,68 @@ var RsSwitch_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineC
|
|
|
41
55
|
"modelModifiers": {}
|
|
42
56
|
}),
|
|
43
57
|
emits: /*@__PURE__*/ mergeModels(["change"], ["update:modelValue"]),
|
|
44
|
-
setup(__props, { emit: __emit }) {
|
|
58
|
+
setup(__props, { expose: __expose, emit: __emit }) {
|
|
45
59
|
const model = useModel(__props, "modelValue");
|
|
46
60
|
const props = __props;
|
|
47
61
|
const emit = __emit;
|
|
62
|
+
const formContext = useRsFormContext();
|
|
48
63
|
const autoId = useId();
|
|
49
64
|
const inputId = computed(() => props.id || autoId);
|
|
65
|
+
const inputRef = useTemplateRef("inputRef");
|
|
50
66
|
const resolvedSize = useResolvedRsComponentSize(() => props.size);
|
|
51
|
-
|
|
52
|
-
const isChecked = computed(() =>
|
|
67
|
+
const resolvedDisabled = computed(() => props.disabled || Boolean(formContext?.disabled.value));
|
|
68
|
+
const isChecked = computed(() => resolveRsSwitchChecked(model.value, props.checkedValue));
|
|
53
69
|
const rootClass = computed(() => [
|
|
54
70
|
"rs-switch",
|
|
55
71
|
`rs-switch--${resolvedSize.value}`,
|
|
56
72
|
{
|
|
57
73
|
"rs-switch--checked": isChecked.value,
|
|
58
|
-
"rs-switch--disabled":
|
|
74
|
+
"rs-switch--disabled": resolvedDisabled.value
|
|
59
75
|
}
|
|
60
76
|
]);
|
|
61
|
-
function
|
|
62
|
-
const next = checked
|
|
77
|
+
function writeChecked(checked) {
|
|
78
|
+
const next = resolveRsSwitchNext(checked, props.checkedValue, props.uncheckedValue);
|
|
63
79
|
if (Object.is(model.value, next)) return;
|
|
64
80
|
model.value = next;
|
|
65
81
|
emit("change", next);
|
|
66
82
|
}
|
|
83
|
+
function onNativeChange(event) {
|
|
84
|
+
if (resolvedDisabled.value) return;
|
|
85
|
+
writeChecked(event.target.checked);
|
|
86
|
+
}
|
|
87
|
+
function onTrackClick(event) {
|
|
88
|
+
event.preventDefault();
|
|
89
|
+
event.stopPropagation();
|
|
90
|
+
if (resolvedDisabled.value) return;
|
|
91
|
+
writeChecked(!isChecked.value);
|
|
92
|
+
}
|
|
93
|
+
__expose({ focus: () => {
|
|
94
|
+
inputRef.value?.focus();
|
|
95
|
+
} });
|
|
67
96
|
return (_ctx, _cache) => {
|
|
68
|
-
return openBlock(), createElementBlock("
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
97
|
+
return openBlock(), createElementBlock("label", { class: normalizeClass(rootClass.value) }, [
|
|
98
|
+
createElementVNode("input", {
|
|
99
|
+
id: inputId.value,
|
|
100
|
+
ref_key: "inputRef",
|
|
101
|
+
ref: inputRef,
|
|
102
|
+
class: "rs-switch__input",
|
|
103
|
+
type: "checkbox",
|
|
104
|
+
role: "switch",
|
|
105
|
+
name: __props.name,
|
|
106
|
+
checked: isChecked.value,
|
|
107
|
+
disabled: resolvedDisabled.value,
|
|
108
|
+
"aria-checked": isChecked.value ? "true" : "false",
|
|
109
|
+
"aria-label": __props.ariaLabel,
|
|
110
|
+
onChange: onNativeChange,
|
|
111
|
+
onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
|
|
112
|
+
}, null, 40, _hoisted_1),
|
|
113
|
+
createElementVNode("span", {
|
|
114
|
+
class: "rs-switch__root",
|
|
115
|
+
"aria-hidden": "true",
|
|
116
|
+
onClick: onTrackClick
|
|
117
|
+
}, [..._cache[1] || (_cache[1] = [createElementVNode("span", { class: "rs-switch__thumb" }, null, -1)])]),
|
|
118
|
+
_ctx.$slots.default ? (openBlock(), createElementBlock("span", _hoisted_2, [renderSlot(_ctx.$slots, "default", {}, void 0, true)])) : createCommentVNode("", true)
|
|
119
|
+
], 2);
|
|
88
120
|
};
|
|
89
121
|
}
|
|
90
122
|
});
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import './RsSwitch.css'
|
|
2
|
+
import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
|
|
2
3
|
import RsSwitch_vue_vue_type_script_setup_true_lang_default from "./RsSwitch.impl.js";
|
|
3
4
|
|
|
4
5
|
//#region src/components/switch/src/RsSwitch.vue
|
|
5
|
-
var RsSwitch_default = RsSwitch_vue_vue_type_script_setup_true_lang_default;
|
|
6
|
+
var RsSwitch_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsSwitch_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-ba0ee1d6"]]);
|
|
6
7
|
//#endregion
|
|
7
8
|
export { RsSwitch_default as default };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
/** Switch v-model 取值:默认 boolean,也可为业务码如 'Y'/'N'、1/0 */
|
|
2
|
+
export type RsSwitchValue = boolean | string | number;
|
|
3
|
+
export declare function resolveRsSwitchChecked(value: RsSwitchValue, checkedValue: RsSwitchValue): boolean;
|
|
4
|
+
export declare function resolveRsSwitchNext(checked: boolean, checkedValue: RsSwitchValue, uncheckedValue: RsSwitchValue): RsSwitchValue;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
//#region src/components/switch/src/switch-utils.ts
|
|
2
|
+
function resolveRsSwitchChecked(value, checkedValue) {
|
|
3
|
+
return Object.is(value, checkedValue);
|
|
4
|
+
}
|
|
5
|
+
function resolveRsSwitchNext(checked, checkedValue, uncheckedValue) {
|
|
6
|
+
return checked ? checkedValue : uncheckedValue;
|
|
7
|
+
}
|
|
8
|
+
//#endregion
|
|
9
|
+
export { resolveRsSwitchChecked, resolveRsSwitchNext };
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
|
|
2
|
-
.rs-textarea[data-v-
|
|
2
|
+
.rs-textarea[data-v-4aaa8fd4] {
|
|
3
3
|
width: 100%;
|
|
4
4
|
}
|
|
5
|
-
.rs-textarea__shell[data-v-
|
|
5
|
+
.rs-textarea__shell[data-v-4aaa8fd4] {
|
|
6
6
|
position: relative;
|
|
7
7
|
box-sizing: border-box;
|
|
8
8
|
width: 100%;
|
|
@@ -14,32 +14,32 @@
|
|
|
14
14
|
border-color var(--rs-transition-fast),
|
|
15
15
|
box-shadow var(--rs-transition-fast);
|
|
16
16
|
}
|
|
17
|
-
.rs-textarea__shell[data-v-
|
|
17
|
+
.rs-textarea__shell[data-v-4aaa8fd4]:hover:not(.is-disabled):not(.is-readonly):not(:focus-within) {
|
|
18
18
|
border-color: var(--rs-input-border-hover, var(--rs-border));
|
|
19
19
|
}
|
|
20
|
-
.rs-textarea__shell[data-v-
|
|
20
|
+
.rs-textarea__shell[data-v-4aaa8fd4]:focus-within {
|
|
21
21
|
border-color: var(--rs-focus-border, var(--rs-primary));
|
|
22
22
|
box-shadow:
|
|
23
23
|
var(--rs-input-shadow, none),
|
|
24
24
|
0 0 0 var(--rs-focus-ring-width, 2px) var(--rs-focus-ring);
|
|
25
25
|
}
|
|
26
|
-
.rs-textarea__shell.is-invalid[data-v-
|
|
26
|
+
.rs-textarea__shell.is-invalid[data-v-4aaa8fd4] {
|
|
27
27
|
border-color: var(--rs-danger);
|
|
28
28
|
}
|
|
29
|
-
.rs-textarea__shell.is-invalid[data-v-
|
|
29
|
+
.rs-textarea__shell.is-invalid[data-v-4aaa8fd4]:focus-within {
|
|
30
30
|
box-shadow:
|
|
31
31
|
var(--rs-input-shadow, none),
|
|
32
32
|
0 0 0 var(--rs-focus-ring-width, 2px) color-mix(in srgb, var(--rs-danger) 14%, transparent);
|
|
33
33
|
}
|
|
34
|
-
.rs-textarea__shell.is-disabled[data-v-
|
|
34
|
+
.rs-textarea__shell.is-disabled[data-v-4aaa8fd4] {
|
|
35
35
|
opacity: 0.38;
|
|
36
36
|
cursor: not-allowed;
|
|
37
37
|
background: var(--rs-surface-hover);
|
|
38
38
|
}
|
|
39
|
-
.rs-textarea__shell.is-readonly[data-v-
|
|
39
|
+
.rs-textarea__shell.is-readonly[data-v-4aaa8fd4] {
|
|
40
40
|
background: var(--rs-surface-hover);
|
|
41
41
|
}
|
|
42
|
-
.rs-textarea__control[data-v-
|
|
42
|
+
.rs-textarea__control[data-v-4aaa8fd4] {
|
|
43
43
|
display: block;
|
|
44
44
|
box-sizing: border-box;
|
|
45
45
|
width: 100%;
|
|
@@ -53,37 +53,37 @@
|
|
|
53
53
|
font-size: var(--rs-font-size-sm);
|
|
54
54
|
line-height: 1.5;
|
|
55
55
|
}
|
|
56
|
-
.rs-textarea__shell.is-autosize .rs-textarea__control[data-v-
|
|
56
|
+
.rs-textarea__shell.is-autosize .rs-textarea__control[data-v-4aaa8fd4] {
|
|
57
57
|
min-height: 0;
|
|
58
58
|
}
|
|
59
|
-
.rs-textarea__shell.has-count .rs-textarea__control[data-v-
|
|
59
|
+
.rs-textarea__shell.has-count .rs-textarea__control[data-v-4aaa8fd4] {
|
|
60
60
|
padding-bottom: 1.55rem;
|
|
61
61
|
}
|
|
62
|
-
.rs-textarea__shell.has-clear .rs-textarea__control[data-v-
|
|
62
|
+
.rs-textarea__shell.has-clear .rs-textarea__control[data-v-4aaa8fd4] {
|
|
63
63
|
padding-inline-end: 1.85rem;
|
|
64
64
|
}
|
|
65
|
-
.rs-input-field--sm .rs-textarea__control[data-v-
|
|
65
|
+
.rs-input-field--sm .rs-textarea__control[data-v-4aaa8fd4] {
|
|
66
66
|
min-height: 3.5rem;
|
|
67
67
|
padding: 0.4rem 0.6rem;
|
|
68
68
|
font-size: var(--rs-font-size-xs);
|
|
69
69
|
}
|
|
70
|
-
.rs-input-field--sm .rs-textarea__shell.has-count .rs-textarea__control[data-v-
|
|
70
|
+
.rs-input-field--sm .rs-textarea__shell.has-count .rs-textarea__control[data-v-4aaa8fd4] {
|
|
71
71
|
padding-bottom: 1.4rem;
|
|
72
72
|
}
|
|
73
|
-
.rs-input-field--lg .rs-textarea__control[data-v-
|
|
73
|
+
.rs-input-field--lg .rs-textarea__control[data-v-4aaa8fd4] {
|
|
74
74
|
min-height: 5.5rem;
|
|
75
75
|
padding: 0.7rem 0.9rem;
|
|
76
76
|
}
|
|
77
|
-
.rs-textarea__control[data-v-
|
|
77
|
+
.rs-textarea__control[data-v-4aaa8fd4]::placeholder {
|
|
78
78
|
color: var(--rs-placeholder);
|
|
79
79
|
}
|
|
80
|
-
.rs-textarea__control[data-v-
|
|
80
|
+
.rs-textarea__control[data-v-4aaa8fd4]:disabled {
|
|
81
81
|
cursor: not-allowed;
|
|
82
82
|
}
|
|
83
|
-
.rs-textarea__control[data-v-
|
|
83
|
+
.rs-textarea__control[data-v-4aaa8fd4]:read-only {
|
|
84
84
|
cursor: default;
|
|
85
85
|
}
|
|
86
|
-
.rs-textarea__clear[data-v-
|
|
86
|
+
.rs-textarea__clear[data-v-4aaa8fd4] {
|
|
87
87
|
position: absolute;
|
|
88
88
|
top: 0.45rem;
|
|
89
89
|
inset-inline-end: 0.45rem;
|
|
@@ -102,11 +102,11 @@
|
|
|
102
102
|
color var(--rs-transition-fast),
|
|
103
103
|
background var(--rs-transition-fast);
|
|
104
104
|
}
|
|
105
|
-
.rs-textarea__clear[data-v-
|
|
105
|
+
.rs-textarea__clear[data-v-4aaa8fd4]:hover {
|
|
106
106
|
color: var(--rs-text);
|
|
107
107
|
background: var(--rs-item-hover);
|
|
108
108
|
}
|
|
109
|
-
.rs-textarea__count[data-v-
|
|
109
|
+
.rs-textarea__count[data-v-4aaa8fd4] {
|
|
110
110
|
position: absolute;
|
|
111
111
|
inset-inline-end: 0.65rem;
|
|
112
112
|
bottom: 0.3rem;
|
|
@@ -117,10 +117,10 @@
|
|
|
117
117
|
line-height: 1;
|
|
118
118
|
color: var(--rs-muted);
|
|
119
119
|
}
|
|
120
|
-
.rs-textarea__count.is-limit[data-v-
|
|
120
|
+
.rs-textarea__count.is-limit[data-v-4aaa8fd4] {
|
|
121
121
|
color: var(--rs-danger);
|
|
122
122
|
}
|
|
123
|
-
.rs-field--label-left .rs-textarea[data-v-
|
|
123
|
+
.rs-field--label-left .rs-textarea[data-v-4aaa8fd4] {
|
|
124
124
|
grid-column: 2;
|
|
125
125
|
min-width: 0;
|
|
126
126
|
}
|
|
@@ -1,17 +1,8 @@
|
|
|
1
1
|
import type { RsComponentSize, RsRadius } from '../../../theme/types';
|
|
2
|
+
import type { RsInputRule, RsInputValidateTrigger } from '../../input/src/input-rules';
|
|
2
3
|
import { type RsFormLabelPosition } from '../../form/src/form-utils';
|
|
3
4
|
import { type RsFormRuleTrigger } from '../../form/src/form-rules';
|
|
4
|
-
import type
|
|
5
|
-
/** 原生 resize;autosize 开启时强制 none,与 Element Plus 一致。 */
|
|
6
|
-
export type RsTextareaResize = 'none' | 'horizontal' | 'vertical' | 'both';
|
|
7
|
-
/**
|
|
8
|
-
* 自适应高度。true 从 rows 起往下长;对象可锁 minRows / maxRows。
|
|
9
|
-
* 对齐 Ant Design autoSize、Element Plus autosize。
|
|
10
|
-
*/
|
|
11
|
-
export type RsTextareaAutosize = boolean | {
|
|
12
|
-
minRows?: number;
|
|
13
|
-
maxRows?: number;
|
|
14
|
-
};
|
|
5
|
+
import { type RsTextareaAutosize, type RsTextareaResize } from './textarea-utils';
|
|
15
6
|
/**
|
|
16
7
|
* RsTextarea 模板 ref 请用此类型。
|
|
17
8
|
* 不要写 InstanceType<typeof RsTextarea>:组件实例类型过深,vue-tsc 会报 Excessive stack depth。
|
|
@@ -28,6 +19,7 @@ export interface RsTextareaExpose {
|
|
|
28
19
|
export type RsTextareaInstance = RsTextareaExpose & {
|
|
29
20
|
$el: HTMLElement;
|
|
30
21
|
};
|
|
22
|
+
export type { RsTextareaAutosize, RsTextareaResize };
|
|
31
23
|
type __VLS_Props = {
|
|
32
24
|
id?: string;
|
|
33
25
|
placeholder?: string;
|
|
@@ -64,7 +56,9 @@ declare var __VLS_6: {
|
|
|
64
56
|
count: number;
|
|
65
57
|
maxlength: number | undefined;
|
|
66
58
|
}, __VLS_8: {
|
|
59
|
+
name: string | undefined;
|
|
67
60
|
message: string;
|
|
61
|
+
value: string;
|
|
68
62
|
};
|
|
69
63
|
type __VLS_Slots = {} & {
|
|
70
64
|
count?: (props: typeof __VLS_6) => any;
|
|
@@ -92,9 +86,9 @@ declare const __VLS_base: import("vue").DefineComponent<__VLS_PublicProps, RsTex
|
|
|
92
86
|
}) => any) | undefined;
|
|
93
87
|
onPressEnter?: ((event: KeyboardEvent) => any) | undefined;
|
|
94
88
|
}>, {
|
|
89
|
+
required: boolean;
|
|
95
90
|
invalid: boolean;
|
|
96
91
|
resize: RsTextareaResize;
|
|
97
|
-
required: boolean;
|
|
98
92
|
disabled: boolean;
|
|
99
93
|
readonly: boolean;
|
|
100
94
|
validateTrigger: RsInputValidateTrigger;
|