@sb1/ffe-feedback-react 100.4.3 → 100.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/Feedback.js +19 -6
- package/lib/Feedback.js +19 -6
- package/package.json +8 -8
- package/types/Feedback.d.ts +2 -1
package/es/Feedback.js
CHANGED
|
@@ -8,7 +8,7 @@ import { HighFive } from './HighFive';
|
|
|
8
8
|
export var Feedback = function (_a) {
|
|
9
9
|
var _b;
|
|
10
10
|
var _c;
|
|
11
|
-
var _d = _a.headingLevel, headingLevel = _d === void 0 ? 4 : _d, _e = _a.locale, locale = _e === void 0 ? 'nb' : _e, onThumbClick = _a.onThumbClick, onFeedbackSend = _a.onFeedbackSend, onFinish = _a.onFinish, bgColor = _a.bgColor, contactLink = _a.contactLink, texts = _a.texts, className = _a.className, _f = _a.includeConsent, includeConsent = _f === void 0 ? false : _f;
|
|
11
|
+
var _d = _a.headingLevel, headingLevel = _d === void 0 ? 4 : _d, headingLookLike = _a.headingLookLike, _e = _a.locale, locale = _e === void 0 ? 'nb' : _e, onThumbClick = _a.onThumbClick, onFeedbackSend = _a.onFeedbackSend, onFinish = _a.onFinish, bgColor = _a.bgColor, contactLink = _a.contactLink, texts = _a.texts, className = _a.className, _f = _a.includeConsent, includeConsent = _f === void 0 ? false : _f;
|
|
12
12
|
var feedbackSentRef = useRef(null);
|
|
13
13
|
var expandedRef = useRef(null);
|
|
14
14
|
var _g = useState(false), expanded = _g[0], setExpanded = _g[1];
|
|
@@ -40,8 +40,9 @@ export var Feedback = function (_a) {
|
|
|
40
40
|
};
|
|
41
41
|
var renderHeading = function (level, text, options) {
|
|
42
42
|
var _a;
|
|
43
|
-
var _b
|
|
44
|
-
var
|
|
43
|
+
var _b, _c;
|
|
44
|
+
var _d = options || {}, ref = _d.ref, tabIndex = _d.tabIndex, id = _d.id, textCenter = _d.textCenter;
|
|
45
|
+
var headingClassName = classNames("ffe-h".concat((_b = options === null || options === void 0 ? void 0 : options.lookLike) !== null && _b !== void 0 ? _b : level), (_a = {}, _a["ffe-h".concat((_c = options === null || options === void 0 ? void 0 : options.lookLike) !== null && _c !== void 0 ? _c : level, "--text-center")] = textCenter, _a), 'ffe-feedback__heading');
|
|
45
46
|
return React.createElement("h".concat(level), {
|
|
46
47
|
ref: ref,
|
|
47
48
|
id: id,
|
|
@@ -52,17 +53,29 @@ export var Feedback = function (_a) {
|
|
|
52
53
|
if (feedbackSent) {
|
|
53
54
|
return (React.createElement("div", { className: feedbackClassnames },
|
|
54
55
|
React.createElement("div", { className: "ffe-feedback__content" },
|
|
55
|
-
renderHeading(headingLevel, txt[locale].FEEDBACK_SENT_HEADING, {
|
|
56
|
+
renderHeading(headingLevel, txt[locale].FEEDBACK_SENT_HEADING, {
|
|
57
|
+
ref: feedbackSentRef,
|
|
58
|
+
tabIndex: -1,
|
|
59
|
+
lookLike: headingLookLike,
|
|
60
|
+
}),
|
|
56
61
|
React.createElement(HighFive, null))));
|
|
57
62
|
}
|
|
58
63
|
if (expanded) {
|
|
59
64
|
return (React.createElement("div", { className: feedbackClassnames },
|
|
60
65
|
React.createElement("div", { className: "ffe-feedback__expanded" },
|
|
61
|
-
renderHeading(headingLevel, txt[locale].FEEDBACK_SENT_HEADING, {
|
|
66
|
+
renderHeading(headingLevel, txt[locale].FEEDBACK_SENT_HEADING, {
|
|
67
|
+
ref: expandedRef,
|
|
68
|
+
tabIndex: -1,
|
|
69
|
+
lookLike: headingLookLike,
|
|
70
|
+
}),
|
|
62
71
|
React.createElement(FeedbackExpanded, { locale: locale, handleFeedback: handleFeedbackSent, contactLink: contactLink, includeConsent: includeConsent }))));
|
|
63
72
|
}
|
|
64
73
|
return (React.createElement("div", { className: feedbackClassnames },
|
|
65
74
|
React.createElement("div", { className: "ffe-feedback__content" },
|
|
66
|
-
renderHeading(headingLevel, (_c = texts === null || texts === void 0 ? void 0 : texts.feedbackNotSentHeading) !== null && _c !== void 0 ? _c : txt[locale].FEEDBACK_NOT_SENT_HEADING, {
|
|
75
|
+
renderHeading(headingLevel, (_c = texts === null || texts === void 0 ? void 0 : texts.feedbackNotSentHeading) !== null && _c !== void 0 ? _c : txt[locale].FEEDBACK_NOT_SENT_HEADING, {
|
|
76
|
+
id: headingId,
|
|
77
|
+
textCenter: true,
|
|
78
|
+
lookLike: headingLookLike,
|
|
79
|
+
}),
|
|
67
80
|
React.createElement(FeedbackThumbs, { onClick: handleThumbClicked, locale: locale, headingId: headingId }))));
|
|
68
81
|
};
|
package/lib/Feedback.js
CHANGED
|
@@ -47,7 +47,7 @@ var HighFive_1 = require("./HighFive");
|
|
|
47
47
|
var Feedback = function (_a) {
|
|
48
48
|
var _b;
|
|
49
49
|
var _c;
|
|
50
|
-
var _d = _a.headingLevel, headingLevel = _d === void 0 ? 4 : _d, _e = _a.locale, locale = _e === void 0 ? 'nb' : _e, onThumbClick = _a.onThumbClick, onFeedbackSend = _a.onFeedbackSend, onFinish = _a.onFinish, bgColor = _a.bgColor, contactLink = _a.contactLink, texts = _a.texts, className = _a.className, _f = _a.includeConsent, includeConsent = _f === void 0 ? false : _f;
|
|
50
|
+
var _d = _a.headingLevel, headingLevel = _d === void 0 ? 4 : _d, headingLookLike = _a.headingLookLike, _e = _a.locale, locale = _e === void 0 ? 'nb' : _e, onThumbClick = _a.onThumbClick, onFeedbackSend = _a.onFeedbackSend, onFinish = _a.onFinish, bgColor = _a.bgColor, contactLink = _a.contactLink, texts = _a.texts, className = _a.className, _f = _a.includeConsent, includeConsent = _f === void 0 ? false : _f;
|
|
51
51
|
var feedbackSentRef = (0, react_1.useRef)(null);
|
|
52
52
|
var expandedRef = (0, react_1.useRef)(null);
|
|
53
53
|
var _g = (0, react_1.useState)(false), expanded = _g[0], setExpanded = _g[1];
|
|
@@ -79,8 +79,9 @@ var Feedback = function (_a) {
|
|
|
79
79
|
};
|
|
80
80
|
var renderHeading = function (level, text, options) {
|
|
81
81
|
var _a;
|
|
82
|
-
var _b
|
|
83
|
-
var
|
|
82
|
+
var _b, _c;
|
|
83
|
+
var _d = options || {}, ref = _d.ref, tabIndex = _d.tabIndex, id = _d.id, textCenter = _d.textCenter;
|
|
84
|
+
var headingClassName = (0, classnames_1.default)("ffe-h".concat((_b = options === null || options === void 0 ? void 0 : options.lookLike) !== null && _b !== void 0 ? _b : level), (_a = {}, _a["ffe-h".concat((_c = options === null || options === void 0 ? void 0 : options.lookLike) !== null && _c !== void 0 ? _c : level, "--text-center")] = textCenter, _a), 'ffe-feedback__heading');
|
|
84
85
|
return react_1.default.createElement("h".concat(level), {
|
|
85
86
|
ref: ref,
|
|
86
87
|
id: id,
|
|
@@ -91,18 +92,30 @@ var Feedback = function (_a) {
|
|
|
91
92
|
if (feedbackSent) {
|
|
92
93
|
return (react_1.default.createElement("div", { className: feedbackClassnames },
|
|
93
94
|
react_1.default.createElement("div", { className: "ffe-feedback__content" },
|
|
94
|
-
renderHeading(headingLevel, texts_1.txt[locale].FEEDBACK_SENT_HEADING, {
|
|
95
|
+
renderHeading(headingLevel, texts_1.txt[locale].FEEDBACK_SENT_HEADING, {
|
|
96
|
+
ref: feedbackSentRef,
|
|
97
|
+
tabIndex: -1,
|
|
98
|
+
lookLike: headingLookLike,
|
|
99
|
+
}),
|
|
95
100
|
react_1.default.createElement(HighFive_1.HighFive, null))));
|
|
96
101
|
}
|
|
97
102
|
if (expanded) {
|
|
98
103
|
return (react_1.default.createElement("div", { className: feedbackClassnames },
|
|
99
104
|
react_1.default.createElement("div", { className: "ffe-feedback__expanded" },
|
|
100
|
-
renderHeading(headingLevel, texts_1.txt[locale].FEEDBACK_SENT_HEADING, {
|
|
105
|
+
renderHeading(headingLevel, texts_1.txt[locale].FEEDBACK_SENT_HEADING, {
|
|
106
|
+
ref: expandedRef,
|
|
107
|
+
tabIndex: -1,
|
|
108
|
+
lookLike: headingLookLike,
|
|
109
|
+
}),
|
|
101
110
|
react_1.default.createElement(FeedbackExpanded_1.FeedbackExpanded, { locale: locale, handleFeedback: handleFeedbackSent, contactLink: contactLink, includeConsent: includeConsent }))));
|
|
102
111
|
}
|
|
103
112
|
return (react_1.default.createElement("div", { className: feedbackClassnames },
|
|
104
113
|
react_1.default.createElement("div", { className: "ffe-feedback__content" },
|
|
105
|
-
renderHeading(headingLevel, (_c = texts === null || texts === void 0 ? void 0 : texts.feedbackNotSentHeading) !== null && _c !== void 0 ? _c : texts_1.txt[locale].FEEDBACK_NOT_SENT_HEADING, {
|
|
114
|
+
renderHeading(headingLevel, (_c = texts === null || texts === void 0 ? void 0 : texts.feedbackNotSentHeading) !== null && _c !== void 0 ? _c : texts_1.txt[locale].FEEDBACK_NOT_SENT_HEADING, {
|
|
115
|
+
id: headingId,
|
|
116
|
+
textCenter: true,
|
|
117
|
+
lookLike: headingLookLike,
|
|
118
|
+
}),
|
|
106
119
|
react_1.default.createElement(FeedbackThumbs_1.FeedbackThumbs, { onClick: handleThumbClicked, locale: locale, headingId: headingId }))));
|
|
107
120
|
};
|
|
108
121
|
exports.Feedback = Feedback;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sb1/ffe-feedback-react",
|
|
3
|
-
"version": "100.
|
|
3
|
+
"version": "100.5.0",
|
|
4
4
|
"description": "React component for ffe-feedback",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "SpareBank 1",
|
|
@@ -25,15 +25,15 @@
|
|
|
25
25
|
"test:watch": "ffe-buildtool jest --watch"
|
|
26
26
|
},
|
|
27
27
|
"dependencies": {
|
|
28
|
-
"@sb1/ffe-buttons-react": "^100.
|
|
29
|
-
"@sb1/ffe-core-react": "^100.
|
|
30
|
-
"@sb1/ffe-feedback": "^100.
|
|
31
|
-
"@sb1/ffe-form-react": "^100.
|
|
32
|
-
"@sb1/ffe-icons-react": "^100.
|
|
28
|
+
"@sb1/ffe-buttons-react": "^100.5.0",
|
|
29
|
+
"@sb1/ffe-core-react": "^100.5.0",
|
|
30
|
+
"@sb1/ffe-feedback": "^100.5.0",
|
|
31
|
+
"@sb1/ffe-form-react": "^100.5.0",
|
|
32
|
+
"@sb1/ffe-icons-react": "^100.5.0",
|
|
33
33
|
"classnames": "^2.3.1"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
|
-
"@sb1/ffe-buildtool": "^100.
|
|
36
|
+
"@sb1/ffe-buildtool": "^100.5.0",
|
|
37
37
|
"eslint": "^9.22.0",
|
|
38
38
|
"react": "^18.2.0",
|
|
39
39
|
"react-dom": "^18.2.0"
|
|
@@ -44,5 +44,5 @@
|
|
|
44
44
|
"publishConfig": {
|
|
45
45
|
"access": "public"
|
|
46
46
|
},
|
|
47
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "84d495f2e596a3a185dcc99564ec8960014e1038"
|
|
48
48
|
}
|
package/types/Feedback.d.ts
CHANGED
|
@@ -6,6 +6,7 @@ type Locale = 'nb' | 'nn' | 'en';
|
|
|
6
6
|
type BgColor = 'primary' | 'secondary' | 'tertiary';
|
|
7
7
|
export interface FeedbackProps {
|
|
8
8
|
headingLevel?: HeadingLevel;
|
|
9
|
+
headingLookLike?: HeadingLevel;
|
|
9
10
|
locale?: Locale;
|
|
10
11
|
onThumbClick: (thumb: Thumb) => void;
|
|
11
12
|
onFeedbackSend: (feedbackText: string, consent?: boolean) => void;
|
|
@@ -19,5 +20,5 @@ export interface FeedbackProps {
|
|
|
19
20
|
className?: string;
|
|
20
21
|
includeConsent?: boolean;
|
|
21
22
|
}
|
|
22
|
-
export declare const Feedback: ({ headingLevel, locale, onThumbClick, onFeedbackSend, onFinish, bgColor, contactLink, texts, className, includeConsent, }: FeedbackProps) => React.JSX.Element;
|
|
23
|
+
export declare const Feedback: ({ headingLevel, headingLookLike, locale, onThumbClick, onFeedbackSend, onFinish, bgColor, contactLink, texts, className, includeConsent, }: FeedbackProps) => React.JSX.Element;
|
|
23
24
|
export {};
|