Move shared types for RcButton into a declaration file

Signed-off-by: Phillip Rak <rak.phillip@gmail.com>

pkg/rancher-components/src/components/RcButton/RcButton.vue

@@ -1,30 +1,23 @@
 <script setup lang="ts">
 import { computed, ref, defineExpose } from 'vue';
+import { ButtonRoleProps, ButtonSizeProps } from './types';
 
-type Props = {
+const buttonRoles: { role: keyof ButtonRoleProps, className: string }[] = [
-  primary?: boolean;
-  secondary?: boolean;
-  tertiary?: boolean;
-  link?: boolean;
-  small?: boolean;
-}
-
-const buttonRoles = [
   { role: 'primary', className: 'role-primary' },
   { role: 'secondary', className: 'role-secondary' },
   { role: 'tertiary', className: 'role-tertiary' },
   { role: 'link', className: 'role-link' },
 ];
 
-const buttonSizes = [
+const buttonSizes: { size: keyof ButtonSizeProps, className: string }[] = [
   { size: 'small', className: 'btn-sm' },
 ];
 
-const props = defineProps<Props>();
+const props = defineProps<ButtonRoleProps & ButtonSizeProps>();
 
 const buttonClass = computed(() => {
-  const activeRole = buttonRoles.find(({ role }) => props[role as keyof Props]);
+  const activeRole = buttonRoles.find(({ role }) => props[role]);
-  const isButtonSmall = buttonSizes.some(({ size }) => props[size as keyof Props]);
+  const isButtonSmall = buttonSizes.some(({ size }) => props[size]);
 
   return {
     btn: true,

pkg/rancher-components/src/components/RcButton/types.ts

@@ -1,3 +1,14 @@
 export type RcButtonType = {
   focus: () => void;
 }
+
+export type ButtonRoleProps = {
+  primary?: boolean;
+  secondary?: boolean;
+  tertiary?: boolean;
+  link?: boolean;
+}
+
+export type ButtonSizeProps = {
+  small?: boolean;
+}