diff --git a/docs/vue.md b/docs/vue.md
index d1eba0c..0a3e838 100644
--- a/docs/vue.md
+++ b/docs/vue.md
@@ -108,7 +108,7 @@
 npm run build:example:vue
 ```
 
-The example uses a Vite alias for `vue` because `gnexus-ui-kit` is linked as a local file dependency. Published package consumers do not need that alias if `vue` is installed in the host project.
+The example uses a Vite alias for `vue` because `gnexus-ui-kit` is linked as a local file dependency. Published package consumers do not need that alias if `vue` is installed in the host project. The example build clears `node_modules/.vite` before `vite build` so Vite does not reuse stale linked-package cache after `dist/vue` changes.
 
 `kit.css` currently references fonts through absolute `/assets/...` URLs. Vite may warn that those URLs are left for runtime resolution; host apps must serve `dist/assets` at `/assets` or adjust their asset pipeline accordingly.
 
diff --git a/docs/vue/ai-usage-guide.md b/docs/vue/ai-usage-guide.md
index 32e515e..c048775 100644
--- a/docs/vue/ai-usage-guide.md
+++ b/docs/vue/ai-usage-guide.md
@@ -44,6 +44,10 @@
 - multiline field: `GnTextarea`
 - select field: `GnSelect`
 - boolean control: `GnCheckbox` or `GnSwitch`
+- radio choice: `GnRadio` or `GnRadioGroup`
+- range slider: `GnRange`
+- file upload: `GnFileUpload`
+- searchable option input: `GnCombobox`
 - view switcher: `GnTabs`
 - disclosure group: `GnAccordion`
 - dialog: `GnModal`
@@ -75,6 +79,8 @@
 - Do not call `GNexusUIKit.Modals.create()` from Vue components.
 - Do not call `GNexusUIKit.Overlays.init()` or `GNexusUIKit.NavigationShell.init()` in Vue projects.
 - Do not run `Accordion.init()` or `Tabs.init()` inside Vue components.
+- Do not use the legacy `advancedSelect()` helper in Vue; use `GnCombobox`.
+- Do not use `InputPatterns.init()` for Vue file upload previews; use `GnFileUpload`.
 - Do not invent new variant names.
 - Do not duplicate GNexus CSS in Vue component scoped styles.
 - Do not bundle Vue into the UI-kit adapter.
@@ -104,3 +110,5 @@
 ```
 
 Warnings about `/assets/fonts/...` in Vite builds are expected with the current CSS contract. They mean the host app must serve GNexus UI Kit assets at `/assets`.
+
+The local example clears `examples/vue/node_modules/.vite` before build because `gnexus-ui-kit` is linked from the repository root and Vite can otherwise reuse stale optimized metadata after `dist/vue` changes.
diff --git a/docs/vue/component-map.md b/docs/vue/component-map.md
index 5a7440f..792a267 100644
--- a/docs/vue/component-map.md
+++ b/docs/vue/component-map.md
@@ -15,6 +15,11 @@
 | `GnSelect` | `.select-wrap`, `.input.select` | `v-model`, options prop or option slot. |
 | `GnCheckbox` | `.checkbox` | `v-model` boolean. |
 | `GnSwitch` | `.checkbox` | Alias for current switch-like checkbox styling. |
+| `GnRadio` | `.radio` | Single radio option. |
+| `GnRadioGroup` | `.radio` | Controlled radio group. |
+| `GnRange` | `.range` | Controlled range slider. |
+| `GnFileUpload` | `.file-upload-panel` | Vue-native file picker with preview. |
+| `GnCombobox` | `.advanced-select` | Vue-native advanced select/combobox. |
 | `GnTabs` | `.tabs`, `.tabs-list`, `.tab-panel` | Vue-native state through `v-model`. |
 | `GnAccordion` | `.accordion` | Vue-native open state. |
 | `GnModal` | `.modal` | Vue-native `v-model:open`; teleports to body. |
