@comfyorg/design-system 1.1.0 → 1.3.0-alpha.0

package/dist/radio-group/RadioGroup.vue.js

@@ -0,0 +1,43 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { createBlock, defineComponent, mergeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import { RadioGroupRoot, useForwardPropsEmits } from "reka-ui";
+import { reactiveOmit } from "@vueuse/core";
+// src/components/radio-group/RadioGroup.vue
+var RadioGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "RadioGroup",
+	props: {
+		modelValue: {},
+		defaultValue: {},
+		disabled: { type: Boolean },
+		orientation: {},
+		dir: {},
+		loop: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		name: {},
+		required: { type: Boolean },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: ["update:modelValue"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emits = __emit;
+		const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(RadioGroupRoot), mergeProps(unref(forwarded), {
+				"data-slot": "radio-group",
+				class: unref(cn)("flex gap-2", props.class)
+			}), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				_: 3
+			}, 16, ["class"]);
+		};
+	}
+});
+export { RadioGroup_default as default };

package/dist/radio-group/RadioGroupItem.vue.d.ts

@@ -0,0 +1,22 @@
+import { RadioGroupItemProps } from 'reka-ui';
+import { HTMLAttributes } from 'vue';
+type __VLS_Props = RadioGroupItemProps & {
+    class?: HTMLAttributes['class'];
+};
+declare var __VLS_8: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_8) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    select: (event: import('reka-ui').RadioGroupItemSelectEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onSelect?: ((event: import('reka-ui').RadioGroupItemSelectEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/radio-group/RadioGroupItem.vue.js

@@ -0,0 +1,40 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { createBlock, createVNode, defineComponent, mergeProps, openBlock, renderSlot, unref, withCtx } from "vue";
+import { RadioGroupIndicator, RadioGroupItem, useForwardPropsEmits } from "reka-ui";
+import { reactiveOmit } from "@vueuse/core";
+// src/components/radio-group/RadioGroupItem.vue
+var RadioGroupItem_default = /* @__PURE__ */ defineComponent({
+	__name: "RadioGroupItem",
+	props: {
+		id: {},
+		value: {},
+		disabled: { type: Boolean },
+		asChild: { type: Boolean },
+		as: {},
+		name: {},
+		required: { type: Boolean },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	},
+	emits: ["select"],
+	setup(__props, { emit: __emit }) {
+		const props = __props;
+		const emits = __emit;
+		const forwarded = useForwardPropsEmits(reactiveOmit(props, "class"), emits);
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(RadioGroupItem), mergeProps(unref(forwarded), {
+				"data-slot": "radio-group-item",
+				class: unref(cn)("inline-flex size-4 shrink-0 cursor-pointer items-center justify-center rounded-full border bg-transparent outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary", props.class)
+			}), {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", {}, () => [createVNode(unref(RadioGroupIndicator), { class: "size-2 rounded-full bg-primary" })])]),
+				_: 3
+			}, 16, ["class"]);
+		};
+	}
+});
+export { RadioGroupItem_default as default };

package/dist/search-input/AsyncSearchInput.vue.d.ts

@@ -0,0 +1,27 @@
+import { HTMLAttributes, MaybeRefOrGetter } from 'vue';
+type __VLS_Props = {
+    accessibleLabel: string;
+    clearLabel: string;
+    placeholder?: string;
+    searcher?: (query: string, onCleanup: (cleanupFn: () => void) => void) => Promise<void>;
+    updateKey?: MaybeRefOrGetter<unknown>;
+    autofocus?: boolean;
+    debounceMs?: number;
+    debounceMaxWaitMs?: number;
+    class?: HTMLAttributes['class'];
+};
+type __VLS_ModelProps = {
+    modelValue?: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare const __VLS_export: import('vue').DefineComponent<__VLS_PublicProps, {
+    focus: () => void | undefined;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    enter: (event: KeyboardEvent) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    onEnter?: ((event: KeyboardEvent) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/search-input/AsyncSearchInput.vue.js

@@ -0,0 +1,102 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { createCommentVNode, createElementBlock, createElementVNode, defineComponent, mergeModels, nextTick, normalizeClass, onMounted, openBlock, ref, toRef, toValue, unref, useModel, vModelText, watch, withDirectives, withKeys } from "vue";
+import { refDebounced } from "@vueuse/core";
+// src/components/search-input/AsyncSearchInput.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = [
+	"placeholder",
+	"aria-label",
+	"autofocus"
+];
+var _hoisted_2 = ["aria-label"];
+// src/components/search-input/AsyncSearchInput.vue
+var AsyncSearchInput_default = /* @__PURE__ */ defineComponent({
+	__name: "AsyncSearchInput",
+	props: /*@__PURE__*/ mergeModels({
+		accessibleLabel: {},
+		clearLabel: {},
+		placeholder: {},
+		searcher: {
+			type: Function,
+			default: async () => {}
+		},
+		updateKey: {},
+		autofocus: {
+			type: Boolean,
+			default: false
+		},
+		debounceMs: { default: 250 },
+		debounceMaxWaitMs: { default: 1e3 },
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	}, {
+		"modelValue": { default: "" },
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["enter"], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const searchQuery = useModel(__props, "modelValue");
+		const inputRef = ref();
+		onMounted(() => {
+			if (!__props.autofocus) return;
+			nextTick(() => inputRef.value?.focus());
+		});
+		__expose({ focus: () => inputRef.value?.focus() });
+		const isQuerying = ref(false);
+		const debouncedSearchQuery = refDebounced(searchQuery, __props.debounceMs, { maxWait: __props.debounceMaxWaitMs });
+		watch(searchQuery, (value) => {
+			isQuerying.value = value !== debouncedSearchQuery.value;
+		});
+		const updateKeyRef = toRef(() => toValue(__props.updateKey));
+		watch([debouncedSearchQuery, updateKeyRef], (_, __, onCleanup) => {
+			let isCleanup = false;
+			let cleanupFn;
+			onCleanup(() => {
+				isCleanup = true;
+				cleanupFn?.();
+			});
+			__props.searcher(debouncedSearchQuery.value, (cb) => cleanupFn = cb).catch((error) => {
+				console.error("[AsyncSearchInput] searcher failed", error);
+			}).finally(() => {
+				if (!isCleanup) isQuerying.value = false;
+			});
+		}, { immediate: true });
+		function handleFocus(event) {
+			const target = event.target;
+			if (target instanceof HTMLInputElement) target.select();
+		}
+		function handleKeydownEnter(event) {
+			if (event.isComposing) return;
+			emit("enter", event);
+		}
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("label", { class: normalizeClass(unref(cn)("group", "rounded-lg bg-secondary transition-all duration-150", "flex flex-1 items-center", "border-0 text-foreground", "focus-within:ring focus-within:ring-ring", __props.class)) }, [
+				createElementVNode("i", { class: normalizeClass(unref(cn)("ml-2 transition-colors duration-150", isQuerying.value ? "icon-[lucide--loader-circle] animate-spin" : "icon-[lucide--search]", searchQuery.value?.trim() !== "" ? "text-foreground" : "text-muted-foreground group-focus-within:text-foreground group-hover:text-foreground")) }, null, 2),
+				withDirectives(createElementVNode("input", {
+					ref_key: "inputRef",
+					ref: inputRef,
+					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => searchQuery.value = $event),
+					type: "text",
+					class: "mx-2 my-1.5 h-5 w-full min-w-0 border-0 bg-transparent text-sm ring-0 outline-0",
+					placeholder: __props.placeholder,
+					"aria-label": __props.accessibleLabel,
+					autofocus: __props.autofocus,
+					onFocus: handleFocus,
+					onKeydown: withKeys(handleKeydownEnter, ["enter"])
+				}, null, 40, _hoisted_1), [[vModelText, searchQuery.value]]),
+				searchQuery.value.trim().length > 0 ? (openBlock(), createElementBlock("button", {
+					key: 0,
+					class: "m-0 flex shrink-0 items-center justify-center border-0 bg-transparent p-0 pr-3 pl-1 text-muted-foreground ring-0 outline-0 transition-all duration-150 hover:scale-108 hover:text-foreground",
+					"aria-label": __props.clearLabel,
+					onClick: _cache[1] || (_cache[1] = ($event) => searchQuery.value = "")
+				}, [createElementVNode("i", { class: normalizeClass(unref(cn)("icon-[lucide--delete] cursor-pointer")) }, null, 2)], 8, _hoisted_2)) : createCommentVNode("", true)
+			], 2);
+		};
+	}
+});
+export { AsyncSearchInput_default as default };

package/dist/search-input/SearchAutocomplete.vue.d.ts

@@ -0,0 +1,53 @@
+import { HTMLAttributes, StyleValue } from 'vue';
+import { SearchInputVariants } from './searchInput.variants';
+declare const __VLS_export: <T>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
+    props: import('vue').PublicProps & __VLS_PrettifyLocal<({
+        placeholder?: string;
+        accessibleLabel: string;
+        clearLabel: string;
+        icon?: string;
+        autofocus?: boolean;
+        inputId?: string;
+        loading?: boolean;
+        disabled?: boolean;
+        openOnFocus?: boolean;
+        updateModelOnSelect?: boolean;
+        size?: SearchInputVariants["size"];
+        suggestions?: T[];
+        optionLabel?: keyof T & string;
+        optionKey?: keyof T & string;
+        class?: HTMLAttributes["class"];
+        anchorClass?: HTMLAttributes["class"];
+        contentStyle?: StyleValue;
+    } & {
+        modelValue: string;
+    }) & {
+        onSelect?: ((item: T) => any) | undefined;
+        "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+        onHighlight?: ((item: T | undefined) => any) | undefined;
+    }> & (typeof globalThis extends {
+        __VLS_PROPS_FALLBACK: infer P;
+    } ? P : {});
+    expose: (exposed: import('vue').ShallowUnwrapRef<{
+        focus: () => void;
+        open: () => void;
+    }>) => void;
+    attrs: any;
+    slots: {
+        leading?: (props: {}) => any;
+    } & {
+        suggestion?: (props: {
+            suggestion: T;
+        }) => any;
+    };
+    emit: (((evt: "select", item: T) => void) & ((evt: "highlight", item: T | undefined) => void)) & ((event: "update:modelValue", value: string) => void);
+}>) => import('vue').VNode & {
+    __ctx?: NonNullable<Awaited<typeof __VLS_setup>>;
+};
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_PrettifyLocal<T> = (T extends any ? {
+    [K in keyof T]: T[K];
+} : {
+    [K in keyof T as K]: T[K];
+}) & {};

