bootstrap-view/esm/icons/helpers/icon-base.js

With more than 85 components, over 45 available plugins, several directives, and 1000+ icons, BootstrapVue provides one of the most comprehensive implementations of the Bootstrap v4 component and grid system available for Vue.js v2.6, complete with extens

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
import { extend, mergeData } from '../../vue';
import { NAME_ICON_BASE } from '../../constants/components';
import { PROP_TYPE_BOOLEAN, PROP_TYPE_NUMBER_STRING, PROP_TYPE_STRING } from '../../constants/props';
import { identity } from '../../utils/identity';
import { isUndefinedOrNull } from '../../utils/inspect';
import { mathMax } from '../../utils/math';
import { toFloat } from '../../utils/number';
import { makeProp } from '../../utils/props';

// --- Constants ---

// Base attributes needed on all icons
var BASE_ATTRS = {
  viewBox: '0 0 16 16',
  width: '1em',
  height: '1em',
  focusable: 'false',
  role: 'img',
  'aria-label': 'icon'
};

// Attributes that are nulled out when stacked
var STACKED_ATTRS = {
  width: null,
  height: null,
  focusable: null,
  role: null,
  'aria-label': null
};

// --- Props ---

export var props = {
  animation: makeProp(PROP_TYPE_STRING),
  content: makeProp(PROP_TYPE_STRING),
  flipH: makeProp(PROP_TYPE_BOOLEAN, false),
  flipV: makeProp(PROP_TYPE_BOOLEAN, false),
  fontScale: makeProp(PROP_TYPE_NUMBER_STRING, 1),
  rotate: makeProp(PROP_TYPE_NUMBER_STRING, 0),
  scale: makeProp(PROP_TYPE_NUMBER_STRING, 1),
  shiftH: makeProp(PROP_TYPE_NUMBER_STRING, 0),
  shiftV: makeProp(PROP_TYPE_NUMBER_STRING, 0),
  stacked: makeProp(PROP_TYPE_BOOLEAN, false),
  title: makeProp(PROP_TYPE_STRING),
  variant: makeProp(PROP_TYPE_STRING)
};

// --- Main component ---

// Shared private base component to reduce bundle/runtime size
// @vue/component
export var BVIconBase = /*#__PURE__*/extend({
  name: NAME_ICON_BASE,
  functional: true,
  props: props,
  render: function render(h, _ref) {
    var data = _ref.data,
      props = _ref.props,
      children = _ref.children;
    var animation = props.animation,
      content = props.content,
      flipH = props.flipH,
      flipV = props.flipV,
      stacked = props.stacked,
      title = props.title,
      variant = props.variant;
    var fontScale = mathMax(toFloat(props.fontScale, 1), 0) || 1;
    var scale = mathMax(toFloat(props.scale, 1), 0) || 1;
    var rotate = toFloat(props.rotate, 0);
    var shiftH = toFloat(props.shiftH, 0);
    var shiftV = toFloat(props.shiftV, 0);
    // Compute the transforms
    // Note that order is important as SVG transforms are applied in order from
    // left to right and we want flipping/scale to occur before rotation
    // Note shifting is applied separately
    // Assumes that the viewbox is `0 0 16 16` (`8 8` is the center)
    var hasScale = flipH || flipV || scale !== 1;
    var hasTransforms = hasScale || rotate;
    var hasShift = shiftH || shiftV;
    var hasContent = !isUndefinedOrNull(content);
    var transforms = [hasTransforms ? 'translate(8 8)' : null, hasScale ? "scale(".concat((flipH ? -1 : 1) * scale, " ").concat((flipV ? -1 : 1) * scale, ")") : null, rotate ? "rotate(".concat(rotate, ")") : null, hasTransforms ? 'translate(-8 -8)' : null].filter(identity);

    // We wrap the content in a `<g>` for handling the transforms (except shift)
    var $inner = h('g', {
      attrs: {
        transform: transforms.join(' ') || null
      },
      domProps: hasContent ? {
        innerHTML: content || ''
      } : {}
    }, children);

    // If needed, we wrap in an additional `<g>` in order to handle the shifting
    if (hasShift) {
      $inner = h('g', {
        attrs: {
          transform: "translate(".concat(16 * shiftH / 16, " ").concat(-16 * shiftV / 16, ")")
        }
      }, [$inner]);
    }

    // Wrap in an additional `<g>` for proper animation handling if stacked
    if (stacked) {
      $inner = h('g', [$inner]);
    }
    var $title = title ? h('title', title) : null;
    var $content = [$title, $inner].filter(identity);
    return h('svg', mergeData({
      staticClass: 'b-icon bi',
      class: _defineProperty(_defineProperty({}, "text-".concat(variant), variant), "b-icon-animation-".concat(animation), animation),
      attrs: BASE_ATTRS,
      style: stacked ? {} : {
        fontSize: fontScale === 1 ? null : "".concat(fontScale * 100, "%")
      }
    },
    // Merge in user supplied data
    data,
    // If icon is stacked, null-out some attrs
    stacked ? {
      attrs: STACKED_ATTRS
    } : {},
    // These cannot be overridden by users
    {
      attrs: {
        xmlns: stacked ? null : 'http://www.w3.org/2000/svg',
        fill: 'currentColor'
      }
    }), $content);
  }
});