Merged in chore/SW-3145-move-button (pull request #2527)

chore: SW-3145 Moved tempdesign button to design-system

* chore: SW-3145 Moved tempdesign button to design-system


Approved-by: Anton Gunnarsson

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

@@ -0,0 +1,154 @@
+import { cva } from 'class-variance-authority'
+
+import styles from './button.module.css'
+
+export const buttonVariants = cva(styles.btn, {
+  variants: {
+    intent: {
+      inverted: styles.inverted,
+      primary: styles.primary,
+      secondary: styles.secondary,
+      tertiary: styles.tertiary,
+      text: styles.text,
+      textInverted: styles.text,
+    },
+    size: {
+      small: styles.small,
+      medium: styles.medium,
+      large: styles.large,
+    },
+    theme: {
+      base: '',
+      primaryDark: '',
+      primaryStrong: '',
+      primaryLight: '',
+      secondaryLight: '',
+      secondaryDark: '',
+      tertiaryLight: '',
+      tertiaryDark: '',
+    },
+    variant: {
+      clean: styles.clean,
+      default: styles.default,
+      icon: styles.icon,
+    },
+    wrapping: {
+      true: styles.wrapping,
+    },
+    clean: {
+      true: styles.clean,
+    },
+    fullWidth: {
+      true: styles.fullWidth,
+    },
+  },
+  defaultVariants: {
+    intent: 'primary',
+    size: 'medium',
+    theme: 'primaryLight',
+    variant: 'default',
+  },
+
+  compoundVariants: [
+    {
+      className: styles.basePrimary,
+      intent: 'primary',
+      theme: 'base',
+    },
+    {
+      className: styles.baseSecondary,
+      intent: 'secondary',
+      theme: 'base',
+    },
+    {
+      className: styles.baseTertiary,
+      intent: 'tertiary',
+      theme: 'base',
+    },
+    {
+      className: styles.baseInverted,
+      intent: 'inverted',
+      theme: 'base',
+    },
+    {
+      className: styles.primaryDarkPrimary,
+      intent: 'primary',
+      theme: 'primaryDark',
+    },
+    {
+      className: styles.primaryDarkSecondary,
+      intent: 'secondary',
+      theme: 'primaryDark',
+    },
+    {
+      className: styles.primaryLightPrimary,
+      intent: 'primary',
+      theme: 'primaryLight',
+    },
+    {
+      className: styles.primaryLightSecondary,
+      intent: 'secondary',
+      theme: 'primaryLight',
+    },
+    {
+      className: styles.primaryStrongPrimary,
+      intent: 'primary',
+      theme: 'primaryStrong',
+    },
+    {
+      className: styles.primaryStrongSecondary,
+      intent: 'secondary',
+      theme: 'primaryStrong',
+    },
+    {
+      className: styles.secondaryDarkPrimary,
+      intent: 'primary',
+      theme: 'secondaryDark',
+    },
+    {
+      className: styles.secondaryDarkSecondary,
+      intent: 'secondary',
+      theme: 'secondaryDark',
+    },
+    {
+      className: styles.secondaryLightPrimary,
+      intent: 'primary',
+      theme: 'secondaryLight',
+    },
+    {
+      className: styles.secondaryLightSecondary,
+      intent: 'secondary',
+      theme: 'secondaryLight',
+    },
+    {
+      className: styles.tertiaryDarkPrimary,
+      intent: 'primary',
+      theme: 'tertiaryDark',
+    },
+    {
+      className: styles.tertiaryDarkSecondary,
+      intent: 'secondary',
+      theme: 'tertiaryDark',
+    },
+    {
+      className: styles.tertiaryLightPrimary,
+      intent: 'primary',
+      theme: 'tertiaryLight',
+    },
+    {
+      className: styles.tertiaryLightSecondary,
+      intent: 'secondary',
+      theme: 'tertiaryLight',
+    },
+    {
+      className: styles.baseText,
+      intent: 'text',
+      theme: 'base',
+    },
+    {
+      className: styles.baseTextInverted,
+      intent: 'textInverted',
+      theme: 'base',
+    },
+  ],
+})