Variants

API

• prop: The prop key that variants should be. Defaults to variant.
• defaultVariant: The default variant that will be used if none is specified.
• base: A system CSS object that is shared (and overrided) by all variants. This will not be applied if no variant / default variant has been specified.
• variants (required): A map of keys to each possible state.
  • key: The name of the variant to be a possible option of the prop.
  • value: The system CSS Object to be applied if the variant has been selected.

Usage

import { animus } from '@animus-ui/core';

const Anchor = animus
  .variant({
    defaultVariant: 'interface',
    variants: {
      ui: {
        color: 'text',
      },
      inline: {
        color: 'primary',
      },
    },
  })
  .asElement('a');