dibk-design 3.4.0 → 3.5.0

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.
Files changed (38) hide show
  1. package/dist/components/Accordion.js +14 -23
  2. package/dist/components/Button.js +15 -20
  3. package/dist/components/CheckBoxIcon.js +8 -11
  4. package/dist/components/CheckBoxInput.js +4 -4
  5. package/dist/components/CheckBoxList.js +7 -7
  6. package/dist/components/CheckBoxListItem.js +4 -4
  7. package/dist/components/Container.js +1 -1
  8. package/dist/components/ContentBox.js +7 -7
  9. package/dist/components/Dialog.js +8 -9
  10. package/dist/components/DragAndDropFileInput.js +21 -33
  11. package/dist/components/ErrorBox.js +2 -2
  12. package/dist/components/ErrorMessage.js +3 -3
  13. package/dist/components/Footer.js +1 -1
  14. package/dist/components/Header.js +7 -7
  15. package/dist/components/InputField.js +31 -27
  16. package/dist/components/Label.js +10 -13
  17. package/dist/components/List.js +9 -11
  18. package/dist/components/ListItem.js +2 -2
  19. package/dist/components/LoadingAnimation.js +1 -1
  20. package/dist/components/NavigationBar.js +27 -39
  21. package/dist/components/NavigationBarListItem.js +4 -5
  22. package/dist/components/Paper.js +1 -1
  23. package/dist/components/ProgressBar.js +5 -7
  24. package/dist/components/RadioButtonIcon.js +8 -11
  25. package/dist/components/RadioButtonInput.js +4 -4
  26. package/dist/components/RadioButtonList.js +7 -7
  27. package/dist/components/RadioButtonListItem.js +4 -4
  28. package/dist/components/Select.js +61 -64
  29. package/dist/components/Table.js +7 -7
  30. package/dist/components/Textarea.js +28 -23
  31. package/dist/components/Theme.js +15 -15
  32. package/dist/components/WizardNavigation/Step.js +12 -11
  33. package/dist/components/WizardNavigation.js +8 -8
  34. package/dist/functions/generators.js +7 -6
  35. package/dist/functions/helpers.js +24 -25
  36. package/dist/functions/theme.js +21 -11
  37. package/dist/index.js +32 -32
  38. package/package.json +1 -1
@@ -16,36 +16,21 @@ var _helpers = require("../functions/helpers");
16
16
  var _asterisk = _interopRequireDefault(require("../assets/svg/asterisk.svg?url"));
17
17
  var _SelectModule = _interopRequireDefault(require("./Select.module.scss"));
