vuikit/lib/icon.js

A responsive Vue UI library for web site interfaces based on UIkit

/**
 * Vuikit 0.8.10
 * (c) 2018 Miljan Aleksic
 * @license MIT
**/

/* Substantial part of the code is adapted from UIkit,
  Copyright (c) 2013-2018 YOOtheme GmbH, getuikit.com */

import { mergeData } from './util/vue';
import { assign } from './util/lang';

var ElementIcon = {
  functional: true,
  render: function (h, ref) {
      var data = ref.data;
      var children = ref.children;
      return h('span', mergeData(data, {
      class: 'uk-icon'
    }), children);
}
}

var ElementIconLink = {
  functional: true,
  props: {
    reset: {
      type: Boolean,
      default: false
    }
  },
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    var children = ref.children;
    var reset = props.reset;
    return h('a', mergeData(data, {
      class: ['uk-icon', {
        'uk-icon-link': reset
      }]
    }), children)
  }
}

var ElementIconButton = {
  functional: true,
  render: function render (h, ref) {
    var data = ref.data;
    var children = ref.children;
    return h('a', mergeData(data, {
      class: 'uk-icon uk-icon-button'
    }), children)
  }
}

var ElementIconImage = {
  functional: true,
  props: {
    src: {
      type: String,
      required: true
    }
  },
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    var src = props.src;
    return h('span', mergeData(data, {
      class: 'uk-icon uk-icon-image',
      style: {
        'background-image': ("url(" + src + ")")
      }
    }))
  }
}

var core = {
  functional: true,
  props: {
    icon: {
      type: String,
      required: true
    },
    ratio: {
      type: [Number, String],
      default: 1
    }
  },
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    var icon = props.icon;
    var ratio = props.ratio;
    var ref$1 = data.attrs || {};
    var width = ref$1.width;
    var height = ref$1.height;
    var viewBox = ref$1.viewBox;
    var Icon = h(("vk-icons-" + icon), {
      attrs: { width: width, height: height, viewBox: viewBox }
    });
    if (ratio !== 1) {
      Icon.data.attrs.width *= ratio;
      Icon.data.attrs.height *= ratio;
      Icon.data.attrs.ratio = ratio;
    }
    return Icon
  }
}

var icon = {
  name: 'VkIcon',
  functional: true,
  props: core.props,
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    return h(ElementIcon, data, [
      h(core, mergeData(data, { props: props }))
    ])
  }
}

var iconLink = {
  name: 'VkIconLink',
  functional: true,
  props: assign({}, core.props, ElementIconLink.props),
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    var def = mergeData(data, { props: props });
    return h(ElementIconLink, def, [ h(core, def) ])
  }
}

var iconButton = {
  name: 'VkIconButton',
  functional: true,
  props: core.props,
  render: function render (h, ref) {
    var data = ref.data;
    var props = ref.props;
    return h(ElementIconButton, data, [
      h(core, mergeData(data, { props: props }))
    ])
  }
}

var iconImage = {
  name: 'VkIconImage',
  functional: true,
  props: ElementIconImage.props,
  render: ElementIconImage.render
}

export { ElementIcon, ElementIconLink, ElementIconButton, ElementIconImage, icon as Icon, iconLink as IconLink, iconButton as IconButton, iconImage as IconImage };