feat: uniformize components sizes (#68)

src/runtime/components/Accordion.vue

@@ -63,7 +63,7 @@ const ui = computed(() => tv({ extend: accordion, slots: props.ui })({ disabled:
   <AccordionRoot v-bind="rootProps" :class="ui.root({ class: props.class })">
     <AccordionItem v-for="(item, index) in items" :key="index" :value="item.value || String(index)" :disabled="item.disabled" :class="ui.item()">
       <AccordionHeader :class="ui.header()">
-        <AccordionTrigger :class="ui.trigger()">
+        <AccordionTrigger :class="ui.trigger({ disabled: item.disabled })">
           <slot name="leading" :item="item" :index="index">
             <UIcon v-if="item.icon" :name="item.icon" :class="ui.leadingIcon()" />
           </slot>

src/runtime/components/Alert.vue

@@ -93,7 +93,7 @@ const ui = computed(() => tv({ extend: alert, slots: props.ui })({
       <UButton
         v-if="close"
         :icon="appConfig.ui.icons.close"
-        size="sm"
+        size="md"
         color="gray"
         variant="link"
         aria-label="Close"

src/runtime/components/DropdownMenuContent.vue

@@ -54,7 +54,7 @@ const groups = computed(() => props.items?.length ? (Array.isArray(props.items[0
       <slot name="trailing" :item="item" :active="active">
         <UIcon v-if="item.children?.length" :name="appConfig.ui.icons.chevronRight" :class="ui.itemTrailingIcon()" />
         <span v-else-if="item.shortcuts?.length" :class="ui.itemTrailingShortcuts()">
-          <UKbd v-for="(shortcut, shortcutIndex) in item.shortcuts" :key="shortcutIndex" size="sm" v-bind="typeof shortcut === 'string' ? { value: shortcut } : shortcut" />
+          <UKbd v-for="(shortcut, shortcutIndex) in item.shortcuts" :key="shortcutIndex" size="md" v-bind="typeof shortcut === 'string' ? { value: shortcut } : shortcut" />
         </span>
       </slot>
     </span>

src/runtime/components/Input.vue

@@ -63,6 +63,7 @@ const { isLeading, isTrailing, leadingIconName, trailingIconName } = useComponen
 // const size = computed(() => sizeButtonGroup.value || sizeFormGroup.value)
 
 const ui = computed(() => tv({ extend: input, slots: props.ui })({
+  type: props.type,
   color: color.value,
   variant: props.variant,
   size: size?.value,

src/runtime/components/Modal.vue

@@ -104,7 +104,7 @@ const ui = computed(() => tv({ extend: modal, slots: props.ui })({
                   <UButton
                     v-if="close !== null"
                     :icon="appConfig.ui.icons.close"
-                    size="sm"
+                    size="md"
                     color="gray"
                     variant="ghost"
                     aria-label="Close"

src/runtime/components/NavigationMenu.vue

@@ -78,9 +78,8 @@ const lists = computed(() => props.links?.length ? (Array.isArray(props.links[0]
                   <slot name="trailing" :link="link" :active="active">
                     <UBadge
                       v-if="link.badge"
-                      color="gray"
-                      variant="solid"
-                      size="xs"
+                      color="white"
+                      size="sm"
                       v-bind="(typeof link.badge === 'string' || typeof link.badge === 'number') ? { label: link.badge } : link.badge"
                       :class="ui.linkTrailingBadge()"
                     />

src/runtime/components/Slideover.vue

@@ -107,7 +107,7 @@ const ui = computed(() => tv({ extend: slideover, slots: props.ui })({
                   <UButton
                     v-if="close !== null"
                     :icon="appConfig.ui.icons.close"
-                    size="sm"
+                    size="md"
                     color="gray"
                     variant="ghost"
                     aria-label="Close"

src/runtime/components/Toast.vue

@@ -121,7 +121,7 @@ defineExpose({
           <UButton
             v-if="close !== null"
             :icon="appConfig.ui.icons.close"
-            size="sm"
+            size="md"
             color="gray"
             variant="link"
             aria-label="Close"

src/runtime/components/Tooltip.vue

@@ -63,7 +63,7 @@ const ui = computed(() => tv({ extend: tooltip, slots: props.ui })({ side: conte
 
           <span v-if="shortcuts?.length || $slots.shortcuts" :class="ui.shortcuts()">
             <slot name="shortcuts">
-              <UKbd v-for="(shortcut, index) in shortcuts" :key="index" size="xs" v-bind="typeof shortcut === 'string' ? { value: shortcut } : shortcut" />
+              <UKbd v-for="(shortcut, index) in shortcuts" :key="index" size="sm" v-bind="typeof shortcut === 'string' ? { value: shortcut } : shortcut" />
             </slot>
           </span>
         </slot>