Type 'string' is not assignable to type 'ComponentProps'

[mrleblanc101]

Version

@nuxtjs/color-mode: 3.2.0 nuxt: 3.0.0

Reproduction Link

Steps to reproduce

<ColorScheme placeholder="...">
    <ISun class="h-5" v-if="colorMode.preference === 'dark'" />
    <IMoon class="h-5" v-else-if="colorMode.preference === 'light'" />
    <IComputer class="h-5" v-else />
</ColorScheme>

What is Expected?

There should be no type error.

What is actually happening?

I get this error.

Type '{ placeholder: String; }' is not assignable to type 'ComponentProps<{ name: any; props: { placeholder: StringConstructor; tag: { type: StringConstructor; default: string; }; }; }>'. Type '{ placeholder: String; }' is missing the following properties from type '{ name: any; props: { placeholder: StringConstructor; tag: { type: StringConstructor; default: string; }; }; }': name, props

[mrleblanc101]

Probably related to: https://github.com/nuxt-modules/color-mode/issues/168

[vctrtvfrrr]

Same problem here.

[mrleblanc101]

@kwiat1990 Did you actually read the documentation ?

[kwiat1990]

Yeah, I have but I thought it should work a bit different than it is actually does because of an odd rendering issue while combining color mode with another Nuxt module for icons. For some reason text or any custom components were correctly rendered and updated based on color preference/color unknown property but it didn't work with icon component, so that rendering different icons with v-if/v-else based on $colorMode.unknown condition didn't worked. I guess it must be a problem with icon modules or in general with rendering of SVG elements.

[danielroe]

Do you still experience this? This is not reproducible for me.

Let me know if so and I'll happily reopen.