@sb1/ffe-accordion-react 11.1.0 → 11.1.2

package/es/Accordion.js

@@ -5,20 +5,19 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 import React from 'react';
 import { node, oneOf, string } from 'prop-types';
 import classNames from 'classnames';
-var Accordion = function Accordion(_ref) {
+import { AccordionProvider } from './AccordionContext';
+export var Accordion = function Accordion(_ref) {
   var children = _ref.children,
     headingLevel = _ref.headingLevel,
     className = _ref.className,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/React.createElement("div", _extends({
+  return /*#__PURE__*/React.createElement(AccordionProvider, {
+    headingLevel: headingLevel
+  }, /*#__PURE__*/React.createElement("div", _extends({
     className: classNames(className, 'ffe-accordion'),
     role: "group",
     "aria-label": "Trekkspillmeny"
-  }, rest), React.Children.map(children, function (child, index) {
-    return /*#__PURE__*/React.cloneElement(child, {
-      headingLevel: headingLevel
-    });
-  }));
+  }, rest), children));
 };
 Accordion.propTypes = {
   /** Accordion items */
@@ -27,5 +26,4 @@ Accordion.propTypes = {
   headingLevel: oneOf([1, 2, 3, 4, 5, 6]).isRequired,
   /** Class assigned the container */
   className: string
-};
-export default Accordion;
+};

package/es/AccordionContext.js

@@ -0,0 +1,16 @@
+import React, { createContext } from 'react';
+import { node, oneOf } from 'prop-types';
+export var AccordionContext = /*#__PURE__*/createContext({});
+export var AccordionProvider = function AccordionProvider(_ref) {
+  var children = _ref.children,
+    headingLevel = _ref.headingLevel;
+  return /*#__PURE__*/React.createElement(AccordionContext.Provider, {
+    value: {
+      headingLevel: headingLevel
+    }
+  }, children);
+};
+AccordionProvider.propTypes = {
+  children: node,
+  headingLevel: oneOf([1, 2, 3, 4, 5, 6]).isRequired
+};

package/es/AccordionItem.js

@@ -1,5 +1,4 @@
-var _excluded = ["children", "heading", "defaultOpen", "isOpen", "className", "onToggleOpen", "ariaLabel"],
-  _excluded2 = ["headingLevel", "forwardedRef"];
+var _excluded = ["children", "heading", "defaultOpen", "isOpen", "className", "onToggleOpen", "ariaLabel"];
 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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -9,13 +8,14 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 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; }
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useRef, useState, useContext } from 'react';
 import { bool, func, node, string } from 'prop-types';
 import { v4 as uuid } from 'uuid';
 import { Icon } from '@sb1/ffe-icons-react';
 import { Collapse } from '@sb1/ffe-collapse-react';
 import classNames from 'classnames';
