dibk-design 7.7.0 → 8.0.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/README.md +7 -0
- package/dist/dibk-design.css +1 -0
- package/dist/favicon.ico +0 -0
- package/dist/index.es.js +2386 -0
- package/dist/index.html +38 -0
- package/dist/index.umd.js +20 -0
- package/dist/manifest.json +15 -0
- package/dist/robots.txt +3 -0
- package/package.json +19 -27
- package/dist/assets/fonts/PPMori-Bold.otf +0 -0
- package/dist/assets/fonts/PPMori-Book.otf +0 -0
- package/dist/assets/fonts/PPMori-ExtraBold.otf +0 -0
- package/dist/assets/fonts/PPMori-Light.otf +0 -0
- package/dist/assets/fonts/PPMori-Medium.otf +0 -0
- package/dist/assets/fonts/PPMori-Regular.otf +0 -0
- package/dist/assets/fonts/PPMori-RegularItalic.otf +0 -0
- package/dist/assets/fonts/PPMori-SemiBold.otf +0 -0
- package/dist/assets/png/dibk-logo.png +0 -0
- package/dist/assets/svg/arbeidstilsynet-logo.svg +0 -1
- package/dist/assets/svg/asterisk.svg +0 -1
- package/dist/assets/svg/checkmark-symbol.svg +0 -8
- package/dist/assets/svg/dibk-logo-base64.js +0 -7
- package/dist/assets/svg/dibk-logo-mobile.svg +0 -91
- package/dist/assets/svg/dibk-logo.svg +0 -52
- package/dist/assets/svg/error-sign.svg +0 -15
- package/dist/assets/svg/info-sign.svg +0 -1
- package/dist/assets/svg/spinner.svg +0 -57
- package/dist/assets/svg/x-symbol.svg +0 -1
- package/dist/components/Accordion.js +0 -64
- package/dist/components/Accordion.module.scss +0 -190
- package/dist/components/Button.js +0 -118
- package/dist/components/Button.module.scss +0 -290
- package/dist/components/CheckBoxIcon.js +0 -42
- package/dist/components/CheckBoxIcon.module.scss +0 -69
- package/dist/components/CheckBoxInput.js +0 -70
- package/dist/components/CheckBoxInput.module.scss +0 -53
- package/dist/components/CheckBoxList.js +0 -55
- package/dist/components/CheckBoxList.module.scss +0 -25
- package/dist/components/CheckBoxListItem.js +0 -61
- package/dist/components/CheckBoxListItem.module.scss +0 -84
- package/dist/components/Container.js +0 -24
- package/dist/components/Container.module.scss +0 -15
- package/dist/components/ContentBox.js +0 -56
- package/dist/components/ContentBox.module.scss +0 -60
- package/dist/components/DescriptionDetails.js +0 -32
- package/dist/components/DescriptionDetails.module.scss +0 -22
- package/dist/components/DescriptionList.js +0 -47
- package/dist/components/DescriptionList.module.scss +0 -15
- package/dist/components/DescriptionTerm.js +0 -32
- package/dist/components/DescriptionTerm.module.scss +0 -30
- package/dist/components/Dialog.js +0 -86
- package/dist/components/Dialog.module.scss +0 -178
- package/dist/components/DragAndDropFileInput.js +0 -131
- package/dist/components/DragAndDropFileInput.module.scss +0 -38
- package/dist/components/ErrorBox.js +0 -33
- package/dist/components/ErrorBox.module.scss +0 -68
- package/dist/components/ErrorMessage.js +0 -37
- package/dist/components/ErrorMessage.module.scss +0 -30
- package/dist/components/Footer.js +0 -16
- package/dist/components/Footer.module.scss +0 -21
- package/dist/components/Header.js +0 -42
- package/dist/components/Header.module.scss +0 -79
- package/dist/components/InfoBox.js +0 -23
- package/dist/components/InfoBox.module.scss +0 -44
- package/dist/components/InputField.js +0 -137
- package/dist/components/InputField.module.scss +0 -88
- package/dist/components/Label.js +0 -40
- package/dist/components/Label.module.scss +0 -19
- package/dist/components/Lead.js +0 -31
- package/dist/components/Lead.module.scss +0 -13
- package/dist/components/List.js +0 -46
- package/dist/components/List.module.scss +0 -12
- package/dist/components/ListItem.js +0 -27
- package/dist/components/ListItem.module.scss +0 -10
- package/dist/components/LoadingAnimation.js +0 -26
- package/dist/components/LoadingAnimation.module.scss +0 -28
- package/dist/components/NavigationBar.js +0 -146
- package/dist/components/NavigationBar.module.scss +0 -474
- package/dist/components/NavigationBarListItem.js +0 -24
- package/dist/components/PDF.js +0 -14
- package/dist/components/PDF.scss +0 -765
- package/dist/components/Paper.js +0 -24
- package/dist/components/Paper.module.scss +0 -17
- package/dist/components/ProgressBar.js +0 -32
- package/dist/components/ProgressBar.module.scss +0 -30
- package/dist/components/RadioButtonIcon.js +0 -34
- package/dist/components/RadioButtonIcon.module.scss +0 -49
- package/dist/components/RadioButtonInput.js +0 -68
- package/dist/components/RadioButtonInput.module.scss +0 -53
- package/dist/components/RadioButtonList.js +0 -55
- package/dist/components/RadioButtonList.module.scss +0 -25
- package/dist/components/RadioButtonListItem.js +0 -59
- package/dist/components/RadioButtonListItem.module.scss +0 -84
- package/dist/components/Select.js +0 -224
- package/dist/components/Select.module.scss +0 -118
- package/dist/components/Table.js +0 -31
- package/dist/components/Table.module.scss +0 -65
- package/dist/components/Textarea.js +0 -105
- package/dist/components/Textarea.module.scss +0 -73
- package/dist/components/Theme.js +0 -138
- package/dist/components/Theme.module.scss +0 -103
- package/dist/components/ThemeProvider.js +0 -24
- package/dist/components/ThemeProvider.module.scss +0 -24
- package/dist/components/ToggleNavigationButton.js +0 -44
- package/dist/components/ToggleNavigationButton.module.scss +0 -34
- package/dist/components/WizardNavigation/Step.js +0 -66
- package/dist/components/WizardNavigation/Step.module.scss +0 -175
- package/dist/components/WizardNavigation.js +0 -56
- package/dist/components/WizardNavigation.module.scss +0 -25
- package/dist/functions/generators.js +0 -16
- package/dist/functions/helpers.js +0 -112
- package/dist/functions/theme.js +0 -18
- package/dist/index.js +0 -279
- package/dist/style/abstracts/mixins/_animation.scss +0 -6
- package/dist/style/abstracts/mixins/_appearance.scss +0 -5
- package/dist/style/abstracts/mixins/_border-radius.scss +0 -31
- package/dist/style/abstracts/mixins/_box-shadow.scss +0 -5
- package/dist/style/abstracts/mixins/_box-sizing.scss +0 -5
- package/dist/style/abstracts/mixins/_calc.scss +0 -5
- package/dist/style/abstracts/mixins/_keyframes.scss +0 -14
- package/dist/style/abstracts/mixins/_opacity.scss +0 -5
- package/dist/style/abstracts/mixins/_placeholder.scss +0 -17
- package/dist/style/abstracts/mixins/_scrollbar.scss +0 -26
- package/dist/style/abstracts/mixins/_transform.scss +0 -6
- package/dist/style/abstracts/mixins/_transition.scss +0 -34
- package/dist/style/abstracts/variables/_colors.scss +0 -33
- package/dist/style/abstracts/variables/_sizes.scss +0 -1
- package/dist/style/abstracts/variables/_transitions.scss +0 -2
- package/dist/style/abstracts/variables/_typography.scss +0 -1
- package/dist/style/abstracts/variables/_viewports.scss +0 -14
- package/dist/style/base/_fonts.scss +0 -57
- package/dist/style/base/_reset.scss +0 -15
- package/dist/style/base/_typography.scss +0 -10
- package/dist/style/layout/_containers.scss +0 -11
- package/dist/style/pdf.css +0 -637
- package/dist/style/pdf.css.map +0 -1
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" role="presentation">
|
|
2
|
-
<g clip-path="url(#clip0_1089_7422)">
|
|
3
|
-
<mask id="mask0_1089_7422" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="20" style="mask-type: alpha;">
|
|
4
|
-
<rect width="20" height="20" style="fill: white;"></rect>
|
|
5
|
-
</mask>
|
|
6
|
-
<g mask="url(#mask0_1089_7422)">
|
|
7
|
-
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 10C0 4.4775 4.4775 0 10 0C15.5225 0 20 4.4775 20 10C20 15.5225 15.5225 20 10 20C4.4775 20 0 15.5225 0 10ZM11 14.0766C11 14.8122 10.5188 15.3333 9.83335 15.3333C9.13335 15.3333 8.66669 14.8122 8.66669 14.0766C8.66669 13.341 9.13335 12.8046 9.83335 12.8046C10.5188 12.8046 11 13.341 11 14.0766ZM10.65 11.9463H8.98752L8.75419 4.66663H10.8834L10.65 11.9463Z" style="fill: rgb(219, 0, 0);"></path>
|
|
8
|
-
</g>
|
|
9
|
-
</g>
|
|
10
|
-
<defs>
|
|
11
|
-
<clipPath id="clip0_1089_7422">
|
|
12
|
-
<rect width="20" height="20" fill="white"></rect>
|
|
13
|
-
</clipPath>
|
|
14
|
-
</defs>
|
|
15
|
-
</svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" role="presentation"><path d="M10 0C4.4775 0 0 4.4775 0 10C0 15.5225 4.4775 20 10 20C15.5225 20 20 15.5225 20 10C20 4.4775 15.5225 0 10 0ZM8.30583 13.3417C8.77583 11.8508 9.66583 10.065 9.82333 9.61333C10.0508 8.9575 9.6475 8.66667 8.37333 9.7875L8.09 9.25417C9.54333 7.67333 12.5358 7.31583 11.5175 9.765C10.8817 11.2942 10.4267 12.3267 10.1667 13.1233C9.7875 14.2842 10.745 13.8133 11.6825 12.9475C11.81 13.1558 11.8517 13.2233 11.9792 13.4633C9.8975 15.445 7.58667 15.62 8.30583 13.3417ZM12.2575 6.53417C11.8142 6.91167 11.1575 6.90333 10.79 6.51583C10.4225 6.12833 10.4842 5.50917 10.9267 5.13167C11.37 4.75417 12.0267 4.76333 12.3942 5.15C12.76 5.53833 12.7 6.1575 12.2575 6.53417Z" style="fill: rgb(0, 48, 69);"></path></svg>
|
|
@@ -1,57 +0,0 @@
|
|
|
1
|
-
<svg class="lds-spin" width="47px" height="47px" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" style="background: none;"><g transform="translate(80,50)">
|
|
2
|
-
<g transform="rotate(0)">
|
|
3
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="1" transform="scale(1.0175 1.0175)">
|
|
4
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.875s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
5
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.875s"></animate>
|
|
6
|
-
</circle>
|
|
7
|
-
</g>
|
|
8
|
-
</g><g transform="translate(71.21320343559643,71.21320343559643)">
|
|
9
|
-
<g transform="rotate(45)">
|
|
10
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.875" transform="scale(1.03 1.03)">
|
|
11
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.75s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
12
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.75s"></animate>
|
|
13
|
-
</circle>
|
|
14
|
-
</g>
|
|
15
|
-
</g><g transform="translate(50,80)">
|
|
16
|
-
<g transform="rotate(90)">
|
|
17
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.75" transform="scale(1.0425 1.0425)">
|
|
18
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.625s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
19
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.625s"></animate>
|
|
20
|
-
</circle>
|
|
21
|
-
</g>
|
|
22
|
-
</g><g transform="translate(28.786796564403577,71.21320343559643)">
|
|
23
|
-
<g transform="rotate(135)">
|
|
24
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.625" transform="scale(1.055 1.055)">
|
|
25
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.5s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
26
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.5s"></animate>
|
|
27
|
-
</circle>
|
|
28
|
-
</g>
|
|
29
|
-
</g><g transform="translate(20,50.00000000000001)">
|
|
30
|
-
<g transform="rotate(180)">
|
|
31
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.5" transform="scale(1.0675 1.0675)">
|
|
32
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.375s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
33
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.375s"></animate>
|
|
34
|
-
</circle>
|
|
35
|
-
</g>
|
|
36
|
-
</g><g transform="translate(28.78679656440357,28.786796564403577)">
|
|
37
|
-
<g transform="rotate(225)">
|
|
38
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.375" transform="scale(1.08 1.08)">
|
|
39
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.25s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
40
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.25s"></animate>
|
|
41
|
-
</circle>
|
|
42
|
-
</g>
|
|
43
|
-
</g><g transform="translate(49.99999999999999,20)">
|
|
44
|
-
<g transform="rotate(270)">
|
|
45
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.25" transform="scale(1.0925 1.0925)">
|
|
46
|
-
<animateTransform attributeName="transform" type="scale" begin="-0.125s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
47
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="-0.125s"></animate>
|
|
48
|
-
</circle>
|
|
49
|
-
</g>
|
|
50
|
-
</g><g transform="translate(71.21320343559643,28.78679656440357)">
|
|
51
|
-
<g transform="rotate(315)">
|
|
52
|
-
<circle cx="0" cy="0" r="10" fill="#00757f" fill-opacity="0.125" transform="scale(1.005 1.005)">
|
|
53
|
-
<animateTransform attributeName="transform" type="scale" begin="0s" values="1.1 1.1;1 1" keyTimes="0;1" dur="1s" repeatCount="indefinite"></animateTransform>
|
|
54
|
-
<animate attributeName="fill-opacity" keyTimes="0;1" dur="1s" repeatCount="indefinite" values="1;0" begin="0s"></animate>
|
|
55
|
-
</circle>
|
|
56
|
-
</g>
|
|
57
|
-
</g></svg>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
<svg xmlns="http://www.w3.org/2000/svg" width="25" height="25"><path fill="#072938" stroke="#072938" stroke-linecap="round" stroke-width="3.23" d="m3.97 3.57 17.44 18.2m-17.44.01L21.41 3.57"/></svg>
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _helpers = require("../functions/helpers");
|
|
10
|
-
var _AccordionModule = _interopRequireDefault(require("./Accordion.module.scss"));
|
|
11
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
|
-
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); }
|
|
13
|
-
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; }
|
|
14
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
15
|
-
const Accordion = props => {
|
|
16
|
-
const [expanded, setExpanded] = (0, _react.useState)(props.expanded);
|
|
17
|
-
const [initialized, setInitialized] = (0, _react.useState)(props.initialized);
|
|
18
|
-
const handleToggleExpand = () => {
|
|
19
|
-
setExpanded(!expanded);
|
|
20
|
-
setInitialized(true);
|
|
21
|
-
if (props.onToggleExpand) {
|
|
22
|
-
props.onToggleExpand();
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
(0, _react.useEffect)(() => {
|
|
26
|
-
setExpanded(props.expanded);
|
|
27
|
-
}, [props.expanded]);
|
|
28
|
-
const renderPanel = () => {
|
|
29
|
-
return _react.default.createElement("button", _extends({}, props.buttonProps, {
|
|
30
|
-
className: _AccordionModule.default.panel,
|
|
31
|
-
onClick: handleToggleExpand,
|
|
32
|
-
"aria-expanded": expanded ? "true" : "false"
|
|
33
|
-
}), _react.default.createElement("span", {
|
|
34
|
-
className: _AccordionModule.default.panelText
|
|
35
|
-
}, props.title), _react.default.createElement("span", {
|
|
36
|
-
className: "".concat(_AccordionModule.default.panelChevron, " ").concat(expanded ? _AccordionModule.default.expanded : "")
|
|
37
|
-
}));
|
|
38
|
-
};
|
|
39
|
-
const className = (0, _helpers.classNameArrayToClassNameString)([_AccordionModule.default.accordion, props.color && _AccordionModule.default[props.color], !props.noMargin && _AccordionModule.default.margin]);
|
|
40
|
-
return _react.default.createElement("div", {
|
|
41
|
-
className: className
|
|
42
|
-
}, renderPanel(), _react.default.createElement("div", {
|
|
43
|
-
className: "".concat(_AccordionModule.default.content, " ").concat(initialized ? _AccordionModule.default.initialized : "", " ").concat(expanded ? _AccordionModule.default.expanded : "")
|
|
44
|
-
}, props.children));
|
|
45
|
-
};
|
|
46
|
-
Accordion.propTypes = {
|
|
47
|
-
title: _propTypes.default.string,
|
|
48
|
-
titleSize: _propTypes.default.oneOf(["regular", "large"]),
|
|
49
|
-
content: _propTypes.default.string,
|
|
50
|
-
color: _propTypes.default.oneOf(["default", "secondary"]),
|
|
51
|
-
expanded: _propTypes.default.bool,
|
|
52
|
-
onToggleExpand: _propTypes.default.func,
|
|
53
|
-
buttonProps: _propTypes.default.object
|
|
54
|
-
};
|
|
55
|
-
Accordion.defaultProps = {
|
|
56
|
-
title: null,
|
|
57
|
-
titleSize: "regular",
|
|
58
|
-
href: null,
|
|
59
|
-
content: "",
|
|
60
|
-
color: "default",
|
|
61
|
-
expanded: false,
|
|
62
|
-
noMargin: false
|
|
63
|
-
};
|
|
64
|
-
var _default = exports.default = Accordion;
|
|
@@ -1,190 +0,0 @@
|
|
|
1
|
-
// Mixins
|
|
2
|
-
@use "../style/abstracts/mixins/appearance";
|
|
3
|
-
@use "../style/abstracts/mixins/border-radius";
|
|
4
|
-
|
|
5
|
-
// Variables
|
|
6
|
-
@use "../style/abstracts/variables/colors";
|
|
7
|
-
@use "../style/abstracts/variables/viewports";
|
|
8
|
-
@use "../style/abstracts/variables/typography";
|
|
9
|
-
|
|
10
|
-
@keyframes show {
|
|
11
|
-
0% {
|
|
12
|
-
opacity: 0;
|
|
13
|
-
margin-top: 0px;
|
|
14
|
-
padding: 0 15px 0;
|
|
15
|
-
line-height: 0;
|
|
16
|
-
max-height: 0;
|
|
17
|
-
}
|
|
18
|
-
100% {
|
|
19
|
-
opacity: 1;
|
|
20
|
-
margin-top: 0px;
|
|
21
|
-
padding: 8px 15px 15px;
|
|
22
|
-
line-height: inherit;
|
|
23
|
-
max-height: 1000px;
|
|
24
|
-
}
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
@keyframes hide {
|
|
28
|
-
100% {
|
|
29
|
-
opacity: 0;
|
|
30
|
-
margin-top: 0px;
|
|
31
|
-
padding: 0 15px 0;
|
|
32
|
-
line-height: 0;
|
|
33
|
-
max-height: 0;
|
|
34
|
-
}
|
|
35
|
-
0% {
|
|
36
|
-
opacity: 1;
|
|
37
|
-
margin-top: 0px;
|
|
38
|
-
padding: 8px 15px 15px;
|
|
39
|
-
line-height: inherit;
|
|
40
|
-
max-height: 1000px;
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
@media only screen and (min-width: viewports.$screen-sm) {
|
|
45
|
-
@keyframes show {
|
|
46
|
-
0% {
|
|
47
|
-
opacity: 0;
|
|
48
|
-
margin-top: 0px;
|
|
49
|
-
padding: 0 30px 0;
|
|
50
|
-
line-height: 0;
|
|
51
|
-
max-height: 0;
|
|
52
|
-
}
|
|
53
|
-
100% {
|
|
54
|
-
opacity: 1;
|
|
55
|
-
margin-top: 0px;
|
|
56
|
-
padding: 8px 30px 15px;
|
|
57
|
-
line-height: inherit;
|
|
58
|
-
max-height: 1000px;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
@keyframes hide {
|
|
62
|
-
100% {
|
|
63
|
-
opacity: 0;
|
|
64
|
-
margin-top: 0px;
|
|
65
|
-
padding: 0 30px 0;
|
|
66
|
-
line-height: 0;
|
|
67
|
-
max-height: 0;
|
|
68
|
-
}
|
|
69
|
-
0% {
|
|
70
|
-
opacity: 1;
|
|
71
|
-
margin-top: 0px;
|
|
72
|
-
padding: 8px 30px 15px;
|
|
73
|
-
line-height: inherit;
|
|
74
|
-
max-height: 1000px;
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
|
|
79
|
-
.accordion {
|
|
80
|
-
font-family: typography.$default-font;
|
|
81
|
-
text-decoration: none;
|
|
82
|
-
width: 100%;
|
|
83
|
-
display: block;
|
|
84
|
-
&.default {
|
|
85
|
-
background-color: var(--color-default-background, colors.$color-default-background);
|
|
86
|
-
.panel span,
|
|
87
|
-
.content {
|
|
88
|
-
color: var(--color-default-text, colors.$color-default-text);
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
&.secondary {
|
|
92
|
-
background-color: var(--color-secondary-background, colors.$color-secondary-background);
|
|
93
|
-
color: var(--color-default-text, colors.$color-default-text);
|
|
94
|
-
.panel span,
|
|
95
|
-
.content {
|
|
96
|
-
color: var(--color-default-text, colors.$color-default-text);
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
&.margin {
|
|
100
|
-
margin-bottom: 8px;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
.panel {
|
|
104
|
-
@include appearance.appearance(none);
|
|
105
|
-
@include border-radius.border-radius(0);
|
|
106
|
-
font-family: typography.$default-font;
|
|
107
|
-
padding: 15px 15px;
|
|
108
|
-
display: flex;
|
|
109
|
-
align-items: center;
|
|
110
|
-
position: relative;
|
|
111
|
-
text-decoration: none;
|
|
112
|
-
overflow-wrap: break-word;
|
|
113
|
-
line-height: 1.7;
|
|
114
|
-
cursor: pointer;
|
|
115
|
-
border: none;
|
|
116
|
-
width: 100%;
|
|
117
|
-
background: none;
|
|
118
|
-
text-align: left;
|
|
119
|
-
@media only screen and (min-width: viewports.$screen-sm) {
|
|
120
|
-
padding: 15px 30px;
|
|
121
|
-
}
|
|
122
|
-
&:focus-visible {
|
|
123
|
-
outline-color: var(--color-primary, colors.$color-primary);
|
|
124
|
-
outline-style: auto;
|
|
125
|
-
outline-width: 2px;
|
|
126
|
-
outline-offset: 0px;
|
|
127
|
-
}
|
|
128
|
-
.panelText {
|
|
129
|
-
font-family: typography.$default-font;
|
|
130
|
-
font-weight: bold;
|
|
131
|
-
font-size: 18px;
|
|
132
|
-
flex: 1;
|
|
133
|
-
}
|
|
134
|
-
.panelChevron {
|
|
135
|
-
@include border-radius.border-radius(100px);
|
|
136
|
-
box-sizing: border-box;
|
|
137
|
-
position: relative;
|
|
138
|
-
display: block;
|
|
139
|
-
width: 18px;
|
|
140
|
-
height: 18px;
|
|
141
|
-
margin-right: 6px;
|
|
142
|
-
@media only screen and (min-width: viewports.$screen-sm) {
|
|
143
|
-
margin-right: 0;
|
|
144
|
-
}
|
|
145
|
-
&::after {
|
|
146
|
-
content: "";
|
|
147
|
-
display: block;
|
|
148
|
-
box-sizing: border-box;
|
|
149
|
-
position: absolute;
|
|
150
|
-
width: 18px;
|
|
151
|
-
height: 18px;
|
|
152
|
-
border-bottom: 2px solid;
|
|
153
|
-
border-right: 2px solid;
|
|
154
|
-
transform: translateY(-30%) rotate(45deg);
|
|
155
|
-
transition: transform 0.3s ease-in-out;
|
|
156
|
-
}
|
|
157
|
-
&.expanded {
|
|
158
|
-
&::after {
|
|
159
|
-
transform: translateY(30%) rotate(225deg);
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
}
|
|
164
|
-
.content {
|
|
165
|
-
opacity: 0;
|
|
166
|
-
margin-top: 0px;
|
|
167
|
-
line-height: 0;
|
|
168
|
-
max-height: 0;
|
|
169
|
-
overflow: hidden;
|
|
170
|
-
padding: 0 15px 0;
|
|
171
|
-
@media only screen and (min-width: viewports.$screen-sm) {
|
|
172
|
-
padding: 0 30px 0;
|
|
173
|
-
}
|
|
174
|
-
&.initialized {
|
|
175
|
-
animation: hide 0.3s ease-in-out;
|
|
176
|
-
}
|
|
177
|
-
|
|
178
|
-
&.expanded {
|
|
179
|
-
animation: show 0.3s ease-in-out;
|
|
180
|
-
opacity: 1;
|
|
181
|
-
margin-top: 0px;
|
|
182
|
-
padding: 8px 15px 15px;
|
|
183
|
-
line-height: inherit;
|
|
184
|
-
max-height: 10000px;
|
|
185
|
-
@media only screen and (min-width: viewports.$screen-sm) {
|
|
186
|
-
padding: 8px 30px 15px;
|
|
187
|
-
}
|
|
188
|
-
}
|
|
189
|
-
}
|
|
190
|
-
}
|
|
@@ -1,118 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
-
var _reactRouterDom = require("react-router-dom");
|
|
10
|
-
var _helpers = require("../functions/helpers");
|
|
11
|
-
var _ButtonModule = _interopRequireDefault(require("./Button.module.scss"));
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
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 && {}.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
|
-
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
16
|
-
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; }
|
|
17
|
-
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; }
|
|
18
|
-
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
|
|
19
|
-
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
20
|
-
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
|
|
21
|
-
const Button = props => {
|
|
22
|
-
var _props$href, _props$href2, _props$children;
|
|
23
|
-
const getArrowClass = arrow => {
|
|
24
|
-
switch (arrow) {
|
|
25
|
-
case "left":
|
|
26
|
-
return _ButtonModule.default.hasArrowLeft;
|
|
27
|
-
case "right":
|
|
28
|
-
return _ButtonModule.default.hasArrowRight;
|
|
29
|
-
default:
|
|
30
|
-
return "";
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
let buttonProps = _objectSpread(_objectSpread({}, props), {}, {
|
|
34
|
-
"aria-invalid": props.hasErrors || null,
|
|
35
|
-
href: !props.disabled && (_props$href = props.href) !== null && _props$href !== void 0 && _props$href.length ? props.href : null
|
|
36
|
-
});
|
|
37
|
-
delete buttonProps.noHover;
|
|
38
|
-
delete buttonProps.hasErrors;
|
|
39
|
-
delete buttonProps.rounded;
|
|
40
|
-
delete buttonProps.inputType;
|
|
41
|
-
delete buttonProps.color;
|
|
42
|
-
delete buttonProps.content;
|
|
43
|
-
delete buttonProps.arrow;
|
|
44
|
-
delete buttonProps.noMargin;
|
|
45
|
-
const buttonColor = (props === null || props === void 0 ? void 0 : props.inputType) === "radio" ? props.defaultChecked ? "primary" : "secondary" : props.color;
|
|
46
|
-
const className = (0, _helpers.classNameArrayToClassNameString)([_ButtonModule.default.button, _ButtonModule.default[buttonColor], _ButtonModule.default[props.size], getArrowClass(props.arrow), props.noHover || (props === null || props === void 0 ? void 0 : props.inputType) === "radio" ? _ButtonModule.default.noHover : null, props.rounded && _ButtonModule.default.rounded, props.hasErrors && _ButtonModule.default.hasErrors, props.disabled && _ButtonModule.default.disabled, props.noMargin && _ButtonModule.default.noMargin]);
|
|
47
|
-
const renderReactLinkElements = childElements => {
|
|
48
|
-
const childElementsthroughFragments = (0, _helpers.cloneThroughFragments)(childElements);
|
|
49
|
-
return childElementsthroughFragments.map((childElement, index) => {
|
|
50
|
-
var _childElement$props;
|
|
51
|
-
if (!buttonProps.disabled && !!(childElement !== null && childElement !== void 0 && (_childElement$props = childElement.props) !== null && _childElement$props !== void 0 && _childElement$props.to)) {
|
|
52
|
-
var _childElement$props2, _childElement$props3;
|
|
53
|
-
const childElementCopy = _react.default.cloneElement(childElement, {
|
|
54
|
-
className: className,
|
|
55
|
-
key: "button-".concat(index),
|
|
56
|
-
to: !buttonProps.disabled && childElement !== null && childElement !== void 0 && (_childElement$props2 = childElement.props) !== null && _childElement$props2 !== void 0 && _childElement$props2.to ? childElement === null || childElement === void 0 || (_childElement$props3 = childElement.props) === null || _childElement$props3 === void 0 ? void 0 : _childElement$props3.to : null
|
|
57
|
-
});
|
|
58
|
-
return childElementCopy;
|
|
59
|
-
} else {
|
|
60
|
-
return _react.default.createElement("button", _extends({}, buttonProps, {
|
|
61
|
-
key: "button-".concat(index),
|
|
62
|
-
className: className
|
|
63
|
-
}), props.content || childElement.props.children);
|
|
64
|
-
}
|
|
65
|
-
});
|
|
66
|
-
};
|
|
67
|
-
if (props.inputType === "button") {
|
|
68
|
-
return _react.default.createElement("input", _extends({}, buttonProps, {
|
|
69
|
-
className: className,
|
|
70
|
-
type: "button",
|
|
71
|
-
value: props.content
|
|
72
|
-
}));
|
|
73
|
-
} else if (props.inputType === "radio") {
|
|
74
|
-
return _react.default.createElement("label", {
|
|
75
|
-
className: className
|
|
76
|
-
}, _react.default.createElement("input", _extends({}, buttonProps, {
|
|
77
|
-
type: "radio"
|
|
78
|
-
})), props.content);
|
|
79
|
-
} else if ((_props$href2 = props.href) !== null && _props$href2 !== void 0 && _props$href2.length && !props.disabled) {
|
|
80
|
-
return _react.default.createElement("a", _extends({}, buttonProps, {
|
|
81
|
-
className: className
|
|
82
|
-
}), props.content || props.children);
|
|
83
|
-
} else if ((props === null || props === void 0 || (_props$children = props.children) === null || _props$children === void 0 ? void 0 : _props$children.type) === _reactRouterDom.Link) {
|
|
84
|
-
return _react.default.createElement(_react.Fragment, null, renderReactLinkElements(_react.default.Children.toArray(props.children)));
|
|
85
|
-
} else {
|
|
86
|
-
return _react.default.createElement("button", _extends({}, buttonProps, {
|
|
87
|
-
className: className
|
|
88
|
-
}), props.content || props.children);
|
|
89
|
-
}
|
|
90
|
-
};
|
|
91
|
-
Button.propTypes = {
|
|
92
|
-
content: _propTypes.default.string,
|
|
93
|
-
color: _propTypes.default.oneOf(["primary", "secondary"]),
|
|
94
|
-
size: _propTypes.default.oneOf(["small", "regular"]),
|
|
95
|
-
arrow: _propTypes.default.oneOf(["none", "left", "right"]),
|
|
96
|
-
disabled: _propTypes.default.bool,
|
|
97
|
-
inputType: _propTypes.default.oneOf(["button", "radio"]),
|
|
98
|
-
name: _propTypes.default.string,
|
|
99
|
-
defaultChecked: _propTypes.default.bool,
|
|
100
|
-
required: _propTypes.default.bool,
|
|
101
|
-
hasErrors: _propTypes.default.bool,
|
|
102
|
-
"aria-describedby": _propTypes.default.string,
|
|
103
|
-
noHover: _propTypes.default.bool,
|
|
104
|
-
rounded: _propTypes.default.bool,
|
|
105
|
-
href: _propTypes.default.string,
|
|
106
|
-
onClick: _propTypes.default.func,
|
|
107
|
-
noMargin: _propTypes.default.bool
|
|
108
|
-
};
|
|
109
|
-
Button.defaultProps = {
|
|
110
|
-
color: "primary",
|
|
111
|
-
size: "regular",
|
|
112
|
-
disabled: false,
|
|
113
|
-
hasErrors: false,
|
|
114
|
-
noHover: false,
|
|
115
|
-
arrow: "none",
|
|
116
|
-
noMargin: false
|
|
117
|
-
};
|
|
118
|
-
var _default = exports.default = Button;
|