[CSidebarNavItem] Icon props are not passed to CIcon

[CVeniamin]

I am trying to adjust the size of icon in the CSidebarNavItem by passing icon as an object, such as

<CSidebarNavItem 
  name="Dashboard" 
   to="/dashboard" 
   :icon="{name: 'cil-chart', size: '4xl'}"
/>

however the size prop is not passed to CIcon.
However, creating a CIcon with the size prop works just fine

<CIcon name="cil-chart" size="4xl"/>

After searching through the code I saw that CIconRaw is imported instead of CIcon

coreui-vue/src/components/template/CSidebarNavDropdown.vue

Line 19 in ad9f36c

import CIcon from '@coreui/icons-vue/src/CIconRaw.vue'

Could it be that importing CIconRaw instead of CIcon is to blame here?

[woothu]

Hi, thank you for the report!

in fact, it doesn't work because 'customClasses' is set to 'c-sidebar-nav-icon' inside CSidebarNavItem overriding size prop in CIcon.

Hotfix:

<CSidebarNavItem 
  name="Dashboard" 
   to="/dashboard" 
   :icon="{name: 'cil-chart', customClasses: 'c-sidebar-nav-icon c-icon c-icon-4xl'}"
/>

We will think of a better solution, and fixing documentation of CIcon (it doesn't say that using customClasses overrides size prop).

[CVeniamin]

@woothu, thank you for the hotfix!