@ndla/ui 3.1.1-alpha.10 → 3.2.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/CopyParagraphButton/CopyParagraphButton.js +8 -5
- package/es/CopyParagraphButton/initCopyParagraphButtons.js +4 -3
- package/lib/CopyParagraphButton/CopyParagraphButton.d.ts +2 -3
- package/lib/CopyParagraphButton/CopyParagraphButton.js +8 -5
- package/lib/CopyParagraphButton/initCopyParagraphButtons.js +4 -3
- package/package.json +2 -2
- package/src/CopyParagraphButton/CopyParagraphButton.tsx +4 -6
- package/src/CopyParagraphButton/initCopyParagraphButtons.tsx +2 -2
|
@@ -38,7 +38,7 @@ var IconButton = _styled("button", {
|
|
|
38
38
|
} : {
|
|
39
39
|
name: "1eoah0f",
|
|
40
40
|
styles: "float:left;position:relative;left:-3em;top:0.1em;background:none;border:0;z-index:1;transition:0.2s;opacity:0;& svg{width:30px;height:30px;}",
|
|
41
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
41
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvcHlQYXJhZ3JhcGhCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCZ0MiLCJmaWxlIjoiQ29weVBhcmFncmFwaEJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBMaW5rIH0gZnJvbSAnQG5kbGEvaWNvbnMvY29tbW9uJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG4vLyBAdHMtaWdub3JlXG5pbXBvcnQgVG9vbHRpcCBmcm9tICdAbmRsYS90b29sdGlwJztcbmltcG9ydCB7IGNvcHlUZXh0VG9DbGlwYm9hcmQgfSBmcm9tICdAbmRsYS91dGlsJztcblxuY29uc3QgSWNvbkJ1dHRvbiA9IHN0eWxlZC5idXR0b25gXG4gIGZsb2F0OiBsZWZ0O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGxlZnQ6IC0zZW07XG4gIHRvcDogMC4xZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogMDtcbiAgei1pbmRleDogMTtcbiAgdHJhbnNpdGlvbjogMC4ycztcbiAgb3BhY2l0eTogMDtcblxuICAmIHN2ZyB7XG4gICAgd2lkdGg6IDMwcHg7XG4gICAgaGVpZ2h0OiAzMHB4O1xuICB9XG5gO1xuXG5jb25zdCBDb250YWluZXJEaXYgPSBzdHlsZWQuZGl2YFxuICAmOmhvdmVyIGJ1dHRvbiB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIG9wYWNpdHk6IDAuNTtcbiAgfVxuXG4gICYgaDIge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBsZWZ0OiAtMmVtO1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZT86IHN0cmluZyB8IG51bGw7XG4gIGNvbnRlbnQ/OiBzdHJpbmcgfCBudWxsO1xufVxuXG5jb25zdCBDb3B5UGFyYWdyYXBoQnV0dG9uID0gKHsgdGl0bGUsIGNvbnRlbnQgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGFzQ29waWVkLCBzZXRIYXNDb3BpZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChoYXNDb3BpZWQpIHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4gc2V0SGFzQ29waWVkKGZhbHNlKSwgMzAwMCk7XG4gICAgfVxuICB9LCBbaGFzQ29waWVkXSk7XG5cbiAgaWYgKCF0aXRsZSkgcmV0dXJuIG51bGw7XG5cbiAgY29uc3Qgb25Db3B5Q2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQsIE1vdXNlRXZlbnQ+KTogdm9pZCA9PiB7XG4gICAgc2V0SGFzQ29waWVkKHRydWUpO1xuICAgIGNvbnN0IGNvcHlJZCA9IGV2ZW50LmN1cnJlbnRUYXJnZXQuZ2V0QXR0cmlidXRlKCdkYXRhLXRpdGxlJyk7XG4gICAgY29uc3QgeyBsb2NhdGlvbiB9ID0gd2luZG93O1xuICAgIGNvbnN0IG5ld0hhc2ggPSBgIyR7Y29weUlkfWA7XG4gICAgY29uc3QgcG9ydCA9IGxvY2F0aW9uLnBvcnQgPyBgOiR7bG9jYXRpb24ucG9ydH1gIDogJyc7XG4gICAgY29uc3QgdXJsVG9Db3B5ID0gYCR7bG9jYXRpb24ucHJvdG9jb2x9Ly8ke2xvY2F0aW9uLmhvc3RuYW1lfSR7cG9ydH0ke2xvY2F0aW9uLnBhdGhuYW1lfSR7bG9jYXRpb24uc2VhcmNofSR7bmV3SGFzaH1gO1xuXG4gICAgY29weVRleHRUb0NsaXBib2FyZCh1cmxUb0NvcHkpO1xuICB9O1xuXG4gIGNvbnN0IHNhbml0aXplZFRpdGxlID0gZW5jb2RlVVJJQ29tcG9uZW50KHRpdGxlLnJlcGxhY2UoLyAvZywgJy0nKSk7XG4gIGNvbnN0IHRvb2x0aXAgPSBoYXNDb3BpZWQgPyB0KCdhcnRpY2xlLmNvcHlQYWdlTGlua0NvcGllZCcpIDogdCgnYXJ0aWNsZS5jb3B5SGVhZGVyTGluaycpO1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXJEaXYgZGF0YS1oZWFkZXItY29weS1jb250YWluZXIgZGF0YS10aXRsZT17dGl0bGV9PlxuICAgICAgPEljb25CdXR0b24gb25DbGljaz17b25Db3B5Q2xpY2t9IGRhdGEtdGl0bGU9e3Nhbml0aXplZFRpdGxlfT5cbiAgICAgICAgPFRvb2x0aXAgdG9vbHRpcD17dG9vbHRpcH0+XG4gICAgICAgICAgPExpbmsgdGl0bGU9eycnfSAvPlxuICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICA8L0ljb25CdXR0b24+XG4gICAgICA8aDIgaWQ9e3Nhbml0aXplZFRpdGxlfSB0YWJJbmRleD17MH0gZGFuZ2Vyb3VzbHlTZXRJbm5lckhUTUw9e3sgX19odG1sOiBjb250ZW50IHx8ICcnIH19PjwvaDI+XG4gICAgPC9Db250YWluZXJEaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBDb3B5UGFyYWdyYXBoQnV0dG9uO1xuIl19 */",
|
|
42
42
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
43
43
|
});
|
|
44
44
|
|
|
@@ -51,13 +51,13 @@ var ContainerDiv = _styled("div", {
|
|
|
51
51
|
} : {
|
|
52
52
|
name: "25spe5",
|
|
53
53
|
styles: "&:hover button{cursor:pointer;opacity:0.5;}& h2{position:relative;left:-2em;}",
|
|
54
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
54
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvcHlQYXJhZ3JhcGhCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtDK0IiLCJmaWxlIjoiQ29weVBhcmFncmFwaEJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBMaW5rIH0gZnJvbSAnQG5kbGEvaWNvbnMvY29tbW9uJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG4vLyBAdHMtaWdub3JlXG5pbXBvcnQgVG9vbHRpcCBmcm9tICdAbmRsYS90b29sdGlwJztcbmltcG9ydCB7IGNvcHlUZXh0VG9DbGlwYm9hcmQgfSBmcm9tICdAbmRsYS91dGlsJztcblxuY29uc3QgSWNvbkJ1dHRvbiA9IHN0eWxlZC5idXR0b25gXG4gIGZsb2F0OiBsZWZ0O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGxlZnQ6IC0zZW07XG4gIHRvcDogMC4xZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogMDtcbiAgei1pbmRleDogMTtcbiAgdHJhbnNpdGlvbjogMC4ycztcbiAgb3BhY2l0eTogMDtcblxuICAmIHN2ZyB7XG4gICAgd2lkdGg6IDMwcHg7XG4gICAgaGVpZ2h0OiAzMHB4O1xuICB9XG5gO1xuXG5jb25zdCBDb250YWluZXJEaXYgPSBzdHlsZWQuZGl2YFxuICAmOmhvdmVyIGJ1dHRvbiB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIG9wYWNpdHk6IDAuNTtcbiAgfVxuXG4gICYgaDIge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBsZWZ0OiAtMmVtO1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZT86IHN0cmluZyB8IG51bGw7XG4gIGNvbnRlbnQ/OiBzdHJpbmcgfCBudWxsO1xufVxuXG5jb25zdCBDb3B5UGFyYWdyYXBoQnV0dG9uID0gKHsgdGl0bGUsIGNvbnRlbnQgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGFzQ29waWVkLCBzZXRIYXNDb3BpZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChoYXNDb3BpZWQpIHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4gc2V0SGFzQ29waWVkKGZhbHNlKSwgMzAwMCk7XG4gICAgfVxuICB9LCBbaGFzQ29waWVkXSk7XG5cbiAgaWYgKCF0aXRsZSkgcmV0dXJuIG51bGw7XG5cbiAgY29uc3Qgb25Db3B5Q2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQsIE1vdXNlRXZlbnQ+KTogdm9pZCA9PiB7XG4gICAgc2V0SGFzQ29waWVkKHRydWUpO1xuICAgIGNvbnN0IGNvcHlJZCA9IGV2ZW50LmN1cnJlbnRUYXJnZXQuZ2V0QXR0cmlidXRlKCdkYXRhLXRpdGxlJyk7XG4gICAgY29uc3QgeyBsb2NhdGlvbiB9ID0gd2luZG93O1xuICAgIGNvbnN0IG5ld0hhc2ggPSBgIyR7Y29weUlkfWA7XG4gICAgY29uc3QgcG9ydCA9IGxvY2F0aW9uLnBvcnQgPyBgOiR7bG9jYXRpb24ucG9ydH1gIDogJyc7XG4gICAgY29uc3QgdXJsVG9Db3B5ID0gYCR7bG9jYXRpb24ucHJvdG9jb2x9Ly8ke2xvY2F0aW9uLmhvc3RuYW1lfSR7cG9ydH0ke2xvY2F0aW9uLnBhdGhuYW1lfSR7bG9jYXRpb24uc2VhcmNofSR7bmV3SGFzaH1gO1xuXG4gICAgY29weVRleHRUb0NsaXBib2FyZCh1cmxUb0NvcHkpO1xuICB9O1xuXG4gIGNvbnN0IHNhbml0aXplZFRpdGxlID0gZW5jb2RlVVJJQ29tcG9uZW50KHRpdGxlLnJlcGxhY2UoLyAvZywgJy0nKSk7XG4gIGNvbnN0IHRvb2x0aXAgPSBoYXNDb3BpZWQgPyB0KCdhcnRpY2xlLmNvcHlQYWdlTGlua0NvcGllZCcpIDogdCgnYXJ0aWNsZS5jb3B5SGVhZGVyTGluaycpO1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXJEaXYgZGF0YS1oZWFkZXItY29weS1jb250YWluZXIgZGF0YS10aXRsZT17dGl0bGV9PlxuICAgICAgPEljb25CdXR0b24gb25DbGljaz17b25Db3B5Q2xpY2t9IGRhdGEtdGl0bGU9e3Nhbml0aXplZFRpdGxlfT5cbiAgICAgICAgPFRvb2x0aXAgdG9vbHRpcD17dG9vbHRpcH0+XG4gICAgICAgICAgPExpbmsgdGl0bGU9eycnfSAvPlxuICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICA8L0ljb25CdXR0b24+XG4gICAgICA8aDIgaWQ9e3Nhbml0aXplZFRpdGxlfSB0YWJJbmRleD17MH0gZGFuZ2Vyb3VzbHlTZXRJbm5lckhUTUw9e3sgX19odG1sOiBjb250ZW50IHx8ICcnIH19PjwvaDI+XG4gICAgPC9Db250YWluZXJEaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBDb3B5UGFyYWdyYXBoQnV0dG9uO1xuIl19 */",
|
|
55
55
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
56
56
|
});
|
|
57
57
|
|
|
58
58
|
var CopyParagraphButton = function CopyParagraphButton(_ref) {
|
|
59
59
|
var title = _ref.title,
|
|
60
|
-
|
|
60
|
+
content = _ref.content;
|
|
61
61
|
|
|
62
62
|
var _useTranslation = useTranslation(),
|
|
63
63
|
t = _useTranslation.t;
|
|
@@ -101,8 +101,11 @@ var CopyParagraphButton = function CopyParagraphButton(_ref) {
|
|
|
101
101
|
title: ''
|
|
102
102
|
}))), ___EmotionJSX("h2", {
|
|
103
103
|
id: sanitizedTitle,
|
|
104
|
-
tabIndex: 0
|
|
105
|
-
|
|
104
|
+
tabIndex: 0,
|
|
105
|
+
dangerouslySetInnerHTML: {
|
|
106
|
+
__html: content || ''
|
|
107
|
+
}
|
|
108
|
+
}));
|
|
106
109
|
};
|
|
107
110
|
|
|
108
111
|
export default CopyParagraphButton;
|
|
@@ -21,10 +21,11 @@ var forEachElement = function forEachElement(selector, callback) {
|
|
|
21
21
|
var initCopyParagraphButtons = function initCopyParagraphButtons() {
|
|
22
22
|
forEachElement('[data-header-copy-container]', function (el) {
|
|
23
23
|
var title = el.getAttribute('data-title');
|
|
24
|
-
var
|
|
24
|
+
var content = el.innerHTML;
|
|
25
25
|
ReactDOM.hydrate(___EmotionJSX(CopyParagraphButton, {
|
|
26
|
-
title: title
|
|
27
|
-
|
|
26
|
+
title: title,
|
|
27
|
+
content: content
|
|
28
|
+
}), el);
|
|
28
29
|
});
|
|
29
30
|
};
|
|
30
31
|
|
|
@@ -5,10 +5,9 @@
|
|
|
5
5
|
* LICENSE file in the root directory of this source tree.
|
|
6
6
|
*
|
|
7
7
|
*/
|
|
8
|
-
import { ReactNode } from 'react';
|
|
9
8
|
interface Props {
|
|
10
9
|
title?: string | null;
|
|
11
|
-
|
|
10
|
+
content?: string | null;
|
|
12
11
|
}
|
|
13
|
-
declare const CopyParagraphButton: ({ title,
|
|
12
|
+
declare const CopyParagraphButton: ({ title, content }: Props) => JSX.Element | null;
|
|
14
13
|
export default CopyParagraphButton;
|
|
@@ -50,7 +50,7 @@ var IconButton = (0, _styledBase["default"])("button", {
|
|
|
50
50
|
} : {
|
|
51
51
|
name: "1eoah0f",
|
|
52
52
|
styles: "float:left;position:relative;left:-3em;top:0.1em;background:none;border:0;z-index:1;transition:0.2s;opacity:0;& svg{width:30px;height:30px;}",
|
|
53
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
53
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvcHlQYXJhZ3JhcGhCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWlCZ0MiLCJmaWxlIjoiQ29weVBhcmFncmFwaEJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBMaW5rIH0gZnJvbSAnQG5kbGEvaWNvbnMvY29tbW9uJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG4vLyBAdHMtaWdub3JlXG5pbXBvcnQgVG9vbHRpcCBmcm9tICdAbmRsYS90b29sdGlwJztcbmltcG9ydCB7IGNvcHlUZXh0VG9DbGlwYm9hcmQgfSBmcm9tICdAbmRsYS91dGlsJztcblxuY29uc3QgSWNvbkJ1dHRvbiA9IHN0eWxlZC5idXR0b25gXG4gIGZsb2F0OiBsZWZ0O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGxlZnQ6IC0zZW07XG4gIHRvcDogMC4xZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogMDtcbiAgei1pbmRleDogMTtcbiAgdHJhbnNpdGlvbjogMC4ycztcbiAgb3BhY2l0eTogMDtcblxuICAmIHN2ZyB7XG4gICAgd2lkdGg6IDMwcHg7XG4gICAgaGVpZ2h0OiAzMHB4O1xuICB9XG5gO1xuXG5jb25zdCBDb250YWluZXJEaXYgPSBzdHlsZWQuZGl2YFxuICAmOmhvdmVyIGJ1dHRvbiB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIG9wYWNpdHk6IDAuNTtcbiAgfVxuXG4gICYgaDIge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBsZWZ0OiAtMmVtO1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZT86IHN0cmluZyB8IG51bGw7XG4gIGNvbnRlbnQ/OiBzdHJpbmcgfCBudWxsO1xufVxuXG5jb25zdCBDb3B5UGFyYWdyYXBoQnV0dG9uID0gKHsgdGl0bGUsIGNvbnRlbnQgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGFzQ29waWVkLCBzZXRIYXNDb3BpZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChoYXNDb3BpZWQpIHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4gc2V0SGFzQ29waWVkKGZhbHNlKSwgMzAwMCk7XG4gICAgfVxuICB9LCBbaGFzQ29waWVkXSk7XG5cbiAgaWYgKCF0aXRsZSkgcmV0dXJuIG51bGw7XG5cbiAgY29uc3Qgb25Db3B5Q2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQsIE1vdXNlRXZlbnQ+KTogdm9pZCA9PiB7XG4gICAgc2V0SGFzQ29waWVkKHRydWUpO1xuICAgIGNvbnN0IGNvcHlJZCA9IGV2ZW50LmN1cnJlbnRUYXJnZXQuZ2V0QXR0cmlidXRlKCdkYXRhLXRpdGxlJyk7XG4gICAgY29uc3QgeyBsb2NhdGlvbiB9ID0gd2luZG93O1xuICAgIGNvbnN0IG5ld0hhc2ggPSBgIyR7Y29weUlkfWA7XG4gICAgY29uc3QgcG9ydCA9IGxvY2F0aW9uLnBvcnQgPyBgOiR7bG9jYXRpb24ucG9ydH1gIDogJyc7XG4gICAgY29uc3QgdXJsVG9Db3B5ID0gYCR7bG9jYXRpb24ucHJvdG9jb2x9Ly8ke2xvY2F0aW9uLmhvc3RuYW1lfSR7cG9ydH0ke2xvY2F0aW9uLnBhdGhuYW1lfSR7bG9jYXRpb24uc2VhcmNofSR7bmV3SGFzaH1gO1xuXG4gICAgY29weVRleHRUb0NsaXBib2FyZCh1cmxUb0NvcHkpO1xuICB9O1xuXG4gIGNvbnN0IHNhbml0aXplZFRpdGxlID0gZW5jb2RlVVJJQ29tcG9uZW50KHRpdGxlLnJlcGxhY2UoLyAvZywgJy0nKSk7XG4gIGNvbnN0IHRvb2x0aXAgPSBoYXNDb3BpZWQgPyB0KCdhcnRpY2xlLmNvcHlQYWdlTGlua0NvcGllZCcpIDogdCgnYXJ0aWNsZS5jb3B5SGVhZGVyTGluaycpO1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXJEaXYgZGF0YS1oZWFkZXItY29weS1jb250YWluZXIgZGF0YS10aXRsZT17dGl0bGV9PlxuICAgICAgPEljb25CdXR0b24gb25DbGljaz17b25Db3B5Q2xpY2t9IGRhdGEtdGl0bGU9e3Nhbml0aXplZFRpdGxlfT5cbiAgICAgICAgPFRvb2x0aXAgdG9vbHRpcD17dG9vbHRpcH0+XG4gICAgICAgICAgPExpbmsgdGl0bGU9eycnfSAvPlxuICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICA8L0ljb25CdXR0b24+XG4gICAgICA8aDIgaWQ9e3Nhbml0aXplZFRpdGxlfSB0YWJJbmRleD17MH0gZGFuZ2Vyb3VzbHlTZXRJbm5lckhUTUw9e3sgX19odG1sOiBjb250ZW50IHx8ICcnIH19PjwvaDI+XG4gICAgPC9Db250YWluZXJEaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBDb3B5UGFyYWdyYXBoQnV0dG9uO1xuIl19 */",
|
|
54
54
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
55
55
|
});
|
|
56
56
|
var ContainerDiv = (0, _styledBase["default"])("div", {
|
|
@@ -62,13 +62,13 @@ var ContainerDiv = (0, _styledBase["default"])("div", {
|
|
|
62
62
|
} : {
|
|
63
63
|
name: "25spe5",
|
|
64
64
|
styles: "&:hover button{cursor:pointer;opacity:0.5;}& h2{position:relative;left:-2em;}",
|
|
65
|
-
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,
|
|
65
|
+
map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkNvcHlQYXJhZ3JhcGhCdXR0b24udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQWtDK0IiLCJmaWxlIjoiQ29weVBhcmFncmFwaEJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMS1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZVN0YXRlIH0gZnJvbSAncmVhY3QnO1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBMaW5rIH0gZnJvbSAnQG5kbGEvaWNvbnMvY29tbW9uJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG4vLyBAdHMtaWdub3JlXG5pbXBvcnQgVG9vbHRpcCBmcm9tICdAbmRsYS90b29sdGlwJztcbmltcG9ydCB7IGNvcHlUZXh0VG9DbGlwYm9hcmQgfSBmcm9tICdAbmRsYS91dGlsJztcblxuY29uc3QgSWNvbkJ1dHRvbiA9IHN0eWxlZC5idXR0b25gXG4gIGZsb2F0OiBsZWZ0O1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGxlZnQ6IC0zZW07XG4gIHRvcDogMC4xZW07XG4gIGJhY2tncm91bmQ6IG5vbmU7XG4gIGJvcmRlcjogMDtcbiAgei1pbmRleDogMTtcbiAgdHJhbnNpdGlvbjogMC4ycztcbiAgb3BhY2l0eTogMDtcblxuICAmIHN2ZyB7XG4gICAgd2lkdGg6IDMwcHg7XG4gICAgaGVpZ2h0OiAzMHB4O1xuICB9XG5gO1xuXG5jb25zdCBDb250YWluZXJEaXYgPSBzdHlsZWQuZGl2YFxuICAmOmhvdmVyIGJ1dHRvbiB7XG4gICAgY3Vyc29yOiBwb2ludGVyO1xuICAgIG9wYWNpdHk6IDAuNTtcbiAgfVxuXG4gICYgaDIge1xuICAgIHBvc2l0aW9uOiByZWxhdGl2ZTtcbiAgICBsZWZ0OiAtMmVtO1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB0aXRsZT86IHN0cmluZyB8IG51bGw7XG4gIGNvbnRlbnQ/OiBzdHJpbmcgfCBudWxsO1xufVxuXG5jb25zdCBDb3B5UGFyYWdyYXBoQnV0dG9uID0gKHsgdGl0bGUsIGNvbnRlbnQgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCBbaGFzQ29waWVkLCBzZXRIYXNDb3BpZWRdID0gdXNlU3RhdGUoZmFsc2UpO1xuICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgIGlmIChoYXNDb3BpZWQpIHtcbiAgICAgIHNldFRpbWVvdXQoKCkgPT4gc2V0SGFzQ29waWVkKGZhbHNlKSwgMzAwMCk7XG4gICAgfVxuICB9LCBbaGFzQ29waWVkXSk7XG5cbiAgaWYgKCF0aXRsZSkgcmV0dXJuIG51bGw7XG5cbiAgY29uc3Qgb25Db3B5Q2xpY2sgPSAoZXZlbnQ6IFJlYWN0Lk1vdXNlRXZlbnQ8SFRNTEJ1dHRvbkVsZW1lbnQsIE1vdXNlRXZlbnQ+KTogdm9pZCA9PiB7XG4gICAgc2V0SGFzQ29waWVkKHRydWUpO1xuICAgIGNvbnN0IGNvcHlJZCA9IGV2ZW50LmN1cnJlbnRUYXJnZXQuZ2V0QXR0cmlidXRlKCdkYXRhLXRpdGxlJyk7XG4gICAgY29uc3QgeyBsb2NhdGlvbiB9ID0gd2luZG93O1xuICAgIGNvbnN0IG5ld0hhc2ggPSBgIyR7Y29weUlkfWA7XG4gICAgY29uc3QgcG9ydCA9IGxvY2F0aW9uLnBvcnQgPyBgOiR7bG9jYXRpb24ucG9ydH1gIDogJyc7XG4gICAgY29uc3QgdXJsVG9Db3B5ID0gYCR7bG9jYXRpb24ucHJvdG9jb2x9Ly8ke2xvY2F0aW9uLmhvc3RuYW1lfSR7cG9ydH0ke2xvY2F0aW9uLnBhdGhuYW1lfSR7bG9jYXRpb24uc2VhcmNofSR7bmV3SGFzaH1gO1xuXG4gICAgY29weVRleHRUb0NsaXBib2FyZCh1cmxUb0NvcHkpO1xuICB9O1xuXG4gIGNvbnN0IHNhbml0aXplZFRpdGxlID0gZW5jb2RlVVJJQ29tcG9uZW50KHRpdGxlLnJlcGxhY2UoLyAvZywgJy0nKSk7XG4gIGNvbnN0IHRvb2x0aXAgPSBoYXNDb3BpZWQgPyB0KCdhcnRpY2xlLmNvcHlQYWdlTGlua0NvcGllZCcpIDogdCgnYXJ0aWNsZS5jb3B5SGVhZGVyTGluaycpO1xuICByZXR1cm4gKFxuICAgIDxDb250YWluZXJEaXYgZGF0YS1oZWFkZXItY29weS1jb250YWluZXIgZGF0YS10aXRsZT17dGl0bGV9PlxuICAgICAgPEljb25CdXR0b24gb25DbGljaz17b25Db3B5Q2xpY2t9IGRhdGEtdGl0bGU9e3Nhbml0aXplZFRpdGxlfT5cbiAgICAgICAgPFRvb2x0aXAgdG9vbHRpcD17dG9vbHRpcH0+XG4gICAgICAgICAgPExpbmsgdGl0bGU9eycnfSAvPlxuICAgICAgICA8L1Rvb2x0aXA+XG4gICAgICA8L0ljb25CdXR0b24+XG4gICAgICA8aDIgaWQ9e3Nhbml0aXplZFRpdGxlfSB0YWJJbmRleD17MH0gZGFuZ2Vyb3VzbHlTZXRJbm5lckhUTUw9e3sgX19odG1sOiBjb250ZW50IHx8ICcnIH19PjwvaDI+XG4gICAgPC9Db250YWluZXJEaXY+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBDb3B5UGFyYWdyYXBoQnV0dG9uO1xuIl19 */",
|
|
66
66
|
toString: _EMOTION_STRINGIFIED_CSS_ERROR__
|
|
67
67
|
});
|
|
68
68
|
|
|
69
69
|
var CopyParagraphButton = function CopyParagraphButton(_ref) {
|
|
70
70
|
var title = _ref.title,
|
|
71
|
-
|
|
71
|
+
content = _ref.content;
|
|
72
72
|
|
|
73
73
|
var _useTranslation = (0, _reactI18next.useTranslation)(),
|
|
74
74
|
t = _useTranslation.t;
|
|
@@ -112,8 +112,11 @@ var CopyParagraphButton = function CopyParagraphButton(_ref) {
|
|
|
112
112
|
title: ''
|
|
113
113
|
}))), (0, _core.jsx)("h2", {
|
|
114
114
|
id: sanitizedTitle,
|
|
115
|
-
tabIndex: 0
|
|
116
|
-
|
|
115
|
+
tabIndex: 0,
|
|
116
|
+
dangerouslySetInnerHTML: {
|
|
117
|
+
__html: content || ''
|
|
118
|
+
}
|
|
119
|
+
}));
|
|
117
120
|
};
|
|
118
121
|
|
|
119
122
|
var _default = CopyParagraphButton;
|
|
@@ -33,11 +33,12 @@ var forEachElement = function forEachElement(selector, callback) {
|
|
|
33
33
|
var initCopyParagraphButtons = function initCopyParagraphButtons() {
|
|
34
34
|
forEachElement('[data-header-copy-container]', function (el) {
|
|
35
35
|
var title = el.getAttribute('data-title');
|
|
36
|
-
var
|
|
36
|
+
var content = el.innerHTML;
|
|
37
37
|
|
|
38
38
|
_reactDom["default"].hydrate((0, _core.jsx)(_CopyParagraphButton["default"], {
|
|
39
|
-
title: title
|
|
40
|
-
|
|
39
|
+
title: title,
|
|
40
|
+
content: content
|
|
41
|
+
}), el);
|
|
41
42
|
});
|
|
42
43
|
};
|
|
43
44
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ndla/ui",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.2.0",
|
|
4
4
|
"description": "UI component library for NDLA.",
|
|
5
5
|
"license": "GPL-3.0",
|
|
6
6
|
"main": "lib/index.js",
|
|
@@ -92,5 +92,5 @@
|
|
|
92
92
|
"publishConfig": {
|
|
93
93
|
"access": "public"
|
|
94
94
|
},
|
|
95
|
-
"gitHead": "
|
|
95
|
+
"gitHead": "dee068227de7adfdc761166e944ef375bf344bc8"
|
|
96
96
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
*
|
|
7
7
|
*/
|
|
8
8
|
|
|
9
|
-
import React, {
|
|
9
|
+
import React, { useEffect, useState } from 'react';
|
|
10
10
|
|
|
11
11
|
import styled from '@emotion/styled';
|
|
12
12
|
import { Link } from '@ndla/icons/common';
|
|
@@ -46,10 +46,10 @@ const ContainerDiv = styled.div`
|
|
|
46
46
|
|
|
47
47
|
interface Props {
|
|
48
48
|
title?: string | null;
|
|
49
|
-
|
|
49
|
+
content?: string | null;
|
|
50
50
|
}
|
|
51
51
|
|
|
52
|
-
const CopyParagraphButton = ({ title,
|
|
52
|
+
const CopyParagraphButton = ({ title, content }: Props) => {
|
|
53
53
|
const { t } = useTranslation();
|
|
54
54
|
const [hasCopied, setHasCopied] = useState(false);
|
|
55
55
|
useEffect(() => {
|
|
@@ -80,9 +80,7 @@ const CopyParagraphButton = ({ title, children }: Props) => {
|
|
|
80
80
|
<Link title={''} />
|
|
81
81
|
</Tooltip>
|
|
82
82
|
</IconButton>
|
|
83
|
-
<h2 id={sanitizedTitle} tabIndex={0}>
|
|
84
|
-
{children}
|
|
85
|
-
</h2>
|
|
83
|
+
<h2 id={sanitizedTitle} tabIndex={0} dangerouslySetInnerHTML={{ __html: content || '' }}></h2>
|
|
86
84
|
</ContainerDiv>
|
|
87
85
|
);
|
|
88
86
|
};
|
|
@@ -19,8 +19,8 @@ const forEachElement = (selector: string, callback: Function) => {
|
|
|
19
19
|
const initCopyParagraphButtons = () => {
|
|
20
20
|
forEachElement('[data-header-copy-container]', (el: HTMLElement) => {
|
|
21
21
|
const title = el.getAttribute('data-title');
|
|
22
|
-
const
|
|
23
|
-
ReactDOM.hydrate(<CopyParagraphButton title={title}
|
|
22
|
+
const content = el.innerHTML;
|
|
23
|
+
ReactDOM.hydrate(<CopyParagraphButton title={title} content={content} />, el);
|
|
24
24
|
});
|
|
25
25
|
};
|
|
26
26
|
|