niuma-ui 2.0.3 → 2.0.9

package/dist/components/auto-complete/src/RsAutoComplete.impl.js

@@ -1,13 +1,18 @@
+import { RS_COMPONENT_SIZE_ICON_PX } from "../../../theme/types.js";
 import { useRsI18n } from "../../../composables/useRsI18n.js";
 import RsIcon_default from "../../icon/src/RsIcon.js";
+import { useRsFormContext, useRsFormField } from "../../form/src/form-utils.js";
 import { useResolvedRsComponentSize } from "../../_shared/src/resolve-size.js";
-import { filterSelectOptions, splitSelectLabelHighlight } from "../../select/src/select-utils.js";
 import { placeAnchoredPopup, stepEnabledIndex } from "../../_shared/src/overlay-utils.js";
-import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, toDisplayString, unref, useId, useModel, vModelText, watch, withDirectives, withModifiers } from "vue";
+import { filterRsAutoCompleteOptions, normalizeRsAutoCompleteOptions } from "./auto-complete-utils.js";
+import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onUnmounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useAttrs, useId, useModel, vModelDynamic, watch, withDirectives, withModifiers } from "vue";
 //#region src/components/auto-complete/src/RsAutoComplete.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
+	"id",
+	"name",
 	"placeholder",
 	"disabled",
+	"aria-label",
 	"aria-expanded",
 	"aria-controls",
 	"aria-activedescendant"
@@ -15,25 +20,24 @@ var _hoisted_1 = [
 var _hoisted_2 = ["aria-label"];
 var _hoisted_3 = [
 	"id",
+	"size",
 	"aria-label",
-	"data-placement"
+	"aria-busy",
+	"data-rs-theme",
+	"data-placement",
+	"value"
 ];
 var _hoisted_4 = {
 	key: 0,
-	class: "rs-auto-complete__empty",
-	role: "presentation"
+	disabled: "",
+	value: ""
 };
 var _hoisted_5 = [
 	"id",
-	"aria-selected",
-	"aria-disabled",
-	"onMousedown"
+	"value",
+	"disabled",
+	"title"
 ];
-var _hoisted_6 = { class: "rs-auto-complete__label" };
-var _hoisted_7 = {
-	key: 0,
-	class: "rs-auto-complete__mark"
-};
 var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
 	name: "RsAutoComplete",
 	inheritAttrs: false,
@@ -55,7 +59,15 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 			default: true
 		},
 		debounce: { default: 0 },
