'use strict';

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

var React = require('react');
var _rollupPluginBabelHelpers = require('./_rollupPluginBabelHelpers-988dd35a.js');
require('@emotion/core');
var _commonjsHelpers = require('./_commonjsHelpers-aa8da8cd.js');
require('./index-fb98497c.js');
var _tslib = require('./_tslib-9c546438.js');
var jsxRuntime = require('@emotion/react/jsx-runtime');
require('@emotion/styled');
require('@emotion/react');
var css = require('./css-203af057.js');
require('./index-cfc055a4.js');
var index = require('./index-2472d70b.js');
var autoId_esm = require('./auto-id.esm-f9c7d71b.js');
var createIconComponent = require('./createIconComponent-643fed10.js');
var utilities = require('./utilities-d51a0c2d.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

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

var performanceNow = _commonjsHelpers.createCommonjsModule(function (module) {
  // Generated by CoffeeScript 1.12.2
  (function () {
    var getNanoSeconds, hrtime, loadTime, moduleLoadTime, nodeLoadTime, upTime;

    if (typeof performance !== "undefined" && performance !== null && performance.now) {
      module.exports = function () {
        return performance.now();
      };
    } else if (typeof process !== "undefined" && process !== null && process.hrtime) {
      module.exports = function () {
        return (getNanoSeconds() - nodeLoadTime) / 1e6;
      };

      hrtime = process.hrtime;

      getNanoSeconds = function getNanoSeconds() {
        var hr;
        hr = hrtime();
        return hr[0] * 1e9 + hr[1];
      };

      moduleLoadTime = getNanoSeconds();
      upTime = process.uptime() * 1e9;
      nodeLoadTime = moduleLoadTime - upTime;
    } else if (Date.now) {
      module.exports = function () {
        return Date.now() - loadTime;
      };

      loadTime = Date.now();
    } else {
      module.exports = function () {
        return new Date().getTime() - loadTime;
      };

      loadTime = new Date().getTime();
    }
  }).call(_commonjsHelpers.commonjsGlobal);
});

var root = typeof window === 'undefined' ? _commonjsHelpers.commonjsGlobal : window,
    vendors = ['moz', 'webkit'],
    suffix = 'AnimationFrame',
    raf = root['request' + suffix],
    caf = root['cancel' + suffix] || root['cancelRequest' + suffix];

for (var i = 0; !raf && i < vendors.length; i++) {
  raf = root[vendors[i] + 'Request' + suffix];
  caf = root[vendors[i] + 'Cancel' + suffix] || root[vendors[i] + 'CancelRequest' + suffix];
} // Some versions of FF have rAF but not cAF


if (!raf || !caf) {
  var last = 0,
      id = 0,
      queue = [],
      frameDuration = 1000 / 60;

  raf = function raf(callback) {
    if (queue.length === 0) {
      var _now = performanceNow(),
          next = Math.max(0, frameDuration - (_now - last));

      last = next + _now;
      setTimeout(function () {
        var cp = queue.slice(0); // Clear queue here to prevent
        // callbacks from appending listeners
        // to the current frame's queue

        queue.length = 0;

        for (var i = 0; i < cp.length; i++) {
          if (!cp[i].cancelled) {
            try {
              cp[i].callback(last);
            } catch (e) {
              setTimeout(function () {
                throw e;
              }, 0);
            }
          }
        }
      }, Math.round(next));
    }

    queue.push({
      handle: ++id,
      callback: callback,
      cancelled: false
    });
    return id;
  };

  caf = function caf(handle) {
    for (var i = 0; i < queue.length; i++) {
      if (queue[i].handle === handle) {
        queue[i].cancelled = true;
      }
    }
  };
}

var raf_1 = function raf_1(fn) {
  // Wrap in a new function to prevent
  // `cancel` potentially being assigned
  // to the native rAF function
  return raf.call(root, fn);
};

var cancel = function cancel() {
  caf.apply(root, arguments);
};

var polyfill = function polyfill(object) {
  if (!object) {
    object = root;
  }

  object.requestAnimationFrame = raf;
  object.cancelAnimationFrame = caf;
};
raf_1.cancel = cancel;
raf_1.polyfill = polyfill;

var lib = _commonjsHelpers.createCommonjsModule(function (module, exports) {

  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.Animate = exports.easings = undefined;

  var _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {
          target[key] = source[key];
        }
      }
    }

    return target;
  };

  var _createClass = function () {
    function defineProperties(target, props) {
      for (var i = 0; i < props.length; i++) {
        var descriptor = props[i];
        descriptor.enumerable = descriptor.enumerable || false;
        descriptor.configurable = true;
        if ("value" in descriptor) descriptor.writable = true;
        Object.defineProperty(target, descriptor.key, descriptor);
      }
    }

    return function (Constructor, protoProps, staticProps) {
      if (protoProps) defineProperties(Constructor.prototype, protoProps);
      if (staticProps) defineProperties(Constructor, staticProps);
      return Constructor;
    };
  }();

  var _react2 = _interopRequireDefault(React__default['default']);

  var _propTypes2 = _interopRequireDefault(index.propTypes);

  var _raf2 = _interopRequireDefault(raf_1);

  function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
      "default": obj
    };
  }

  function _objectWithoutProperties(obj, keys) {
    var target = {};

    for (var i in obj) {
      if (keys.indexOf(i) >= 0) continue;
      if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
      target[i] = obj[i];
    }

    return target;
  }

  function _classCallCheck(instance, Constructor) {
    if (!(instance instanceof Constructor)) {
      throw new TypeError("Cannot call a class as a function");
    }
  }

  function _possibleConstructorReturn(self, call) {
    if (!self) {
      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
    }

    return call && (_rollupPluginBabelHelpers._typeof(call) === "object" || typeof call === "function") ? call : self;
  }

  function _inherits(subClass, superClass) {
    if (typeof superClass !== "function" && superClass !== null) {
      throw new TypeError("Super expression must either be null or a function, not " + _rollupPluginBabelHelpers._typeof(superClass));
    }

    subClass.prototype = Object.create(superClass && superClass.prototype, {
      constructor: {
        value: subClass,
        enumerable: false,
        writable: true,
        configurable: true
      }
    });
    if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
  }
  /* eslint-disable no-restricted-syntax, react/forbid-prop-types */


  var easings = exports.easings = {
    // Cubic
    easeInCubic: 'cubic-bezier(0.550, 0.055, 0.675, 0.190)',
    easeOutCubic: 'cubic-bezier(0.215, 0.610, 0.355, 1.000)',
    easeInOutCubic: 'cubic-bezier(0.645, 0.045, 0.355, 1.000)',
    // Circ
    easeInCirc: 'cubic-bezier(0.600, 0.040, 0.980, 0.335)',
    easeOutCirc: 'cubic-bezier(0.075, 0.820, 0.165, 1.000)',
    easeInOutCirc: 'cubic-bezier(0.785, 0.135, 0.150, 0.860)',
    // Expo
    easeInExpo: 'cubic-bezier(0.950, 0.050, 0.795, 0.035)',
    easeOutExpo: 'cubic-bezier(0.190, 1.000, 0.220, 1.000)',
    easeInOutExpo: 'cubic-bezier(1.000, 0.000, 0.000, 1.000)',
    // Quad
    easeInQuad: 'cubic-bezier(0.550, 0.085, 0.680, 0.530)',
    easeOutQuad: 'cubic-bezier(0.250, 0.460, 0.450, 0.940)',
    easeInOutQuad: 'cubic-bezier(0.455, 0.030, 0.515, 0.955)',
    // Quart
    easeInQuart: 'cubic-bezier(0.895, 0.030, 0.685, 0.220)',
    easeOutQuart: 'cubic-bezier(0.165, 0.840, 0.440, 1.000)',
    easeInOutQuart: 'cubic-bezier(0.770, 0.000, 0.175, 1.000)',
    // Quint
    easeInQuint: 'cubic-bezier(0.755, 0.050, 0.855, 0.060)',
    easeOutQuint: 'cubic-bezier(0.230, 1.000, 0.320, 1.000)',
    easeInOutQuint: 'cubic-bezier(0.860, 0.000, 0.070, 1.000)',
    // Sine
    easeInSine: 'cubic-bezier(0.470, 0.000, 0.745, 0.715)',
    easeOutSine: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)',
    easeInOutSine: 'cubic-bezier(0.445, 0.050, 0.550, 0.950)',
    // Back
    easeInBack: 'cubic-bezier(0.600, -0.280, 0.735, 0.045)',
    easeOutBack: 'cubic-bezier(0.175,  0.885, 0.320, 1.275)',
    easeInOutBack: 'cubic-bezier(0.680, -0.550, 0.265, 1.550)'
  };

  var Animate = exports.Animate = function (_React$Component) {
    _inherits(Animate, _React$Component);

    function Animate(props) {
      _classCallCheck(this, Animate);

      var _this = _possibleConstructorReturn(this, (Animate.__proto__ || Object.getPrototypeOf(Animate)).call(this, props));

      _initialiseProps.call(_this);

      var _this$props = _this.props,
          show = _this$props.show,
          preMount = _this$props.preMount,
          transitionOnMount = _this$props.transitionOnMount,
          start = _this$props.start,
          enter = _this$props.enter;
      _this.stage = false;
      _this.stageStyles = {};
      _this.transitioning = false;
      _this.state = {
        mountContent: preMount || show,
        currentStyle: transitionOnMount ? start : enter,
        styleOverrides: {}
      };
      return _this;
    }

    _createClass(Animate, [{
      key: 'componentDidMount',
      value: function componentDidMount() {
        var _props = this.props,
            transitionOnMount = _props.transitionOnMount,
            show = _props.show,
            enter = _props.enter;

        if (transitionOnMount && show) {
          this.transition('enter', enter);
        }
      }
    }, {
      key: 'componentDidUpdate',
      value: function componentDidUpdate(oldProps) {
        var _props2 = this.props,
            show = _props2.show,
            enter = _props2.enter,
            leave = _props2.leave,
            start = _props2.start,
            stage = this.stage;

        if (show) {
          // Entering
          if (!oldProps.show) {
            if (stage === 'leave') {
              return this.transition('clean');
            }

            if (enter) {
              return this.transition('enter', enter);
            }

            return this.transition('clean');
          } // Did Enter


          if (stage === 'didEnter') {
            return this.transition('clean');
          }
        } else if (oldProps.show) {
          // Leaving
          return this.transition('leave', leave || start);
        }
      }
    }, {
      key: 'render',
      value: function render() {
        var _this2 = this;

        var _props3 = this.props,
            Comp = _props3.component,
            children = _props3.children,
            originalShow = _props3.show,
            easing = _props3.easing,
            duration = _props3.duration,
            transitionProperty = _props3.transitionProperty,
            stayMounted = _props3.stayMounted,
            transitionOnMount = _props3.transitionOnMount,
            show = _props3.show,
            style = _props3.style,
            leave = _props3.leave,
            enter = _props3.enter,
            innerRef = _props3.innerRef,
            onFinish = _props3.onFinish,
            preMount = _props3.preMount,
            rest = _objectWithoutProperties(_props3, ['component', 'children', 'show', 'easing', 'duration', 'transitionProperty', 'stayMounted', 'transitionOnMount', 'show', 'style', 'leave', 'enter', 'innerRef', 'onFinish', 'preMount']);

        var _state = this.state,
            mountContent = _state.mountContent,
            currentStyle = _state.currentStyle,
            styleOverrides = _state.styleOverrides;
        return mountContent ? _react2["default"].createElement(Comp, _extends({
          ref: function ref(el) {
            _this2.handleRef(el);

            if (innerRef) {
              innerRef(el);
            }
          },
          onTransitionEnd: this.transitionEnd,
          style: this.makeStyles(currentStyle, styleOverrides)
        }, rest), children) : null;
      }
    }]);

    return Animate;
  }(_react2["default"].Component); // I'll let someone smarter than me figure out how to do this ;)
  // export class AnimateGroup extends React.Component {
  //   constructor (props) {
  //     super(props)
  //     const { data } = props
  //     this.nodes = this.makeNodes(data)
  //   }
  //   componentDidUpdate () {
  //     const { data } = this.props
  //     const newNodes = this.makeNodes(data)
  //     let needsUpdate
  //     if (newNodes.some(node => !this.nodes.find(d => d.key === node.key))) {
  //       needsUpdate = 'diff'
  //     }
  //     if (needsUpdate) {
  //       console.log(needsUpdate, newNodes, this.nodes)
  //       this.nodes = this.updateNodes(newNodes)
  //       this.forceUpdate()
  //     }
  //   }
  //   makeNodes = data => {
  //     const { getKey } = this.props
  //     return data.map(datum => ({
  //       key: getKey(datum),
  //       data: datum,
  //       show: true,
  //     }))
  //   }
  //   updateNodes = next => {
  //     const nodes = []
  //     this.nodes.forEach(node => {
  //       if (next.find(d => d.key === node.key)) {
  //         return
  //       }
  //       exiting.push({
  //         ...node,
  //         show: false,
  //       })
  //     })
  //     return [...next, ...exiting]
  //   }
  //   removeNode = node => {
  //     this.nodes = this.nodes.filter(d => d.key !== node.key)
  //     this.forceUpdate()
  //   }
  //   render () {
  //     const {
  //       data,
  //       getKey,
  //       children,
  //       render,
  //       start,
  //       enter,
  //       update,
  //       leave,
  //       duration,
  //       easing,
  //       ...rest
  //     } = this.props
  //     return (
  //       <React.Fragment>
  //         {this.nodes.map((node, i) => (
  //           <Animate
  //             key={node.key}
  //             show={node.show}
  //             start={typeof start === 'function' ? start(node.data, node.key, i) : start}
  //             enter={typeof enter === 'function' ? enter(node.data, node.key, i) : enter}
  //             update={typeof update === 'function' ? update(node.data, node.key, i) : update}
  //             leave={typeof leave === 'function' ? leave(node.data, node.key, i) : leave}
  //             onFinish={() => {
  //               if (!node.show) {
  //                 this.removeNode(node)
  //               }
  //             }}
  //             {...rest}
  //           >
  //             {(render || children)(node.data)}
  //           </Animate>
  //         ))}
  //       </React.Fragment>
  //     )
  //   }
  // }
  // function mergeNodes (left, right) {
  //   let nodes = []
  //   let lastRightIndex = 0
  //   left.forEach(l => {
  //     const index = right.findIndex(r => r.key === l.key)
  //     if (index === -1) {
  //       return nodes.push(l)
  //     }
  //     nodes = [...nodes, ...right.slice(lastRightIndex, index)]
  //     lastRightIndex = index
  //   })
  //   return nodes
  // }


  Animate.easings = easings;
  Animate.propTypes = {
    component: _propTypes2["default"].string,
    show: _propTypes2["default"].oneOfType([_propTypes2["default"].bool, _propTypes2["default"].number]),
    easing: _propTypes2["default"].string,
    duration: _propTypes2["default"].number,
    preMount: _propTypes2["default"].bool,
    transitionProperty: _propTypes2["default"].string,
    stayMounted: _propTypes2["default"].bool,
    style: _propTypes2["default"].object,
    start: _propTypes2["default"].object,
    enter: _propTypes2["default"].object,
    leave: _propTypes2["default"].object,
    onFinish: _propTypes2["default"].func,
    transitionOnMount: _propTypes2["default"].bool,
    children: _propTypes2["default"].node.isRequired
  };
  Animate.defaultProps = {
    component: 'div',
    show: true,
    easing: 'easeOutQuad',
    duration: 300,
    transitionProperty: 'all',
    preMount: false,
    stayMounted: true,
    transitionOnMount: false,
    style: undefined,
    start: undefined,
    enter: undefined,
    leave: undefined,
    onFinish: function onFinish() {}
  };

  var _initialiseProps = function _initialiseProps() {
    var _this3 = this;

    this.ensureMounted = function () {
      return new Promise(function (resolve) {
        var check = function check() {
          if (_this3.el) {
            return resolve();
          }

          (0, _raf2["default"])(function () {
            _this3.setState({
              mountContent: true
            }, check);
          });
        };

        check();
      });
    };

    this.setCurrentStyle = function (style) {
      return _this3.setState({
        currentStyle: style
      });
    };

    this.overrideStyle = function (style) {
      return new Promise(function (resolve) {
        var check = function check() {
          _this3.setState({
            styleOverrides: style
          }, function () {
            (0, _raf2["default"])(function () {
              if (Object.keys(style).some(function (key) {
                return !_this3.el || _this3.el.style[key] !== style[key];
              })) {
                return check();
              }

              resolve();
            });
          });
        };

        check();
      });
    };

    this.transition = function (stage) {
      var styles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
      var show = _this3.props.show;
      _this3.stage = stage;
      _this3.stageStyles = styles;
      _this3.transitioning = true;
      var wasAutoWidth = void 0;
      var wasAutoHeight = void 0;
      var isAutoWidth = void 0;
      var isAutoHeight = void 0;
      var isAutoChanged = void 0;
      return Promise.resolve().then(function () {
        if (show) {
          return _this3.ensureMounted();
        }
      }).then(function () {
        var _state2 = _this3.state,
            currentStyle = _state2.currentStyle,
            styleOverrides = _state2.styleOverrides;

        var previousStyle = _this3.makeStyles(currentStyle, styleOverrides);

        var nextStyle = _this3.makeStyles(styles);

        wasAutoWidth = _this3.isProp(previousStyle, 'width', 'auto');
        wasAutoHeight = _this3.isProp(previousStyle, 'height', 'auto');
        isAutoWidth = _this3.isProp(nextStyle, 'width', 'auto');
        isAutoHeight = _this3.isProp(nextStyle, 'height', 'auto');
        var isAutoWidthChanged = wasAutoWidth !== isAutoWidth;
        var isAutoHeightChanged = wasAutoHeight !== isAutoHeight;
        isAutoChanged = isAutoWidthChanged || isAutoHeightChanged;

        if (isAutoChanged) {
          // First we have to make sure we are measuring an
          // inline-block element that is overflow hidden, otherwise measurements
          // can get very inaccurate
          return _this3.overrideStyle({
            display: 'block',
            overflow: 'hidden'
          }).then(function () {
            // Then we measure
            var measurements = _this3.measure(); // Make sure overflow is hidden while we animate


            return _this3.overrideStyle(_extends({}, isAutoWidthChanged ? {
              width: measurements.width + 'px'
            } : {}, isAutoHeightChanged ? {
              height: measurements.height + 'px'
            } : {}));
          });
        }
      }).then(function () {
        (0, _raf2["default"])(function () {
          _this3.setState(function (_ref) {
            var styleOverrides = _ref.styleOverrides;
            styleOverrides = isAutoChanged ? _extends({}, styleOverrides, wasAutoWidth ? {
              width: styles.width
            } : {}, wasAutoHeight ? {
              height: styles.height
            } : {}) : styleOverrides;
            return {
              mountContent: true,
              currentStyle: styles,
              styleOverrides: styleOverrides
            };
          }, function () {// If no styles were applied, then we need to manually complete the transition
            // TODO: this might also need to be done if the transitionProperty doesn't
            // match any of the styles provided.
            // if (!styles) {
            //   this.completeTransition();
            // }
          });
        });
      });
    };

    this.transitionEnd = function (e) {
      if (e) {
        e.persist(); // Only handle transitionEnd for this element

        if (e.target !== _this3.el) {
          return;
        }
      } // We have to debounce the action of stopping
      // the "transition" state, since onTransitionEnd
      // will fire more than once if there are multiple
      // properties that were transitioned.


      if (_this3.transitionRAF) {
        _raf2["default"].cancel(_this3.transitionRAF);
      }

      _this3.transitionRAF = (0, _raf2["default"])(_this3.completeTransition);
    };

    this.completeTransition = function () {
      var _props4 = _this3.props,
          stayMounted = _props4.stayMounted,
          onFinish = _props4.onFinish;
      var shouldHide = _this3.stage === 'leave';
      _this3.transitioning = false;

      if (_this3.stage === 'enter') {
        _this3.stage = 'didEnter';
      } else if (_this3.stage === 'mount') {
        _this3.stage = 'mounted';
      } else {
        _this3.stage = false;
      }

      _this3.setState({
        mountContent: !(shouldHide && !stayMounted),
        styleOverrides: {} // This is to make sure the auto/hidden overrides are gone

      }, onFinish);
    };

    this.handleRef = function (el) {
      _this3.el = el;
    };

    this.isProp = function (style, prop, value) {
      return style[prop] === value;
    };

    this.measure = function () {
      if (!_this3.el) {
        return {};
      }

      return {
        width: _this3.el.scrollWidth,
        height: _this3.el.scrollHeight
      };
    };

    this.makeStyles = function () {
      var currentStyle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
      var overrides = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
      var _props5 = _this3.props,
          style = _props5.style,
          transitionProperty = _props5.transitionProperty,
          duration = _props5.duration,
          easing = _props5.easing;
      var resolvedEasing = easings[easing] || easing || 'ease-out';
      return _extends({
        transitionProperty: transitionProperty,
        transitionDuration: duration + 'ms',
        transitionTimingFunction: '' + resolvedEasing
      }, style, currentStyle, overrides);
    };
  };
});

