🔗 Linked issue

resolves #359

❓ Type of change

• 👌 Enhancement (improving an existing functionality)

📚 Description

This PR enhances the existing custom SVG collections feature by adding TypeScript type generation. Currently, when using custom SVG collections, developers don't get type safety or autocompletion for their icon names. This PR adds automatic type generation that creates TypeScript definitions for all SVGs in custom collections.

Current Behavior

<Icon name="custom:my-icon" /> // No type checking or autocompletion

New Behavior

<Icon name="custom:my-icon" /> // TypeScript enforces valid icon names and provides autocompletion

Example configuration:

// nuxt.config.ts
export default defineNuxtConfig({
  icon: {
    generateLocalSVGTypes: true, // Enable type generation (default: false)
    customCollections: {
      'my-icons': {
        prefix: 'navbar',
        dir: './assets/navbar'
      }
    }
  }
})

I've tested this with the included SVGs in the repository. Please let me know if you'd like me to make any adjustments; The only downside I can see right now is that if you have both local and non-local collections in use, you can't make use of the feature; There might be a way for us to widen the type if both local collections and other collections are in use at the same time.

Edit: Just reading through my own PR again; I think renaming the 'generateTypes' key to something like 'generateLocalSVGTypes' might be better for the user, as it's only going to work with local types, and the existing name might be misleading or confusing. Can change this tomorrow though if there's agreement.

Edit II: Changed the name to generateLocalSVGTypes