@sb1/ffe-form-react 100.12.4 → 101.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/es/BaseRadioButton.js +7 -30
- package/es/Checkbox.js +6 -29
- package/es/Input.js +2 -25
- package/es/InputGroup.js +17 -40
- package/es/InputTextLike.js +2 -25
- package/es/Label.js +3 -28
- package/es/PhoneNumber.js +20 -32
- package/es/RadioBlock.js +7 -30
- package/es/RadioButton.js +3 -26
- package/es/RadioButtonInputGroup.js +7 -30
- package/es/RadioSwitch.js +6 -29
- package/es/TextArea.js +2 -25
- package/es/TextField.js +2 -25
- package/es/ToggleSwitch.js +5 -28
- package/es/Tooltip.js +9 -21
- package/es/documentation/RadioButton-example.js +12 -23
- package/es/documentation/RadioSwitch-example.js +4 -15
- package/es/i18n/i18n.js +3 -3
- package/es/message/BaseFieldMessage.js +7 -29
- package/es/message/ErrorFieldMessage.js +2 -25
- package/es/message/InfoFieldMessage.js +2 -25
- package/es/message/SuccessFieldMessage.js +2 -25
- package/lib/BaseRadioButton.js +10 -33
- package/lib/Checkbox.js +8 -31
- package/lib/Input.js +4 -27
- package/lib/InputGroup.js +22 -45
- package/lib/InputTextLike.js +4 -27
- package/lib/Label.js +5 -30
- package/lib/PhoneNumber.js +24 -36
- package/lib/RadioBlock.js +9 -32
- package/lib/RadioButton.js +6 -29
- package/lib/RadioButtonInputGroup.js +11 -34
- package/lib/RadioSwitch.js +9 -32
- package/lib/TextArea.js +4 -27
- package/lib/TextField.js +4 -27
- package/lib/ToggleSwitch.js +8 -31
- package/lib/Tooltip.js +13 -25
- package/lib/documentation/RadioButton-example.js +15 -26
- package/lib/documentation/RadioSwitch-example.js +7 -18
- package/lib/i18n/i18n.js +3 -3
- package/lib/message/BaseFieldMessage.js +10 -32
- package/lib/message/ErrorFieldMessage.js +4 -27
- package/lib/message/InfoFieldMessage.js +4 -27
- package/lib/message/SuccessFieldMessage.js +4 -27
- package/package.json +8 -8
package/lib/ToggleSwitch.js
CHANGED
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -43,32 +32,20 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
43
32
|
return result;
|
|
44
33
|
};
|
|
45
34
|
})();
|
|
46
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
47
|
-
var t = {};
|
|
48
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
49
|
-
t[p] = s[p];
|
|
50
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
51
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
52
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
53
|
-
t[p[i]] = s[p[i]];
|
|
54
|
-
}
|
|
55
|
-
return t;
|
|
56
|
-
};
|
|
57
35
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
58
36
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
59
37
|
};
|
|
60
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
61
39
|
exports.ToggleSwitch = void 0;
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
var text = i18n_1.default[locale];
|
|
40
|
+
const react_1 = __importStar(require("react"));
|
|
41
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
42
|
+
const i18n_1 = __importDefault(require("./i18n/i18n"));
|
|
43
|
+
const ToggleSwitch = ({ children, className, description, hideOnOff, onText, offText, id: providedId, value = 'on', locale = 'nb', checked, ...rest }) => {
|
|
44
|
+
const generatedId = (0, react_1.useId)();
|
|
45
|
+
const id = providedId !== null && providedId !== void 0 ? providedId : generatedId;
|
|
46
|
+
const text = i18n_1.default[locale];
|
|
70
47
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)('ffe-toggle-switch', { 'ffe-toggle-switch--hide-on-off': hideOnOff }, className) },
|
|
71
|
-
react_1.default.createElement("input",
|
|
48
|
+
react_1.default.createElement("input", { className: "ffe-toggle-switch__input", type: "checkbox", role: "switch", id: id, value: value, checked: !!checked, ...rest }),
|
|
72
49
|
react_1.default.createElement("label", { className: "ffe-toggle-switch__label", htmlFor: id },
|
|
73
50
|
react_1.default.createElement("span", { className: "ffe-toggle-switch__label-text" },
|
|
74
51
|
children,
|
package/lib/Tooltip.js
CHANGED
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -48,25 +37,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
48
37
|
};
|
|
49
38
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
50
39
|
exports.Tooltip = void 0;
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
exports.Tooltip = react_1.default.forwardRef(
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
setIsOpen(function (prev) { return !prev; });
|
|
40
|
+
const react_1 = __importStar(require("react"));
|
|
41
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
42
|
+
const ffe_collapse_react_1 = require("@sb1/ffe-collapse-react");
|
|
43
|
+
const ffe_icons_react_1 = require("@sb1/ffe-icons-react");
|
|
44
|
+
exports.Tooltip = react_1.default.forwardRef(({ isOpen: initialIsOpen, 'aria-controls': ariaControls, 'aria-label': ariaLabel = 'Vis hjelpetekst', children, className, onClick, tabIndex, containerProps, }, ref) => {
|
|
45
|
+
const tooltipButtonId = (0, react_1.useId)();
|
|
46
|
+
const tooltipId = (0, react_1.useId)();
|
|
47
|
+
const [isOpen, setIsOpen] = (0, react_1.useState)(!!initialIsOpen);
|
|
48
|
+
const handleClick = (evt) => {
|
|
49
|
+
setIsOpen(prev => !prev);
|
|
62
50
|
if (onClick) {
|
|
63
51
|
onClick(evt);
|
|
64
52
|
}
|
|
65
53
|
};
|
|
66
|
-
|
|
67
|
-
return (react_1.default.createElement("div",
|
|
54
|
+
const helpIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIj48cGF0aCBkPSJNNDgwLTI0MHEyMCAwIDM0LTE0dDE0LTM0cTAtMjAtMTQtMzR0LTM0LTE0cS0yMCAwLTM0IDE0dC0xNCAzNHEwIDIwIDE0IDM0dDM0IDE0Wm0tMzYtMTUzaDczcTAtMzcgNi41LTUyLjVUNTU1LTQ4NXEzNS0zNCA0OC41LTU4dDEzLjUtNTNxMC01NS0zNy41LTg5LjVUNDg0LTcyMHEtNTEgMC04OC41IDI3VDM0My02MjBsNjUgMjdxOS0yOCAyOC41LTQzLjVUNDgyLTY1MnEyOCAwIDQ2IDE2dDE4IDQycTAgMjMtMTUuNSA0MVQ0OTYtNTE4cS0zNSAzMi00My41IDUyLjVUNDQ0LTM5M1ptMzYgMjk3cS03OSAwLTE0OS0zMHQtMTIyLjUtODIuNVExNTYtMjYxIDEyNi0zMzFUOTYtNDgwcTAtODAgMzAtMTQ5LjV0ODIuNS0xMjJRMjYxLTgwNCAzMzEtODM0dDE0OS0zMHE4MCAwIDE0OS41IDMwdDEyMiA4Mi41UTgwNC02OTkgODM0LTYyOS41VDg2NC00ODBxMCA3OS0zMCAxNDl0LTgyLjUgMTIyLjVRNjk5LTE1NiA2MjkuNS0xMjZUNDgwLTk2Wm0wLTcycTEzMCAwIDIyMS05MXQ5MS0yMjFxMC0xMzAtOTEtMjIxdC0yMjEtOTFxLTEzMCAwLTIyMSA5MXQtOTEgMjIxcTAgMTMwIDkxIDIyMXQyMjEgOTFabTAtMzEyWiIvPjwvc3ZnPg==';
|
|
55
|
+
return (react_1.default.createElement("div", { ...containerProps, className: (0, classnames_1.default)('ffe-tooltip', {
|
|
68
56
|
'ffe-tooltip--open': isOpen,
|
|
69
|
-
}) }
|
|
57
|
+
}) },
|
|
70
58
|
react_1.default.createElement("button", { ref: ref, "aria-expanded": isOpen, "aria-controls": children ? tooltipId : ariaControls, "aria-label": ariaLabel, className: "ffe-tooltip__icon", onClick: handleClick, type: "button", tabIndex: tabIndex, id: tooltipButtonId },
|
|
71
59
|
react_1.default.createElement("span", { "aria-hidden": true },
|
|
72
60
|
react_1.default.createElement(ffe_icons_react_1.Icon, { className: "ffe-button__icon", fileUrl: helpIcon, size: "sm", ariaLabel: "?" }))),
|
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -44,23 +33,23 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
44
33
|
};
|
|
45
34
|
})();
|
|
46
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
exports.default = (
|
|
51
|
-
|
|
52
|
-
|
|
36
|
+
const react_1 = __importStar(require("react"));
|
|
37
|
+
const RadioButton_1 = require("../RadioButton");
|
|
38
|
+
const RadioButtonInputGroup_1 = require("../RadioButtonInputGroup");
|
|
39
|
+
exports.default = () => {
|
|
40
|
+
const [accountType, setAccountType] = (0, react_1.useState)('savings');
|
|
41
|
+
const [paymentFreq, setPaymentFreq] = (0, react_1.useState)('monthly');
|
|
53
42
|
return (react_1.default.createElement("div", { className: "ffe-grid" },
|
|
54
43
|
react_1.default.createElement("div", { className: "ffe-grid__row" },
|
|
55
44
|
react_1.default.createElement("div", { className: "ffe-grid__col--md-12 ffe-grid__col--sm-12" },
|
|
56
|
-
react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Choose your account type", description: "Select the type of account that best suits your needs", name: "account-type", onChange:
|
|
57
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
58
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
59
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
45
|
+
react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Choose your account type", description: "Select the type of account that best suits your needs", name: "account-type", onChange: e => setAccountType(e.target.value), selectedValue: accountType }, inputProps => (react_1.default.createElement(react_1.default.Fragment, null,
|
|
46
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "savings", tooltip: "Best for long-term savings with higher interest rates", ...inputProps }, "Savings Account"),
|
|
47
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "checking", tooltip: "Perfect for daily transactions and bill payments", ...inputProps }, "Checking Account"),
|
|
48
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "investment", tooltip: "Ideal for growing your wealth through various investment options", ...inputProps }, "Investment Account")))))),
|
|
60
49
|
react_1.default.createElement("div", { className: "ffe-grid__row", style: { marginTop: '2rem' } },
|
|
61
50
|
react_1.default.createElement("div", { className: "ffe-grid__col--md-12 ffe-grid__col--sm-12" },
|
|
62
|
-
react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Payment frequency", name: "payment-frequency", onChange:
|
|
63
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
64
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
65
|
-
react_1.default.createElement(RadioButton_1.RadioButton,
|
|
66
|
-
}
|
|
51
|
+
react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Payment frequency", name: "payment-frequency", onChange: e => setPaymentFreq(e.target.value), selectedValue: paymentFreq, inline: true }, inputProps => (react_1.default.createElement(react_1.default.Fragment, null,
|
|
52
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "monthly", ...inputProps }, "Monthly"),
|
|
53
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "quarterly", ...inputProps }, "Quarterly"),
|
|
54
|
+
react_1.default.createElement(RadioButton_1.RadioButton, { value: "yearly", ...inputProps }, "Yearly"))))))));
|
|
55
|
+
};
|
|
@@ -1,15 +1,4 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
2
|
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
14
3
|
if (k2 === undefined) k2 = k;
|
|
15
4
|
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
@@ -44,10 +33,10 @@ var __importStar = (this && this.__importStar) || (function () {
|
|
|
44
33
|
};
|
|
45
34
|
})();
|
|
46
35
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
exports.default = (
|
|
51
|
-
|
|
52
|
-
return (react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Do you want email notifications?", description: "Choose whether to receive email notifications for important updates", name: "email-notifications", onChange:
|
|
53
|
-
}
|
|
36
|
+
const react_1 = __importStar(require("react"));
|
|
37
|
+
const RadioButtonInputGroup_1 = require("../RadioButtonInputGroup");
|
|
38
|
+
const RadioSwitch_1 = require("../RadioSwitch");
|
|
39
|
+
exports.default = () => {
|
|
40
|
+
const [selected, setSelected] = (0, react_1.useState)('yes'); // Initialize with a default value
|
|
41
|
+
return (react_1.default.createElement(RadioButtonInputGroup_1.RadioButtonInputGroup, { label: "Do you want email notifications?", description: "Choose whether to receive email notifications for important updates", name: "email-notifications", onChange: e => setSelected(e.target.value), selectedValue: selected }, inputProps => (react_1.default.createElement(RadioSwitch_1.RadioSwitch, { leftLabel: "Yes", leftValue: "yes", rightLabel: "No", rightValue: "no", ...inputProps }))));
|
|
42
|
+
};
|
package/lib/i18n/i18n.js
CHANGED
|
@@ -3,9 +3,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
const en_1 = __importDefault(require("./en"));
|
|
7
|
+
const nn_1 = __importDefault(require("./nn"));
|
|
8
|
+
const nb_1 = __importDefault(require("./nb"));
|
|
9
9
|
exports.default = {
|
|
10
10
|
nb: nb_1.default,
|
|
11
11
|
nn: nn_1.default,
|
|
@@ -1,45 +1,23 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
4
|
};
|
|
27
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
6
|
exports.BaseFieldMessage = void 0;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const ffe_icons_react_1 = require("@sb1/ffe-icons-react");
|
|
9
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
32
10
|
/**
|
|
33
11
|
* Internal factory component
|
|
34
12
|
* @ignore
|
|
35
13
|
*/
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
return (react_1.default.createElement(Comp,
|
|
42
|
-
react_1.default.createElement("span", { className: (0, classnames_1.default)(
|
|
14
|
+
const BaseFieldMessage = props => {
|
|
15
|
+
const { children, className, as: Comp = 'div', type, role = 'status', ...rest } = props;
|
|
16
|
+
const priorityHighIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjAiPjxwYXRoIGQ9Ik00NzkuNzg4LTE4Ny4wOHEtMjEuNTM3IDAtMzYuNjYyLTE1LjMzN3QtMTUuMTI1LTM2Ljg3NHEwLTIxLjUzNyAxNS4zMzctMzYuNjYyIDE1LjMzNy0xNS4xMjQgMzYuODc0LTE1LjEyNCAyMS41MzcgMCAzNi42NjIgMTUuMzM3dDE1LjEyNSAzNi44NzRxMCAyMS41MzctMTUuMzM3IDM2LjY2MS0xNS4zMzcgMTUuMTI1LTM2Ljg3NCAxNS4xMjVabS0uMDYyLTE5Ni4xNTFxLTE5LjM0MSAwLTMyLjg0LTEzLjcwOS0xMy41LTEzLjcwOS0xMy41LTMyLjk2di0zMTYuNjg1cTAtMTkuMjUxIDEzLjc3NC0zMi43OTQgMTMuNzczLTEzLjU0MiAzMy4xMTQtMTMuNTQyIDE5LjM0MSAwIDMyLjg0IDEzLjcwOSAxMy41IDEzLjcwOSAxMy41IDMyLjk2djMxNi42ODVxMCAxOS4yNTEtMTMuNzc0IDMyLjc5NC0xMy43NzMgMTMuNTQyLTMzLjExNCAxMy41NDJaIi8+PC9zdmc+';
|
|
17
|
+
const checkIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjAiPjxwYXRoIGQ9Im0zOTUtMzcyLjM4NCAyNzAuNTM5LTI2OS41MzhxNy45MjMtNy45MjMgMTcuNjkyLTcuNjE2IDkuNzY5LjMwOCAxOC4wNzYgOC42MTYgOC4zMDggOC4zMDcgOC4zMDggMTcuODg0IDAgOS41NzYtOC4zMDggMTcuODg0bC0yODMgMjgyLjk5OXEtOS44NDYgOS44NDYtMjIuODA3IDkuODQ2LTEyLjk2MSAwLTIyLjgwNy05Ljg0NmwtMTE0LTExMy45OTlxLTcuOTIzLTcuOTIzLTguMzA4LTE3LjY5Mi0uMzg0LTkuNzY5IDcuOTIzLTE4LjA3NiA4LjMwOC04LjMwOCAxNy44ODQtOC4zMDggOS41NzcgMCAxNy44ODQgOC4zMDhMMzk1LTM3Mi4zODRaIi8+PC9zdmc+';
|
|
18
|
+
const infoIcon = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgLTk2MCA5NjAgOTYwIiB3aWR0aD0iMjAiPjxwYXRoIGQ9Ik00NzkuNzg4LTY3MnEtMjUuOTQyIDAtNDMuODY0LTE4LjEzNS0xNy45MjMtMTguMTM2LTE3LjkyMy00NC4wNzd0MTguMTM1LTQzLjg2NHExOC4xMzUtMTcuOTIzIDQ0LjA3Ni0xNy45MjMgMjUuOTQyIDAgNDMuODY0IDE4LjEzNiAxNy45MjMgMTguMTM1IDE3LjkyMyA0NC4wNzZ0LTE4LjEzNSA0My44NjRRNTA1LjcyOS02NzIgNDc5Ljc4OC02NzJabS4yNTcgNTA3Ljk5OXEtMjAuODE0IDAtMzUuNDI5LTE0LjU4NC0xNC42MTUtMTQuNTgzLTE0LjYxNS0zNS40MTZ2LTI5Ni42MTRxMC0yMC44MzMgMTQuNTctMzUuNDE2IDE0LjU3LTE0LjU4MyAzNS4zODQtMTQuNTgzdDM1LjQyOSAxNC41ODNxMTQuNjE1IDE0LjU4MyAxNC42MTUgMzUuNDE2djI5Ni42MTRxMCAyMC44MzMtMTQuNTcgMzUuNDE2LTE0LjU3IDE0LjU4NC0zNS4zODQgMTQuNTg0WiIvPjwvc3ZnPg==';
|
|
19
|
+
return (react_1.default.createElement(Comp, { className: (0, classnames_1.default)(`ffe-field-message`, `ffe-field-message--${type}`, className), role: role, ...rest },
|
|
20
|
+
react_1.default.createElement("span", { className: (0, classnames_1.default)(`ffe-field-message__icon`, `ffe-field-message__icon--${type}'`) }, (() => {
|
|
43
21
|
switch (type) {
|
|
44
22
|
case 'error':
|
|
45
23
|
return (react_1.default.createElement(ffe_icons_react_1.Icon, { fileUrl: priorityHighIcon, ariaLabel: "Utropstegn", size: "sm" }));
|
|
@@ -1,35 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
4
|
};
|
|
27
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
6
|
exports.ErrorFieldMessage = void 0;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, __assign({ role: role }, rest, { type: "error" }));
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const BaseFieldMessage_1 = require("./BaseFieldMessage");
|
|
9
|
+
const ErrorFieldMessage = ({ role = 'alert', ...rest }) => {
|
|
10
|
+
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, { role: role, ...rest, type: "error" });
|
|
34
11
|
};
|
|
35
12
|
exports.ErrorFieldMessage = ErrorFieldMessage;
|
|
@@ -1,35 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
4
|
};
|
|
27
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
6
|
exports.InfoFieldMessage = void 0;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, __assign({ role: "none" }, rest, { type: "info" }));
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const BaseFieldMessage_1 = require("./BaseFieldMessage");
|
|
9
|
+
const InfoFieldMessage = ({ ...rest }) => {
|
|
10
|
+
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, { role: "none", ...rest, type: "info" });
|
|
34
11
|
};
|
|
35
12
|
exports.InfoFieldMessage = InfoFieldMessage;
|
|
@@ -1,35 +1,12 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
var __assign = (this && this.__assign) || function () {
|
|
3
|
-
__assign = Object.assign || function(t) {
|
|
4
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
-
s = arguments[i];
|
|
6
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
-
t[p] = s[p];
|
|
8
|
-
}
|
|
9
|
-
return t;
|
|
10
|
-
};
|
|
11
|
-
return __assign.apply(this, arguments);
|
|
12
|
-
};
|
|
13
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
-
var t = {};
|
|
15
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
-
t[p] = s[p];
|
|
17
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
-
t[p[i]] = s[p[i]];
|
|
21
|
-
}
|
|
22
|
-
return t;
|
|
23
|
-
};
|
|
24
2
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
4
|
};
|
|
27
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
6
|
exports.SuccessFieldMessage = void 0;
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, __assign({ role: "none" }, rest, { type: "success" }));
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const BaseFieldMessage_1 = require("./BaseFieldMessage");
|
|
9
|
+
const SuccessFieldMessage = ({ ...rest }) => {
|
|
10
|
+
return react_1.default.createElement(BaseFieldMessage_1.BaseFieldMessage, { role: "none", ...rest, type: "success" });
|
|
34
11
|
};
|
|
35
12
|
exports.SuccessFieldMessage = SuccessFieldMessage;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sb1/ffe-form-react",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "101.0.0",
|
|
4
4
|
"description": "React component for form elements in ffe",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "SpareBank 1",
|
|
@@ -25,14 +25,14 @@
|
|
|
25
25
|
"test:watch": "ffe-buildtool jest --watch"
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@sb1/ffe-collapse-react": "^
|
|
29
|
-
"@sb1/ffe-form": "^
|
|
30
|
-
"@sb1/ffe-icons-react": "^
|
|
31
|
-
"classnames": "^2.
|
|
28
|
+
"@sb1/ffe-collapse-react": "^101.0.0",
|
|
29
|
+
"@sb1/ffe-form": "^101.0.0",
|
|
30
|
+
"@sb1/ffe-icons-react": "^101.0.0",
|
|
31
|
+
"classnames": "^2.5.1"
|
|
32
32
|
},
|
|
33
33
|
"devDependencies": {
|
|
34
|
-
"@sb1/ffe-buildtool": "^
|
|
35
|
-
"eslint": "^
|
|
34
|
+
"@sb1/ffe-buildtool": "^101.0.0",
|
|
35
|
+
"eslint": "^10.2.0",
|
|
36
36
|
"react": "^18.2.0",
|
|
37
37
|
"react-dom": "^18.2.0"
|
|
38
38
|
},
|
|
@@ -42,5 +42,5 @@
|
|
|
42
42
|
"publishConfig": {
|
|
43
43
|
"access": "public"
|
|
44
44
|
},
|
|
45
|
-
"gitHead": "
|
|
45
|
+
"gitHead": "7714019dbb9001551cb5d1c262c58afd609d4fb0"
|
|
46
46
|
}
|