@equinor/eds-core-react/dist/esm/components/Button/tokens/contained.js

The React implementation of the Equinor Design System

import { tokens } from '@equinor/eds-tokens';
import { button } from './button.js';
import mergeDeepRight from '../../../node_modules/.pnpm/ramda@0.30.1/node_modules/ramda/es/mergeDeepRight.js';

const {
  colors: {
    text: {
      static_icons__primary_white: {
        rgba: primaryWhite
      }
    },
    interactive: {
      primary__resting: {
        rgba: primaryColor
      },
      primary__hover: {
        rgba: primaryHoverColor
      },
      secondary__resting: {
        rgba: secondaryColor
      },
      secondary__link_hover: {
        rgba: secondaryHoverColor
      },
      danger__resting: {
        rgba: dangerColor
      },
      danger__hover: {
        rgba: dangerHoverColor
      }
    }
  },
  shape: {
    button: {
      borderRadius: buttonBorderRadius
    }
  }
} = tokens;
const primary = mergeDeepRight(button, {
  background: primaryColor,
  typography: {
    color: primaryWhite
  },
  border: {
    type: 'border',
    style: 'solid',
    width: '1px',
    color: primaryColor,
    radius: `var(--eds_button__radius, ${buttonBorderRadius})`
  },
  states: {
    hover: {
      background: primaryHoverColor
    }
  }
});
const secondary = mergeDeepRight(primary, {
  background: secondaryColor,
  border: {
    color: secondaryColor
  },
  states: {
    hover: {
      background: secondaryHoverColor,
      border: {
        color: secondaryHoverColor
      }
    }
  }
});
const danger = mergeDeepRight(primary, {
  background: dangerColor,
  border: {
    color: dangerColor
  },
  states: {
    hover: {
      background: dangerHoverColor,
      border: {
        color: dangerHoverColor
      }
    }
  }
});

export { danger, primary, secondary };