UNPKG

@atlaskit/logo

Version:

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

61 lines (58 loc) 2.85 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.GuardIcon = 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.getColorsFromAppearance)(appearance, colorMode); } return "<svg fill=\"none\" height=\"32\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 32 32\" focusable=\"false\" aria-hidden=\"true\">\n <path\n d=\"M5.584 14.4h20.83c.599 0 .918-.32.918-.918V6.459c0-.599-.319-.918-.918-.918h-4.39c-.598 0-.917.32-.917.918v3.551h-1.995V6.46c0-.599-.32-.918-.918-.918h-4.39c-.598 0-.917.32-.917.918v3.551h-1.995V6.46c0-.599-.32-.918-.918-.918h-4.39c-.598 0-.917.32-.917.918v7.023c0 .599.319.918.917.918zm.36 6.145a13.9 13.9 0 0 1-.798-3.99c-.04-.52.199-.799.758-.799h20.191c.559 0 .798.24.798.719q-.12 2.214-.838 4.07c-.24.638-.598.918-1.277.918H7.221c-.679 0-1.038-.28-1.277-.918m18.475 3.312c-1.915 2.354-5.068 3.87-8.42 3.87s-6.584-1.516-8.46-3.87c-.478-.638-.239-1.038.24-1.038h16.44c.48 0 .719.4.2 1.038\"\n fill=\"".concat(colors.iconColor, "\"\n />\n </svg>"); }; /** * __Guard icon__ * * The Guard 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 GuardIcon = exports.GuardIcon = function GuardIcon(_ref2) { var appearance = _ref2.appearance, _ref2$label = _ref2.label, label = _ref2$label === void 0 ? 'Guard' : _ref2$label, _ref2$size = _ref2.size, size = _ref2$size === void 0 ? _constants.defaultLogoParams.size : _ref2$size, testId = _ref2.testId, _ref2$textColor = _ref2.textColor, textColor = _ref2$textColor === void 0 ? _constants.defaultLogoParams.textColor : _ref2$textColor, _ref2$iconColor = _ref2.iconColor, iconColor = _ref2$iconColor === void 0 ? _constants.defaultLogoParams.iconColor : _ref2$iconColor; var _useThemeObserver = (0, _tokens.useThemeObserver)(), colorMode = _useThemeObserver.colorMode; return /*#__PURE__*/_react.default.createElement(_wrapper.default, { appearance: appearance, svg: svg({ appearance: appearance, iconColor: iconColor }, colorMode), iconColor: iconColor, label: label, size: size, testId: testId, textColor: textColor }); };