var caretDown = _commonjsHelpers.createCommonjsModule(function (module, exports) {

  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports["default"] = void 0;

  var _createIconComponent = _interopRequireDefault(createIconComponent.createIconComponent_1);

  var _react = _interopRequireDefault(React__default['default']);

  function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
      "default": obj
    };
  }

  var IconCaretDown = (0, _createIconComponent["default"])({
    content: _react["default"].createElement("g", null, _react["default"].createElement("path", {
      d: "M57.49 21.6a3.85 3.85 0 0 0-5.44 0l-17 17-17-17a3.85 3.85 0 0 0-5.45 0 3.85 3.85 0 0 0 0 5.45L35 49.54l22.5-22.48a3.85 3.85 0 0 0-.01-5.46z"
    })),
    height: undefined,
    width: undefined
  });
  IconCaretDown.displayName = 'IconCaretDown';
  var _default = IconCaretDown;
  exports["default"] = _default;
});
var CaretDown = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(caretDown);

var Accordion = function (_a) {
    var children = _a.children, userProvidedId = _a.id, _b = _a.customCss, customCss = _b === void 0 ? '' : _b, title = _a.title, onChange = _a.onChange, transitionDuration = _a.transitionDuration, isOpen = _a.isOpen, props = _tslib.__rest(_a, ["children", "id", "customCss", "title", "onChange", "transitionDuration", "isOpen"]);
    var id = autoId_esm.useId(userProvidedId);
    var _c = React__default['default'].useState(isOpen ? isOpen : false), isOpenState = _c[0], setIsOpen = _c[1];
    var resolvedCss = utilities.useCustomCss(customCss);
    React__default['default'].useEffect(function () {
        if (isOpen && isOpen !== isOpenState) {
            setIsOpen(isOpen);
        }
    }, [isOpenState, setIsOpen, isOpen]);
    var toggleAccordion = function () {
        if (onChange) {
            onChange();
        }
        setIsOpen(!isOpenState);
    };
    return (jsxRuntime.jsxs("div", _tslib.__assign({}, props, { children: [jsxRuntime.jsxs(HeaderButton, _tslib.__assign({ id: id, css: resolvedCss, active: isOpenState, onClick: toggleAccordion, "aria-expanded": isOpen }, { children: [title, jsxRuntime.jsx(IconWrapper, _tslib.__assign({ "aria-hidden": true, expanded: isOpenState }, { children: jsxRuntime.jsx(CaretDown, {}, void 0) }), void 0)] }), void 0),
            jsxRuntime.jsx(lib.Animate, _tslib.__assign({ show: isOpen, stayMounted: false, duration: transitionDuration ? transitionDuration : 250, style: { height: 'auto', overflow: 'hidden' }, start: { height: 0 }, transitionOnMount: true }, { children: children }), void 0)] }), void 0));
};
var HeaderButton = css.styled('button')(templateObject_1 || (templateObject_1 = _tslib.__makeTemplateObject(["\n  background-color: ", ";\n  border-radius: 5px;\n  border: none;\n  color: #444;\n  padding: 8px;\n  margin: 3px 0px;\n  width: 100%;\n  border: none;\n  text-align: left;\n  outline: none;\n  font-size: 1em;\n  font-weight: 600;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  &:hover {\n    background-color: #dcdee2;\n  }\n  &:focus-visible {\n    box-shadow: 0px 0px 0px 2px ", ";\n  }\n"], ["\n  background-color: ", ";\n  border-radius: 5px;\n  border: none;\n  color: #444;\n  padding: 8px;\n  margin: 3px 0px;\n  width: 100%;\n  border: none;\n  text-align: left;\n  outline: none;\n  font-size: 1em;\n  font-weight: 600;\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  &:hover {\n    background-color: #dcdee2;\n  }\n  &:focus-visible {\n    box-shadow: 0px 0px 0px 2px ", ";\n  }\n"])), function (_a) {
    var active = _a.active;
    return (active ? '#DCDEE2' : '#E9EBEF');
}, function (_a) {
    var theme = _a.theme;
    return theme.colors.inputFocus;
});
var IconWrapper = css.styled('div')(templateObject_2 || (templateObject_2 = _tslib.__makeTemplateObject(["\n  height: 1.2em;\n  width: 1.2em;\n  transition: transform 0.6s ease;\n  transform: ", ";\n"], ["\n  height: 1.2em;\n  width: 1.2em;\n  transition: transform 0.6s ease;\n  transform: ", ";\n"])), function (_a) {
    var expanded = _a.expanded;
    return "rotate(" + (expanded ? '180' : '0') + "deg)";
});
var templateObject_1, templateObject_2;

exports.Accordion = Accordion;
//# sourceMappingURL=Accordion.js.map
