@atlaskit/icon/dist/es2019/components/icon-tile/index.js

An icon is a symbol representing a command, device, directory, or common action.

/* index.tsx generated by @compiled/babel-plugin v3.0.2 */
import "./index.compiled.css";
import * as React from 'react';
import { ax, ix } from "@compiled/react/runtime";
import Tile from '@atlaskit/tile/tile';
// Icon color mapping for Tile-based icons
const iconColorMap = {
  blue: "_syaz6txe",
  blueBold: "_syaz1q3r",
  gray: "_syazdgkc",
  grayBold: "_syaz5w2r",
  green: "_syaz17hp",
  greenBold: "_syaz1q3r",
  lime: "_syaz8645",
  limeBold: "_syaz1q3r",
  magenta: "_syazv8hk",
  magentaBold: "_syaz1q3r",
  orange: "_syaz1j6y",
  orangeBold: "_syaz1q3r",
  purple: "_syazuq3u",
  purpleBold: "_syaz1q3r",
  red: "_syaznbxb",
  redBold: "_syaz1q3r",
  teal: "_syaz8uof",
  tealBold: "_syaz1q3r",
  yellow: "_syaz1oqg",
  yellowBold: "_syaz1q3r"
};
const iconWrapperStyles = {
  root: "_vwz4idpf"
};

// Background color mapping for Tile component
const backgroundColorMap = {
  blue: undefined,
  blueBold: 'color.background.accent.blue.subtle',
  gray: undefined,
  grayBold: 'color.background.neutral.bold',
  green: undefined,
  greenBold: 'color.background.accent.green.subtle',
  lime: undefined,
  limeBold: 'color.background.accent.lime.subtle',
  magenta: undefined,
  magentaBold: 'color.background.accent.magenta.subtle',
  orange: undefined,
  orangeBold: 'color.background.accent.orange.subtle',
  purple: undefined,
  purpleBold: 'color.background.accent.purple.subtle',
  red: undefined,
  redBold: 'color.background.accent.red.subtle',
  teal: undefined,
  tealBold: 'color.background.accent.teal.subtle',
  yellow: undefined,
  yellowBold: 'color.background.accent.yellow.subtle'
};

/**
 * __IconTile__
 *
 * An icon with background color and size properties determined by Tile.
 */
export default function IconTile(props) {
  const {
    icon: Icon,
    label,
    appearance,
    size = 'medium',
    testId
  } = props;
  const ExpandedIcon = Icon;
  return /*#__PURE__*/React.createElement(Tile, {
    size: size,
    backgroundColor: backgroundColorMap[appearance],
    label: label,
    testId: testId
  }, /*#__PURE__*/React.createElement("span", {
    className: ax([iconColorMap[appearance], iconWrapperStyles.root])
  }, /*#__PURE__*/React.createElement(ExpandedIcon, {
    color: "currentColor",
    label: "",
    shouldScale: true
  })));
}