'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _rollupPluginBabelHelpers = require('../../_virtual/_rollupPluginBabelHelpers.js');
var React = require('react');
var base$1 = require('./variations/_view/base.js');
var base = require('./variations/_size/base.js');
var SpinnerSvg = require('./SpinnerSvg.js');
var Spinner_styles = require('./Spinner.styles.js');
var index = require('./hooks/index.js');
var react = require('../../utils/react.js');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var React__default = /*#__PURE__*/_interopDefault(React);

var _excluded = ["id", "width", "height", "style"];
var spinnerRoot = function spinnerRoot(Root) {
  return /*#__PURE__*/React.forwardRef(function (props, ref) {
    var id = props.id,
      width = props.width,
      height = props.height,
      style = props.style,
      rest = _rollupPluginBabelHelpers.objectWithoutProperties(props, _excluded);
    var innerProps = index.useInnerProps(props, {
      wrapperWidth: 'auto',
      wrapperHeight: 'auto',
      svgWidth: 'var(--plasma-spinner-size)',
      svgHeight: 'var(--plasma-spinner-size)',
      color: 'currentColor'
    });
    var uniqId = react.safeUseId;
    var innerId = id || uniqId();
    var rootStyle = width && height ? _rollupPluginBabelHelpers.objectSpread2(_rollupPluginBabelHelpers.objectSpread2({}, style), {}, {
      width: innerProps.wrapperWidth,
      height: innerProps.wrapperHeight
    }) : style;
    return /*#__PURE__*/React__default.default.createElement(Root, _rollupPluginBabelHelpers.extends({
      ref: ref,
      id: innerId
    }, rest, {
      style: rootStyle
    }), /*#__PURE__*/React__default.default.createElement(Spinner_styles.SpinnerWrapper, {
      width: innerProps.wrapperWidth,
      height: innerProps.wrapperHeight
    }, /*#__PURE__*/React__default.default.createElement(SpinnerSvg.SpinnerSvg, {
      id: innerId,
      width: innerProps.svgWidth,
      height: innerProps.svgHeight,
      color: innerProps.color
    })));
  });
};
var spinnerConfig = {
  name: 'Spinner',
  tag: 'div',
  layout: spinnerRoot,
  base: Spinner_styles.base,
  variations: {
    size: {
      css: base.base
    },
    view: {
      css: base$1.base
    }
  },
  defaults: {
    size: 'm',
    view: 'accent'
  }
};

exports.spinnerConfig = spinnerConfig;
exports.spinnerRoot = spinnerRoot;
