@dnb/eufemia 10.4.2 → 10.6.0

package/cjs/components/accordion/Accordion.js

@@ -4,8 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
+var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _componentHelper = require("../../shared/component-helper");
 var _SpacingHelper = require("../space/SpacingHelper");
@@ -15,293 +14,257 @@ var _AccordionContent = _interopRequireDefault(require("./AccordionContent"));
 var _AccordionContext = _interopRequireDefault(require("./AccordionContext"));
 var _AccordionProviderContext = _interopRequireDefault(require("./AccordionProviderContext"));
 var _Context = _interopRequireDefault(require("../../shared/Context"));
-var _AccordionPropTypes = require("./AccordionPropTypes");
 var _AccordionStore = require("./AccordionStore");
+var _defaultProps = require("./defaultProps");
 var _AccordionHeader;
-const _excluded = ["variant", "className", "class", "prerender", "prevent_rerender", "prevent_rerender_conditional", "single_container", "remember_state", "disabled", "skeleton", "no_animation", "expanded_ssr", "children", "id", "group", "expanded", "title", "description", "left_component", "icon", "icon_position", "icon_size", "on_change", "on_state_update", "contentRef"];
+const _excluded = ["variant", "icon_size"],
+  _excluded2 = ["variant", "className", "class", "prerender", "prevent_rerender", "prevent_rerender_conditional", "single_container", "remember_state", "disabled", "skeleton", "no_animation", "expanded_ssr", "children", "id", "group", "title", "description", "left_component", "icon", "icon_position", "icon_size", "on_change", "on_state_update", "contentRef"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-class Accordion extends _react.default.PureComponent {
-  static getDerivedStateFromProps(props, state) {
-    if (state._listenForPropChanges) {
-      if (props.expanded !== state._expanded) {
-        state.expanded = (0, _componentHelper.isTrue)(props.expanded);
-        state._expanded = props.expanded;
-      }
-      if (props.group && !state.group) {
-        state.group = props.group;
-      }
-    }
-    state._listenForPropChanges = true;
-    return state;
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+function Accordion(_ref) {
+  let {
+      variant = 'outlined',
+      icon_size = 'medium'
+    } = _ref,
+    restOfProps = _objectWithoutProperties(_ref, _excluded);
+  const props = _objectSpread({
+    variant,
+    icon_size
+  }, restOfProps);
+  const context = (0, _react.useContext)(_AccordionProviderContext.default);
+  const group = props.group || (context === null || context === void 0 ? void 0 : context.group);
+  const id = (0, _react.useRef)(props.id || (0, _componentHelper.makeUniqueId)()).current;
+  const store = new _AccordionStore.Store({
+    id: props.id,
+    group
+  });
+  const [previousExpanded, setPreviousExpanded] = (0, _react.useState)(props.expanded);
+  const [expanded, setExpanded] = (0, _react.useState)(getInitialExpandedState());
+  if (props.expanded !== previousExpanded) {
+    setExpanded(props.expanded !== undefined ? props.expanded : false);
+    setPreviousExpanded(props.expanded);
   }
-  constructor(props, context) {
-    var _this;
-    super(props);
-    _this = this;
-    _defineProperty(this, "handleDisabledClick", e => {
-      e.preventDefault();
-      return false;
-    });
-    _defineProperty(this, "callOnChangeHandler", function () {
-      var _this$context;
-      for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) {
-        params[_key] = arguments[_key];
-      }
-      _this.callOnChange(...params);
-      if ((_this$context = _this.context) !== null && _this$context !== void 0 && _this$context.onChange) {
-        var _this$context2;
-        (_this$context2 = _this.context) === null || _this$context2 === void 0 ? void 0 : _this$context2.onChange(...params);
-      }
-      if (_this.state.group && typeof window !== 'undefined') {
-        var _window, _window$__dnbAccordio;
-        (_window = window) === null || _window === void 0 ? void 0 : (_window$__dnbAccordio = _window.__dnbAccordion[_this.state.group]) === null || _window$__dnbAccordio === void 0 ? void 0 : _window$__dnbAccordio.onChange(...params);
-      }
-    });
-    _defineProperty(this, "callOnChange", _ref => {
-      let {
-        expanded,
-        event
-      } = _ref;
-      this.changeOpened(expanded, event);
-      (0, _componentHelper.dispatchCustomElementEvent)(this, 'on_change', {
-        expanded,
-        event
-      });
-    });
-    this._id = props.id || (0, _componentHelper.makeUniqueId)();
-    this.state = {
-      _expanded: props.expanded,
-      expanded: props.expanded !== null ? (0, _componentHelper.isTrue)(props.expanded) : (0, _componentHelper.isTrue)(context === null || context === void 0 ? void 0 : context.expanded),
-      group: props.group || (context === null || context === void 0 ? void 0 : context.group),
-      _listenForPropChanges: false
-    };
-    if (typeof window === 'undefined' && (0, _componentHelper.isTrue)(props.expanded_ssr || (context === null || context === void 0 ? void 0 : context.expanded_ssr))) {
-      this.state.expanded = true;
+  const thisInstance = {
+    _id: id,
+    context,
+    handleDisabledClick,
+    callOnChange,
+    callOnChangeHandler,
+    close,
+    setExpandedState,
+    state: {
+      expanded,
+      group
+    },
+    props,
+    store
+  };
+  (0, _react.useEffect)(() => {
+    if (group && typeof window !== 'undefined') {
+      window['__dnbAccordion'] = window['__dnbAccordion'] || {};
+      window['__dnbAccordion'][group] = window['__dnbAccordion'][group] || new _AccordionStore.AccordionStore(group);
+      window['__dnbAccordion'][group].addInstance(thisInstance);
     }
-    if (this.state.group && typeof window !== 'undefined') {
-      window.__dnbAccordion = window.__dnbAccordion || {};
-      window.__dnbAccordion[this.state.group] = window.__dnbAccordion[this.state.group] || new _AccordionStore.AccordionStore(this.state.group);
-      window.__dnbAccordion[this.state.group].addInstance(this);
+    if (context && typeof (context === null || context === void 0 ? void 0 : context.onInit) === 'function') {
+      context.onInit(thisInstance);
     }
-    this.store = new _AccordionStore.Store({
-      id: props.id,
-      group: this.state.group
-    });
-    if ((0, _componentHelper.isTrue)(props.remember_state || context.remember_state) && (0, _componentHelper.isTrue)(props.expanded)) {
-      const expanded = this.store.getState();
-      if (expanded === false) {
-        this.state.expanded = false;
+    return () => {
+      if (group && typeof window !== 'undefined') {
+        var _window, _window$__dnbAccordio;
+        (_window = window) === null || _window === void 0 ? void 0 : (_window$__dnbAccordio = _window['__dnbAccordion'][group]) === null || _window$__dnbAccordio === void 0 ? void 0 : _window$__dnbAccordio.removeInstance(thisInstance);
       }
+    };
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (context.flush_remembered_state) {
+      store.flush();
+      setExpanded(props.expanded);
     }
-    if (context && typeof (context === null || context === void 0 ? void 0 : context.onInit) === 'function') {
-      context.onInit(this);
+    if (context !== null && context !== void 0 && context.expanded_id && context.expanded_id === props.id) {
+      setExpanded(true);
     }
-    if (typeof window !== 'undefined' && (0, _componentHelper.isTrue)(props.expanded_ssr || (context === null || context === void 0 ? void 0 : context.expanded_ssr))) {
-      this.state.expanded = false;
+  }, [context.flush_remembered_state, context.expanded_id]);
+  function getInitialExpandedState() {
+    if (props.expanded_ssr || context !== null && context !== void 0 && context.expanded_ssr) {
+      return typeof window === 'undefined';
     }
-    if ((0, _componentHelper.isTrue)(this.props.remember_state || context.remember_state)) {
-      const expanded = this.store.getState();
-      if (expanded) {
-        this.state.expanded = true;
+    if (props.remember_state || context.remember_state) {
+      const storedExpanded = store.getState();
+      if (props.expanded && storedExpanded === false) {
+        return false;
+      }
+      if (storedExpanded) {
+        return true;
       }
     }
+    return props.expanded !== undefined ? props.expanded : (context === null || context === void 0 ? void 0 : context.expanded) !== undefined ? context.expanded : false;
   }
-  componentDidMount() {
-    this._isMounted = true;
+  function setExpandedState(expanded) {
+    setExpanded(expanded);
   }
-  componentWillUnmount() {
-    this._isMounted = false;
-    clearTimeout(this._animationState);
-    clearTimeout(this._openTimeout);
-    clearTimeout(this._changeOpenState);
-    if (this.state.group && typeof window !== 'undefined') {
-      var _window2, _window2$__dnbAccordi;
-      (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$__dnbAccordi = _window2.__dnbAccordion[this.state.group]) === null || _window2$__dnbAccordi === void 0 ? void 0 : _window2$__dnbAccordi.removeInstance(this);
+  function close() {
+    changeOpened(false);
+  }
+  function changeOpened(expanded) {
+    setExpanded(expanded);
+    if (props.remember_state || context.remember_state) {
+      store.saveState(expanded);
     }
   }
-  componentDidUpdate(props) {
-    var _this$context3;
-    if ((0, _componentHelper.isTrue)(this.context.flush_remembered_state)) {
-      this.store.flush();
-      this.setState({
-        expanded: (0, _componentHelper.isTrue)(this.props.expanded)
-      });
+  function handleDisabledClick(e) {
+    e.preventDefault();
+    return false;
+  }
+  function callOnChangeHandler() {
+    for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) {
+      params[_key] = arguments[_key];
     }
-    if ((_this$context3 = this.context) !== null && _this$context3 !== void 0 && _this$context3.expanded_id && this.context.expanded_id === props.id) {
-      this.setState({
-        expanded: true
-      });
+    callOnChange(...params);
+    if (context !== null && context !== void 0 && context.onChange) {
+      context === null || context === void 0 ? void 0 : context.onChange(...params);
+    }
+    if (group && typeof window !== 'undefined') {
+      var _window2, _window2$__dnbAccordi;
+      (_window2 = window) === null || _window2 === void 0 ? void 0 : (_window2$__dnbAccordi = _window2['__dnbAccordion'][group]) === null || _window2$__dnbAccordi === void 0 ? void 0 : _window2$__dnbAccordi.onChange(...params);
     }
   }
-  setExpandedState(expanded) {
-    this.setState({
+  function callOnChange() {
+    const {
       expanded,
-      _listenForPropChanges: false
-    });
-  }
-  close() {
-    this.changeOpened(false);
-  }
-  changeOpened(expanded) {
-    if (!this._isMounted) {
-      return;
-    }
-    this.setState({
+      event
+    } = arguments.length <= 0 ? undefined : arguments[0];
+    changeOpened(expanded);
+    (0, _componentHelper.dispatchCustomElementEvent)(thisInstance, 'on_change', {
       expanded,
-      _listenForPropChanges: false
+      event
     });
-    if ((0, _componentHelper.isTrue)(this.props.remember_state) || (0, _componentHelper.isTrue)(this.context.remember_state)) {
-      this.store.saveState(expanded);
-    }
   }
-  render() {
-    return _react.default.createElement(_Context.default.Consumer, null, globalContext => _react.default.createElement(_AccordionContext.default.Consumer, null, nestedContext => {
-      let {
-        expanded
-      } = this.state;
-      const props = (0, _componentHelper.extendPropsWithContextInClassComponent)(this.props, Accordion.defaultProps, this.context, nestedContext, {
-        skeleton: globalContext === null || globalContext === void 0 ? void 0 : globalContext.skeleton
-      }, globalContext.accordion, globalContext.translation.Accordion);
-      if (expanded === null && globalContext.accordion) {
-        if (globalContext.accordion.expanded) {
-          expanded = (0, _componentHelper.isTrue)(props.expanded);
-        }
-      }
-      const {
-          variant,
-          className,
-          class: _className,
-          prerender,
-          prevent_rerender,
-          prevent_rerender_conditional,
-          single_container,
-          remember_state,
-          disabled,
-          skeleton,
-          no_animation,
-          expanded_ssr: _expanded_ssr,
-          children,
-          id: _id,
-          group: _group,
-          expanded: _expanded,
-          title,
-          description,
-          left_component,
-          icon,
-          icon_position,
-          icon_size,
-          on_change,
-          on_state_update,
-          contentRef
-        } = props,
-        rest = _objectWithoutProperties(props, _excluded);
-      const id = this._id;
-      const mainParams = {
-        id,
-        className: (0, _classnames.default)('dnb-accordion', (0, _SpacingHelper.createSpacingClasses)(props), className, _className, expanded && 'dnb-accordion--expanded', variant && `dnb-accordion__variant--${variant}`, (0, _componentHelper.isTrue)(prerender) && 'dnb-accordion--prerender')
-      };
-      if (this.state.open) {
-        mainParams.open = true;
+  return _react.default.createElement(_Context.default.Consumer, null, globalContext => _react.default.createElement(_AccordionContext.default.Consumer, null, nestedContext => {
+    let expandedState = expanded;
+    const extendedProps = (0, _componentHelper.extendPropsWithContext)(props, _defaultProps.accordionDefaultProps, context, nestedContext, {
+      skeleton: globalContext === null || globalContext === void 0 ? void 0 : globalContext.skeleton
+    }, globalContext.Accordion, globalContext.translation.Accordion);
+    if (expandedState === undefined && globalContext.Accordion) {
+      if (globalContext.Accordion.expanded) {
+        expandedState = extendedProps.expanded;
       }
-      (0, _componentHelper.validateDOMAttributes)(this.props, rest);
-      const extendProps = (0, _componentHelper.extendPropsWithContextInClassComponent)(this.props, Accordion.defaultProps, this.state, this.context);
-      const context = _objectSpread(_objectSpread({}, extendProps), {}, {
-        id,
-        expanded,
-        prerender: (0, _componentHelper.isTrue)(prerender),
-        prevent_rerender: (0, _componentHelper.isTrue)(prevent_rerender),
-        prevent_rerender_conditional: (0, _componentHelper.isTrue)(prevent_rerender_conditional),
-        single_container: (0, _componentHelper.isTrue)(single_container),
-        remember_state: (0, _componentHelper.isTrue)(remember_state),
-        disabled: (0, _componentHelper.isTrue)(disabled),
-        skeleton: (0, _componentHelper.isTrue)(skeleton),
-        no_animation: (0, _componentHelper.isTrue)(no_animation),
-        callOnChange: this.callOnChangeHandler
-      });
-      if ((0, _componentHelper.isTrue)(disabled)) {
-        mainParams.onClick = this.handleDisabledClick;
-      }
-      return _react.default.createElement(_AccordionContext.default.Provider, {
-        value: context
-      }, _react.default.createElement("div", mainParams, (0, _componentHelper.findElementInChildren)(children, cur => cur.type === _AccordionHeader2.default) ? null : _AccordionHeader || (_AccordionHeader = _react.default.createElement(_AccordionHeader2.default, null)), (0, _componentHelper.findElementInChildren)(children, cur => cur.type === _AccordionContent.default) ? children : _react.default.createElement(_AccordionContent.default, null, children)));
-    }));
-  }
-}
-exports.default = Accordion;
-_defineProperty(Accordion, "contextType", _AccordionProviderContext.default);
-_defineProperty(Accordion, "Provider", _AccordionGroup.default);
-_defineProperty(Accordion, "Header", _AccordionHeader2.default);
-_defineProperty(Accordion, "Content", _AccordionContent.default);
-_defineProperty(Accordion, "defaultProps", _objectSpread({}, _AccordionPropTypes.accordionDefaultProps));
-process.env.NODE_ENV !== "production" ? Accordion.propTypes = _objectSpread({}, _AccordionPropTypes.accordionPropTypes) : void 0;
-class Group extends _react.default.PureComponent {
-  constructor(props) {
-    super(props);
-    _defineProperty(this, "state", {});
-    _defineProperty(this, "onInit", instance => {
-      if (instance.props.id && !this._IDs.includes(instance.props.id)) {
-        this._IDs.push(instance.props.id);
-      }
-    });
-    let group;
-    if (props.id) {
-      group = props.id;
-    } else if (!props.group) {
-      group = '#' + (0, _componentHelper.makeUniqueId)();
     }
-    this.state.group = group;
-    this.store = new _AccordionStore.Store({
+    const {
+        variant,
+        className,
+        class: _className,
+        prerender,
+        prevent_rerender,
+        prevent_rerender_conditional,
+        single_container,
+        remember_state,
+        disabled,
+        skeleton,
+        no_animation,
+        expanded_ssr: _expanded_ssr,
+        children,
+        id: _id,
+        group: _group,
+        title,
+        description,
+        left_component,
+        icon,
+        icon_position,
+        icon_size,
+        on_change,
+        on_state_update,
+        contentRef
+      } = extendedProps,
+      restOfExtendedProps = _objectWithoutProperties(extendedProps, _excluded2);
+    const mainParams = {
+      id,
+      className: (0, _classnames.default)('dnb-accordion', (0, _SpacingHelper.createSpacingClasses)(extendedProps), className, _className, expandedState && 'dnb-accordion--expanded', variant && `dnb-accordion__variant--${variant}`, prerender && 'dnb-accordion--prerender')
+    };
+    if (disabled) {
+      mainParams.onClick = handleDisabledClick;
+    }
+    (0, _componentHelper.validateDOMAttributes)(props, restOfExtendedProps);
+    const extendedPropsForContext = (0, _componentHelper.extendPropsWithContext)(props, _defaultProps.accordionDefaultProps, {
+      expanded,
       group
+    }, context);
+    const accordionContext = _objectSpread(_objectSpread({}, extendedPropsForContext), {}, {
+      id,
+      expanded: expandedState,
+      prerender: prerender,
+      prevent_rerender: prevent_rerender,
+      prevent_rerender_conditional: prevent_rerender_conditional,
+      single_container: single_container,
+      remember_state: remember_state,
+      disabled: disabled,
+      skeleton: skeleton,
+      no_animation: no_animation,
+      callOnChange: callOnChangeHandler
     });
-    this._IDs = [];
-    if ((0, _componentHelper.isTrue)(props.remember_state) && !props.id) {
-      (0, _AccordionStore.rememberWarning)('accordion group');
-    }
+    return _react.default.createElement(_AccordionContext.default.Provider, {
+      value: accordionContext
+    }, _react.default.createElement("div", mainParams, (0, _componentHelper.findElementInChildren)(children, cur => cur.type === _AccordionHeader2.default) ? null : _AccordionHeader || (_AccordionHeader = _react.default.createElement(_AccordionHeader2.default, null)), (0, _componentHelper.findElementInChildren)(children, cur => cur.type === _AccordionContent.default) ? children : _react.default.createElement(_AccordionContent.default, null, children)));
+  }));
+}
+Accordion.defaultProps = _defaultProps.accordionDefaultProps;
+const Group = props => {
+  if (props.remember_state && !props.id) {
+    (0, _AccordionStore.rememberWarning)('accordion group');
   }
-  componentDidMount() {
-    const storedData = this.store.getData();
-    if (storedData !== null && storedData !== void 0 && storedData.id) {
-      if (!this._IDs.includes(storedData.id)) {
-        const expanded_id = this._IDs[0];
-        if (expanded_id) {
-          this.setState({
-            expanded_id
-          }, () => {
-            this.store.saveState(true, expanded_id);
-            this.setState({
-              expanded_id: null
-            });
-          });
-        }
-      }
+  const [expandedId, setExpandedId] = (0, _react.useState)(null);
+  const instanceIDs = (0, _react.useRef)([]);
+  const group = props !== null && props !== void 0 && props.id ? props.id : !props.group ? '#' + (0, _componentHelper.makeUniqueId)() : undefined;
+  const store = new _AccordionStore.Store({
+    group
+  });
+  (0, _react.useEffect)(() => {
+    const storedData = store.getData();
+    const currentIDs = instanceIDs === null || instanceIDs === void 0 ? void 0 : instanceIDs.current;
+    if (!(storedData !== null && storedData !== void 0 && storedData.id)) {
+      return;
+    }
+    if (currentIDs.includes(storedData === null || storedData === void 0 ? void 0 : storedData.id)) {
+      return;
+    }
+    const fallbackId = currentIDs[0];
+    if (!fallbackId) {
+      return;
+    }
+    setExpandedId(fallbackId);
+  }, []);
+  (0, _react.useEffect)(() => {
+    if (!expandedId) {
+      return;
+    }
+    store.saveState(true, expandedId);
+    setExpandedId(null);
+  }, [expandedId]);
+  function onInit(instance) {
+    if (instance.props.id && !instanceIDs.current.includes(instance.props.id)) {
+      instanceIDs.current.push(instance.props.id);
     }
   }
-  render() {
-    return _react.default.createElement(_AccordionGroup.default, _extends({
-      onInit: this.onInit
-    }, this.props, this.state));
-  }
-}
-_defineProperty(Group, "defaultProps", {
-  id: null,
-  group: null,
-  remember_state: null
-});
-process.env.NODE_ENV !== "production" ? Group.propTypes = {
-  id: _propTypes.default.string,
-  group: _propTypes.default.string,
-  remember_state: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool])
-} : void 0;
+  return _react.default.createElement(_AccordionGroup.default, _extends({
+    onInit: onInit
+  }, props, {
+    group: group,
+    expanded_id: expandedId || props.expanded_id
+  }));
+};
+Accordion.Provider = _AccordionGroup.default;
+Accordion.Header = _AccordionHeader2.default;
+Accordion.Content = _AccordionContent.default;
 Accordion.Group = Group;
-Accordion.Group.Store = function (group) {
+Group.Store = function (group) {
   let id = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
   return new _AccordionStore.Store({
     group,
@@ -313,4 +276,6 @@ Accordion.Store = id => {
     id
   });
 };
+var _default = Accordion;
+exports.default = _default;
 //# sourceMappingURL=Accordion.js.map