Merged in fix/BOOK-293-button-variants (pull request #3371)

fix(BOOK-293): changed variants and props on IconButton component

* fix(BOOK-293): changed variants and props on IconButton component

* fix(BOOK-293): inherit color for icon


Approved-by: Bianca Widstam
Approved-by: Christel Westerberg

packages/design-system/lib/components/Button/variants.ts

@@ -1,9 +1,5 @@
 import { cva } from 'class-variance-authority'
 
-import {
-  config as typographyConfig,
-  withTypography,
-} from '../Typography/variants'
 
 import { deepmerge } from 'deepmerge-ts'
 import styles from './button.module.css'
@@ -14,7 +10,6 @@ export const config = {
       Primary: styles['variant-primary'],
       Secondary: styles['variant-secondary'],
       Tertiary: styles['variant-tertiary'],
-      Inverted: styles['variant-inverted'],
       Text: styles['variant-text'],
     },
     color: {
@@ -22,9 +17,9 @@ export const config = {
       Inverted: styles['color-inverted'],
     },
     size: {
-      Small: styles['size-small'],
-      Medium: styles['size-medium'],
-      Large: styles['size-large'],
+      sm: styles['size-sm'],
+      md: styles['size-md'],
+      lg: styles['size-lg'],
     },
     wrapping: {
       true: undefined,
@@ -38,24 +33,21 @@ export const config = {
   defaultVariants: {
     variant: 'Primary',
     color: 'Primary',
-    size: 'Large',
+    size: 'lg',
     wrapping: true,
-    fullWidth: false,
   },
 } as const
 
 const buttonConfig = {
   variants: {
     ...config.variants,
-    typography: typographyConfig.variants.variant,
   },
   defaultVariants: {
     ...config.defaultVariants,
-    typography: 'Body/Paragraph/mdBold',
   },
 } as const
 
-export const variants = cva(styles.button, withTypography(buttonConfig))
+export const variants = cva(styles.button, buttonConfig)
 
 export function withButton<T>(config: T) {
   return deepmerge(buttonConfig, config)