dibk-design 2.6.3 → 2.6.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,43 +1,48 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports.default = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
+ var _react = _interopRequireWildcard(require("react"));
8
9
  var _propTypes = _interopRequireDefault(require("prop-types"));
9
10
  var _reactRouterDom = require("react-router-dom");
11
+ var _helpers = require("../../functions/helpers");
10
12
  var _StepModule = _interopRequireDefault(require("./Step.module.scss"));
11
13
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
14
+ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
+ 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; }
12
16
  var Step = function Step(props) {
13
- var getActiveClass = function getActiveClass() {
14
- return props.activeStepId === props.step.id ? _StepModule.default.active : "";
17
+ var getActiveClass = function getActiveClass(step) {
18
+ return props.activeStepId === step.id ? _StepModule.default.active : "";
15
19
  };
16
- var getFinishedClass = function getFinishedClass() {
17
- return props.step.finished ? _StepModule.default.finished : "";
20
+ var getFinishedClass = function getFinishedClass(step) {
21
+ return step.finished ? _StepModule.default.finished : "";
18
22
  };
19
- var getErrorClass = function getErrorClass() {
20
- return props.step.hasErrors ? _StepModule.default.hasErrors : "";
23
+ var getErrorClass = function getErrorClass(step) {
24
+ return step.hasErrors ? _StepModule.default.hasErrors : "";
21
25
  };
22
- var step = props.step;
23
- return step.link && Object.keys(step.link).length ? _react.default.createElement(_reactRouterDom.Link, {
26
+ var renderStepContent = function renderStepContent(step, index) {
27
+ return _react.default.createElement(_react.Fragment, null, _react.default.createElement("span", {
28
+ className: _StepModule.default.stepNumber
29
+ }, index + 1), _react.default.createElement("span", {
30
+ className: _StepModule.default.stepName
31
+ }, step.name));
32
+ };
33
+ var step = props.step,
34
+ index = props.index,
35
+ activeStepId = props.activeStepId;
36
+ return _react.default.createElement("li", {
37
+ className: (0, _helpers.classNameArrayToClassNameString)([_StepModule.default.wizardTopnavItem, getActiveClass(step), getFinishedClass(step), getErrorClass(step)])
38
+ }, step.link && Object.keys(step.link).length ? _react.default.createElement(_reactRouterDom.Link, {
24
39
  to: step.link,
25
- className: "".concat(_StepModule.default.wizardTopnavItem, " ").concat(getActiveClass(), " ").concat(getFinishedClass(), " ").concat(getErrorClass())
26
- }, _react.default.createElement("span", {
40
+ "aria-current": activeStepId === step.id ? "step" : null,
27
41
  className: _StepModule.default.wizardTopnavItemContent
28
- }, _react.default.createElement("span", {
29
- className: _StepModule.default.stepNumber
30
- }, props.index + 1), _react.default.createElement("span", {
31
- className: _StepModule.default.stepName
32
- }, props.step.name))) : _react.default.createElement("div", {
33
- className: "".concat(_StepModule.default.wizardTopnavItem, " ").concat(getActiveClass(), " ").concat(getFinishedClass(), " ").concat(getErrorClass())
34
- }, _react.default.createElement("span", {
42
+ }, renderStepContent(step, index)) : _react.default.createElement("span", {
43
+ "aria-current": activeStepId === step.id ? "step" : null,
35
44
  className: _StepModule.default.wizardTopnavItemContent
36
- }, _react.default.createElement("span", {
37
- className: _StepModule.default.stepNumber
38
- }, props.index + 1), _react.default.createElement("span", {
39
- className: _StepModule.default.stepName
40
- }, props.step.name)));
45
+ }, renderStepContent(step, index)));
41
46
  };
42
47
  Step.propTypes = {
43
48
  step: _propTypes.default.object.isRequired,
@@ -6,7 +6,9 @@
6
6
 
7
7
  .wizardTopnavItem {
8
8
  flex: 1;
9
- text-decoration: none;
9
+ a {
10
+ text-decoration: none;
11
+ }
10
12
  .wizardTopnavItemContent {
11
13
  display: flex;
12
14
  height: 60px;
@@ -10,6 +10,7 @@ var _Step = _interopRequireDefault(require("./WizardNavigation/Step"));
10
10
  var _WizardNavigationModule = _interopRequireDefault(require("./WizardNavigation.module.scss"));
11
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
12
  var WizardNavigation = function WizardNavigation(props) {
13
+ var _Object$keys, _props$ariaLabel;
13
14
  var renderSteps = function renderSteps(steps, activeStepId) {
14
15
  var hasSteps = steps && Object.keys(steps).length;
15
16
  return hasSteps ? Object.keys(steps).map(function (stepKey, stepIndex) {
@@ -22,9 +23,14 @@ var WizardNavigation = function WizardNavigation(props) {
22
23
  });
23
24
  }) : null;
24
25
  };
25
- return _react.default.createElement("div", {
26
+ var amountOfSteps = props.steps && (_Object$keys = Object.keys(props.steps)) !== null && _Object$keys !== void 0 && _Object$keys.length ? Object.keys(props.steps).length : 0;
27
+ var defaultAriaLabel = "I dette skjemaet er det totalt ".concat(amountOfSteps, " steg som du skal g\xE5 igjennom");
28
+ var ariaLabel = (_props$ariaLabel = props["aria-label"]) !== null && _props$ariaLabel !== void 0 && _props$ariaLabel.length ? props["aria-label"] : defaultAriaLabel;
29
+ return _react.default.createElement("nav", {
30
+ "aria-label": ariaLabel
31
+ }, _react.default.createElement("ol", {
26
32
  className: _WizardNavigationModule.default.wizardTopnav
27
- }, renderSteps(props.steps, props.activeStepId));
33
+ }, renderSteps(props.steps, props.activeStepId)));
28
34
  };
29
35
  WizardNavigation.propTypes = {
30
36
  steps: _propTypes.default.shape({
@@ -37,7 +43,8 @@ WizardNavigation.propTypes = {
37
43
  reactLink: _propTypes.default.bool
38
44
  })
39
45
  }).isRequired,
40
- activeStepId: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired
46
+ activeStepId: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]).isRequired,
47
+ "aria-label": _propTypes.default.string
41
48
  };
42
49
  var _default = WizardNavigation;
43
50
  exports.default = _default;
@@ -4,6 +4,8 @@
4
4
  display: flex;
5
5
  margin: 20px;
6
6
  flex-direction: column;
7
+ list-style: none;
8
+ padding: 0;
7
9
  @media only screen and (min-width: $screen-sm) {
8
10
  flex-direction: row;
9
11
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "dibk-design",
3
- "version": "2.6.3",
3
+ "version": "2.6.5",
4
4
  "private": false,
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.js",