@intility/bifrost-react/dist/components/Box/index.js

React library for Intility's design system, Bifrost.

import Box from "./Box.js";
import BoxArrow from "./Box.Arrow.js";

/**
 * Styleable wrapper element
 *
 * @see https://bifrost.intility.com/react/box
 *
 * @example
 * <Box padding border radius>
 *   Box with padding, border, and radius
 * </Box>
 *
 * @example
 * <Box background="warning">Yellow background</Box>
 *
 * @example
 * <Box theme="purple" background="theme">
 *   Purple-themed box with theme background
 * </Box>
 */
export default Object.assign(Box, {
  /**
   * Right-arrow icon for use in links (animates on hover)
   *
   * @see https://bifrost.intility.com/react/box#boxarrow
   *
   * @example
   * <a href="/path/to/page" className="bf-neutral-link">
   *   Link text
   *   <Box.Arrow />
   * </a>
   *
   * @example
   * // use `external` for arrow pointing up and to the right
   * <a href="https://www.imdb.com/title/tt3501632/" className="bf-neutral-link">
   *   Thor Ragnarok
   *   <Box.Arrow external />
   * </a>
   */
  Arrow: BoxArrow
});