-var AccordionItem = function AccordionItem(_ref) {
+import { AccordionContext } from './AccordionContext';
+export var AccordionItem = function AccordionItem(_ref) {
   var children = _ref.children,
     heading = _ref.heading,
     defaultOpen = _ref.defaultOpen,
@@ -24,7 +24,7 @@ var AccordionItem = function AccordionItem(_ref) {
     _ref$onToggleOpen = _ref.onToggleOpen,
     onToggleOpen = _ref$onToggleOpen === void 0 ? Function.prototype : _ref$onToggleOpen,
     ariaLabel = _ref.ariaLabel,
-    accordionProps = _objectWithoutProperties(_ref, _excluded);
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useState = useState(defaultOpen),
     _useState2 = _slicedToArray(_useState, 2),
     isExpanded = _useState2[0],
@@ -39,6 +39,8 @@ var AccordionItem = function AccordionItem(_ref) {
     setFocus = _useState6[1];
   var buttonId = useRef(uuid());
   var contentId = useRef(uuid());
+  var _useContext = useContext(AccordionContext),
+    headingLevel = _useContext.headingLevel;
   var expandMoreIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtMzczLjUzOXEtNy4yMzEgMC0xMy40NjEtMi4zMDgtNi4yMzEtMi4zMDgtMTEuODQ2LTcuOTIzTDI3NC45MjQtNTYzLjUzOXEtOC4zMDgtOC4zMDctOC41LTIwLjg4NC0uMTkzLTEyLjU3NyA4LjUtMjEuMjY5IDguNjkyLTguNjkyIDIxLjA3Ni04LjY5MnQyMS4wNzYgOC42OTJMNDgwLTQ0Mi43NjhsMTYyLjkyNC0xNjIuOTI0cTguMzA3LTguMzA3IDIwLjg4NC04LjUgMTIuNTc2LS4xOTIgMjEuMjY4IDguNSA4LjY5MyA4LjY5MiA4LjY5MyAyMS4wNzcgMCAxMi4zODQtOC42OTMgMjEuMDc2TDUwNS4zMDctMzgzLjc3cS01LjYxNSA1LjYxNS0xMS44NDYgNy45MjMtNi4yMyAyLjMwOC0xMy40NjEgMi4zMDhaIi8+PC9zdmc+';
   useEffect(function () {
     if (isOpen != null) {
@@ -53,9 +55,6 @@ var AccordionItem = function AccordionItem(_ref) {
       setIsExpanded(!isExpanded);
     }
   };
-  var headingLevel = accordionProps.headingLevel,
-    forwardedRef = accordionProps.forwardedRef,
-    rest = _objectWithoutProperties(accordionProps, _excluded2);
   var collapseHidden = !isExpanded && !isAnimating;
   var H = "h".concat(headingLevel);
   return /*#__PURE__*/React.createElement("div", _extends({
@@ -68,7 +67,6 @@ var AccordionItem = function AccordionItem(_ref) {
   }, /*#__PURE__*/React.createElement("button", {
     type: "button",
     id: buttonId.current,
-    ref: forwardedRef,
     "aria-expanded": isExpanded ? 'true' : 'false',
     "aria-controls": contentId.current,
     "aria-label": ariaLabel,
@@ -119,9 +117,4 @@ AccordionItem.propTypes = {
   onToggleOpen: func,
   /** aria-label for the button */
   ariaLabel: string
-};
-export default /*#__PURE__*/React.forwardRef(function (props, ref) {
-  return /*#__PURE__*/React.createElement(AccordionItem, _extends({}, props, {
-    forwardedRef: ref
-  }));
-});
+};

package/es/index.js

@@ -1,2 +1,2 @@
-export { default as Accordion } from './Accordion';
-export { default as AccordionItem } from './AccordionItem';
+export { Accordion } from './Accordion';
+export { AccordionItem } from './AccordionItem';

package/lib/Accordion.js

@@ -3,29 +3,28 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.Accordion = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = require("prop-types");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _AccordionContext = require("./AccordionContext");
 var _excluded = ["children", "headingLevel", "className"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 _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; }
-var Accordion = function Accordion(_ref) {
+var Accordion = exports.Accordion = function Accordion(_ref) {
   var children = _ref.children,
     headingLevel = _ref.headingLevel,
     className = _ref.className,
     rest = _objectWithoutProperties(_ref, _excluded);
-  return /*#__PURE__*/_react.default.createElement("div", _extends({
+  return /*#__PURE__*/_react.default.createElement(_AccordionContext.AccordionProvider, {
+    headingLevel: headingLevel
+  }, /*#__PURE__*/_react.default.createElement("div", _extends({
     className: (0, _classnames.default)(className, 'ffe-accordion'),
     role: "group",
     "aria-label": "Trekkspillmeny"
-  }, rest), _react.default.Children.map(children, function (child, index) {
-    return /*#__PURE__*/_react.default.cloneElement(child, {
-      headingLevel: headingLevel
-    });
-  }));
+  }, rest), children));
 };
 Accordion.propTypes = {
   /** Accordion items */
@@ -34,5 +33,4 @@ Accordion.propTypes = {
   headingLevel: (0, _propTypes.oneOf)([1, 2, 3, 4, 5, 6]).isRequired,
   /** Class assigned the container */
   className: _propTypes.string
-};
-var _default = exports.default = Accordion;
+};

package/lib/AccordionContext.js

@@ -0,0 +1,25 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AccordionProvider = exports.AccordionContext = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = require("prop-types");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+var AccordionContext = exports.AccordionContext = /*#__PURE__*/(0, _react.createContext)({});
+var AccordionProvider = exports.AccordionProvider = function AccordionProvider(_ref) {
+  var children = _ref.children,
+    headingLevel = _ref.headingLevel;
+  return /*#__PURE__*/_react.default.createElement(AccordionContext.Provider, {
+    value: {
+      headingLevel: headingLevel
+    }
+  }, children);
+};
+AccordionProvider.propTypes = {
+  children: _propTypes.node,
+  headingLevel: (0, _propTypes.oneOf)([1, 2, 3, 4, 5, 6]).isRequired
+};

package/lib/AccordionItem.js

@@ -4,15 +4,15 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.AccordionItem = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _propTypes = require("prop-types");
 var _uuid = require("uuid");
 var _ffeIconsReact = require("@sb1/ffe-icons-react");
 var _ffeCollapseReact = require("@sb1/ffe-collapse-react");
 var _classnames = _interopRequireDefault(require("classnames"));
-var _excluded = ["children", "heading", "defaultOpen", "isOpen", "className", "onToggleOpen", "ariaLabel"],
-  _excluded2 = ["headingLevel", "forwardedRef"];
+var _AccordionContext = require("./AccordionContext");
+var _excluded = ["children", "heading", "defaultOpen", "isOpen", "className", "onToggleOpen", "ariaLabel"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -25,7 +25,7 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 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; }
-var AccordionItem = function AccordionItem(_ref) {
+var AccordionItem = exports.AccordionItem = function AccordionItem(_ref) {
   var children = _ref.children,
     heading = _ref.heading,
     defaultOpen = _ref.defaultOpen,
@@ -34,7 +34,7 @@ var AccordionItem = function AccordionItem(_ref) {
     _ref$onToggleOpen = _ref.onToggleOpen,
     onToggleOpen = _ref$onToggleOpen === void 0 ? Function.prototype : _ref$onToggleOpen,
     ariaLabel = _ref.ariaLabel,
-    accordionProps = _objectWithoutProperties(_ref, _excluded);
+    rest = _objectWithoutProperties(_ref, _excluded);
   var _useState = (0, _react.useState)(defaultOpen),
     _useState2 = _slicedToArray(_useState, 2),
     isExpanded = _useState2[0],
@@ -49,6 +49,8 @@ var AccordionItem = function AccordionItem(_ref) {
     setFocus = _useState6[1];
   var buttonId = (0, _react.useRef)((0, _uuid.v4)());
   var contentId = (0, _react.useRef)((0, _uuid.v4)());
+  var _useContext = (0, _react.useContext)(_AccordionContext.AccordionContext),
+    headingLevel = _useContext.headingLevel;
   var expandMoreIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjQiPjxwYXRoIGQ9Ik00ODAtMzczLjUzOXEtNy4yMzEgMC0xMy40NjEtMi4zMDgtNi4yMzEtMi4zMDgtMTEuODQ2LTcuOTIzTDI3NC45MjQtNTYzLjUzOXEtOC4zMDgtOC4zMDctOC41LTIwLjg4NC0uMTkzLTEyLjU3NyA4LjUtMjEuMjY5IDguNjkyLTguNjkyIDIxLjA3Ni04LjY5MnQyMS4wNzYgOC42OTJMNDgwLTQ0Mi43NjhsMTYyLjkyNC0xNjIuOTI0cTguMzA3LTguMzA3IDIwLjg4NC04LjUgMTIuNTc2LS4xOTIgMjEuMjY4IDguNSA4LjY5MyA4LjY5MiA4LjY5MyAyMS4wNzcgMCAxMi4zODQtOC42OTMgMjEuMDc2TDUwNS4zMDctMzgzLjc3cS01LjYxNSA1LjYxNS0xMS44NDYgNy45MjMtNi4yMyAyLjMwOC0xMy40NjEgMi4zMDhaIi8+PC9zdmc+';
   (0, _react.useEffect)(function () {
     if (isOpen != null) {
@@ -63,9 +65,6 @@ var AccordionItem = function AccordionItem(_ref) {
       setIsExpanded(!isExpanded);
     }
   };
-  var headingLevel = accordionProps.headingLevel,
-    forwardedRef = accordionProps.forwardedRef,
-    rest = _objectWithoutProperties(accordionProps, _excluded2);
   var collapseHidden = !isExpanded && !isAnimating;
   var H = "h".concat(headingLevel);
   return /*#__PURE__*/_react.default.createElement("div", _extends({
@@ -78,7 +77,6 @@ var AccordionItem = function AccordionItem(_ref) {
   }, /*#__PURE__*/_react.default.createElement("button", {
     type: "button",
     id: buttonId.current,
-    ref: forwardedRef,
     "aria-expanded": isExpanded ? 'true' : 'false',
     "aria-controls": contentId.current,
     "aria-label": ariaLabel,
@@ -129,9 +127,4 @@ AccordionItem.propTypes = {
   onToggleOpen: _propTypes.func,
   /** aria-label for the button */
   ariaLabel: _propTypes.string
-};
-var _default = exports.default = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  return /*#__PURE__*/_react.default.createElement(AccordionItem, _extends({}, props, {
-    forwardedRef: ref
-  }));
-});
+};

package/lib/index.js

@@ -6,15 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 Object.defineProperty(exports, "Accordion", {
   enumerable: true,
   get: function get() {
-    return _Accordion.default;
+    return _Accordion.Accordion;
   }
 });
 Object.defineProperty(exports, "AccordionItem", {
   enumerable: true,
   get: function get() {
-    return _AccordionItem.default;
+    return _AccordionItem.AccordionItem;
   }
 });
-var _Accordion = _interopRequireDefault(require("./Accordion"));
-var _AccordionItem = _interopRequireDefault(require("./AccordionItem"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _Accordion = require("./Accordion");
+var _AccordionItem = require("./AccordionItem");

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@sb1/ffe-accordion-react",
-    "version": "11.1.0",
+    "version": "11.1.2",
     "license": "MIT",
     "author": "SpareBank 1",
     "files": [
@@ -24,8 +24,8 @@
         "test:watch": "ffe-buildtool jest --watch"
     },
     "dependencies": {
-        "@sb1/ffe-accordion": "^10.0.9",
-        "@sb1/ffe-collapse-react": "^3.0.0",
+        "@sb1/ffe-accordion": "^10.0.10",
+        "@sb1/ffe-collapse-react": "^3.0.2",
         "@sb1/ffe-icons-react": "^9.0.7",
         "classnames": "^2.3.1",
         "prop-types": "^15.7.2",
@@ -42,5 +42,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "61ed382e40df3befbff8393cc9fba2beac9de990"
+    "gitHead": "f2bbfac2f7648f6a9dc6baacd22f142014d0df05"
 }

package/types/index.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 
-export interface AccordionItemProps extends React.HTMLProps<HTMLDivElement> {
+export interface AccordionItemProps
+    extends React.ComponentPropsWithoutRef<'div'> {
     heading: string | React.ReactElement;
     defaultOpen?: boolean;
     isOpen?: boolean;
@@ -8,7 +9,7 @@ export interface AccordionItemProps extends React.HTMLProps<HTMLDivElement> {
     ariaLabel?: string;
 }
 
-export interface AccordionProps extends React.HTMLProps<HTMLDivElement> {
+export interface AccordionProps extends React.ComponentPropsWithoutRef<'div'> {
     children:
         | (React.ReactElement<AccordionItemProps> | null)[]
         | React.ReactElement<AccordionItemProps>;