Can't use "type" and "color" in defineProps typescript

[hasan-almujtaba]

Link to minimal reproduction

https://sfc.vuejs.org/#eyJBcHAudnVlIjoiPHNjcmlwdCBzZXR1cCBsYW5nPVwidHNcIj5cbmltcG9ydCB7IHJlZiB9IGZyb20gJ3Z1ZSdcbmltcG9ydCBYQnV0dG9uIGZyb20gJy4vWEJ1dHRvbi52dWUnXG5cbmNvbnN0IG1zZyA9IHJlZignSGVsbG8gV29ybGQhJylcbjwvc2NyaXB0PlxuXG48dGVtcGxhdGU+XG4gIDxYQnV0dG9uIHZhcmlhbnQ9XCJmaWxsZWRcIj5cbiAgXHRoZWxsb1xuICA8L1hCdXR0b24+XG48L3RlbXBsYXRlPiIsImltcG9ydC1tYXAuanNvbiI6IntcbiAgXCJpbXBvcnRzXCI6IHtcbiAgICBcInZ1ZVwiOiBcImh0dHBzOi8vc2ZjLnZ1ZWpzLm9yZy92dWUucnVudGltZS5lc20tYnJvd3Nlci5qc1wiXG4gIH1cbn0iLCJYQnV0dG9uLnZ1ZSI6IjxzY3JpcHQgbGFuZz1cInRzXCIgc2V0dXA+XG5pbXBvcnQgeyBjb21wdXRlZCB9IGZyb20gJ3Z1ZSdcblxuY29uc3QgcHJvcHMgPSBkZWZpbmVQcm9wczx7XG4gIHZhcmlhbnQ6ICdmaWxsZWQnIHwgJ291dGxpbmVkJyB8ICd0ZXh0J1xuICBjb2xvcj86ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknIHwgJ3RlcnRpYXJ5JyB8ICdlcnJvcidcbn0+KClcblxuY29uc3QgdHlwZSA9IGNvbXB1dGVkKCgpID0+IHtcbiAgaWYgKHByb3BzLnZhcmlhbnQgPT09ICdvdXRsaW5lZCcpIHJldHVybiAnbi11aS1idXR0b24tb3V0bGluZWQnXG4gIGlmIChwcm9wcy52YXJpYW50ID09PSAndGV4dCcpIHJldHVybiAnbi11aS1idXR0b24tdGV4dCdcblxuICByZXR1cm4gJ24tdWktYnV0dG9uLWZpbGxlZCdcbn0pXG5cbmNvbnN0IGNvbG9yID0gY29tcHV0ZWQoKCkgPT4ge1xuICBpZiAocHJvcHMuY29sb3IgPT09ICdzZWNvbmRhcnknKSByZXR1cm4gJ24tdWktYnV0dG9uLXNlY29uZGFyeSdcbiAgaWYgKHByb3BzLmNvbG9yID09PSAndGVydGlhcnknKSByZXR1cm4gJ24tdWktYnV0dG9uLXRlcnRpYXJ5J1xuICBpZiAocHJvcHMuY29sb3IgPT09ICdlcnJvcicpIHJldHVybiAnbi11aS1idXR0b24tZXJyb3InXG5cbiAgcmV0dXJuICduLXVpLWJ1dHRvbi1wcmltYXJ5J1xufSlcblxuY29uc3QgY2xhc3NlcyA9IGNvbXB1dGVkKCgpID0+IGBuLXVpLWJ1dHRvbiAke3R5cGUudmFsdWV9ICR7Y29sb3IudmFsdWV9YClcbjwvc2NyaXB0PlxuXG48dGVtcGxhdGU+XG4gIDxidXR0b24gOmNsYXNzPVwiY2xhc3Nlc1wiPlxuICAgIDxzbG90IC8+XG4gIDwvYnV0dG9uPlxuPC90ZW1wbGF0ZT5cbiJ9

Steps to reproduce

• Create vue app using yarn create vite
• Create component with interface props using "type" and "color"

What is expected?

No ts error appeared

What is actually happening?

TS error :

Property 'classes' does not exist on type 'never'.
  The intersection '{ $: ComponentInternalInstance; $data: {}; $props: Partial<{}> & Omit<Readonly<ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{ variant: "filled" | "outlined" | "text"; color?: "primary" | "secondary" | "tertiary" | "error" | undefined; }>>> & VNodeProps & AllowedComponentProps & ComponentCustomProps, never>; ... 10...' was reduced to 'never' because property 'color' has conflicting types in some constituents.ts(2339)

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-11370H @ 3.30GHz
    Memory: 5.18 GB / 15.69 GB
  Binaries:
    Node: 16.14.2 - C:\laragon\bin\nodejs\node-v16\node.EXE
    Yarn: 1.22.15 - C:\laragon\bin\nodejs\node-v16\yarn.CMD
    npm: 8.5.0 - C:\laragon\bin\nodejs\node-v16\npm.CMD
  Browsers:
    Edge: Spartan (44.22000.120.0), Chromium (101.0.1210.39)
    Internet Explorer: 11.0.22000.120
  npmPackages:
    vue: ^3.2.25 => 3.2.33

Any additional comments?

If i change the props interface for other name like 'variant' or 'tone' it's work as usually

Other Info

package.json

{
  "name": "nui-testing",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc --noEmit && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "vue": "^3.2.25"
  },
  "devDependencies": {
    "@typescript-eslint/parser": "^5.23.0",
    "@vitejs/plugin-vue": "^2.3.3",
    "eslint": "^8.15.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-vue": "^8.7.1",
    "sass": "^1.51.0",
    "typescript": "^4.5.4",
    "vite": "^2.9.9",
    "vue-eslint-parser": "^9.0.1",
    "vue-tsc": "^0.34.7"
  }
}

tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "skipLibCheck": true,
    "declaration": true,
    "outDir": "dist"
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

[liulinboyi]

The props doc link.

type: Can be one of the following native constructors: String, Number, Boolean, Array, Object, Date, Function, Symbol, any custom constructor function or an array of those. In development mode, Vue will check if a prop's value matches the declared type, and will throw a warning if it doesn't. See Prop Validation for more details.

example

[LinusBorg]

This seems to be a duplicate of #5885 - first-level variables that have the same name as a prop lead to them having type never.