diff --git a/examples/vue/package.json b/examples/vue/package.json
index 63b241a..1a3ff23 100644
--- a/examples/vue/package.json
+++ b/examples/vue/package.json
@@ -4,7 +4,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite --host 0.0.0.0",
-    "build": "vite build"
+    "build": "node -e \"require('fs').rmSync('node_modules/.vite',{recursive:true,force:true})\" && vite build"
   },
   "dependencies": {
     "@vitejs/plugin-vue": "^5.2.0",
diff --git a/examples/vue/src/main.js b/examples/vue/src/main.js
index 0b26c64..707883d 100644
--- a/examples/vue/src/main.js
+++ b/examples/vue/src/main.js
@@ -8,14 +8,18 @@
 	GnBadge,
 	GnChip,
 	GnChipGroup,
+	GnCombobox,
 	GnDescriptionList,
 	GnDropdown,
 	GnEmptyState,
+	GnFileUpload,
 	GnInput,
 	GnModal,
 	GnPopover,
 	GnPageHeader,
 	GnProgress,
+	GnRadioGroup,
+	GnRange,
 	GnSearchField,
 	GnTabs,
 	GnTooltip,
@@ -32,14 +36,18 @@
 		GnBadge,
 		GnChip,
 		GnChipGroup,
+		GnCombobox,
 		GnDescriptionList,
 		GnDropdown,
 		GnEmptyState,
+		GnFileUpload,
 		GnInput,
 		GnModal,
 		GnPopover,
 		GnPageHeader,
 		GnProgress,
+		GnRadioGroup,
+		GnRange,
 		GnSearchField,
 		GnTabs,
 		GnTooltip,
@@ -49,6 +57,10 @@
 		const modalOpen = ref(false);
 		const name = ref("Launch Plan");
 		const query = ref("");
+		const mode = ref("auto");
+		const rollout = ref(72);
+		const assignee = ref("");
+		const files = ref([]);
 		const toast = useToast();
 
 		const tabs = [
@@ -69,6 +81,17 @@
 			{ label: "Duplicate", icon: "ph-copy" },
 			{ label: "Delete", icon: "ph-trash", danger: true }
 		];
+		const modes = [
+			{ label: "Auto", value: "auto" },
+			{ label: "Manual", value: "manual" },
+			{ label: "Locked", value: "locked", disabled: true }
+		];
+		const people = [
+			{ label: "Joe", value: "joe" },
+			{ label: "James", value: "james" },
+			{ label: "Eliza", value: "eliza" },
+			{ label: "Emily", value: "emily" }
+		];
 
 		const save = () => {
 			toast.success({ title: "Saved", text: `${name.value} updated` });
@@ -79,10 +102,16 @@
 			activeTab,
 			activity,
 			details,
+			files,
+			mode,
 			menuItems,
 			modalOpen,
 			name,
+			assignee,
+			people,
 			query,
+			rollout,
+			modes,
 			tabs,
 			save
 		};
@@ -120,7 +149,7 @@
 					<template #overview>
 						<GnDescriptionList :items="details" />
 						<div class="mt-4">
-							<GnProgress label="Rollout" :value="72" animated />
+							<GnProgress label="Rollout" :value="Number(rollout)" animated />
 						</div>
 						<div class="mt-4">
 							<GnChipGroup>
@@ -141,6 +170,18 @@
 			</section>
 
 			<section class="section">
+				<div class="form-grid">
+					<GnRadioGroup v-model="mode" label="Mode" :options="modes" />
+					<GnRange v-model="rollout" label="Rollout" />
+					<GnCombobox v-model="assignee" label="Assignee" icon="ph-user" :options="people" />
+				</div>
+			</section>
+
+			<section class="section">
+				<GnFileUpload v-model="files" badge="Max 12 MB" />
+			</section>
+
+			<section class="section">
 				<GnEmptyState title="No blocking issues" text="Vue adapter components keep project markup consistent.">
 					<template #actions>
 						<GnAvatar initials="GN" status="online" />
diff --git a/src/vue/components/GnCombobox.js b/src/vue/components/GnCombobox.js
new file mode 100644
index 0000000..7c21ef0
--- /dev/null
+++ b/src/vue/components/GnCombobox.js
@@ -0,0 +1,113 @@
+import { computed, defineComponent, h, nextTick, ref } from "vue";
+import { cx, eventValue, iconNode } from "../utils.js";
+
+export default defineComponent({
+	name: "GnCombobox",
+	inheritAttrs: false,
+	props: {
+		modelValue: { type: [String, Number], default: "" },
+		label: { type: String, default: "" },
+		icon: { type: String, default: "" },
+		options: { type: Array, default: () => [] },
+		placeholder: { type: String, default: "Search" },
+		notFoundText: { type: String, default: "Nothing found" },
+		state: { type: String, default: "" },
+		help: { type: String, default: "" }
+	},
+	emits: ["update:modelValue", "select"],
+	setup(props, { attrs, emit }) {
+		const open = ref(false);
+		const focused = ref(-1);
+		const inputRef = ref(null);
+		const normalized = computed(() => props.options.map(option => typeof option === "object" ? option : {
+			value: option,
+			label: option
+		}));
+		const query = computed(() => String(props.modelValue ?? "").toLowerCase());
+		const filtered = computed(() => normalized.value.filter(option => String(option.label).toLowerCase().includes(query.value)));
+		const select = option => {
+			if(!option) {
+				return;
+			}
+
+			emit("update:modelValue", option.label);
+			emit("select", option);
+			open.value = false;
+			focused.value = -1;
+		};
+		const move = direction => {
+			if(!filtered.value.length) {
+				return;
+			}
+
+			open.value = true;
+			focused.value = (focused.value + direction + filtered.value.length) % filtered.value.length;
+			nextTick(() => {
+				const container = inputRef.value?.closest(".form-group")?.querySelector(".advanced-select");
+				container?.querySelector(".option.focus")?.scrollIntoView({ block: "nearest" });
+			});
+		};
+		const onKeydown = event => {
+			if(event.key === "ArrowDown") {
+				event.preventDefault();
+				move(1);
+			} else if(event.key === "ArrowUp") {
+				event.preventDefault();
+				move(-1);
+			} else if(event.key === "Enter") {
+				event.preventDefault();
+				select(filtered.value[focused.value]);
+			} else if(event.key === "Escape") {
+				open.value = false;
+				focused.value = -1;
+			}
+		};
+
+		return () => h("div", { class: "form-group" }, [
+			h("label", { class: cx("label", props.state) }, [
+				props.label,
+				iconNode(props.icon),
+				h("input", {
+					...attrs,
+					ref: inputRef,
+					type: "text",
+					value: props.modelValue,
+					placeholder: props.placeholder,
+					autocomplete: "off",
+					class: cx("input", attrs.class),
+					onFocus: () => {
+						open.value = true;
+					},
+					onBlur: () => {
+						setTimeout(() => {
+							open.value = false;
+						}, 120);
+					},
+					onInput: event => {
+						focused.value = -1;
+						open.value = true;
+						emit("update:modelValue", eventValue(event));
+					},
+					onKeydown
+				})
+			]),
+			h("div", { class: "advanced-select-container" }, [
+				h("div", { class: cx("advanced-select", { "a-show": open.value }) }, [
+					h("div", { class: "popup-options-container" }, [
+						h("div", { class: cx("not-found", { show: !filtered.value.length }) }, props.notFoundText),
+						h("div", { class: cx("options", { show: filtered.value.length }) }, filtered.value.map((option, index) => h("div", {
+							class: cx("option", { focus: index === focused.value }),
+							"data-value": option.value,
+							"data-display-value": option.label,
+							onMousedown: event => {
+								event.preventDefault();
+								select(option);
+							}
+						}, option.label)))
+					])
+				])
+			]),
+			props.help && h("div", { class: cx("input-info", props.state === "error" && "error") }, props.help)
+		]);
+	}
+});
diff --git a/src/vue/components/GnFileUpload.js b/src/vue/components/GnFileUpload.js
new file mode 100644
index 0000000..359eb39
--- /dev/null
+++ b/src/vue/components/GnFileUpload.js
@@ -0,0 +1,110 @@
+import { defineComponent, h, ref } from "vue";
+import { iconNode } from "../utils.js";
+import GnButton from "./GnButton.js";
+import GnBadge from "./GnBadge.js";
+
+function fileType(file) {
+	const ext = file.name.split(".").pop();
+	return ext ? ext.slice(0, 6).toUpperCase() : "FILE";
+}
+
+function fileSize(file) {
+	if(!file.size) {
+		return "0 B";
+	}
+
+	const units = ["B", "KB", "MB", "GB"];
+	const index = Math.min(Math.floor(Math.log(file.size) / Math.log(1024)), units.length - 1);
+	const value = file.size / Math.pow(1024, index);
+	return `${value.toFixed(value >= 10 || index === 0 ? 0 : 1)} ${units[index]}`;
+}
+
+export default defineComponent({
+	name: "GnFileUpload",
+	props: {
+		modelValue: { type: Array, default: () => [] },
+		title: { type: String, default: "Upload files" },
+		description: { type: String, default: "Attach documents, archives or images." },
+		primary: { type: String, default: "Choose files" },
+		secondary: { type: String, default: "Images get thumbnails, other files show their type" },
+		badge: { type: String, default: "" },
+		multiple: { type: Boolean, default: true },
+		accept: { type: String, default: "" }
+	},
+	emits: ["update:modelValue", "change"],
+	setup(props, { emit, slots }) {
+		const urls = ref(new Map());
+		const setFiles = fileList => {
+			const files = Array.from(fileList || []);
+			emit("update:modelValue", files);
+			emit("change", files);
+		};
+		const remove = index => {
+			const files = props.modelValue.filter((_, itemIndex) => itemIndex !== index);
+			emit("update:modelValue", files);
+			emit("change", files);
+		};
+		const previewUrl = file => {
+			if(!file.type?.startsWith("image/")) {
+				return "";
+			}
+
+			if(!urls.value.has(file)) {
+				urls.value.set(file, URL.createObjectURL(file));
+			}
+
+			return urls.value.get(file);
+		};
+
+		return () => h("div", { class: "file-upload-panel" }, [
+			h("div", { class: "file-upload-form" }, [
+				h("div", { class: "file-upload-header" }, [
+					h("div", { class: "file-upload-heading" }, [
+						h("h3", { class: "file-upload-title" }, slots.title?.() || props.title),
+						h("p", { class: "file-upload-description" }, slots.description?.() || props.description)
+					]),
+					props.badge && h(GnBadge, { variant: "info" }, () => props.badge)
+				]),
+				h("label", { class: "file-upload-dropzone" }, [
+					h("span", { class: "file-upload-icon", "aria-hidden": "true" }, [iconNode("ph-cloud-arrow-up")]),
+					h("span", { class: "file-upload-body" }, [
+						h("span", { class: "file-upload-primary" }, props.primary),
+						h("span", { class: "file-upload-secondary" }, props.secondary)
+					]),
+					h("input", {
+						type: "file",
+						multiple: props.multiple,
+						accept: props.accept || undefined,
+						onChange: event => setFiles(event.target.files)
+					})
+				]),
+				h("div", { class: "file-upload-preview", hidden: !props.modelValue.length }, props.modelValue.map((file, index) => h("figure", {
+					class: "file-upload-preview-item"
+				}, [
+					h("button", {
+						class: "file-upload-preview-remove",
+						type: "button",
+						"aria-label": `Remove ${file.name}`,
+						onClick: () => remove(index)
+					}, [iconNode("ph-x")]),
+					h("div", { class: "file-upload-preview-visual" }, previewUrl(file)
+						? h("img", { src: previewUrl(file), alt: "" })
+						: h("span", { class: "file-upload-preview-type" }, fileType(file))
+					),
+					h("figcaption", {}, [
+						h("span", { class: "file-upload-preview-name" }, file.name),
+						h("span", { class: "file-upload-preview-meta" }, `${fileType(file)} / ${fileSize(file)}`)
+					])
+				]))),
+				slots.actions && h("div", { class: "file-upload-actions" }, slots.actions()),
+				!slots.actions && props.modelValue.length > 0 && h("div", { class: "file-upload-actions" }, [
+					h(GnButton, {
+						variant: "secondary",
+						size: "sm",
+						onClick: () => setFiles([])
+					}, () => "Reset")
+				])
+			])
+		]);
+	}
+});
diff --git a/src/vue/components/GnRadio.js b/src/vue/components/GnRadio.js
new file mode 100644
index 0000000..74af983
--- /dev/null
+++ b/src/vue/components/GnRadio.js
@@ -0,0 +1,30 @@
+import { defineComponent, h } from "vue";
+import { cx } from "../utils.js";
+
+export default defineComponent({
+	name: "GnRadio",
+	inheritAttrs: false,
+	props: {
+		modelValue: { type: [String, Number, Boolean], default: "" },
+		value: { type: [String, Number, Boolean], required: true },
+		label: { type: String, default: "" },
+		name: { type: String, default: "" },
+		disabled: { type: Boolean, default: false }
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit, slots }) {
+		return () => h("label", { class: cx("radio", attrs.class) }, [
+			h("input", {
+				...attrs,
+				type: "radio",
+				name: props.name,
+				value: props.value,
+				checked: props.modelValue === props.value,
+				disabled: props.disabled,
+				onChange: () => emit("update:modelValue", props.value)
+			}),
+			h("span", { class: "radio-control", "aria-hidden": "true" }),
+			h("span", { class: "radio-label" }, slots.default?.() || props.label)
+		]);
+	}
+});
diff --git a/src/vue/components/GnRadioGroup.js b/src/vue/components/GnRadioGroup.js
new file mode 100644
index 0000000..68864bf
--- /dev/null
+++ b/src/vue/components/GnRadioGroup.js
@@ -0,0 +1,26 @@
+import { defineComponent, h } from "vue";
+import GnRadio from "./GnRadio.js";
+
+export default defineComponent({
+	name: "GnRadioGroup",
+	props: {
+		modelValue: { type: [String, Number, Boolean], default: "" },
+		name: { type: String, default: "gn-radio-group" },
+		label: { type: String, default: "" },
+		options: { type: Array, default: () => [] }
+	},
+	emits: ["update:modelValue"],
+	setup(props, { emit, slots }) {
+		return () => h("div", { class: "form-group", role: "radiogroup", "aria-label": props.label || undefined }, [
+			props.label && h("div", { class: "label" }, props.label),
+			slots.default?.() || props.options.map(option => h(GnRadio, {
+				modelValue: props.modelValue,
+				"onUpdate:modelValue": value => emit("update:modelValue", value),
+				name: props.name,
+				value: option.value,
+				label: option.label,
+				disabled: option.disabled
+			}))
+		]);
+	}
+});
diff --git a/src/vue/components/GnRange.js b/src/vue/components/GnRange.js
new file mode 100644
index 0000000..85a5a95
--- /dev/null
+++ b/src/vue/components/GnRange.js
@@ -0,0 +1,31 @@
+import { defineComponent, h } from "vue";
+import { eventValue } from "../utils.js";
+
+export default defineComponent({
+	name: "GnRange",
+	inheritAttrs: false,
+	props: {
+		modelValue: { type: [Number, String], default: 0 },
+		label: { type: String, default: "" },
+		min: { type: [Number, String], default: 0 },
+		max: { type: [Number, String], default: 100 },
+		step: { type: [Number, String], default: 1 }
+	},
+	emits: ["update:modelValue"],
+	setup(props, { attrs, emit }) {
+		return () => h("div", { class: "range" }, [
+			h("label", { class: "label" }, [
+				props.label,
+				h("input", {
+					...attrs,
+					type: "range",
+					value: props.modelValue,
+					min: props.min,
+					max: props.max,
+					step: props.step,
+					onInput: event => emit("update:modelValue", eventValue(event))
+				})
+			])
+		]);
+	}
+});
diff --git a/src/vue/index.js b/src/vue/index.js
index 14b1f2d..2e872f9 100644
--- a/src/vue/index.js
+++ b/src/vue/index.js
@@ -9,11 +9,13 @@
 export { default as GnCheckbox } from "./components/GnCheckbox.js";
 export { default as GnChip } from "./components/GnChip.js";
 export { default as GnChipGroup } from "./components/GnChipGroup.js";
