vuikit/lib/spinner.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';

var Icon = {
  functional: true,
  render: function (h, ctx) {
    var props = ctx.props;
    var ratio = props.ratio || 1;
    var width = props.width || 30;
    var height = props.height || 30;
    var viewBox = props.viewBox || '0 0 30 30';
    if (ratio !== 1) {
      width = width * ratio;
      height = height * ratio;
    }
    return h('svg', {
      attrs: {
        version: '1.1',
        width: width,
        height: height,
        viewBox: viewBox
      },
      domProps: {
        innerHTML: '<circle fill="none" stroke="#000" cx="15" cy="15" r="14"/>'
      }
    })
  }
}

var ElementSpinner = {
  functional: true,
  props: {
    ratio: {
      type: [String, Number]
    }
  },
  render: function render (h, ref) {
    var props = ref.props;
    var data = ref.data;
    return h('div', mergeData(data, {
      class: ['uk-icon', 'uk-spinner']
    }), [
      h(Icon, { props: props })
    ])
  }
}

var spinner = {
  name: 'VkSpinner',
  functional: true,
  props: ElementSpinner.props,
  render: ElementSpinner.render
}

export { ElementSpinner, Icon as ElementSpinnerIcon, spinner as Spinner };