-		emptyText: { default: "" }
+		emptyText: { default: "" },
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		loadingText: {},
+		id: {},
+		name: {},
+		ariaLabel: {}
 	}, {
 		"modelValue": { default: "" },
 		"modelModifiers": {},
@@ -68,16 +80,22 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 	emits: /*@__PURE__*/ mergeModels([
 		"search",
 		"select",
-		"clear"
+		"clear",
+		"focus",
+		"blur"
 	], ["update:modelValue", "update:open"]),
-	setup(__props, { emit: __emit }) {
+	setup(__props, { expose: __expose, emit: __emit }) {
 		const model = useModel(__props, "modelValue");
 		const openModel = useModel(__props, "open");
 		const props = __props;
 		const emit = __emit;
 		const { t } = useRsI18n();
+		const attrs = useAttrs();
+		const formContext = useRsFormContext();
 		const resolvedSize = useResolvedRsComponentSize(() => props.size);
 		const listId = useId();
+		const autoId = useId();
+		const inputId = computed(() => props.id || autoId);
 		const inputRef = ref(null);
 		const listRef = ref(null);
 		const highlight = ref(0);
@@ -89,17 +107,43 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 			width: 0,
 			placement: "bottom"
 		});
-		const normalized = computed(() => props.options.map((item) => typeof item === "string" ? {
-			label: item,
-			value: item
-		} : item));
-		const suggestions = computed(() => {
-			if (props.filterOption === false) return normalized.value;
-			return filterSelectOptions(normalized.value, model.value, (text, q) => text.toLowerCase().includes(q.toLowerCase()), props.filterOption);
+		/** 面板挂到 body 后仍跟输入框最近的 data-rs-theme（深色岛 / 混主题页）。 */
+		const panelTheme = ref();
+		function syncPanelTheme() {
+			const el = inputRef.value;
+			if (!el) {
+				panelTheme.value = void 0;
+				return;
+			}
+			const themed = el.closest("[data-rs-theme]");
+			panelTheme.value = themed instanceof HTMLElement ? themed.dataset.rsTheme : void 0;
+		}
+		const resolvedDisabled = computed(() => props.disabled || Boolean(formContext?.disabled.value));
+		const iconPx = computed(() => RS_COMPONENT_SIZE_ICON_PX[resolvedSize.value]);
+		const normalized = computed(() => normalizeRsAutoCompleteOptions(props.options));
+		const suggestions = computed(() => filterRsAutoCompleteOptions(normalized.value, model.value, props.filterOption));
+		const suggestionViews = computed(() => suggestions.value.map((option, index) => ({
+			option,
+			index,
+			optionId: `${listId}-${String(option.value)}`
+		})));
+		const listSize = computed(() => {
+			const count = suggestions.value.length;
+			if (count === 0) return 2;
+			return Math.min(8, Math.max(2, count));
 		});
-		const open = computed(() => Boolean(openModel.value && !props.disabled && !dismissed.value));
+		const open = computed(() => Boolean(openModel.value && !resolvedDisabled.value && !dismissed.value));
 		const activeOption = computed(() => suggestions.value[highlight.value]);
-		const activeOptionId = computed(() => open.value && activeOption.value ? `${listId}-${String(activeOption.value.value)}` : void 0);
+		const selectedValue = computed(() => activeOption.value ? String(activeOption.value.value) : "");
+		const activeOptionId = computed(() => {
+			if (!open.value || !activeOption.value) return void 0;
+			return `${listId}-${String(activeOption.value.value)}`;
+		});
+		const showClear = computed(() => Boolean(props.allowClear && model.value && !resolvedDisabled.value));
+		const listStatusText = computed(() => {
+			if (props.loading && !suggestions.value.length) return props.loadingText || t("select.loading");
+			return props.emptyText || t("select.empty");
+		});
 		watch(model, (query) => {
 			if (searchTimer.value) clearTimeout(searchTimer.value);
 			const wait = props.debounce ?? 0;
@@ -128,15 +172,35 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 			});
 		}
 		let frame = 0;
+		let overlayBound = false;
 		function requestPlace() {
-			if (frame) return;
+			if (typeof window === "undefined" || frame) return;
 			frame = window.requestAnimationFrame(() => {
 				frame = 0;
 				placePopup();
 			});
 		}
+		function onWindowChange() {
+			if (open.value) requestPlace();
+		}
+		function attachOverlay() {
+			if (overlayBound || typeof window === "undefined") return;
+			overlayBound = true;
+			window.addEventListener("resize", onWindowChange);
+			window.addEventListener("scroll", onWindowChange, true);
+		}
+		function detachOverlay() {
+			if (frame && typeof window !== "undefined") {
+				window.cancelAnimationFrame(frame);
+				frame = 0;
+			}
+			if (!overlayBound || typeof window === "undefined") return;
+			overlayBound = false;
+			window.removeEventListener("resize", onWindowChange);
+			window.removeEventListener("scroll", onWindowChange, true);
+		}
 		function showList() {
-			if (props.disabled) return;
+			if (resolvedDisabled.value) return;
 			dismissed.value = false;
 			openModel.value = true;
 			requestPlace();
@@ -152,6 +216,11 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 			hideList();
 			nextTick(() => inputRef.value?.focus());
 		}
+		function onNativeSelect(event) {
+			const value = event.target.value;
+			const option = suggestions.value.find((item) => String(item.value) === value);
+			if (option) onPick(option);
+		}
 		function onClear() {
 			model.value = "";
 			emit("clear");
@@ -202,48 +271,84 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 		function onInput() {
 			showList();
 		}
-		function onFocus() {
+		function onFocus(event) {
+			emit("focus", event);
 			showList();
 		}
-		function onBlur() {
-			window.setTimeout(() => {
+		let blurTimer = 0;
+		function onBlur(event) {
+			emit("blur", event);
+			if (blurTimer) window.clearTimeout(blurTimer);
+			blurTimer = window.setTimeout(() => {
+				blurTimer = 0;
 				if (document.activeElement === inputRef.value) return;
 				hideList();
 			}, 0);
 		}
+		function scrollActiveIntoView() {
+			if (!open.value || !activeOptionId.value) return;
+			document.getElementById(activeOptionId.value)?.scrollIntoView({ block: "nearest" });
+		}
 		watch(suggestions, (list) => {
 			highlight.value = list.findIndex((item) => !item.disabled);
 			if (highlight.value < 0) highlight.value = 0;
-			requestPlace();
+			if (open.value) requestPlace();
+		});
+		watch(highlight, () => {
+			nextTick(scrollActiveIntoView);
 		});
 		watch(open, (isOpen) => {
-			if (isOpen) nextTick(() => requestPlace());
-		}, { immediate: true });
-		function onWindowChange() {
-			if (open.value) requestPlace();
+			if (isOpen) {
+				attachOverlay();
+				nextTick(() => {
+					syncPanelTheme();
+					requestPlace();
+				});
+				return;
+			}
+			detachOverlay();
+		});
+		function setFieldValue(value) {
+			model.value = value == null ? "" : String(value);
 		}
-		onMounted(() => {
-			window.addEventListener("resize", onWindowChange);
-			window.addEventListener("scroll", onWindowChange, true);
+		useRsFormField(() => ({
+			get name() {
+				return props.name;
+			},
+			getValue: () => model.value,
+			setValue: setFieldValue
+		}));
+		function focus() {
+			inputRef.value?.focus();
+		}
+		function blur() {
+			inputRef.value?.blur();
+		}
+		__expose({
+			focus,
+			blur
 		});
 		onUnmounted(() => {
-			if (frame) window.cancelAnimationFrame(frame);
+			detachOverlay();
 			if (searchTimer.value) clearTimeout(searchTimer.value);
-			window.removeEventListener("resize", onWindowChange);
-			window.removeEventListener("scroll", onWindowChange, true);
+			if (blurTimer) window.clearTimeout(blurTimer);
 		});
-		function parts(label) {
-			return splitSelectLabelHighlight(label, model.value);
-		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(["rs-auto-complete", [`rs-auto-complete--${unref(resolvedSize)}`, { "rs-auto-complete--clearable": __props.allowClear && model.value && !__props.disabled }]]) }, [
-				withDirectives(createElementVNode("input", {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["rs-auto-complete", [`rs-auto-complete--${unref(resolvedSize)}`, {
+				"rs-auto-complete--clearable": showClear.value,
+				"rs-auto-complete--disabled": resolvedDisabled.value
+			}]]) }, [
+				withDirectives(createElementVNode("input", mergeProps({
+					id: inputId.value,
 					ref_key: "inputRef",
-					ref: inputRef,
+					ref: inputRef
+				}, unref(attrs), {
 					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
 					class: "rs-auto-complete__input",
-					placeholder: __props.placeholder ?? unref(t)("select.placeholder"),
-					disabled: __props.disabled,
+					name: __props.name,
+					placeholder: __props.placeholder ?? unref(t)("autocomplete.placeholder"),
+					disabled: resolvedDisabled.value,
+					"aria-label": __props.ariaLabel,
 					autocomplete: "off",
 					role: "combobox",
 					"aria-autocomplete": "list",
@@ -255,8 +360,8 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 					onInput,
 					onFocus,
 					onBlur
-				}, null, 40, _hoisted_1), [[vModelText, model.value]]),
-				__props.allowClear && model.value && !__props.disabled ? (openBlock(), createElementBlock("button", {
+				}), null, 16, _hoisted_1), [[vModelDynamic, model.value]]),
+				showClear.value ? (openBlock(), createElementBlock("button", {
 					key: 0,
 					type: "button",
 					class: "rs-auto-complete__clear",
@@ -265,39 +370,42 @@ var RsAutoComplete_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 					onClick: onClear
 				}, [createVNode(RsIcon_default, {
 					name: "x",
-					size: 14
-				})], 40, _hoisted_2)) : createCommentVNode("", true),
-				(openBlock(), createBlock(Teleport, { to: "body" }, [open.value ? (openBlock(), createElementBlock("ul", {
+					size: iconPx.value
+				}, null, 8, ["size"])], 40, _hoisted_2)) : createCommentVNode("", true),
+				(openBlock(), createBlock(Teleport, { to: "body" }, [open.value ? (openBlock(), createElementBlock("select", {
 					key: 0,
 					id: unref(listId),
 					ref_key: "listRef",
 					ref: listRef,
 					class: "rs-auto-complete__list",
-					role: "listbox",
+					size: listSize.value,
+					tabindex: "-1",
 					"aria-label": unref(t)("autocomplete.suggestions"),
+					"aria-busy": __props.loading ? "true" : void 0,
+					"data-rs-theme": panelTheme.value,
 					"data-placement": popup.value.placement,
+					value: selectedValue.value,
 					style: normalizeStyle({
 						position: "fixed",
 						top: `${popup.value.top}px`,
 						left: `${popup.value.left}px`,
 						width: `${popup.value.width}px`
-					})
-				}, [!suggestions.value.length ? (openBlock(), createElementBlock("li", _hoisted_4, toDisplayString(__props.emptyText || unref(t)("select.empty")), 1)) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(suggestions.value, (opt, index) => {
-					return openBlock(), createElementBlock("li", {
-						id: `${unref(listId)}-${String(opt.value)}`,
-						key: String(opt.value),
-						role: "option",
-						class: normalizeClass(["rs-auto-complete__item", {
-							"rs-auto-complete__item--disabled": opt.disabled,
-							"rs-auto-complete__item--active": index === highlight.value
-						}]),
-						"aria-selected": index === highlight.value,
-						"aria-disabled": opt.disabled ? "true" : void 0,
-						onMousedown: withModifiers(($event) => onPick(opt), ["prevent"])
-					}, [createElementVNode("span", _hoisted_6, [(openBlock(true), createElementBlock(Fragment, null, renderList(parts(opt.label), (part, i) => {
-						return openBlock(), createElementBlock(Fragment, { key: i }, [part.highlight ? (openBlock(), createElementBlock("span", _hoisted_7, toDisplayString(part.text), 1)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(part.text), 1)], 64))], 64);
-					}), 128))])], 42, _hoisted_5);
-				}), 128))], 12, _hoisted_3)) : createCommentVNode("", true)]))
+					}),
+					onMousedown: _cache[2] || (_cache[2] = withModifiers(() => {}, ["prevent"])),
+					onChange: onNativeSelect
+				}, [!suggestions.value.length ? (openBlock(), createElementBlock("option", _hoisted_4, [renderSlot(_ctx.$slots, "empty", {}, () => [createTextVNode(toDisplayString(listStatusText.value), 1)], true)])) : createCommentVNode("", true), (openBlock(true), createElementBlock(Fragment, null, renderList(suggestionViews.value, (row) => {
+					return openBlock(), createElementBlock("option", {
+						id: row.optionId,
+						key: String(row.option.value),
+						class: normalizeClass(["rs-auto-complete__item", { "rs-auto-complete__item--active": row.index === highlight.value }]),
+						value: String(row.option.value),
+						disabled: row.option.disabled,
+						title: row.option.title
+					}, [renderSlot(_ctx.$slots, "option", {
+						option: row.option,
+						active: row.index === highlight.value
+					}, () => [createTextVNode(toDisplayString(row.option.label), 1)], true)], 10, _hoisted_5);
+				}), 128))], 44, _hoisted_3)) : createCommentVNode("", true)]))
 			], 2);
 		};
 	}

