Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(icon): add type support for local SVG collection #360

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

CRBroughton
Copy link

@CRBroughton CRBroughton commented Feb 19, 2025

πŸ”— 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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Type safe local icon support
1 participant