package/dist/search-input/SearchAutocomplete.vue.js

@@ -0,0 +1,232 @@
+import { t as cn } from "../shared/src-DTwuqov4.js";
+import { t as Button_default } from "../shared/Button-Dj_H5v3V.js";
+import { n as searchInputVariants, t as searchInputSizeConfig } from "../shared/searchInput.variants-BdYHNjce.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useModel, useTemplateRef, watch, withCtx, withKeys, withModifiers } from "vue";
+import { ComboboxAnchor, ComboboxContent, ComboboxInput, ComboboxItem, ComboboxPortal, ComboboxRoot } from "reka-ui";
+// src/components/search-input/SearchAutocomplete.vue
+var SearchAutocomplete_default = /* @__PURE__ */ defineComponent({
+	__name: "SearchAutocomplete",
+	props: /*@__PURE__*/ mergeModels({
+		placeholder: {},
+		accessibleLabel: {},
+		clearLabel: {},
+		icon: { default: "icon-[lucide--search]" },
+		autofocus: {
+			type: Boolean,
+			default: false
+		},
+		inputId: {},
+		loading: {
+			type: Boolean,
+			default: false
+		},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		openOnFocus: {
+			type: Boolean,
+			default: false
+		},
+		updateModelOnSelect: {
+			type: Boolean,
+			default: true
+		},
+		size: { default: "md" },
+		suggestions: { default: () => [] },
+		optionLabel: {},
+		optionKey: {},
+		class: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		anchorClass: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] },
+		contentStyle: { type: [
+			Boolean,
+			null,
+			String,
+			Object,
+			Array
+		] }
+	}, {
+		"modelValue": { required: true },
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["select", "highlight"], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const sizeConfig = computed(() => searchInputSizeConfig[__props.size]);
+		const modelValue = useModel(__props, "modelValue");
+		const comboboxRef = useTemplateRef("comboboxRef");
+		const inputRef = ref(null);
+		const isOpen = ref(false);
+		const isComposing = ref(false);
+		function focus() {
+			inputRef.value?.$el?.focus();
+		}
+		function open() {
+			isOpen.value = true;
+		}
+		__expose({
+			focus,
+			open
+		});
+		function clearSearch() {
+			modelValue.value = "";
+			focus();
+		}
+		function getItemProperty(item, key) {
+			if (typeof item === "object" && item !== null) return String(item[key]);
+			return String(item);
+		}
+		function suggestionLabel(item) {
+			if (__props.optionLabel) return getItemProperty(item, __props.optionLabel);
+			return String(item);
+		}
+		function suggestionKey(item, index) {
+			if (__props.optionKey) return getItemProperty(item, __props.optionKey);
+			return `${suggestionLabel(item)}-${index}`;
+		}
+		function suggestionValue(item) {
+			return suggestionLabel(item);
+		}
+		function onSelectSuggestion(item) {
+			if (__props.updateModelOnSelect) modelValue.value = suggestionLabel(item);
+			isOpen.value = false;
+			emit("select", item);
+		}
+		function onHighlight(payload) {
+			const index = Number(payload?.ref.dataset.suggestionIndex);
+			emit("highlight", Number.isInteger(index) ? __props.suggestions[index] : void 0);
+		}
+		function keepShiftSelectionNative(e) {
+			if (e.target !== inputRef.value?.$el) return;
+			if (e.shiftKey && (e.key === "Home" || e.key === "End")) e.stopPropagation();
+		}
+		function onEnterKey(e) {
+			if (isComposing.value) {
+				e.preventDefault();
+				e.stopPropagation();
+			}
+		}
+		watch(() => __props.suggestions, async (items) => {
+			isOpen.value = items.length > 0 && (__props.openOnFocus || !!modelValue.value);
+			if (isOpen.value) {
+				await nextTick();
+				comboboxRef.value?.highlightFirstItem?.();
+			}
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(unref(ComboboxRoot), {
+				ref_key: "comboboxRef",
+				ref: comboboxRef,
+				open: isOpen.value,
+				"onUpdate:open": _cache[3] || (_cache[3] = ($event) => isOpen.value = $event),
+				"ignore-filter": "",
+				"reset-search-term-on-blur": false,
+				"reset-search-term-on-select": false,
+				disabled: __props.disabled,
+				"open-on-focus": __props.openOnFocus,
+				"open-on-click": __props.openOnFocus,
+				class: normalizeClass(__props.class),
+				onHighlight
+			}, {
+				default: withCtx(() => [createVNode(unref(ComboboxAnchor), {
+					class: normalizeClass(unref(cn)(unref(searchInputVariants)({ size: __props.size }), __props.disabled && "pointer-events-none opacity-50", __props.anchorClass)),
+					onClick: focus,
+					onKeydownCapture: keepShiftSelectionNative
+				}, {
+					default: withCtx(() => [
+						renderSlot(_ctx.$slots, "leading"),
+						modelValue.value ? (openBlock(), createBlock(unref(Button_default), {
+							key: 0,
+							class: normalizeClass(unref(cn)("absolute", sizeConfig.value.clearPos)),
+							variant: "textonly",
+							size: "icon-sm",
+							"aria-label": __props.clearLabel,
+							onClick: withModifiers(clearSearch, ["stop"])
+						}, {
+							default: withCtx(() => [createElementVNode("i", { class: normalizeClass(unref(cn)("icon-[lucide--x]", sizeConfig.value.icon)) }, null, 2)]),
+							_: 1
+						}, 8, ["class", "aria-label"])) : __props.loading ? (openBlock(), createElementBlock("i", {
+							key: 1,
+							class: normalizeClass(unref(cn)("pointer-events-none absolute icon-[lucide--loader-circle] animate-spin", sizeConfig.value.iconPos, sizeConfig.value.icon))
+						}, null, 2)) : (openBlock(), createElementBlock("i", {
+							key: 2,
+							class: normalizeClass(unref(cn)("pointer-events-none absolute", sizeConfig.value.iconPos, sizeConfig.value.icon, __props.icon))
+						}, null, 2)),
+						createVNode(unref(ComboboxInput), {
+							id: __props.inputId,
+							ref_key: "inputRef",
+							ref: inputRef,
+							modelValue: modelValue.value,
+							"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
+							class: normalizeClass(unref(cn)("h-full min-w-0 flex-1 border-none bg-transparent outline-none", sizeConfig.value.inputPl, sizeConfig.value.inputText)),
+							placeholder: __props.placeholder,
+							"aria-label": __props.accessibleLabel,
+							"auto-focus": __props.autofocus,
+							onCompositionstart: _cache[1] || (_cache[1] = ($event) => isComposing.value = true),
+							onCompositionend: _cache[2] || (_cache[2] = ($event) => isComposing.value = false),
+							onKeydown: withKeys(onEnterKey, ["enter"])
+						}, null, 8, [
+							"id",
+							"modelValue",
+							"class",
+							"placeholder",
+							"aria-label",
+							"auto-focus"
+						])
+					]),
+					_: 3
+				}, 8, ["class"]), (openBlock(), createBlock(unref(ComboboxPortal), { key: Number(isOpen.value) }, {
+					default: withCtx(() => [__props.suggestions.length > 0 ? (openBlock(), createBlock(unref(ComboboxContent), {
+						key: 0,
+						position: "popper",
+						"side-offset": 4,
+						style: normalizeStyle(__props.contentStyle),
+						class: normalizeClass(unref(cn)("z-overlay max-h-60 w-(--reka-combobox-trigger-width) overflow-y-auto", "rounded-lg border bg-background p-1 shadow-lg"))
+					}, {
+						default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.suggestions, (suggestion, index) => {
+							return openBlock(), createBlock(unref(ComboboxItem), {
+								key: suggestionKey(suggestion, index),
+								value: suggestionValue(suggestion),
+								"data-suggestion-index": index,
+								"aria-label": suggestionLabel(suggestion),
+								class: normalizeClass(unref(cn)("cursor-pointer rounded-sm px-3 py-2 text-sm outline-none", "data-highlighted:bg-accent")),
+								onSelect: withModifiers(($event) => onSelectSuggestion(suggestion), ["prevent"])
+							}, {
+								default: withCtx(() => [renderSlot(_ctx.$slots, "suggestion", { suggestion }, () => [createTextVNode(toDisplayString(suggestionLabel(suggestion)), 1)])]),
+								_: 2
+							}, 1032, [
+								"value",
+								"data-suggestion-index",
+								"aria-label",
+								"class",
+								"onSelect"
+							]);
+						}), 128))]),
+						_: 3
+					}, 8, ["style", "class"])) : createCommentVNode("", true)]),
+					_: 3
+				}))]),
+				_: 3
+			}, 8, [
+				"open",
+				"disabled",
+				"open-on-focus",
+				"open-on-click",
+				"class"
+			]);
+		};
+	}
+});
+export { SearchAutocomplete_default as default };

package/dist/search-input/SearchInput.vue.d.ts

@@ -0,0 +1,46 @@
+import { HTMLAttributes } from 'vue';
+import { SearchInputVariants } from './searchInput.variants';
+type __VLS_Props = {
+    placeholder?: string;
+    accessibleLabel: string;
+    clearLabel: string;
+    icon?: string;
+    debounceTime?: number;
+    autofocus?: boolean;
+    loading?: boolean;
+    invalid?: boolean;
+    disabled?: boolean;
+    size?: SearchInputVariants['size'];
+    class?: HTMLAttributes['class'];
+};
+declare function focus(): void;
+type __VLS_ModelProps = {
+    modelValue: string;
+};
+type __VLS_PublicProps = __VLS_Props & __VLS_ModelProps;
+declare var __VLS_16: {
+    iconClass: "size-3" | "size-4";
+    positionClass: "left-2" | "left-3" | "left-2.5";
+};
+type __VLS_Slots = {} & {
+    trailing?: (props: typeof __VLS_16) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_PublicProps, {
+    focus: typeof focus;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    blur: () => any;
+    search: (value: string) => any;
+    "update:modelValue": (value: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    onBlur?: (() => any) | undefined;
+    onSearch?: ((value: string) => any) | undefined;
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};