import { objectWithoutProperties as _objectWithoutProperties, toConsumableArray as _toConsumableArray, extends as _extends } from '../_virtual/_rollupPluginBabelHelpers.js';
import React__default, { forwardRef } from 'react';
import cls from 'classnames';
import 'focus-visible';
import { getIntersectionStyles, getStaticVariants, getDynamicVariants } from './utils.js';

var _excluded = ["className", "as", "forwardedAs", "responsive"];
/* eslint-disable no-underscore-dangle */
var _component = function _component(componentConfig) {
  var tag = componentConfig.tag,
    base = componentConfig.base,
    name = componentConfig.name,
    intersections = componentConfig.intersections,
    invariants = componentConfig.invariants,
    responsive = componentConfig.responsive;
  var staticVariants = getStaticVariants(componentConfig);
  var dynamicVariants = getDynamicVariants(componentConfig);
  var component = /*#__PURE__*/forwardRef(function (props, ref) {
    var className = props.className,
      as = props.as,
      forwardedAs = props.forwardedAs,
      responsiveProp = props.responsive,
      rest = _objectWithoutProperties(props, _excluded);
    var variants = dynamicVariants(rest);
    var intersectionStyles = getIntersectionStyles(rest, intersections);
    var rootClassName = cls.apply(void 0, [className, base].concat(_toConsumableArray(staticVariants), _toConsumableArray(variants), _toConsumableArray(intersectionStyles), [responsiveProp && responsive, invariants]));

    // styled-components do it inside
    // filter props
    var baseProps = {};
    for (var key in rest) {
      if (!(key in componentConfig.variations)) {
        baseProps[key] = rest[key];
      }
    }
    baseProps.ref = ref;

    // styled-components do it inside
    // add props that should be attr( disabled for example)
    var htmlAttrs = {};
    for (var _key in componentConfig.variations || {}) {
      if (_key in rest) {
        var variant = componentConfig.variations[_key];
        var attrs = variant.attrs;
        if (typeof attrs === 'boolean') {
          htmlAttrs[_key] = rest[_key];
        }
      }
    }
    var Root = as || forwardedAs || tag;
    return /*#__PURE__*/React__default.createElement(Root, _extends({
      className: rootClassName
    }, htmlAttrs, baseProps));
  });
  if (name) {
    component.displayName = name;
  }
  return component;
};

export { _component };