+export { default as GnCombobox } from "./components/GnCombobox.js";
 export { default as GnConfirmDialog } from "./components/GnConfirmDialog.js";
 export { default as GnDescriptionList } from "./components/GnDescriptionList.js";
 export { default as GnDropdown } from "./components/GnDropdown.js";
 export { default as GnDrawer } from "./components/GnDrawer.js";
 export { default as GnEmptyState } from "./components/GnEmptyState.js";
+export { default as GnFileUpload } from "./components/GnFileUpload.js";
 export { default as GnIconButton } from "./components/GnIconButton.js";
 export { default as GnIdentity } from "./components/GnIdentity.js";
 export { default as GnInput } from "./components/GnInput.js";
@@ -25,6 +27,9 @@
 export { default as GnPagination } from "./components/GnPagination.js";
 export { default as GnPopover } from "./components/GnPopover.js";
 export { default as GnProgress } from "./components/GnProgress.js";
+export { default as GnRadio } from "./components/GnRadio.js";
+export { default as GnRadioGroup } from "./components/GnRadioGroup.js";
+export { default as GnRange } from "./components/GnRange.js";
 export { default as GnSearchField } from "./components/GnSearchField.js";
 export { default as GnSelect } from "./components/GnSelect.js";
 export { default as GnSkeleton } from "./components/GnSkeleton.js";