18
18
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
- 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); }
20
- 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; }
21
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
22
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
23
- 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; }
24
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
25
- 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); }
26
- 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); }
27
- function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
28
- 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."); }
29
- function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
30
- function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
31
- function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
32
- function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
33
- var Select = function Select(props) {
34
- var _useState = (0, _react.useState)(false),
35
- _useState2 = _slicedToArray(_useState, 2),
36
- showDropdownList = _useState2[0],
37
- setShowDropdownList = _useState2[1];
38
- var dropdownRef = (0, _react.useRef)();
39
- var wrapperRef = (0, _react.useCallback)(function (element) {
19
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
20
+ 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 && Object.prototype.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; }
21
+ const Select = props => {
22
+ const [showDropdownList, setShowDropdownList] = (0, _react.useState)(false);
23
+ const dropdownRef = (0, _react.useRef)();
24
+ const wrapperRef = (0, _react.useCallback)(element => {
40
25
  if (!!element) {
41
26
  (0, _helpers.addFocusTrapInsideElement)(element);
42
27
  }
43
28
  }, []);
44
- var hideDropdownList = function hideDropdownList() {
29
+ const hideDropdownList = () => {
45
30
  setShowDropdownList(false);
46
31
  };
47
- (0, _react.useEffect)(function () {
48
- var keyDownFunction = function keyDownFunction(event) {
32
+ (0, _react.useEffect)(() => {
33
+ const keyDownFunction = event => {
49
34
  switch (event.keyCode) {
50
35
  case 27:
51
36
  hideDropdownList();
@@ -54,7 +39,7 @@ var Select = function Select(props) {
54
39
  return null;
55
40
  }
56
41
  };
57
- var handleClickOutside = function handleClickOutside(event) {
42
+ const handleClickOutside = event => {
58
43
  if (dropdownRef !== null && dropdownRef !== void 0 && dropdownRef.current && !dropdownRef.current.contains(event.target)) {
59
44
  hideDropdownList();
60
45
  }
@@ -62,20 +47,20 @@ var Select = function Select(props) {
62
47
  document.addEventListener("mousedown", handleClickOutside);
63
48
  document.addEventListener("keydown", keyDownFunction, false);
64
49
  }, [props, wrapperRef]);
65
- var getThemeErrorInputStyle = function getThemeErrorInputStyle(theme) {
50
+ const getThemeErrorInputStyle = theme => {
66
51
  return {
67
52
  boxShadow: "0 0 3px ".concat((0, _theme.getThemePaletteBackgroundColor)(theme, "warning")),
68
53
  borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, "warning")
69
54
  };
70
55
  };
71
- var getThemeArrowStyle = function getThemeArrowStyle(theme) {
56
+ const getThemeArrowStyle = theme => {
72
57
  return {
73
58
  borderTopColor: (0, _theme.getThemePaletteBackgroundColor)(theme, "primary")
74
59
  };
75
60
  };
76
- var getKeyByValue = function getKeyByValue(value, options) {
77
- var selectedOption = options && options.length ? options.find(function (option) {
78
- if (_typeof(option) === "object") {
61
+ const getKeyByValue = (value, options) => {
62
+ const selectedOption = options && options.length ? options.find(option => {
63
+ if (typeof option === "object") {
79
64
  return option.value === value;
80
65
  } else {
81
66
  return option === value;
@@ -89,8 +74,8 @@ var Select = function Select(props) {
89
74
  return selectedOption;
90
75
  }
91
76
  };
92
- var createOptionObject = function createOptionObject(option) {
93
- if (_typeof(option) === "object") {
77
+ const createOptionObject = option => {
78
+ if (typeof option === "object") {
94
79
  return {
95
80
  key: option.key ? option.key : "",
96
81
  value: option.value ? option.value : ""
@@ -102,68 +87,78 @@ var Select = function Select(props) {
102
87
  };
103
88
  }
104
89
  };
105
- var renderSelectedValues = function renderSelectedValues(options, selectElementProps) {
106
- var selectedValues = selectElementProps.defaultValue || selectElementProps.value;
107
- return selectedValues !== null && selectedValues !== void 0 && selectedValues.length ? selectedValues.map(function (value) {
108
- var keyForValue = getKeyByValue(value, options);
90
+ const renderSelectedValues = (options, selectElementProps) => {
91
+ const selectedValues = selectElementProps.defaultValue || selectElementProps.value;
92
+ return selectedValues !== null && selectedValues !== void 0 && selectedValues.length ? selectedValues.map(value => {
93
+ const keyForValue = getKeyByValue(value, options);
109
94
  return keyForValue;
110
95
  }).join(", ") : null;
111
96
  };
112
- var renderCheckBoxElements = function renderCheckBoxElements(options, selectElementProps) {
113
- return options.map(function (option, index) {
114
- var optionObject = createOptionObject(option);
115
- var selectedValues = selectElementProps.defaultValue || selectElementProps.value;
116
- var isSelected = selectedValues && selectedValues.length && selectedValues.includes(optionObject.value);
97
+ const renderCheckBoxElements = (options, selectElementProps) => {
98
+ return options.map((option, index) => {
99
+ let optionObject = createOptionObject(option);
100
+ const selectedValues = selectElementProps.defaultValue || selectElementProps.value;
101
+ const isSelected = selectedValues && selectedValues.length && selectedValues.includes(optionObject.value);
117
102
  return _react.default.createElement(_CheckBoxListItem.default, {
118
103
  key: index,
119
104
  id: "".concat(props.id, "-").concat(index),
120
105
  value: optionObject.value,
121
106
  checked: isSelected,
122
- onChange: function onChange() {
123
- return selectElementProps.onChange(optionObject.value);
124
- },
107
+ onChange: () => selectElementProps.onChange(optionObject.value),
125
108
  theme: props.theme
126
109
  }, optionObject.key);
127
110
  });
128
111
  };
129
- var renderOptionElements = function renderOptionElements(options) {
130
- return options.map(function (option, key) {
131
- var optionObject = createOptionObject(option);
112
+ const renderOptionElements = options => {
113
+ return options.map((option, key) => {
114
+ let optionObject = createOptionObject(option);
132
115
  return _react.default.createElement("option", {
133
116
  value: optionObject.value,
134
117
  key: key
135
118
  }, optionObject.key);
136
119
  });
137
120
  };
138
- var renderPlaceholderOption = function renderPlaceholderOption(placeholder, placeholderValue) {
121
+ const renderPlaceholderOption = (placeholder, placeholderValue) => {
139
122
  return placeholder ? _react.default.createElement("option", {
140
123
  value: placeholderValue || "",
141
124
  disabled: true
142
125
  }, placeholder) : "";
143
126
  };
144
- var getErrorElementId = function getErrorElementId() {
127
+ const getErrorElementId = () => {
145
128
  return "".concat(props.id, "-errorMessage");
146
129
  };
147
130
  if (props.contentOnly) {
148
- var value = props.defaultValue ? props.defaultValue : props.value || null;
131
+ const value = props.defaultValue ? props.defaultValue : props.value || null;
149
132
  return _react.default.createElement("div", {
150
133
  className: _SelectModule.default.select
151
134
  }, _react.default.createElement(_Label.default, {
152
135
  htmlFor: props.id
153
136
  }, props.label), _react.default.createElement("span", null, value ? props.keyAsContent ? getKeyByValue(value, props.options) : value : props.defaultContent));
154
137
  } else {
155
- var _props$width, _props$errorMessage, _props$ariaDescribed, _selectElementProps, _props$width2;
156
- var defaultValue = !props.value && props.defaultValue ? props.defaultValue : false;
157
- var styleRules = _objectSpread(_objectSpread({}, props.hasErrors ? getThemeErrorInputStyle(props.theme) : null), ((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
158
- maxWidth: props.width
159
- });
160
- var className = (0, _helpers.classNameArrayToClassNameString)([props.hasErrors && _SelectModule.default.hasErrors, props.multiple && _SelectModule.default.multiple]);
161
- var selectElementProps = (_selectElementProps = {
138
+ var _props$width, _props$errorMessage, _props$ariaDescribed, _props$width2;
139
+ const defaultValue = !props.value && props.defaultValue ? props.defaultValue : false;
140
+ const styleRules = {
141
+ ...(props.hasErrors ? getThemeErrorInputStyle(props.theme) : null),
142
+ ...(((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
143
+ maxWidth: props.width
144
+ })
145
+ };
146
+ const className = (0, _helpers.classNameArrayToClassNameString)([props.hasErrors && _SelectModule.default.hasErrors, props.multiple && _SelectModule.default.multiple]);
147
+ const selectElementProps = {
162
148
  name: props.name,
163
149
  multiple: props.multiple,
164
150
  required: props.required,
165
- disabled: props.disabled
166
- }, _defineProperty(_selectElementProps, defaultValue ? "defaultValue" : "value", defaultValue || props.value || ""), _defineProperty(_selectElementProps, "onChange", props.onChange), _defineProperty(_selectElementProps, "id", props.id), _defineProperty(_selectElementProps, "role", props.role), _defineProperty(_selectElementProps, "key", "".concat(props.id, "-").concat((0, _generators.generateRandomString)(6))), _defineProperty(_selectElementProps, "className", className), _defineProperty(_selectElementProps, "aria-describedby", props.hasErrors && !!((_props$errorMessage = props.errorMessage) !== null && _props$errorMessage !== void 0 && _props$errorMessage.length) ? getErrorElementId() : !!((_props$ariaDescribed = props["aria-describedby"]) !== null && _props$ariaDescribed !== void 0 && _props$ariaDescribed.length) ? props["aria-describedby"] : null), _defineProperty(_selectElementProps, "aria-invalid", props.hasErrors ? "true" : null), _defineProperty(_selectElementProps, "style", styleRules), _selectElementProps);
151
+ disabled: props.disabled,
152
+ [defaultValue ? "defaultValue" : "value"]: defaultValue || props.value || "",
153
+ onChange: props.onChange,
154
+ id: props.id,
155
+ role: props.role,
156
+ key: "".concat(props.id, "-").concat((0, _generators.generateRandomString)(6)),
157
+ className,
158
+ "aria-describedby": props.hasErrors && !!((_props$errorMessage = props.errorMessage) !== null && _props$errorMessage !== void 0 && _props$errorMessage.length) ? getErrorElementId() : !!((_props$ariaDescribed = props["aria-describedby"]) !== null && _props$ariaDescribed !== void 0 && _props$ariaDescribed.length) ? props["aria-describedby"] : null,
159
+ "aria-invalid": props.hasErrors ? "true" : null,
160
+ style: styleRules
161
+ };
167
162
  return _react.default.createElement("div", {
168
163
  className: _SelectModule.default.select
169
164
  }, _react.default.createElement(_Label.default, {
@@ -174,16 +169,18 @@ var Select = function Select(props) {
174
169
  className: _SelectModule.default.requiredSymbol
175
170
  })), _react.default.createElement("div", {
176
171
  className: _SelectModule.default.selectContainer,
177
- style: _objectSpread({}, ((_props$width2 = props.width) === null || _props$width2 === void 0 ? void 0 : _props$width2.length) && {
178
- maxWidth: props.width
179
- })
172
+ style: {
173
+ ...(((_props$width2 = props.width) === null || _props$width2 === void 0 ? void 0 : _props$width2.length) && {
174
+ maxWidth: props.width
175
+ })
176
+ }
180
177
  }, _react.default.createElement("span", {
181
178
  className: _SelectModule.default.selectListArrow,
182
179
  style: getThemeArrowStyle(props.theme)
183
180
  }), props.multiple ? _react.default.createElement("div", {
184
181
  ref: dropdownRef
185
182
  }, _react.default.createElement("div", {
186
- onClick: function onClick() {
183
+ onClick: () => {
187
184
  setShowDropdownList(!showDropdownList);
188
185
  },
189
186
  className: _SelectModule.default.multipleSelectElement
@@ -224,7 +221,7 @@ Select.propTypes = {
224
221
  theme: _propTypes.default.object
225
222
  };
226
223
  Select.defaultProps = {
227
- onChange: function onChange() {
224
+ onChange: () => {
228
225
  return false;
229
226
  },
230
227
  name: "",
@@ -9,17 +9,17 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
9
9
  var _helpers = require("../functions/helpers");
10
10
  var _TableModule = _interopRequireDefault(require("./Table.module.scss"));
11
11
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12
- var getCaptionAlignClass = function getCaptionAlignClass(captionAlign) {
13
- var defaultValue = "left";
14
- var availableValues = ["left", "center", "right"];
12
+ const getCaptionAlignClass = captionAlign => {
13
+ const defaultValue = "left";
14
+ const availableValues = ["left", "center", "right"];
15
15
  return captionAlign !== null && captionAlign !== void 0 && captionAlign.length && availableValues.includes(captionAlign) ? _TableModule.default["captionAlign-".concat(captionAlign)] : _TableModule.default["captionAlign-".concat(defaultValue)];
16
16
  };
17
- var getCaptionSideClass = function getCaptionSideClass(captionSide) {
18
- var defaultValue = "top";
19
- var availableValues = ["top", "bottom"];
17
+ const getCaptionSideClass = captionSide => {
18
+ const defaultValue = "top";
19
+ const availableValues = ["top", "bottom"];
20
20
  return captionSide !== null && captionSide !== void 0 && captionSide.length && availableValues.includes(captionSide) ? _TableModule.default["captionSide-".concat(captionSide)] : _TableModule.default["captionSide-".concat(defaultValue)];
21
21
  };
22
- var Table = function Table(props) {
22
+ const Table = props => {
23
23
  return _react.default.createElement("table", {
24
24
  className: (0, _helpers.classNameArrayToClassNameString)([_TableModule.default.table, getCaptionAlignClass(props.captionAlign), getCaptionSideClass(props.captionSide)])
25
25
  }, props.children);
@@ -13,35 +13,33 @@ var _generators = require("../functions/generators");
13
13
  var _asterisk = _interopRequireDefault(require("../assets/svg/asterisk.svg?url"));
14
14
  var _TextareaModule = _interopRequireDefault(require("./Textarea.module.scss"));
15
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
- 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); }
17
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
18
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
19
- 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; }
20
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
21
- 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); }
22
- var Textarea = function Textarea(props) {
23
- var getThemeErrorInputStyle = function getThemeErrorInputStyle(theme) {
16
+ const Textarea = props => {
17
+ const getThemeErrorInputStyle = theme => {
24
18
  return {
25
19
  boxShadow: "0 0 3px ".concat((0, _theme.getThemePaletteBackgroundColor)(theme, "warning")),
26
20
  borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, "warning")
27
21
  };
28
22
  };
29
- var renderValueAsText = function renderValueAsText(value, defaultContent) {
23
+ const renderValueAsText = (value, defaultContent) => {
30
24
  return value ? value : defaultContent;
31
25
  };
32
- var getErrorElementId = function getErrorElementId() {
26
+ const getErrorElementId = () => {
33
27
  return "".concat(props.id, "-errorMessage");
34
28
  };
35
- var renderInputField = function renderInputField() {
36
- var _props$value, _props$defaultValue, _props$width, _props$resize, _props$errorMessage, _props$ariaDescribed, _textareaElementProps;
37
- var defaultValue = !((_props$value = props.value) !== null && _props$value !== void 0 && _props$value.length) && (_props$defaultValue = props.defaultValue) !== null && _props$defaultValue !== void 0 && _props$defaultValue.length ? props.defaultValue : false;
38
- var defaultKey = props.elementKey || null;
39
- var styleRules = _objectSpread(_objectSpread(_objectSpread({}, props.hasErrors ? getThemeErrorInputStyle(props.theme) : null), ((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
40
- maxWidth: props.width
41
- }), ((_props$resize = props.resize) === null || _props$resize === void 0 ? void 0 : _props$resize.length) && {
42
- resize: props.resize
43
- });
44
- var textareaElementProps = (_textareaElementProps = {
29
+ const renderInputField = () => {
30
+ var _props$value, _props$defaultValue, _props$width, _props$resize, _props$errorMessage, _props$ariaDescribed;
31
+ const defaultValue = !((_props$value = props.value) !== null && _props$value !== void 0 && _props$value.length) && (_props$defaultValue = props.defaultValue) !== null && _props$defaultValue !== void 0 && _props$defaultValue.length ? props.defaultValue : false;
32
+ const defaultKey = props.elementKey || null;
33
+ const styleRules = {
34
+ ...(props.hasErrors ? getThemeErrorInputStyle(props.theme) : null),
35
+ ...(((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
36
+ maxWidth: props.width
37
+ }),
38
+ ...(((_props$resize = props.resize) === null || _props$resize === void 0 ? void 0 : _props$resize.length) && {
39
+ resize: props.resize
40
+ })
41
+ };
42
+ const textareaElementProps = {
45
43
  name: props.name,
46
44
  readOnly: props.readOnly,
47
45
  disabled: props.disabled,
@@ -50,8 +48,15 @@ var Textarea = function Textarea(props) {
50
48
  id: props.id,
51
49
  key: defaultKey || "".concat(props.id, "-").concat((0, _generators.generateRandomString)(6)),
52
50
  onChange: props.onChange,
53
- onBlur: props.onBlur
54
- }, _defineProperty(_textareaElementProps, defaultValue ? "defaultValue" : "value", defaultValue || props.value), _defineProperty(_textareaElementProps, "placeholder", props.placeholder), _defineProperty(_textareaElementProps, "rows", props.rows), _defineProperty(_textareaElementProps, "className", props.hasErrors ? _TextareaModule.default.hasErrors : ""), _defineProperty(_textareaElementProps, "aria-describedby", props.hasErrors && !!((_props$errorMessage = props.errorMessage) !== null && _props$errorMessage !== void 0 && _props$errorMessage.length) ? getErrorElementId() : !!((_props$ariaDescribed = props["aria-describedby"]) !== null && _props$ariaDescribed !== void 0 && _props$ariaDescribed.length) ? props["aria-describedby"] : null), _defineProperty(_textareaElementProps, "aria-invalid", props.hasErrors ? "true" : null), _defineProperty(_textareaElementProps, "style", styleRules), _textareaElementProps);
51
+ onBlur: props.onBlur,
52
+ [defaultValue ? "defaultValue" : "value"]: defaultValue || props.value,
53
+ placeholder: props.placeholder,
54
+ rows: props.rows,
55
+ className: props.hasErrors ? _TextareaModule.default.hasErrors : "",
56
+ "aria-describedby": props.hasErrors && !!((_props$errorMessage = props.errorMessage) !== null && _props$errorMessage !== void 0 && _props$errorMessage.length) ? getErrorElementId() : !!((_props$ariaDescribed = props["aria-describedby"]) !== null && _props$ariaDescribed !== void 0 && _props$ariaDescribed.length) ? props["aria-describedby"] : null,
57
+ "aria-invalid": props.hasErrors ? "true" : null,
58
+ style: styleRules
59
+ };
55
60
  return _react.default.createElement("textarea", textareaElementProps);
56
61
  };
57
62
  return _react.default.createElement("div", {
@@ -91,7 +96,7 @@ Textarea.propTypes = {
91
96
  theme: _propTypes.default.object
92
97
  };
93
98
  Textarea.defaultProps = {
94
- onChange: function onChange() {
99
+ onChange: () => {
95
100
  return false;
96
101
  },
97
102
  name: "",
@@ -10,28 +10,28 @@ var _theme = require("../functions/theme");
10
10
  var _dibkLogoMobile = _interopRequireDefault(require("../assets/svg/dibk-logo-mobile.svg?url"));
11
11
  var _ThemeModule = _interopRequireDefault(require("./Theme.module.scss"));
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
- var Theme = function Theme(props) {
14
- var getThemeColorPaletteStyle = function getThemeColorPaletteStyle(theme, color) {
13
+ const Theme = props => {
14
+ const getThemeColorPaletteStyle = (theme, color) => {
15
15
  return {
16
16
  backgroundColor: (0, _theme.getThemePaletteBackgroundColor)(theme, color),
17
17
  color: (0, _theme.getThemePaletteTextColor)(theme, color)
18
18
  };
19
19
  };
20
- var getThemeTextStyle = function getThemeTextStyle(theme) {
20
+ const getThemeTextStyle = theme => {
21
21
  return {
22
22
  color: (0, _theme.getThemeTextColor)(theme)
23
23
  };
24
24
  };
25
- var getThemeLinkStyle = function getThemeLinkStyle(theme) {
25
+ const getThemeLinkStyle = theme => {
26
26
  return {
27
27
  color: (0, _theme.getThemeLinkColor)(theme)
28
28
  };
29
29
  };
30
- var renderColors = function renderColors(theme) {
31
- var colors = ["default", "primary", "success", "warning", "info", "lightCyan", "orange", "lightOrange", "lime", "lightLime"];
32
- return colors.map(function (color) {
33
- var colorClassName = _ThemeModule.default[color];
34
- var colorPaletteStyle = props.theme ? getThemeColorPaletteStyle(props.theme, color) : null;
30
+ const renderColors = theme => {
31
+ const colors = ["default", "primary", "success", "warning", "info", "lightCyan", "orange", "lightOrange", "lime", "lightLime"];
32
+ return colors.map(color => {
33
+ const colorClassName = _ThemeModule.default[color];
34
+ const colorPaletteStyle = props.theme ? getThemeColorPaletteStyle(props.theme, color) : null;
35
35
  return _react.default.createElement("div", {
36
36
  key: color,
37
37
  className: "".concat(_ThemeModule.default.color, " ").concat(colorClassName),
@@ -39,10 +39,10 @@ var Theme = function Theme(props) {
39
39
  }, color);
40
40
  });
41
41
  };
42
- var renderLogo = function renderLogo(logoLink) {
43
- var themeLogo = (0, _theme.getThemeLogo)(props.theme);
44
- var themeAppName = (0, _theme.getThemeAppName)(props.theme);
45
- var logoElement = themeLogo && themeAppName ? _react.default.createElement("img", {
42
+ const renderLogo = logoLink => {
43
+ const themeLogo = (0, _theme.getThemeLogo)(props.theme);
44
+ const themeAppName = (0, _theme.getThemeAppName)(props.theme);
45
+ const logoElement = themeLogo && themeAppName ? _react.default.createElement("img", {
46
46
  alt: "".concat(themeAppName, " logo"),
47
47
  src: themeLogo
48
48
  }) : _react.default.createElement("img", {
@@ -53,8 +53,8 @@ var Theme = function Theme(props) {
53
53
  href: logoLink
54
54
  }, logoElement) : logoElement;
55
55
  };
56
- var themeTextStyle = props.theme ? getThemeTextStyle(props.theme) : null;
57
- var themeLinkStyle = props.theme ? getThemeLinkStyle(props.theme) : null;
56
+ const themeTextStyle = props.theme ? getThemeTextStyle(props.theme) : null;
57
+ const themeLinkStyle = props.theme ? getThemeLinkStyle(props.theme) : null;
58
58
  return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("div", {
59
59
  className: _ThemeModule.default.colorPalette
60
60
  }, renderColors(props.theme)), _react.default.createElement("p", {
@@ -1,6 +1,5 @@
1
1
  "use strict";
2
2
 
3
- 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); }
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
@@ -11,28 +10,30 @@ var _reactRouterDom = require("react-router-dom");
11
10
  var _helpers = require("../../functions/helpers");
12
11
  var _StepModule = _interopRequireDefault(require("./Step.module.scss"));
13
12
  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; }
16
- var Step = function Step(props) {
17
- var getActiveClass = function getActiveClass(step) {
13
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
14
+ 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 && Object.prototype.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; }
15
+ const Step = props => {
16
+ const getActiveClass = step => {
18
17
  return props.activeStepId === step.id ? _StepModule.default.active : "";
19
18
  };
20
- var getFinishedClass = function getFinishedClass(step) {
19
+ const getFinishedClass = step => {
21
20
  return step.finished ? _StepModule.default.finished : "";
22
21
  };
23
- var getErrorClass = function getErrorClass(step) {
22
+ const getErrorClass = step => {
24
23
  return step.hasErrors ? _StepModule.default.hasErrors : "";
25
24
  };
26
- var renderStepContent = function renderStepContent(step, index) {
25
+ const renderStepContent = (step, index) => {
27
26
  return _react.default.createElement(_react.Fragment, null, _react.default.createElement("span", {
28
27
  className: _StepModule.default.stepNumber
29
28
  }, index + 1), _react.default.createElement("span", {
30
29
  className: _StepModule.default.stepName
31
30
  }, step.name));
32
31
  };
33
- var step = props.step,
34
- index = props.index,
35
- activeStepId = props.activeStepId;
32
+ const {
33
+ step,
34
+ index,
35
+ activeStepId
36
+ } = props;
36
37
  return _react.default.createElement("li", {
37
38
  className: (0, _helpers.classNameArrayToClassNameString)([_StepModule.default.wizardTopnavItem, getActiveClass(step), getFinishedClass(step), getErrorClass(step)])
38
39
  }, step.link && Object.keys(step.link).length ? _react.default.createElement(_reactRouterDom.Link, {
@@ -9,12 +9,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
9
9
  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
- var WizardNavigation = function WizardNavigation(props) {
12
+ const WizardNavigation = props => {
13
13
  var _Object$keys, _props$ariaLabel;
14
- var renderSteps = function renderSteps(steps, activeStepId) {
15
- var hasSteps = steps && Object.keys(steps).length;
16
- return hasSteps ? Object.keys(steps).map(function (stepKey, stepIndex) {
17
- var step = steps[stepKey];
14
+ const renderSteps = (steps, activeStepId) => {
15
+ const hasSteps = steps && Object.keys(steps).length;
16
+ return hasSteps ? Object.keys(steps).map((stepKey, stepIndex) => {
17
+ const step = steps[stepKey];
18
18
  return _react.default.createElement(_Step.default, {
19
19
  step: step,
20
20
  activeStepId: activeStepId,
@@ -23,9 +23,9 @@ var WizardNavigation = function WizardNavigation(props) {
23
23
  });
24
24
  }) : null;
25
25
  };
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;
26
+ const amountOfSteps = props.steps && (_Object$keys = Object.keys(props.steps)) !== null && _Object$keys !== void 0 && _Object$keys.length ? Object.keys(props.steps).length : 0;
27
+ const defaultAriaLabel = "I dette skjemaet er det totalt ".concat(amountOfSteps, " steg som du skal g\xE5 igjennom");
28
+ const ariaLabel = (_props$ariaLabel = props["aria-label"]) !== null && _props$ariaLabel !== void 0 && _props$ariaLabel.length ? props["aria-label"] : defaultAriaLabel;
29
29
  return _react.default.createElement("nav", {
30
30
  "aria-label": ariaLabel
31
31
  }, _react.default.createElement("ol", {
@@ -4,12 +4,13 @@ Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
6
  exports.generateRandomString = void 0;
7
- var generateRandomString = exports.generateRandomString = function generateRandomString(length) {
8
- var result = '';
9
- var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
10
- var charactersLength = characters.length;
11
- for (var i = 0; i < length; i++) {
7
+ const generateRandomString = length => {
8
+ let result = '';
9
+ const characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
10
+ const charactersLength = characters.length;
11
+ for (let i = 0; i < length; i++) {
12
12
  result += characters.charAt(Math.floor(Math.random() * charactersLength));
13
13
  }
14
14
  return result;
15
- };
15
+ };
16
+ exports.generateRandomString = generateRandomString;
@@ -5,61 +5,60 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.setFocusToElement = exports.getFocusableElementsInsideElement = exports.cloneThroughFragments = exports.classNameArrayToClassNameString = exports.addFocusTrapInsideElement = void 0;
7
7
  var _react = require("react");
8
- 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); }
9
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
10
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
11
- 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; }
12
- function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
13
- 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); }
14
- var classNameArrayToClassNameString = exports.classNameArrayToClassNameString = function classNameArrayToClassNameString(classNameArray) {
8
+ const classNameArrayToClassNameString = classNameArray => {
15
9
  var _classNameArray$filte;
16
- return (classNameArray === null || classNameArray === void 0 || (_classNameArray$filte = classNameArray.filter(function (className) {
17
- return className;
18
- })) === null || _classNameArray$filte === void 0 ? void 0 : _classNameArray$filte.join(" ")) || "";
10
+ return (classNameArray === null || classNameArray === void 0 || (_classNameArray$filte = classNameArray.filter(className => className)) === null || _classNameArray$filte === void 0 ? void 0 : _classNameArray$filte.join(" ")) || "";
19
11
  };
20
- var cloneThroughFragments = exports.cloneThroughFragments = function cloneThroughFragments(children) {
21
- return _react.Children.map(children, function (c) {
12
+ exports.classNameArrayToClassNameString = classNameArrayToClassNameString;
13
+ const cloneThroughFragments = children => {
14
+ return _react.Children.map(children, c => {
22
15
  if ((0, _react.isValidElement)(c)) {
23
16
  if (c.type === _react.Fragment) {
24
17
  return cloneThroughFragments(c.props.children);
25
18
  }
26
- return (0, _react.cloneElement)(c, _objectSpread({}, c.props));
19
+ return (0, _react.cloneElement)(c, {
20
+ ...c.props
21
+ });
27
22
  }
28
23
  return c;
29
24
  });
30
25
  };
31
- var setFocusToElement = exports.setFocusToElement = function setFocusToElement(element) {
32
- var autoFocusElement = document.createElement("button");
26
+ exports.cloneThroughFragments = cloneThroughFragments;
27
+ const setFocusToElement = element => {
28
+ const autoFocusElement = document.createElement("button");
33
29
  element.prepend(autoFocusElement);
34
30
  autoFocusElement.focus();
35
31
  autoFocusElement.remove();
36
32
  };
37
- var getFocusableElementsInsideElement = exports.getFocusableElementsInsideElement = function getFocusableElementsInsideElement(element) {
38
- return Array.from(element.querySelectorAll('button, [href], input, [tabindex="0"]')).filter(function (resultElement) {
33
+ exports.setFocusToElement = setFocusToElement;
34
+ const getFocusableElementsInsideElement = element => {
35
+ return Array.from(element.querySelectorAll('button, [href], input, [tabindex="0"]')).filter(resultElement => {
39
36
  return resultElement;
40
37
  });
41
38
  };
42
- var addFocusTrapInsideElement = exports.addFocusTrapInsideElement = function addFocusTrapInsideElement(element) {
39
+ exports.getFocusableElementsInsideElement = getFocusableElementsInsideElement;
40
+ const addFocusTrapInsideElement = element => {
43
41
  setFocusToElement(element);
44
- var focusableElements = getFocusableElementsInsideElement(element);
45
- var firstFocusableElement = focusableElements !== null && focusableElements !== void 0 && focusableElements.length ? focusableElements[0] : null;
46
- var lastFocusableElement = (focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.length) > 1 ? focusableElements[focusableElements.length - 1] : firstFocusableElement;
42
+ const focusableElements = getFocusableElementsInsideElement(element);
43
+ const firstFocusableElement = focusableElements !== null && focusableElements !== void 0 && focusableElements.length ? focusableElements[0] : null;
44
+ const lastFocusableElement = (focusableElements === null || focusableElements === void 0 ? void 0 : focusableElements.length) > 1 ? focusableElements[focusableElements.length - 1] : firstFocusableElement;
47
45
  if (firstFocusableElement) {
48
- firstFocusableElement.onkeydown = function (event) {
46
+ firstFocusableElement.onkeydown = event => {
49
47
  if (event.keyCode === 9 && event.shiftKey) {
50
48
  lastFocusableElement.focus();
51
49
  }
52
50
  };
53
51
  }
54
52
  if (lastFocusableElement) {
55
- lastFocusableElement.onclick = function () {
53
+ lastFocusableElement.onclick = () => {
56
54
  firstFocusableElement.focus();
57
55
  };
58
- lastFocusableElement.onkeydown = function (event) {
56
+ lastFocusableElement.onkeydown = event => {
59
57
  if (event.keyCode === 9 && !event.shiftKey) {
60
58
  event.preventDefault();
61
59
  firstFocusableElement.focus();
62
60
  }
63
61
  };
64
62
  }
65
- };
63
+ };
64
+ exports.addFocusTrapInsideElement = addFocusTrapInsideElement;