diff --git a/src/module.ts b/src/module.ts index dee96ec3..0c65d044 100644 --- a/src/module.ts +++ b/src/module.ts @@ -30,11 +30,12 @@ export default defineNuxtModule({ description: 'Configure the defaults of Nuxt Icon' }, size: { - $default: '', + $default: '1em', $schema: { title: 'Icon Size', - description: 'Set the default icon size', + description: 'Set the default icon size. Set to false to disable the sizing of icon in style.', tags: ['@studioIcon material-symbols:format-size-rounded'], + tsType: 'string | false' }, }, class: { diff --git a/src/runtime/Icon.vue b/src/runtime/Icon.vue index fb9d46bb..e7be3fc8 100644 --- a/src/runtime/Icon.vue +++ b/src/runtime/Icon.vue @@ -29,6 +29,10 @@ const iconName = computed(() => ((appConfig as any)?.nuxtIcon?.aliases || {})[pr const icon = computed(() => state.value?.[iconName.value]) const component = computed(() => nuxtApp.vueApp.component(iconName.value)) const sSize = computed(() => { + // Disable size if appConfig.nuxtIcon.size === false + if (!props.size && typeof appConfig.nuxtIcon?.size === 'boolean' && !appConfig.nuxtIcon?.size) { + return undefined + } const size = props.size || appConfig.nuxtIcon?.size || '1em' if (String(Number(size)) === size) { return `${size}px` diff --git a/src/runtime/IconCSS.vue b/src/runtime/IconCSS.vue index f5b01384..16a24640 100644 --- a/src/runtime/IconCSS.vue +++ b/src/runtime/IconCSS.vue @@ -21,6 +21,10 @@ const props = defineProps({ const iconName = computed(() => ((appConfig as any)?.nuxtIcon?.aliases || {})[props.name] || props.name) const iconUrl = computed(() => `url('https://api.iconify.design/${iconName.value.replace(':', '/')}.svg')`) const sSize = computed(() => { + // Disable size if appConfig.nuxtIcon.size === false + if (!props.size && typeof appConfig.nuxtIcon?.size === 'boolean' && !appConfig.nuxtIcon?.size) { + return undefined + } const size = props.size || appConfig.nuxtIcon?.size || '1em' if (String(Number(size)) === size) { return `${size}px`