package/dist/components/auto-complete/src/RsAutoComplete.js

@@ -1,5 +1,8 @@
+import './RsAutoComplete.css'
+import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
 import RsAutoComplete_vue_vue_type_script_setup_true_lang_default from "./RsAutoComplete.impl.js";
+
 //#region src/components/auto-complete/src/RsAutoComplete.vue
-var RsAutoComplete_default = RsAutoComplete_vue_vue_type_script_setup_true_lang_default;
+var RsAutoComplete_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsAutoComplete_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-a95db999"]]);
 //#endregion
 export { RsAutoComplete_default as default };

package/dist/components/auto-complete/src/auto-complete-utils.d.ts

@@ -0,0 +1,7 @@
+import { type RsSelectFilterOption, type RsSelectOption } from '../../select/src/select-utils';
+export type RsAutoCompleteOption = RsSelectOption;
+export type RsAutoCompleteFilterOption = RsSelectFilterOption;
+export type RsAutoCompleteOptionInput = string | RsSelectOption;
+export declare function normalizeRsAutoCompleteOptions(options: ReadonlyArray<RsAutoCompleteOptionInput> | undefined): RsAutoCompleteOption[];
+/** filterOption === false 时不过滤，交给远程 @search。 */
+export declare function filterRsAutoCompleteOptions(options: RsAutoCompleteOption[], query: string, filterOption?: RsAutoCompleteFilterOption | boolean): RsAutoCompleteOption[];

