@atlaskit/logo/dist/cjs/loom-logo/icon.js

A logo is a visual representation of a brand or product. It can be a word or an image, or a combination of both.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.LoomIcon = void 0;
var _react = _interopRequireDefault(require("react"));
var _tokens = require("@atlaskit/tokens");
var _constants = require("../constants");
var _utils = require("../utils");
var _wrapper = _interopRequireDefault(require("../wrapper"));
/* eslint-disable max-len */

var svg = function svg(_ref, colorMode) {
  var appearance = _ref.appearance,
    iconColor = _ref.iconColor;
  var colors = {
    iconColor: iconColor
  };
  if (appearance) {
    colors = (0, _utils.getColorsForLoom)(appearance, colorMode);
  }
  return "<svg\n    fill=\"none\"\n    height=\"32\"\n    viewBox=\"0 0 32 32\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    focusable=\"false\"\n    aria-hidden=\"true\"\n  >\n    <path\n      d=\"M27.333 15.508h-6.628l5.74-3.315-1.26-2.184-5.74 3.314 3.313-5.74-2.184-1.26-3.313 5.74V5.434h-2.522v6.628l-3.314-5.74-2.184 1.26 3.314 5.74-5.74-3.314-1.26 2.184 5.74 3.314H4.667v2.521h6.627l-5.74 3.314 1.261 2.184 5.74-3.313-3.314 5.74 2.184 1.26 3.314-5.74V28.1h2.521v-6.627l3.313 5.74 2.184-1.261-3.314-5.74 5.74 3.313 1.261-2.184-5.74-3.313h6.628zM16 20.198a3.442 3.442 0 1 1 0-6.885 3.442 3.442 0 0 1 0 6.884\"\n      fill=\"".concat(colors.iconColor, "\"\n    />\n  </svg>");
};

/**
 * __Loom icon__
 *
 * The Loom icon without an accompanying wordmark.
 *
 * - [Examples](https://atlassian.design/components/logo/examples)
 * - [Code](https://atlassian.design/components/logo/code)
 * - [Usage](https://atlassian.design/components/logo/usage)
 */
var LoomIcon = exports.LoomIcon = function LoomIcon(_ref2) {
  var appearance = _ref2.appearance,
    _ref2$label = _ref2.label,
    label = _ref2$label === void 0 ? 'Loom' : _ref2$label,
    _ref2$size = _ref2.size,
    size = _ref2$size === void 0 ? _constants.defaultLogoParams.size : _ref2$size,
    testId = _ref2.testId,
    _ref2$iconColor = _ref2.iconColor,
    iconColor = _ref2$iconColor === void 0 ? _constants.defaultLogoParams.iconColor : _ref2$iconColor,
    _ref2$textColor = _ref2.textColor,
    textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor;
  var _useThemeObserver = (0, _tokens.useThemeObserver)(),
    colorMode = _useThemeObserver.colorMode;
  return /*#__PURE__*/_react.default.createElement(_wrapper.default, {
    appearance: appearance,
    label: label,
    svg: svg({
      appearance: appearance,
      iconColor: iconColor
    }, colorMode),
    iconColor: iconColor,
    size: size,
    testId: testId,
    textColor: textColor
  });
};