niuma-ui 1.2.6 → 1.2.9

package/dist/components/RsCodeEditor.css

@@ -1,5 +1,5 @@
 
-.rs-code-editor[data-v-29cd1019] {
+.rs-code-editor[data-v-edadd50f] {
   display: flex;
   flex-direction: column;
   overflow: hidden;
@@ -8,10 +8,10 @@
   background: var(--rs-input-bg);
   color: var(--rs-text);
 }
-.rs-code-editor--square[data-v-29cd1019] {
+.rs-code-editor--square[data-v-edadd50f] {
   border-radius: 0;
 }
-.rs-code-editor--embedded[data-v-29cd1019] {
+.rs-code-editor--embedded[data-v-edadd50f] {
   border: 0;
   border-radius: 0;
   background: transparent;
@@ -19,7 +19,7 @@
   min-height: 0;
   width: 100%;
 }
-.rs-code-editor__toolbar[data-v-29cd1019] {
+.rs-code-editor__toolbar[data-v-edadd50f] {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -28,23 +28,23 @@
   color: var(--rs-muted);
   font-size: var(--rs-font-size-xs);
 }
-.rs-code-editor__body[data-v-29cd1019] {
+.rs-code-editor__body[data-v-edadd50f] {
   position: relative;
   flex: 1;
   min-height: 0;
   display: flex;
   flex-direction: column;
 }
-.rs-code-editor__surface[data-v-29cd1019] {
+.rs-code-editor__surface[data-v-edadd50f] {
   flex: 1;
   min-height: 0;
   overflow: hidden;
 }
-.rs-code-editor--embedded .rs-code-editor__body[data-v-29cd1019],
-.rs-code-editor--embedded .rs-code-editor__surface[data-v-29cd1019] {
+.rs-code-editor--embedded .rs-code-editor__body[data-v-edadd50f],
+.rs-code-editor--embedded .rs-code-editor__surface[data-v-edadd50f] {
   height: 100%;
 }
-.rs-code-editor__inline-edit[data-v-29cd1019] {
+.rs-code-editor__inline-edit[data-v-edadd50f] {
   position: absolute;
   left: 50%;
   top: 12%;
@@ -57,7 +57,7 @@
   background: var(--rs-surface-elevated);
   box-shadow: 0 8px 28px rgba(0, 0, 0, 0.14);
 }
-.rs-code-editor__inline-edit-head[data-v-29cd1019] {
+.rs-code-editor__inline-edit-head[data-v-edadd50f] {
   display: flex;
   align-items: center;
   justify-content: space-between;
@@ -66,14 +66,14 @@
   font-weight: var(--rs-font-weight-semibold);
   color: var(--rs-foreground);
 }
-.rs-code-editor__inline-edit-head kbd[data-v-29cd1019] {
+.rs-code-editor__inline-edit-head kbd[data-v-edadd50f] {
   padding: 0.1rem 0.35rem;
   border-radius: 4px;
   border: 1px solid var(--rs-border-subtle);
   font-size: var(--rs-font-size-xs);
   color: var(--rs-muted);
 }
-.rs-code-editor__inline-preview[data-v-29cd1019] {
+.rs-code-editor__inline-preview[data-v-edadd50f] {
   margin: 0 0 0.5rem;
   padding: 0.35rem 0.5rem;
   border-radius: 4px;
@@ -86,7 +86,7 @@
   max-height: 4.5rem;
   overflow: hidden;
 }
-.rs-code-editor__inline-input[data-v-29cd1019] {
+.rs-code-editor__inline-input[data-v-edadd50f] {
   width: 100%;
   box-sizing: border-box;
   margin-bottom: 0.5rem;
@@ -97,21 +97,21 @@
   color: var(--rs-foreground);
   font-size: var(--rs-font-size-sm);
 }
-.rs-code-editor__inline-input[data-v-29cd1019]:focus {
+.rs-code-editor__inline-input[data-v-edadd50f]:focus {
   outline: 2px solid color-mix(in srgb, var(--rs-primary) 35%, transparent);
   outline-offset: 1px;
 }
-.rs-code-editor__inline-error[data-v-29cd1019] {
+.rs-code-editor__inline-error[data-v-edadd50f] {
   margin: -0.25rem 0 0.5rem;
   font-size: var(--rs-font-size-xs);
   color: var(--rs-danger);
 }
-.rs-code-editor__inline-actions[data-v-29cd1019] {
+.rs-code-editor__inline-actions[data-v-edadd50f] {
   display: flex;
   justify-content: flex-end;
   gap: 0.35rem;
 }
-.rs-code-editor__inline-btn[data-v-29cd1019] {
+.rs-code-editor__inline-btn[data-v-edadd50f] {
   padding: 0.3rem 0.65rem;
   border: 1px solid var(--rs-border);
   border-radius: var(--rs-radius-sm, 4px);
@@ -120,69 +120,69 @@
   font-size: var(--rs-font-size-xs);
   cursor: pointer;
 }
-.rs-code-editor__inline-btn--primary[data-v-29cd1019] {
+.rs-code-editor__inline-btn--primary[data-v-edadd50f] {
   border-color: var(--rs-primary);
   background: var(--rs-primary);
   color: var(--rs-primary-foreground, #fff);
 }
-.rs-code-editor__inline-btn[data-v-29cd1019]:disabled {
+.rs-code-editor__inline-btn[data-v-edadd50f]:disabled {
   opacity: 0.55;
   cursor: not-allowed;
 }
-.rs-code-editor__surface--disabled[data-v-29cd1019] {
+.rs-code-editor__surface--disabled[data-v-edadd50f] {
   opacity: 0.6;
   pointer-events: none;
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-editor {
+.rs-code-editor__surface[data-v-edadd50f] .cm-editor {
   height: 100%;
   background: var(--rs-surface-elevated) !important;
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-scroller {
+.rs-code-editor__surface[data-v-edadd50f] .cm-scroller {
   font-family: var(--rs-code-font-family, var(--rs-font-mono));
   font-size: var(--rs-code-font-size, var(--rs-font-size-sm));
   line-height: var(--rs-code-line-height, var(--rs-line-height-relaxed));
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-gutters {
+.rs-code-editor__surface[data-v-edadd50f] .cm-gutters {
   background: color-mix(in srgb, var(--rs-surface-elevated) 85%, var(--rs-border) 15%) !important;
   border-right-color: var(--rs-border-subtle) !important;
   color: var(--rs-muted);
 }
-.rs-code-editor--embedded .rs-code-editor__surface[data-v-29cd1019] .cm-editor {
+.rs-code-editor--embedded .rs-code-editor__surface[data-v-edadd50f] .cm-editor {
   height: 100%;
   background: transparent !important;
 }
-.rs-code-editor--no-fold .rs-code-editor__surface[data-v-29cd1019] .cm-foldGutter {
+.rs-code-editor--no-fold .rs-code-editor__surface[data-v-edadd50f] .cm-foldGutter {
   display: none !important;
   width: 0 !important;
   min-width: 0 !important;
 }
-.rs-code-editor--gutter-fixed .rs-code-editor__surface[data-v-29cd1019] .cm-gutters {
+.rs-code-editor--gutter-fixed .rs-code-editor__surface[data-v-edadd50f] .cm-gutters {
   min-width: var(--rs-code-editor-gutter-width);
 }
-.rs-code-editor--gutter-fixed.rs-code-editor--no-fold .rs-code-editor__surface[data-v-29cd1019] .cm-lineNumbers {
+.rs-code-editor--gutter-fixed.rs-code-editor--no-fold .rs-code-editor__surface[data-v-edadd50f] .cm-lineNumbers {
   min-width: var(--rs-code-editor-gutter-width);
 }
-.rs-code-editor--gutter-fixed.rs-code-editor--no-fold .rs-code-editor__surface[data-v-29cd1019] .cm-lineNumbers .cm-gutterElement {
+.rs-code-editor--gutter-fixed.rs-code-editor--no-fold .rs-code-editor__surface[data-v-edadd50f] .cm-lineNumbers .cm-gutterElement {
   min-width: calc(var(--rs-code-editor-gutter-width) - 8px);
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-content {
+.rs-code-editor__surface[data-v-edadd50f] .cm-content {
   color: var(--rs-foreground);
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-lintRange-error {
+.rs-code-editor__surface[data-v-edadd50f] .cm-lintRange-error {
   background: color-mix(in srgb, var(--rs-danger) 12%, transparent);
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-lintRange-warning {
+.rs-code-editor__surface[data-v-edadd50f] .cm-lintRange-warning {
   background: color-mix(in srgb, var(--rs-warning) 12%, transparent);
 }
-.rs-code-editor__surface[data-v-29cd1019] .cm-lintRange-info {
+.rs-code-editor__surface[data-v-edadd50f] .cm-lintRange-info {
   background: color-mix(in srgb, var(--rs-info) 10%, transparent);
 }
-.rs-code-editor__surface[data-v-29cd1019] .rs-code-editor__ghost {
+.rs-code-editor__surface[data-v-edadd50f] .rs-code-editor__ghost {
   color: var(--rs-muted);
   opacity: 0.55;
   pointer-events: none;
 }
-.rs-code-editor__surface[data-v-29cd1019] .rs-code-editor__hover {
+.rs-code-editor__surface[data-v-edadd50f] .rs-code-editor__hover {
   max-width: 28rem;
   padding: 0.45rem 0.65rem;
   border-radius: var(--rs-radius-sm, 4px);
@@ -195,7 +195,7 @@
   white-space: pre-wrap;
   box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
 }
-.rs-code-editor__diagnostics[data-v-29cd1019] {
+.rs-code-editor__diagnostics[data-v-edadd50f] {
   margin: 0;
   padding: var(--rs-space-sm) var(--rs-space-md);
   border-top: 1px solid var(--rs-border-subtle);
@@ -203,12 +203,12 @@
   font-size: var(--rs-font-size-xs);
   list-style: none;
 }
-.rs-code-editor__diagnostic--error[data-v-29cd1019] {
+.rs-code-editor__diagnostic--error[data-v-edadd50f] {
   color: var(--rs-danger);
 }
-.rs-code-editor__diagnostic--warning[data-v-29cd1019] {
+.rs-code-editor__diagnostic--warning[data-v-edadd50f] {
   color: var(--rs-warning);
 }
-.rs-code-editor__diagnostic--info[data-v-29cd1019] {
+.rs-code-editor__diagnostic--info[data-v-edadd50f] {
   color: var(--rs-info);
 }

package/dist/components/RsCodeEditor.impl.js

@@ -1,4 +1,4 @@
-import { codeEditorLanguageLabel, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme } from "./code-editor-utils.js";
+import { codeEditorLanguageLabel, readDocumentTheme, resolveCodeEditorLanguage, resolveCodeEditorSize, resolveCodeEditorTheme } from "./code-editor-utils.js";
 import { isCodeMirrorLightTheme, resolveCodeMirrorLanguage } from "./code-mirror-lang.js";
 import { diagnosticExtensions, setEditorDiagnostics } from "./code-mirror-diagnostics.js";
 import { codeMirrorIntelExtensions, goToPosition } from "./code-mirror-intel.js";
@@ -89,10 +89,12 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 		});
 		const resolvedLanguage = computed(() => resolveCodeEditorLanguage(props.language));
 		const resolvedLanguageLabel = computed(() => codeEditorLanguageLabel(props.language));
-		const resolvedTheme = computed(() => resolveCodeEditorTheme(props.theme));
+		const documentTheme = ref(readDocumentTheme());
+		const resolvedTheme = computed(() => props.theme === "auto" ? documentTheme.value : resolveCodeEditorTheme(props.theme));
 		const editorEl = ref(null);
 		const view = shallowRef(null);
 		const editableCompartment = new Compartment();
+		const themeCompartment = new Compartment();
 		let themeObserver = null;
 		let unmounted = false;
 		let syncingFromModel = false;
@@ -157,6 +159,15 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 				ghostTimer = null;
 			}
 		}
+		function codeMirrorThemeExts() {
+			return isCodeMirrorLightTheme() ? [] : [oneDark];
+		}
+		function applyDocumentTheme() {
+			documentTheme.value = readDocumentTheme();
+			if (!view.value) return;
+			view.value.dispatch({ effects: themeCompartment.reconfigure(codeMirrorThemeExts()) });
+			view.value.requestMeasure();
+		}
 		async function initEditor() {
 			if (!editorEl.value || unmounted) return;
 			const seq = ++initSeq;
@@ -185,7 +196,7 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 					...codeMirrorCompletionExtensions(() => ({ completionRequest: props.completionRequest })),
 					...codeMirrorGhostExtensions(() => ({ completionRequest: props.completionRequest }), scheduleGhostCompletion, cancelGhostCompletionSchedule),
 					...props.inlineEditRequest ? [codeMirrorInlineEditExtension(onInlineEditTrigger)] : [],
-					...isCodeMirrorLightTheme() ? [] : [oneDark],
+					themeCompartment.of(codeMirrorThemeExts()),
 					EditorView.updateListener.of((update) => {
 						if (!update.docChanged || syncingFromModel) return;
 						const next = update.state.doc.toString();
@@ -204,7 +215,7 @@ var RsCodeEditor_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 			unmounted = false;
 			initEditor();
 			themeObserver = new MutationObserver(() => {
-				initEditor();
+				applyDocumentTheme();
 			});
 			themeObserver.observe(document.documentElement, {
 				attributes: true,

package/dist/components/RsCodeEditor.js

@@ -3,6 +3,6 @@ import _plugin_vue_export_helper_default from "../_virtual/_plugin-vue_export-he
 import RsCodeEditor_vue_vue_type_script_setup_true_lang_default from "./RsCodeEditor.impl.js";
 
 //#region src/components/RsCodeEditor.vue
-var RsCodeEditor_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsCodeEditor_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-29cd1019"]]);
+var RsCodeEditor_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsCodeEditor_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-edadd50f"]]);
 //#endregion
 export { RsCodeEditor_default as default };

package/dist/components/RsMentions-1.css

@@ -0,0 +1,29 @@
+
+.rs-mentions__list {
+  position: fixed;
+  z-index: var(--rs-z-dropdown, 80);
+  box-sizing: border-box;
+  min-width: 10rem;
+  max-height: 12rem;
+  margin: 0;
+  padding: var(--rs-space-xs);
+  overflow: auto;
+  border: 1px solid var(--rs-border);
+  border-radius: var(--rs-radius-sm);
+  background: var(--rs-surface);
+  box-shadow: var(--rs-shadow-md);
+  list-style: none;
+}
+.rs-mentions__item {
+  padding: var(--rs-space-xs) var(--rs-space-sm);
+  border-radius: var(--rs-radius-xs);
+  cursor: pointer;
+}
+.rs-mentions__item--active,
+.rs-mentions__item:hover:not(.rs-mentions__item--disabled) {
+  background: var(--rs-surface-hover);
+}
+.rs-mentions__item--disabled {
+  opacity: 0.4;
+  cursor: not-allowed;
+}

package/dist/components/RsMentions.css

@@ -0,0 +1,19 @@
+
+.rs-mentions[data-v-0ab8420e] {
+  position: relative;
+  width: 100%;
+}
+.rs-mentions__input[data-v-0ab8420e] {
+  box-sizing: border-box;
+  width: 100%;
+  min-height: calc(var(--rs-control-height-md) * 2);
+  padding: var(--rs-space-sm) var(--rs-space-md);
+  border: 1px solid var(--rs-input-border, var(--rs-border));
+  border-radius: var(--rs-radius-sm);
+  background: var(--rs-input-bg);
+  color: var(--rs-text);
+  font-family: inherit;
+  font-size: var(--rs-font-size-sm);
+  resize: vertical;
+  outline: none;
+}

package/dist/components/RsMentions.d.ts

@@ -0,0 +1,32 @@
+import type { RsComponentSize } from '../theme/types';
+import { type RsMentionOption } from './mentions-utils';
+type __VLS_Props = {
+    options?: readonly RsMentionOption[];
+    prefix?: string | string[];
+    split?: string;
+    rows?: number;
+    placeholder?: string;
+    disabled?: boolean;
+    size?: RsComponentSize;
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import("vue").DefineComponent<__VLS_PublicProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    search: (query: string) => any;
+    select: (value: string) => any;
+    "update:modelValue": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onSearch?: ((query: string) => any) | undefined;
+    onSelect?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {
+    split: string;
+    disabled: boolean;
+    options: readonly RsMentionOption[];
+    prefix: string | string[];
+    rows: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/components/RsMentions.impl.js

@@ -0,0 +1,242 @@
+import { useRsI18n } from "../composables/useRsI18n.js";
+import { useResolvedRsComponentSize } from "./resolve-size.js";
+import { applyMention, createTextareaCaretMeter, filterMentionOptions, findActiveMention, placeMentionPopup, resolveMentionPrefixes, stepMentionIndex } from "./mentions-utils.js";
+import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, ref, renderList, toDisplayString, unref, useId, useModel, vModelText, watch, withDirectives, withModifiers } from "vue";
+//#region src/components/RsMentions.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"rows",
+	"placeholder",
+	"disabled",
+	"aria-expanded",
+	"aria-controls",
+	"aria-activedescendant"
+];
+var _hoisted_2 = ["id", "aria-label"];
+var _hoisted_3 = [
+	"id",
+	"aria-selected",
+	"aria-disabled",
+	"onMousedown"
+];
+var RsMentions_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComponent({
+	name: "RsMentions",
+	__name: "RsMentions",
+	props: /*@__PURE__*/ mergeModels({
+		options: { default: () => [] },
+		prefix: { default: "@" },
+		split: { default: " " },
+		rows: { default: 3 },
+		placeholder: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		size: {}
+	}, {
+		"modelValue": { default: "" },
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["select", "search"], ["update:modelValue"]),
+	setup(__props, { emit: __emit }) {
+		const model = useModel(__props, "modelValue");
+		const props = __props;
+		const emit = __emit;
+		const { t } = useRsI18n();
+		const resolvedSize = useResolvedRsComponentSize(() => props.size);
+		const listId = useId();
+		const areaRef = ref(null);
+		const listRef = ref(null);
+		const cursor = ref(0);
+		const popup = ref({
+			top: 0,
+			left: 0,
+			placement: "bottom"
+		});
+		const highlight = ref(0);
+		const dismissed = ref(false);
+		const lastSearch = ref(null);
+		const prefixes = computed(() => resolveMentionPrefixes(props.prefix));
+		const meter = createTextareaCaretMeter();
+		const active = computed(() => dismissed.value ? null : findActiveMention(model.value, cursor.value, prefixes.value, props.split));
+		const suggestions = computed(() => active.value ? filterMentionOptions(props.options, active.value.query) : []);
+		const open = computed(() => Boolean(active.value && suggestions.value.length));
+		const activeOption = computed(() => suggestions.value[highlight.value]);
+		const activeOptionId = computed(() => open.value && activeOption.value ? `${listId}-${activeOption.value.value}` : void 0);
+		function viewportCaret() {
+			const el = areaRef.value;
+			const mention = active.value;
+			if (!el || !mention) return null;
+			const local = meter.measure(el, mention.start);
+			const box = el.getBoundingClientRect();
+			return {
+				top: box.top + local.top,
+				left: box.left + local.left,
+				height: local.height
+			};
+		}
+		function placePopup() {
+			const caret = viewportCaret();
+			if (!caret) return;
+			const list = listRef.value?.getBoundingClientRect();
+			popup.value = placeMentionPopup(caret, {
+				width: list?.width || 160,
+				height: list?.height || Math.min(192, suggestions.value.length * 32)
+			}, {
+				width: window.innerWidth,
+				height: window.innerHeight
+			});
+		}
+		let frame = 0;
+		function requestPlace() {
+			if (frame) return;
+			frame = window.requestAnimationFrame(() => {
+				frame = 0;
+				placePopup();
+			});
+		}
+		function syncCursor(emitSearch, keepDismissed = false) {
+			const el = areaRef.value;
+			cursor.value = el?.selectionStart ?? model.value.length;
+			if (!keepDismissed) dismissed.value = false;
+			const mention = findActiveMention(model.value, cursor.value, prefixes.value, props.split);
+			if (!mention) {
+				lastSearch.value = null;
+				return;
+			}
+			if (emitSearch && mention.query !== lastSearch.value) {
+				lastSearch.value = mention.query;
+				emit("search", mention.query);
+			}
+			requestPlace();
+		}
+		function pick(option) {
+			if (!active.value || option.disabled) return;
+			const next = applyMention(model.value, active.value, option.value, props.split);
+			model.value = next.text;
+			emit("select", option.value);
+			dismissed.value = true;
+			nextTick(() => {
+				const el = areaRef.value;
+				if (!el) return;
+				el.focus();
+				el.setSelectionRange(next.cursor, next.cursor);
+				cursor.value = next.cursor;
+			});
+		}
+		function onKeydown(event) {
+			if (!open.value) return;
+			if (event.key === "ArrowDown") {
+				event.preventDefault();
+				highlight.value = stepMentionIndex(suggestions.value, highlight.value, 1);
+				return;
+			}
+			if (event.key === "ArrowUp") {
+				event.preventDefault();
+				highlight.value = stepMentionIndex(suggestions.value, highlight.value, -1);
+				return;
+			}
+			if (event.key === "Enter") {
+				event.preventDefault();
+				if (activeOption.value) pick(activeOption.value);
+				return;
+			}
+			if (event.key === "Escape") {
+				event.preventDefault();
+				dismissed.value = true;
+				return;
+			}
+			if (event.key === "Home") {
+				event.preventDefault();
+				highlight.value = stepMentionIndex(suggestions.value, -1, 1);
+				return;
+			}
+			if (event.key === "End") {
+				event.preventDefault();
+				highlight.value = stepMentionIndex(suggestions.value, suggestions.value.length, -1);
+				return;
+			}
+			if (event.key === "Tab" && activeOption.value) {
+				event.preventDefault();
+				pick(activeOption.value);
+			}
+		}
+		watch(suggestions, (list) => {
+			highlight.value = list.findIndex((item) => !item.disabled);
+			if (highlight.value < 0) highlight.value = 0;
+			requestPlace();
+		});
+		watch(open, (isOpen) => {
+			if (isOpen) nextTick(() => requestPlace());
+		});
+		function onWindowChange() {
+			if (open.value) requestPlace();
+		}
+		onMounted(() => {
+			window.addEventListener("resize", onWindowChange);
+			window.addEventListener("scroll", onWindowChange, true);
+		});
+		onUnmounted(() => {
+			if (frame) window.cancelAnimationFrame(frame);
+			meter.dispose();
+			window.removeEventListener("resize", onWindowChange);
+			window.removeEventListener("scroll", onWindowChange, true);
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", { class: normalizeClass(["rs-mentions", `rs-mentions--${unref(resolvedSize)}`]) }, [withDirectives(createElementVNode("textarea", {
+				ref_key: "areaRef",
+				ref: areaRef,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => model.value = $event),
+				class: "rs-mentions__input",
+				rows: __props.rows,
+				placeholder: __props.placeholder ?? unref(t)("mentions.placeholder"),
+				disabled: __props.disabled,
+				role: "combobox",
+				"aria-autocomplete": "list",
+				"aria-haspopup": "listbox",
+				"aria-expanded": open.value ? "true" : "false",
+				"aria-controls": open.value ? unref(listId) : void 0,
+				"aria-activedescendant": activeOptionId.value,
+				onKeydown,
+				onKeyup: _cache[1] || (_cache[1] = ($event) => syncCursor(true, [
+					"Escape",
+					"Enter",
+					"Tab",
+					"ArrowUp",
+					"ArrowDown",
+					"Home",
+					"End"
+				].includes($event.key))),
+				onClick: _cache[2] || (_cache[2] = ($event) => syncCursor(true)),
+				onInput: _cache[3] || (_cache[3] = ($event) => syncCursor(true)),
+				onScroll: _cache[4] || (_cache[4] = ($event) => syncCursor(false, true))
+			}, null, 40, _hoisted_1), [[vModelText, model.value]]), (openBlock(), createBlock(Teleport, { to: "body" }, [open.value ? (openBlock(), createElementBlock("ul", {
+				key: 0,
+				id: unref(listId),
+				ref_key: "listRef",
+				ref: listRef,
+				class: "rs-mentions__list",
+				role: "listbox",
+				"aria-label": unref(t)("mentions.suggestions"),
+				style: normalizeStyle({
+					top: `${popup.value.top}px`,
+					left: `${popup.value.left}px`
+				})
+			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(suggestions.value, (opt, index) => {
+				return openBlock(), createElementBlock("li", {
+					id: `${unref(listId)}-${opt.value}`,
+					key: opt.value,
+					role: "option",
+					class: normalizeClass(["rs-mentions__item", {
+						"rs-mentions__item--disabled": opt.disabled,
+						"rs-mentions__item--active": index === highlight.value
+					}]),
+					"aria-selected": index === highlight.value,
+					"aria-disabled": opt.disabled ? "true" : void 0,
+					onMousedown: withModifiers(($event) => pick(opt), ["prevent"])
+				}, toDisplayString(opt.label), 43, _hoisted_3);
+			}), 128))], 12, _hoisted_2)) : createCommentVNode("", true)]))], 2);
+		};
+	}
+});
+//#endregion
+export { RsMentions_vue_vue_type_script_setup_true_lang_default as default };

package/dist/components/RsMentions.js

@@ -0,0 +1,10 @@
+import './RsMentions.css'
+import './RsMentions-1.css'
+import _plugin_vue_export_helper_default from "../_virtual/_plugin-vue_export-helper.js";
+import RsMentions_vue_vue_type_script_setup_true_lang_default from "./RsMentions.impl.js";
+
+
+//#region src/components/RsMentions.vue
+var RsMentions_default = /*#__PURE__*/ _plugin_vue_export_helper_default(RsMentions_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-0ab8420e"]]);
+//#endregion
+export { RsMentions_default as default };