package/dist/components/auto-complete/src/auto-complete-utils.js

@@ -0,0 +1,17 @@
+import { filterSelectOptions } from "../../select/src/select-utils.js";
+//#region src/components/auto-complete/src/auto-complete-utils.ts
+function normalizeRsAutoCompleteOptions(options) {
+	if (!options?.length) return [];
+	return options.map((item) => typeof item === "string" ? {
+		label: item,
+		value: item
+	} : item);
+}
+var containsIgnoreCase = (text, query) => text.toLowerCase().includes(query.toLowerCase());
+/** filterOption === false 时不过滤，交给远程 @search。 */
+function filterRsAutoCompleteOptions(options, query, filterOption) {
+	if (filterOption === false) return options;
+	return filterSelectOptions(options, query, containsIgnoreCase, filterOption);
+}
+//#endregion
+export { filterRsAutoCompleteOptions, normalizeRsAutoCompleteOptions };

package/dist/components/avatar/index.d.ts

@@ -1 +1,2 @@
 export { default as RsAvatar } from './src/RsAvatar.js';
+export type { RsAvatarShape, RsAvatarSize, RsAvatarTone } from './src/avatar-utils';

package/dist/components/avatar/src/RsAvatar.css

@@ -1,35 +1,46 @@
 
-.rs-avatar {
+.rs-avatar[data-v-5eb19cf0] {
+  --rs-avatar-size-sm: 1.75rem;
+  --rs-avatar-size-md: 2.25rem;
+  --rs-avatar-size-lg: 3rem;
+  --rs-avatar-size: var(--rs-avatar-size-md);
+  position: relative;
   display: inline-flex;
   overflow: hidden;
   flex-shrink: 0;
+  width: var(--rs-avatar-size);
+  height: var(--rs-avatar-size);
   border: 1px solid var(--rs-border);
   background: var(--rs-surface);
+  vertical-align: middle;
 }
-.rs-avatar--circle {
+.rs-avatar--circle[data-v-5eb19cf0] {
   border-radius: var(--rs-radius-full);
 }
-.rs-avatar--square {
+.rs-avatar--square[data-v-5eb19cf0] {
   border-radius: var(--rs-radius-sm);
 }
-.rs-avatar--sm {
-  width: 1.75rem;
-  height: 1.75rem;
+.rs-avatar--sm[data-v-5eb19cf0] {
+  --rs-avatar-size: var(--rs-avatar-size-sm);
 }
-.rs-avatar--md {
-  width: 2.25rem;
-  height: 2.25rem;
+.rs-avatar--md[data-v-5eb19cf0] {
+  --rs-avatar-size: var(--rs-avatar-size-md);
 }
-.rs-avatar--lg {
-  width: 3rem;
-  height: 3rem;
+.rs-avatar--lg[data-v-5eb19cf0] {
+  --rs-avatar-size: var(--rs-avatar-size-lg);
 }
-.rs-avatar__image {
+.rs-avatar__image[data-v-5eb19cf0] {
+  position: absolute;
+  inset: 0;
   width: 100%;
   height: 100%;
   object-fit: cover;
+  opacity: 0;
 }
-.rs-avatar__fallback {
+.rs-avatar__image--ready[data-v-5eb19cf0] {
+  opacity: 1;
+}
+.rs-avatar__fallback[data-v-5eb19cf0] {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -38,23 +49,29 @@
   font-size: var(--rs-font-size-xs);
   font-weight: var(--rs-font-weight-semibold);
 }
-.rs-avatar__fallback--default {
+.rs-avatar__fallback--default[data-v-5eb19cf0] {
   background: var(--rs-surface-hover);
   color: var(--rs-muted);
 }
-.rs-avatar__fallback--primary {
+.rs-avatar__fallback--primary[data-v-5eb19cf0] {
   background: var(--rs-primary-container);
   color: var(--rs-on-primary-container);
 }
-.rs-avatar__fallback--success {
+.rs-avatar__fallback--success[data-v-5eb19cf0] {
   background: var(--rs-success-container);
   color: var(--rs-on-success-container);
 }
-.rs-avatar__fallback--warning {
+.rs-avatar__fallback--warning[data-v-5eb19cf0] {
   background: var(--rs-warning-container);
   color: var(--rs-on-warning-container);
 }
-.rs-avatar__fallback--danger {
+.rs-avatar__fallback--danger[data-v-5eb19cf0] {
   background: var(--rs-danger-container);
   color: var(--rs-on-danger-container);
 }
+@media (forced-colors: active) {
+.rs-avatar[data-v-5eb19cf0] {
+    border: 1px solid CanvasText;
+    forced-color-adjust: none;
+}
+}

package/dist/components/avatar/src/RsAvatar.d.ts

@@ -1,4 +1,5 @@
 import { type RsAvatarShape, type RsAvatarSize, type RsAvatarTone } from './avatar-utils';
+export type { RsAvatarShape, RsAvatarSize, RsAvatarTone };
 type __VLS_Props = {
     src?: string;
     alt?: string;
@@ -10,14 +11,19 @@ type __VLS_Props = {
     tone?: RsAvatarTone;
     label?: string;
 };
-declare var __VLS_19: {};
+declare var __VLS_1: {};
 type __VLS_Slots = {} & {
-    fallback?: (props: typeof __VLS_19) => any;
+    fallback?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    name: string;
+    label: string;
     size: RsAvatarSize;
-    tone: RsAvatarTone;
     icon: string;
+    tone: RsAvatarTone;
+    src: string;
+    alt: string;
+    fallback: string;
     shape: RsAvatarShape;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;