diff --git a/src/vue/plugin.js b/src/vue/plugin.js
index 2424c9e..5aa61c1 100644
--- a/src/vue/plugin.js
+++ b/src/vue/plugin.js
@@ -9,11 +9,13 @@
 import GnCheckbox from "./components/GnCheckbox.js";
 import GnChip from "./components/GnChip.js";
 import GnChipGroup from "./components/GnChipGroup.js";
+import GnCombobox from "./components/GnCombobox.js";
 import GnConfirmDialog from "./components/GnConfirmDialog.js";
 import GnDescriptionList from "./components/GnDescriptionList.js";
 import GnDropdown from "./components/GnDropdown.js";
 import GnDrawer from "./components/GnDrawer.js";
 import GnEmptyState from "./components/GnEmptyState.js";
+import GnFileUpload from "./components/GnFileUpload.js";
 import GnIconButton from "./components/GnIconButton.js";
 import GnIdentity from "./components/GnIdentity.js";
 import GnInput from "./components/GnInput.js";
@@ -25,6 +27,9 @@
 import GnPagination from "./components/GnPagination.js";
 import GnPopover from "./components/GnPopover.js";
 import GnProgress from "./components/GnProgress.js";
+import GnRadio from "./components/GnRadio.js";
+import GnRadioGroup from "./components/GnRadioGroup.js";
+import GnRange from "./components/GnRange.js";
 import GnSearchField from "./components/GnSearchField.js";
 import GnSelect from "./components/GnSelect.js";
 import GnSkeleton from "./components/GnSkeleton.js";
@@ -50,11 +55,13 @@
 	GnCheckbox,
 	GnChip,
 	GnChipGroup,
+	GnCombobox,
 	GnConfirmDialog,
 	GnDescriptionList,
 	GnDropdown,
 	GnDrawer,
 	GnEmptyState,
+	GnFileUpload,
 	GnIconButton,
 	GnIdentity,
 	GnInput,
@@ -66,6 +73,9 @@
 	GnPagination,
 	GnPopover,
 	GnProgress,
+	GnRadio,
+	GnRadioGroup,
+	GnRange,
 	GnSearchField,
 	GnSelect,
 	GnSkeleton,