dibk-design 3.4.0 → 3.6.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.
- package/dist/components/Accordion.js +14 -23
- package/dist/components/Button.js +15 -20
- package/dist/components/CheckBoxIcon.js +8 -11
- package/dist/components/CheckBoxInput.js +4 -4
- package/dist/components/CheckBoxList.js +7 -7
- package/dist/components/CheckBoxListItem.js +4 -4
- package/dist/components/Container.js +1 -1
- package/dist/components/ContentBox.js +7 -7
- package/dist/components/Dialog.js +8 -9
- package/dist/components/DragAndDropFileInput.js +21 -33
- package/dist/components/ErrorBox.js +2 -2
- package/dist/components/ErrorMessage.js +3 -3
- package/dist/components/Footer.js +1 -1
- package/dist/components/Header.js +13 -10
- package/dist/components/InputField.js +31 -27
- package/dist/components/Label.js +10 -13
- package/dist/components/List.js +9 -11
- package/dist/components/ListItem.js +2 -2
- package/dist/components/LoadingAnimation.js +1 -1
- package/dist/components/NavigationBar.js +27 -39
- package/dist/components/NavigationBarListItem.js +4 -5
- package/dist/components/Paper.js +1 -1
- package/dist/components/ProgressBar.js +5 -7
- package/dist/components/RadioButtonIcon.js +8 -11
- package/dist/components/RadioButtonInput.js +4 -4
- package/dist/components/RadioButtonList.js +7 -7
- package/dist/components/RadioButtonListItem.js +4 -4
- package/dist/components/Select.js +61 -64
- package/dist/components/Table.js +7 -7
- package/dist/components/Textarea.js +28 -23
- package/dist/components/Theme.js +15 -15
- package/dist/components/WizardNavigation/Step.js +12 -11
- package/dist/components/WizardNavigation.js +8 -8
- package/dist/functions/generators.js +7 -6
- package/dist/functions/helpers.js +24 -25
- package/dist/functions/theme.js +21 -11
- package/dist/index.js +32 -32
- package/package.json +1 -1
|
@@ -14,39 +14,33 @@ var _generators = require("../functions/generators");
|
|
|
14
14
|
var _asterisk = _interopRequireDefault(require("../assets/svg/asterisk.svg?url"));
|
|
15
15
|
var _InputFieldModule = _interopRequireDefault(require("./InputField.module.scss"));
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
|
|
18
|
-
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; }
|
|
19
|
-
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; }
|
|
20
|
-
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; }
|
|
21
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
22
|
-
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); }
|
|
23
|
-
var InputField = function InputField(props) {
|
|
17
|
+
const InputField = props => {
|
|
24
18
|
var _props$width;
|
|
25
|
-
|
|
19
|
+
const getThemeErrorInputStyle = theme => {
|
|
26
20
|
return {
|
|
27
21
|
boxShadow: "0 0 3px ".concat((0, _theme.getThemePaletteBackgroundColor)(theme, "warning")),
|
|
28
22
|
borderColor: (0, _theme.getThemePaletteBackgroundColor)(theme, "warning")
|
|
29
23
|
};
|
|
30
24
|
};
|
|
31
|
-
|
|
25
|
+
const formatDate = inputDate => {
|
|
32
26
|
if (!inputDate) {
|
|
33
27
|
return null;
|
|
34
28
|
}
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
29
|
+
const date = new Date(inputDate);
|
|
30
|
+
const year = date.getFullYear();
|
|
31
|
+
const month = date.getMonth() + 1 < 10 ? "0".concat(date.getMonth() + 1) : date.getMonth() + 1;
|
|
32
|
+
const day = date.getDate() < 10 ? "0".concat(date.getDate()) : date.getDate();
|
|
39
33
|
return "".concat(day, ".").concat(month, ".").concat(year);
|
|
40
34
|
};
|
|
41
|
-
|
|
35
|
+
const renderValueAsText = (value, defaultContent) => {
|
|
42
36
|
return props.type === "date" ? value ? formatDate(value) : defaultContent : value ? value : defaultContent;
|
|
43
37
|
};
|
|
44
|
-
|
|
38
|
+
const getErrorElementId = () => {
|
|
45
39
|
return "".concat(props.id, "-errorMessage");
|
|
46
40
|
};
|
|
47
|
-
|
|
48
|
-
var _props$errorMessage, _props$ariaDescribed
|
|
49
|
-
return
|
|
41
|
+
const getInputElementProps = (defaultValue, defaultKey, styleRules) => {
|
|
42
|
+
var _props$errorMessage, _props$ariaDescribed;
|
|
43
|
+
return {
|
|
50
44
|
name: props.name,
|
|
51
45
|
readOnly: props.readOnly,
|
|
52
46
|
disabled: props.disabled,
|
|
@@ -58,14 +52,24 @@ var InputField = function InputField(props) {
|
|
|
58
52
|
min: props.min || null,
|
|
59
53
|
max: props.max || null,
|
|
60
54
|
onChange: props.onChange,
|
|
61
|
-
onBlur: props.onBlur
|
|
62
|
-
|
|
55
|
+
onBlur: props.onBlur,
|
|
56
|
+
[defaultValue ? "defaultValue" : "value"]: defaultValue || props.value,
|
|
57
|
+
placeholder: props.placeholder || null,
|
|
58
|
+
className: props.hasErrors ? _InputFieldModule.default.hasErrors : null,
|
|
59
|
+
"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,
|
|
60
|
+
"aria-invalid": props.hasErrors ? "true" : null,
|
|
61
|
+
"aria-autocomplete": props["aria-autocomplete"] || null,
|
|
62
|
+
style: styleRules
|
|
63
|
+
};
|
|
64
|
+
};
|
|
65
|
+
const defaultValue = props.defaultValue ? props.defaultValue : props.value || null;
|
|
66
|
+
const defaultKey = props.elementKey || null;
|
|
67
|
+
const styleRules = {
|
|
68
|
+
...(props.hasErrors ? getThemeErrorInputStyle(props.theme) : null),
|
|
69
|
+
...(((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
|
|
70
|
+
maxWidth: props.width
|
|
71
|
+
})
|
|
63
72
|
};
|
|
64
|
-
var defaultValue = props.defaultValue ? props.defaultValue : props.value || null;
|
|
65
|
-
var defaultKey = props.elementKey || null;
|
|
66
|
-
var styleRules = _objectSpread(_objectSpread({}, props.hasErrors ? getThemeErrorInputStyle(props.theme) : null), ((_props$width = props.width) === null || _props$width === void 0 ? void 0 : _props$width.length) && {
|
|
67
|
-
maxWidth: props.width
|
|
68
|
-
});
|
|
69
73
|
return _react.default.createElement("div", {
|
|
70
74
|
className: "".concat(_InputFieldModule.default.inputField, " ").concat(_InputFieldModule.default[props.type])
|
|
71
75
|
}, _react.default.createElement(_Label.default, {
|
|
@@ -80,7 +84,7 @@ var InputField = function InputField(props) {
|
|
|
80
84
|
className: _InputFieldModule.default.input
|
|
81
85
|
}, props.selectedFileName), props.buttonContent ? _react.default.createElement(_Button.default, {
|
|
82
86
|
color: props.buttonColor,
|
|
83
|
-
onClick:
|
|
87
|
+
onClick: () => {
|
|
84
88
|
document.getElementById(props.id).click();
|
|
85
89
|
},
|
|
86
90
|
content: props.buttonContent,
|
|
@@ -118,7 +122,7 @@ InputField.propTypes = {
|
|
|
118
122
|
theme: _propTypes.default.object
|
|
119
123
|
};
|
|
120
124
|
InputField.defaultProps = {
|
|
121
|
-
onChange:
|
|
125
|
+
onChange: () => {
|
|
122
126
|
return false;
|
|
123
127
|
},
|
|
124
128
|
name: "",
|
package/dist/components/Label.js
CHANGED
|
@@ -8,24 +8,21 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _LabelModule = _interopRequireDefault(require("./Label.module.scss"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
12
|
-
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; }
|
|
13
|
-
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; }
|
|
14
|
-
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; }
|
|
15
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
16
|
-
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); }
|
|
17
|
-
var Label = function Label(props) {
|
|
11
|
+
const Label = props => {
|
|
18
12
|
var _props$htmlTag;
|
|
19
|
-
|
|
20
|
-
|
|
13
|
+
let labelProps = {
|
|
14
|
+
...props
|
|
15
|
+
};
|
|
16
|
+
const htmlTag = (_props$htmlTag = props.htmlTag) !== null && _props$htmlTag !== void 0 && _props$htmlTag.length ? props.htmlTag : "label";
|
|
21
17
|
delete labelProps.inline;
|
|
22
18
|
delete labelProps.normalCursor;
|
|
23
19
|
delete labelProps.htmlTag;
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
20
|
+
const className = "".concat(_LabelModule.default.label, " ").concat(props.inline ? _LabelModule.default.inline : "", " ").concat(props.normalCursor ? _LabelModule.default.normalCursor : "");
|
|
21
|
+
const labelElement = _react.default.createElement(htmlTag, {
|
|
22
|
+
...labelProps,
|
|
23
|
+
className,
|
|
27
24
|
id: props.id || null
|
|
28
|
-
}
|
|
25
|
+
}, props.children);
|
|
29
26
|
return labelElement;
|
|
30
27
|
};
|
|
31
28
|
Label.propTypes = {
|
package/dist/components/List.js
CHANGED
|
@@ -8,18 +8,16 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _ListModule = _interopRequireDefault(require("./List.module.scss"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
var listType = props.ordered ? "ol" : "ul";
|
|
18
|
-
var defaultListStyle = props.ordered ? "decimal" : "disc";
|
|
19
|
-
var scssValueProperty = "--listStyle";
|
|
20
|
-
var listElement = _react.default.createElement(listType, {
|
|
11
|
+
const List = props => {
|
|
12
|
+
const renderList = () => {
|
|
13
|
+
let listType = props.ordered ? "ol" : "ul";
|
|
14
|
+
const defaultListStyle = props.ordered ? "decimal" : "disc";
|
|
15
|
+
const scssValueProperty = "--listStyle";
|
|
16
|
+
let listElement = _react.default.createElement(listType, {
|
|
21
17
|
className: "".concat(_ListModule.default.list, " ").concat(!!props.compact ? _ListModule.default.compact : ""),
|
|
22
|
-
style:
|
|
18
|
+
style: {
|
|
19
|
+
[scssValueProperty]: props.listStyle || defaultListStyle
|
|
20
|
+
}
|
|
23
21
|
}, props.children);
|
|
24
22
|
return listElement;
|
|
25
23
|
};
|
|
@@ -7,8 +7,8 @@ exports.default = void 0;
|
|
|
7
7
|
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
-
|
|
11
|
-
|
|
10
|
+
const ListItem = props => {
|
|
11
|
+
const elementProps = {
|
|
12
12
|
key: props.elementKey || null
|
|
13
13
|
};
|
|
14
14
|
return _react.default.createElement("li", elementProps, props.children, props.elementKey);
|
|
@@ -8,7 +8,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _LoadingAnimationModule = _interopRequireDefault(require("./LoadingAnimation.module.scss"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
11
|
+
const LoadingAnimation = props => {
|
|
12
12
|
return _react.default.createElement("div", {
|
|
13
13
|
className: props.fixed ? _LoadingAnimationModule.default.loadingAnimation + " " + _LoadingAnimationModule.default.fixed : _LoadingAnimationModule.default.loadingAnimation
|
|
14
14
|
}, props.message);
|
|
@@ -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
|
});
|
|
@@ -12,47 +11,38 @@ var _theme = require("../functions/theme");
|
|
|
12
11
|
var _dibkLogoMobile = _interopRequireDefault(require("../assets/svg/dibk-logo-mobile.svg?url"));
|
|
13
12
|
var _NavigationBarModule = _interopRequireDefault(require("./NavigationBar.module.scss"));
|
|
14
13
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
|
-
function _getRequireWildcardCache(
|
|
16
|
-
function _interopRequireWildcard(
|
|
14
|
+
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); }
|
|
15
|
+
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; }
|
|
17
16
|
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); }
|
|
18
|
-
|
|
19
|
-
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."); }
|
|
20
|
-
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); }
|
|
21
|
-
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; }
|
|
22
|
-
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; } }
|
|
23
|
-
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
24
|
-
var NavigationBar = function NavigationBar(props) {
|
|
17
|
+
const NavigationBar = props => {
|
|
25
18
|
var _props$primaryListIte, _props$secondaryListI, _props$mainContentId;
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
active = _useState2[0],
|
|
29
|
-
setActive = _useState2[1];
|
|
30
|
-
var toggleList = function toggleList() {
|
|
19
|
+
const [active, setActive] = (0, _react.useState)(false);
|
|
20
|
+
const toggleList = () => {
|
|
31
21
|
setActive(!active);
|
|
32
22
|
};
|
|
33
|
-
|
|
23
|
+
const getNavigationBarThemeStyle = theme => {
|
|
34
24
|
return {
|
|
35
25
|
backgroundColor: (0, _theme.getThemeNavigationBarBackgroundColor)(theme),
|
|
36
26
|
color: (0, _theme.getThemeNavigationBarTextColor)(theme)
|
|
37
27
|
};
|
|
38
28
|
};
|
|
39
|
-
|
|
29
|
+
const getListItemThemeStyle = theme => {
|
|
40
30
|
return {
|
|
41
31
|
color: (0, _theme.getThemeNavigationBarTextColor)(theme),
|
|
42
32
|
borderBottomColor: (0, _theme.getThemeNavigationBarTextColor)(theme)
|
|
43
33
|
};
|
|
44
34
|
};
|
|
45
|
-
|
|
35
|
+
const getLogoThemeStyle = theme => {
|
|
46
36
|
return {
|
|
47
37
|
padding: (0, _theme.getThemeLogoPadding)(theme)
|
|
48
38
|
};
|
|
49
39
|
};
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
40
|
+
const renderPrimaryList = function () {
|
|
41
|
+
let items = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : props.primaryListItems;
|
|
42
|
+
let iteration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
|
|
43
|
+
const listItemThemeStyle = getListItemThemeStyle(props.theme);
|
|
44
|
+
let listItems = items.map((listItem, i) => {
|
|
45
|
+
let key = iteration + "-" + i;
|
|
56
46
|
if (listItem.listItems !== undefined) {
|
|
57
47
|
return _react.default.createElement("li", {
|
|
58
48
|
key: key
|
|
@@ -71,8 +61,8 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
71
61
|
className: _NavigationBarModule.default.primaryList
|
|
72
62
|
}, listItems);
|
|
73
63
|
};
|
|
74
|
-
|
|
75
|
-
|
|
64
|
+
const renderSecondaryList = () => {
|
|
65
|
+
let listItems = props.secondaryListItems.map((listItem, i) => {
|
|
76
66
|
return _react.default.createElement(_NavigationBarListItem.default, {
|
|
77
67
|
listItem: listItem,
|
|
78
68
|
key: i,
|
|
@@ -83,10 +73,10 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
83
73
|
className: _NavigationBarModule.default.secondaryList
|
|
84
74
|
}, listItems);
|
|
85
75
|
};
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
76
|
+
const renderLogo = (logoLink, logoLinkTitle) => {
|
|
77
|
+
const themeLogo = (0, _theme.getThemeLogo)(props.theme);
|
|
78
|
+
const themeAppName = (0, _theme.getThemeAppName)(props.theme);
|
|
79
|
+
const getLogoAltText = () => {
|
|
90
80
|
if (logoLink && logoLinkTitle) {
|
|
91
81
|
return "";
|
|
92
82
|
} else if (themeLogo && themeAppName) {
|
|
@@ -95,8 +85,8 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
95
85
|
return "DIBK logo";
|
|
96
86
|
}
|
|
97
87
|
};
|
|
98
|
-
|
|
99
|
-
|
|
88
|
+
const renderLogoElement = () => {
|
|
89
|
+
const altText = getLogoAltText();
|
|
100
90
|
return themeLogo ? _react.default.createElement("img", {
|
|
101
91
|
alt: altText,
|
|
102
92
|
src: themeLogo,
|
|
@@ -106,7 +96,7 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
106
96
|
src: _dibkLogoMobile.default
|
|
107
97
|
});
|
|
108
98
|
};
|
|
109
|
-
|
|
99
|
+
const logoLinkProps = {
|
|
110
100
|
target: props.openLogoLinkInNewTab ? "_blank" : null,
|
|
111
101
|
rel: props.openLogoLinkInNewTab ? "noopener noreferrer" : null
|
|
112
102
|
};
|
|
@@ -115,11 +105,11 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
115
105
|
title: logoLinkTitle
|
|
116
106
|
}), renderLogoElement()) : renderLogoElement();
|
|
117
107
|
};
|
|
118
|
-
|
|
119
|
-
|
|
108
|
+
const navigationBarThemeStyle = getNavigationBarThemeStyle(props.theme);
|
|
109
|
+
const hamburgerIconLineStyle = {
|
|
120
110
|
backgroundColor: (0, _theme.getThemeNavigationBarTextColor)(props.theme)
|
|
121
111
|
};
|
|
122
|
-
|
|
112
|
+
const hasListItems = !!((_props$primaryListIte = props.primaryListItems) !== null && _props$primaryListIte !== void 0 && _props$primaryListIte.length) || !!((_props$secondaryListI = props.secondaryListItems) !== null && _props$secondaryListI !== void 0 && _props$secondaryListI.length);
|
|
123
113
|
return _react.default.createElement("div", {
|
|
124
114
|
className: _NavigationBarModule.default.navigationBarContainer
|
|
125
115
|
}, ((_props$mainContentId = props.mainContentId) === null || _props$mainContentId === void 0 ? void 0 : _props$mainContentId.length) && _react.default.createElement("a", {
|
|
@@ -138,9 +128,7 @@ var NavigationBar = function NavigationBar(props) {
|
|
|
138
128
|
}, props.children), hasListItems && _react.default.createElement("button", {
|
|
139
129
|
type: "button",
|
|
140
130
|
className: "".concat(_NavigationBarModule.default.menuToggle, " ").concat(active ? _NavigationBarModule.default.active : ""),
|
|
141
|
-
onClick:
|
|
142
|
-
return toggleList();
|
|
143
|
-
},
|
|
131
|
+
onClick: () => toggleList(),
|
|
144
132
|
"aria-expanded": active ? "true" : "false",
|
|
145
133
|
"aria-controls": "main-menu-dropdown"
|
|
146
134
|
}, _react.default.createElement("span", {
|
|
@@ -8,20 +8,19 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _theme = require("../functions/theme");
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
var getListItemThemeStyle = function getListItemThemeStyle() {
|
|
11
|
+
const NavigationBarListItem = props => {
|
|
12
|
+
const getListItemThemeStyle = () => {
|
|
14
13
|
return {
|
|
15
14
|
color: (0, _theme.getThemeNavigationBarTextColor)(props.theme),
|
|
16
15
|
borderBottomColor: (0, _theme.getThemeNavigationBarTextColor)(props.theme)
|
|
17
16
|
};
|
|
18
17
|
};
|
|
19
|
-
|
|
18
|
+
const listItemThemeStyle = getListItemThemeStyle();
|
|
20
19
|
if (typeof props.listItem === "string") {
|
|
21
20
|
return _react.default.createElement("li", null, _react.default.createElement("span", {
|
|
22
21
|
style: listItemThemeStyle
|
|
23
22
|
}, props.listItem));
|
|
24
|
-
} else if (
|
|
23
|
+
} else if (typeof props.listItem === "object") {
|
|
25
24
|
return _react.default.createElement("li", null, _react.default.createElement("a", {
|
|
26
25
|
href: props.listItem.href,
|
|
27
26
|
style: listItemThemeStyle
|
package/dist/components/Paper.js
CHANGED
|
@@ -8,7 +8,7 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _PaperModule = _interopRequireDefault(require("./Paper.module.scss"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
11
|
+
const Paper = props => {
|
|
12
12
|
return _react.default.createElement("div", {
|
|
13
13
|
className: "".concat(_PaperModule.default.paper, " ").concat(props.noMargin ? _PaperModule.default.noMargin : "", " ").concat(props.noPadding ? _PaperModule.default.noPadding : "")
|
|
14
14
|
}, props.children);
|
|
@@ -8,19 +8,17 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
8
8
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
9
|
var _ProgressBarModule = _interopRequireDefault(require("./ProgressBar.module.scss"));
|
|
10
10
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
14
|
-
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); }
|
|
15
|
-
var ProgressBar = function ProgressBar(props) {
|
|
16
|
-
var scssValueProperty = "--value";
|
|
11
|
+
const ProgressBar = props => {
|
|
12
|
+
const scssValueProperty = "--value";
|
|
17
13
|
return _react.default.createElement("div", {
|
|
18
14
|
className: "".concat(_ProgressBarModule.default.progressBar, " ").concat(props.hasErrors ? _ProgressBarModule.default.hasErrors : ""),
|
|
19
15
|
role: "progressbar",
|
|
20
16
|
"aria-valuenow": props.progress || 0,
|
|
21
17
|
"aria-valuemin": "0",
|
|
22
18
|
"aria-valuemax": "100",
|
|
23
|
-
style:
|
|
19
|
+
style: {
|
|
20
|
+
[scssValueProperty]: props.progress || 0
|
|
21
|
+
}
|
|
24
22
|
});
|
|
25
23
|
};
|
|
26
24
|
ProgressBar.propTypes = {
|
|
@@ -9,22 +9,19 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
|
9
9
|
var _theme = require("../functions/theme");
|
|
10
10
|
var _RadioButtonIconModule = _interopRequireDefault(require("./RadioButtonIcon.module.scss"));
|
|
11
11
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
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; }
|
|
15
|
-
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; }
|
|
16
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
17
|
-
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); }
|
|
18
|
-
var RadioButtonIcon = function RadioButtonIcon(props) {
|
|
19
|
-
var inlineStyle = {
|
|
12
|
+
const RadioButtonIcon = props => {
|
|
13
|
+
let inlineStyle = {
|
|
20
14
|
height: props.size,
|
|
21
15
|
width: props.size
|
|
22
16
|
};
|
|
23
17
|
if (props.theme && props.checked) {
|
|
24
|
-
|
|
25
|
-
|
|
18
|
+
inlineStyle = {
|
|
19
|
+
...inlineStyle,
|
|
20
|
+
[!props.hasErrors && "background"]: (0, _theme.getThemePaletteBackgroundColor)(props.theme, "primary"),
|
|
21
|
+
[!props.hasErrors && "boxShadow"]: "0 0 0 1px ".concat((0, _theme.getThemePaletteBackgroundColor)(props.theme, "primary"))
|
|
22
|
+
};
|
|
26
23
|
}
|
|
27
|
-
|
|
24
|
+
const radioButtonIconProps = {
|
|
28
25
|
className: "".concat(_RadioButtonIconModule.default.radioButtonIcon, " ").concat(props.checked ? _RadioButtonIconModule.default.checked : "", " ").concat(props.disabled ? _RadioButtonIconModule.default.disabled : "", " ").concat(props.hasErrors ? _RadioButtonIconModule.default.hasErrors : ""),
|
|
29
26
|
style: inlineStyle
|
|
30
27
|
};
|
|
@@ -10,18 +10,18 @@ var _RadioButtonIcon = _interopRequireDefault(require("./RadioButtonIcon"));
|
|
|
10
10
|
var _asterisk = _interopRequireDefault(require("../assets/svg/asterisk.svg?url"));
|
|
11
11
|
var _RadioButtonInputModule = _interopRequireDefault(require("./RadioButtonInput.module.scss"));
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
|
|
13
|
+
const RadioButtonInput = props => {
|
|
14
|
+
const labelProps = {
|
|
15
15
|
className: "".concat(_RadioButtonInputModule.default.radioButtonInput, " ").concat(props.checked ? _RadioButtonInputModule.default.checked : "", " ").concat(props.disabled ? _RadioButtonInputModule.default.disabled : "", " ").concat(props.hasErrors ? _RadioButtonInputModule.default.hasErrors : ""),
|
|
16
16
|
htmlFor: props.id
|
|
17
17
|
};
|
|
18
|
-
|
|
18
|
+
const iconProps = {
|
|
19
19
|
checked: props.checked,
|
|
20
20
|
disabled: props.disabled,
|
|
21
21
|
theme: props.theme,
|
|
22
22
|
hasErrors: !props.contentOnly && props.hasErrors
|
|
23
23
|
};
|
|
24
|
-
|
|
24
|
+
const inputProps = {
|
|
25
25
|
id: props.id,
|
|
26
26
|
name: props.name || null,
|
|
27
27
|
type: "radio",
|
|
@@ -10,19 +10,19 @@ var _helpers = require("../functions/helpers");
|
|
|
10
10
|
var _asterisk = _interopRequireDefault(require("../assets/svg/asterisk.svg?url"));
|
|
11
11
|
var _RadioButtonListModule = _interopRequireDefault(require("./RadioButtonList.module.scss"));
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
13
|
+
const RadioButtonList = props => {
|
|
14
14
|
var _props$legend;
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
return childElementsthroughFragments.map(
|
|
15
|
+
const renderChildElements = childElements => {
|
|
16
|
+
const childElementsthroughFragments = (0, _helpers.cloneThroughFragments)(childElements);
|
|
17
|
+
return childElementsthroughFragments.map((childElement, index) => {
|
|
18
18
|
var _childElement$type;
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
const isRadioButtonListItem = (childElement === null || childElement === void 0 || (_childElement$type = childElement.type) === null || _childElement$type === void 0 ? void 0 : _childElement$type.name) === "RadioButtonListItem";
|
|
20
|
+
const childElementProps = isRadioButtonListItem ? {
|
|
21
21
|
requiredGroup: props.required,
|
|
22
22
|
compact: props.compact,
|
|
23
23
|
key: "radioButtonListItem-".concat(index)
|
|
24
24
|
} : null;
|
|
25
|
-
|
|
25
|
+
const childElementCopy = _react.default.cloneElement(childElement, childElementProps);
|
|
26
26
|
return childElementCopy;
|
|
27
27
|
});
|
|
28
28
|
};
|
|
@@ -10,10 +10,10 @@ var _RadioButtonInput = _interopRequireDefault(require("./RadioButtonInput"));
|
|
|
10
10
|
var _helpers = require("../functions/helpers");
|
|
11
11
|
var _RadioButtonListItemModule = _interopRequireDefault(require("./RadioButtonListItem.module.scss"));
|
|
12
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
const RadioButtonListItem = props => {
|
|
14
|
+
const listItemClassNameArray = [_RadioButtonListItemModule.default.radioButtonListItem, props.disabled ? _RadioButtonListItemModule.default.disabled : null, props.compact ? _RadioButtonListItemModule.default.compact : null, props.contentOnly ? _RadioButtonListItemModule.default.contentOnly : null, props.hasErrors ? _RadioButtonListItemModule.default.hasErrors : null];
|
|
15
|
+
const listItemClassNameString = (0, _helpers.classNameArrayToClassNameString)(listItemClassNameArray);
|
|
16
|
+
const inputProps = {
|
|
17
17
|
onChange: props.onChange,
|
|
18
18
|
inputValue: props.inputValue,
|
|
19
19
|
checked: props.checked,
|