@kids-reporter/draft-renderer 0.1.0 → 0.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/lib/block-render-map.js +183 -0
- package/lib/block-renderer-fn.js +15 -74
- package/lib/block-renderers/embedded-code-block.js +16 -20
- package/lib/block-renderers/image-block.js +90 -46
- package/lib/block-renderers/index.js +2 -31
- package/lib/block-renderers/info-box-block.js +2 -115
- package/lib/block-renderers/multimedia.js +127 -0
- package/lib/block-renderers/slideshow-block.js +574 -199
- package/lib/draft-renderer.js +10 -194
- package/lib/entity-decorators/annotation-decorator.js +58 -100
- package/lib/entity-decorators/index.js +17 -6
- package/lib/entity-decorators/link-decorator.js +4 -7
- package/lib/index.js +39 -14
- package/lib/theme/index.js +0 -11
- package/package.json +10 -6
- package/lib/assets/annotation-arrow.png +0 -0
- package/lib/assets/audio-pause.png +0 -0
- package/lib/assets/audio-play.png +0 -0
- package/lib/assets/citation-download.png +0 -0
- package/lib/assets/default-og-img.png +0 -0
- package/lib/assets/slideshow-arrow-down-dark.png +0 -0
- package/lib/assets/slideshow-arrow-down.png +0 -0
- package/lib/assets/slideshow-arrow-up.png +0 -0
- package/lib/assets/slideshow-close-cross.png +0 -0
- package/lib/block-renderers/audio-block.js +0 -162
- package/lib/block-renderers/background-image-block.js +0 -257
- package/lib/block-renderers/background-video-block.js +0 -272
- package/lib/block-renderers/color-box-block.js +0 -94
- package/lib/block-renderers/divider-block.js +0 -27
- package/lib/block-renderers/media-block.js +0 -65
- package/lib/block-renderers/related-post-block.js +0 -73
- package/lib/block-renderers/side-index-block.js +0 -49
- package/lib/block-renderers/table-block.js +0 -455
- package/lib/block-renderers/video-block.js +0 -37
- package/lib/components/slideshow-lightbox.js +0 -134
- package/lib/components/slideshow-sidebar.js +0 -148
- package/lib/const.js +0 -10
- package/lib/entity-decorator.js +0 -18
- package/lib/public/07d1287fd390346af0c15b930148a5e4.png +0 -0
- package/lib/public/5b3cb1a908786c8750f1041860699cc1.png +0 -0
- package/lib/public/679d63b1846e81ada28c2f76edbd2931.png +0 -0
- package/lib/public/722f90c535fa64c27555ec6ee5f22393.png +0 -0
- package/lib/public/903cf84ef5c5ad76634c30bdc0ff8c49.png +0 -0
- package/lib/public/dc249b3412c5af890a004508287a3c3d.png +0 -0
- package/lib/public/dd45f0788d9c70cabe72430bf08e7413.png +0 -0
- package/lib/public/f96d4b486ba2061c460962ae694f4670.png +0 -0
- package/lib/shared-style/content-type.js +0 -163
- package/lib/shared-style/index.js +0 -108
- package/lib/types/index.js +0 -32
- package/lib/utils/common.js +0 -44
- package/lib/utils/post.js +0 -147
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = SlideshowSideBar;
|
|
7
|
-
|
|
8
|
-
var _reactImage = _interopRequireDefault(require("@readr-media/react-image"));
|
|
9
|
-
|
|
10
|
-
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
|
|
12
|
-
var _styledComponents = _interopRequireWildcard(require("styled-components"));
|
|
13
|
-
|
|
14
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
15
|
-
|
|
16
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
-
|
|
18
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
19
|
-
|
|
20
|
-
const defaultImage = "https://unpkg.com/@kids-reporter/draft-renderer@0.1.0/lib/public/722f90c535fa64c27555ec6ee5f22393.png";
|
|
21
|
-
const arrowDown = "https://unpkg.com/@kids-reporter/draft-renderer@0.1.0/lib/public/f96d4b486ba2061c460962ae694f4670.png";
|
|
22
|
-
const arrowUp = "https://unpkg.com/@kids-reporter/draft-renderer@0.1.0/lib/public/679d63b1846e81ada28c2f76edbd2931.png";
|
|
23
|
-
const arrowShareStyle = (0, _styledComponents.css)`
|
|
24
|
-
width: 64px;
|
|
25
|
-
height: 64px;
|
|
26
|
-
margin: auto;
|
|
27
|
-
background-repeat: no-repeat;
|
|
28
|
-
background-position: center center;
|
|
29
|
-
background-size: 64px;
|
|
30
|
-
cursor: pointer;
|
|
31
|
-
border-radius: 50%;
|
|
32
|
-
visibility: ${props => props.shouldHideArrow ? 'hidden' : 'visible'};
|
|
33
|
-
|
|
34
|
-
&:hover {
|
|
35
|
-
background-color: rgba(255, 255, 255, 0.2);
|
|
36
|
-
}
|
|
37
|
-
`;
|
|
38
|
-
const SideBarWrapper = _styledComponents.default.div`
|
|
39
|
-
width: 64px;
|
|
40
|
-
position: relative;
|
|
41
|
-
|
|
42
|
-
.sidebar-images {
|
|
43
|
-
overflow-y: scroll;
|
|
44
|
-
max-height: 520px;
|
|
45
|
-
scrollbar-width: none;
|
|
46
|
-
margin: 12px auto;
|
|
47
|
-
|
|
48
|
-
&::-webkit-scrollbar {
|
|
49
|
-
display: none; /* for Chrome, Safari, and Opera */
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
`;
|
|
53
|
-
const ArrowUp = _styledComponents.default.div`
|
|
54
|
-
${arrowShareStyle}
|
|
55
|
-
background-image: url(${arrowUp});
|
|
56
|
-
`;
|
|
57
|
-
const ArrowDown = _styledComponents.default.div`
|
|
58
|
-
${arrowShareStyle}
|
|
59
|
-
background-image: url(${arrowDown});
|
|
60
|
-
`;
|
|
61
|
-
const SideBarImage = _styledComponents.default.div`
|
|
62
|
-
width: 100%;
|
|
63
|
-
aspect-ratio: 1/1;
|
|
64
|
-
cursor: pointer;
|
|
65
|
-
filter: ${props => props.isfocused ? 'none' : 'brightness(35%)'};
|
|
66
|
-
|
|
67
|
-
&:hover {
|
|
68
|
-
filter: ${props => props.isfocused ? 'none' : 'brightness(60%)'};
|
|
69
|
-
}
|
|
70
|
-
|
|
71
|
-
& + * {
|
|
72
|
-
margin-top: 12px;
|
|
73
|
-
}
|
|
74
|
-
`;
|
|
75
|
-
|
|
76
|
-
function SlideshowSideBar({
|
|
77
|
-
focusImageIndex,
|
|
78
|
-
images,
|
|
79
|
-
setFocusImageIndex,
|
|
80
|
-
imagesRefs
|
|
81
|
-
}) {
|
|
82
|
-
const handleScrollUp = () => {
|
|
83
|
-
if (focusImageIndex > 0) {
|
|
84
|
-
var _imagesRefs$current;
|
|
85
|
-
|
|
86
|
-
setFocusImageIndex(focusImageIndex - 1);
|
|
87
|
-
imagesRefs === null || imagesRefs === void 0 ? void 0 : (_imagesRefs$current = imagesRefs.current[focusImageIndex - 1]) === null || _imagesRefs$current === void 0 ? void 0 : _imagesRefs$current.scrollIntoView({
|
|
88
|
-
behavior: 'smooth',
|
|
89
|
-
block: 'center'
|
|
90
|
-
});
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
|
|
94
|
-
const handleScrollDown = () => {
|
|
95
|
-
if (focusImageIndex < (images === null || images === void 0 ? void 0 : images.length) - 1) {
|
|
96
|
-
var _imagesRefs$current2;
|
|
97
|
-
|
|
98
|
-
setFocusImageIndex(focusImageIndex + 1);
|
|
99
|
-
imagesRefs === null || imagesRefs === void 0 ? void 0 : (_imagesRefs$current2 = imagesRefs.current[focusImageIndex + 1]) === null || _imagesRefs$current2 === void 0 ? void 0 : _imagesRefs$current2.scrollIntoView({
|
|
100
|
-
behavior: 'smooth',
|
|
101
|
-
block: 'center'
|
|
102
|
-
});
|
|
103
|
-
}
|
|
104
|
-
};
|
|
105
|
-
|
|
106
|
-
const handleScrollIntoView = index => {
|
|
107
|
-
var _imagesRefs$current$i;
|
|
108
|
-
|
|
109
|
-
setFocusImageIndex(index);
|
|
110
|
-
imagesRefs === null || imagesRefs === void 0 ? void 0 : (_imagesRefs$current$i = imagesRefs.current[index]) === null || _imagesRefs$current$i === void 0 ? void 0 : _imagesRefs$current$i.scrollIntoView({
|
|
111
|
-
behavior: 'smooth',
|
|
112
|
-
block: 'center'
|
|
113
|
-
});
|
|
114
|
-
};
|
|
115
|
-
|
|
116
|
-
const sideBarImages = images.map((image, index) => {
|
|
117
|
-
return /*#__PURE__*/_react.default.createElement(SideBarImage, {
|
|
118
|
-
key: image === null || image === void 0 ? void 0 : image.id,
|
|
119
|
-
isfocused: focusImageIndex === index,
|
|
120
|
-
onClick: () => {
|
|
121
|
-
handleScrollIntoView(index);
|
|
122
|
-
},
|
|
123
|
-
ref: el => {
|
|
124
|
-
if (imagesRefs !== null && imagesRefs !== void 0 && imagesRefs.current) {
|
|
125
|
-
imagesRefs.current[index] = el;
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
}, /*#__PURE__*/_react.default.createElement(_reactImage.default, {
|
|
129
|
-
images: image === null || image === void 0 ? void 0 : image.resized,
|
|
130
|
-
defaultImage: defaultImage,
|
|
131
|
-
alt: image === null || image === void 0 ? void 0 : image.name,
|
|
132
|
-
rwd: {
|
|
133
|
-
desktop: '64px',
|
|
134
|
-
default: '100%'
|
|
135
|
-
},
|
|
136
|
-
priority: true
|
|
137
|
-
}));
|
|
138
|
-
});
|
|
139
|
-
return /*#__PURE__*/_react.default.createElement(SideBarWrapper, null, /*#__PURE__*/_react.default.createElement(ArrowUp, {
|
|
140
|
-
onClick: handleScrollUp,
|
|
141
|
-
shouldHideArrow: focusImageIndex === 0
|
|
142
|
-
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
143
|
-
className: "sidebar-images"
|
|
144
|
-
}, sideBarImages), /*#__PURE__*/_react.default.createElement(ArrowDown, {
|
|
145
|
-
onClick: handleScrollDown,
|
|
146
|
-
shouldHideArrow: focusImageIndex + 1 === (images === null || images === void 0 ? void 0 : images.length)
|
|
147
|
-
}));
|
|
148
|
-
}
|
package/lib/const.js
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.CUSTOM_STYLE_PREFIX_FONT_COLOR = exports.CUSTOM_STYLE_PREFIX_BACKGROUND_COLOR = void 0;
|
|
7
|
-
const CUSTOM_STYLE_PREFIX_FONT_COLOR = 'FONT_COLOR_';
|
|
8
|
-
exports.CUSTOM_STYLE_PREFIX_FONT_COLOR = CUSTOM_STYLE_PREFIX_FONT_COLOR;
|
|
9
|
-
const CUSTOM_STYLE_PREFIX_BACKGROUND_COLOR = 'BACKGROUND_COLOR_';
|
|
10
|
-
exports.CUSTOM_STYLE_PREFIX_BACKGROUND_COLOR = CUSTOM_STYLE_PREFIX_BACKGROUND_COLOR;
|
package/lib/entity-decorator.js
DELETED
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
|
|
8
|
-
var _draftJs = require("draft-js");
|
|
9
|
-
|
|
10
|
-
var _entityDecorators = require("./entity-decorators");
|
|
11
|
-
|
|
12
|
-
const {
|
|
13
|
-
annotationDecorator,
|
|
14
|
-
linkDecorator
|
|
15
|
-
} = _entityDecorators.entityDecorators;
|
|
16
|
-
const decorators = new _draftJs.CompositeDecorator([annotationDecorator, linkDecorator]);
|
|
17
|
-
var _default = decorators;
|
|
18
|
-
exports.default = _default;
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
Binary file
|
|
@@ -1,163 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.SummaryStyle = exports.NormalStyle = exports.CitationStyle = void 0;
|
|
7
|
-
|
|
8
|
-
var _styledComponents = require("styled-components");
|
|
9
|
-
|
|
10
|
-
var _index = require("./index");
|
|
11
|
-
|
|
12
|
-
const SummaryStyle = (0, _styledComponents.css)`
|
|
13
|
-
${({
|
|
14
|
-
theme
|
|
15
|
-
}) => theme.fontSize.sm};
|
|
16
|
-
line-height: 1.6;
|
|
17
|
-
|
|
18
|
-
*:not(:first-child) {
|
|
19
|
-
.public-DraftStyleDefault-block {
|
|
20
|
-
margin-top: 12px;
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
.public-DraftStyleDefault-ul,
|
|
25
|
-
.public-DraftStyleDefault-ol {
|
|
26
|
-
margin-top: 12px;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.public-DraftStyleDefault-unorderedListItem,
|
|
30
|
-
.public-DraftStyleDefault-orderedListItem {
|
|
31
|
-
.public-DraftStyleDefault-block {
|
|
32
|
-
margin-top: 4px;
|
|
33
|
-
}
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
.public-DraftStyleDefault-blockquote {
|
|
37
|
-
${_index.defaultBlockQuoteStyle};
|
|
38
|
-
|
|
39
|
-
& + blockquote {
|
|
40
|
-
${_index.blockQuoteSpacingBetweenContent};
|
|
41
|
-
}
|
|
42
|
-
}
|
|
43
|
-
`;
|
|
44
|
-
exports.SummaryStyle = SummaryStyle;
|
|
45
|
-
const NormalStyle = (0, _styledComponents.css)`
|
|
46
|
-
${({
|
|
47
|
-
theme
|
|
48
|
-
}) => theme.fontSize.md};
|
|
49
|
-
line-height: 2;
|
|
50
|
-
|
|
51
|
-
*:not(:first-child) {
|
|
52
|
-
${_index.defaultSpacingBetweenContent}
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
.public-DraftStyleDefault-unorderedListItem,
|
|
56
|
-
.public-DraftStyleDefault-orderedListItem {
|
|
57
|
-
${_index.noSpacingBetweenContent};
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.public-DraftStyleDefault-ul,
|
|
61
|
-
.public-DraftStyleDefault-ol {
|
|
62
|
-
margin-top: 32px;
|
|
63
|
-
}
|
|
64
|
-
|
|
65
|
-
.public-DraftStyleDefault-blockquote {
|
|
66
|
-
${_index.defaultBlockQuoteStyle};
|
|
67
|
-
|
|
68
|
-
& + blockquote {
|
|
69
|
-
${_index.blockQuoteSpacingBetweenContent};
|
|
70
|
-
}
|
|
71
|
-
}
|
|
72
|
-
`;
|
|
73
|
-
exports.NormalStyle = NormalStyle;
|
|
74
|
-
const CitationStyle = (0, _styledComponents.css)`
|
|
75
|
-
${({
|
|
76
|
-
theme
|
|
77
|
-
}) => theme.fontSize.sm};
|
|
78
|
-
line-height: 1.6;
|
|
79
|
-
|
|
80
|
-
*:not(:first-child) {
|
|
81
|
-
.public-DraftStyleDefault-block {
|
|
82
|
-
margin-top: 12px;
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
|
|
86
|
-
.public-DraftStyleDefault-unorderedListItem,
|
|
87
|
-
.public-DraftStyleDefault-orderedListItem {
|
|
88
|
-
.public-DraftStyleDefault-block {
|
|
89
|
-
margin-top: 4px;
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
.public-DraftStyleDefault-ul,
|
|
94
|
-
.public-DraftStyleDefault-ol {
|
|
95
|
-
margin-top: 12px;
|
|
96
|
-
}
|
|
97
|
-
|
|
98
|
-
//檔案下載
|
|
99
|
-
.public-DraftStyleDefault-ul:has(a) {
|
|
100
|
-
padding: 0;
|
|
101
|
-
|
|
102
|
-
.public-DraftStyleDefault-unorderedListItem {
|
|
103
|
-
list-style-type: none;
|
|
104
|
-
padding: 8px 0;
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
a {
|
|
108
|
-
width: 100%;
|
|
109
|
-
border: none;
|
|
110
|
-
font-weight: 700;
|
|
111
|
-
font-size: 16px;
|
|
112
|
-
line-height: 1.5;
|
|
113
|
-
color: #04295e;
|
|
114
|
-
display: inline-block;
|
|
115
|
-
position: relative;
|
|
116
|
-
padding-right: 60px;
|
|
117
|
-
|
|
118
|
-
&:hover {
|
|
119
|
-
color: rgba(0, 9, 40, 0.87);
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
&::after {
|
|
123
|
-
content: '';
|
|
124
|
-
background-image: url('../assets/citation-download.png');
|
|
125
|
-
background-repeat: no-repeat;
|
|
126
|
-
background-position: center center;
|
|
127
|
-
background-size: contain;
|
|
128
|
-
position: absolute;
|
|
129
|
-
right: 0;
|
|
130
|
-
top: 50%;
|
|
131
|
-
width: 24px;
|
|
132
|
-
height: 24px;
|
|
133
|
-
transform: translate(0%, -12px);
|
|
134
|
-
}
|
|
135
|
-
}
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
.public-DraftStyleDefault-blockquote {
|
|
139
|
-
width: 100%;
|
|
140
|
-
color: rgba(0, 9, 40, 0.5);
|
|
141
|
-
${({
|
|
142
|
-
theme
|
|
143
|
-
}) => theme.fontSize.sm};
|
|
144
|
-
line-height: 1.6;
|
|
145
|
-
padding: 0;
|
|
146
|
-
|
|
147
|
-
& + blockquote {
|
|
148
|
-
${_index.blockQuoteSpacingBetweenContent};
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
& + ul {
|
|
152
|
-
border-top: 1px solid rgba(0, 9, 40, 0.1);
|
|
153
|
-
padding-top: 4px;
|
|
154
|
-
|
|
155
|
-
${({
|
|
156
|
-
theme
|
|
157
|
-
}) => theme.breakpoint.md} {
|
|
158
|
-
margin-top: 16px;
|
|
159
|
-
}
|
|
160
|
-
}
|
|
161
|
-
}
|
|
162
|
-
`;
|
|
163
|
-
exports.CitationStyle = CitationStyle;
|
|
@@ -1,108 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.textAroundPictureStyle = exports.noSpacingBetweenContent = exports.narrowSpacingBetweenContent = exports.defaultUnorderedListStyle = exports.defaultUlStyle = exports.defaultSpacingBetweenContent = exports.defaultOrderedListStyle = exports.defaultOlStyle = exports.defaultLinkStyle = exports.defaultH2Style = exports.defaultBlockQuoteStyle = exports.blockQuoteSpacingBetweenContent = void 0;
|
|
7
|
-
|
|
8
|
-
var _styledComponents = require("styled-components");
|
|
9
|
-
|
|
10
|
-
const blockQuoteSpacingBetweenContent = (0, _styledComponents.css)`
|
|
11
|
-
.public-DraftStyleDefault-block {
|
|
12
|
-
margin-top: 8px;
|
|
13
|
-
}
|
|
14
|
-
`;
|
|
15
|
-
exports.blockQuoteSpacingBetweenContent = blockQuoteSpacingBetweenContent;
|
|
16
|
-
const textAroundPictureStyle = (0, _styledComponents.css)`
|
|
17
|
-
max-width: 33.3%;
|
|
18
|
-
> figure {
|
|
19
|
-
margin-bottom: 0;
|
|
20
|
-
width: 150%;
|
|
21
|
-
transform: unset;
|
|
22
|
-
}
|
|
23
|
-
figcaption {
|
|
24
|
-
padding: 0;
|
|
25
|
-
}
|
|
26
|
-
`;
|
|
27
|
-
exports.textAroundPictureStyle = textAroundPictureStyle;
|
|
28
|
-
const defaultH2Style = (0, _styledComponents.css)`
|
|
29
|
-
${({
|
|
30
|
-
theme
|
|
31
|
-
}) => theme.fontSize.lg};
|
|
32
|
-
font-weight: 700;
|
|
33
|
-
line-height: 1.5;
|
|
34
|
-
letter-spacing: 0.032em;
|
|
35
|
-
color: #000928;
|
|
36
|
-
|
|
37
|
-
${({
|
|
38
|
-
theme
|
|
39
|
-
}) => theme.breakpoint.md} {
|
|
40
|
-
${({
|
|
41
|
-
theme
|
|
42
|
-
}) => theme.fontSize.xl};
|
|
43
|
-
}
|
|
44
|
-
`;
|
|
45
|
-
exports.defaultH2Style = defaultH2Style;
|
|
46
|
-
const defaultUlStyle = (0, _styledComponents.css)`
|
|
47
|
-
list-style-type: disc;
|
|
48
|
-
padding-left: 1.2rem;
|
|
49
|
-
`;
|
|
50
|
-
exports.defaultUlStyle = defaultUlStyle;
|
|
51
|
-
const defaultUnorderedListStyle = (0, _styledComponents.css)`
|
|
52
|
-
letter-spacing: 0.01em;
|
|
53
|
-
text-align: justify;
|
|
54
|
-
color: rgba(0, 9, 40, 0.87);
|
|
55
|
-
`;
|
|
56
|
-
exports.defaultUnorderedListStyle = defaultUnorderedListStyle;
|
|
57
|
-
const defaultOlStyle = (0, _styledComponents.css)`
|
|
58
|
-
list-style-type: decimal;
|
|
59
|
-
padding-left: 1.2rem;
|
|
60
|
-
`;
|
|
61
|
-
exports.defaultOlStyle = defaultOlStyle;
|
|
62
|
-
const defaultOrderedListStyle = (0, _styledComponents.css)`
|
|
63
|
-
letter-spacing: 0.01em;
|
|
64
|
-
text-align: justify;
|
|
65
|
-
color: rgba(0, 9, 40, 0.87);
|
|
66
|
-
`;
|
|
67
|
-
exports.defaultOrderedListStyle = defaultOrderedListStyle;
|
|
68
|
-
const defaultLinkStyle = (0, _styledComponents.css)`
|
|
69
|
-
display: inline;
|
|
70
|
-
border-bottom: 2px solid #ebf02c;
|
|
71
|
-
letter-spacing: 0.01em;
|
|
72
|
-
text-align: justify;
|
|
73
|
-
color: rgba(0, 9, 40, 0.87);
|
|
74
|
-
padding-bottom: 2px;
|
|
75
|
-
|
|
76
|
-
&:hover {
|
|
77
|
-
border-bottom: 2px solid #04295e;
|
|
78
|
-
}
|
|
79
|
-
`;
|
|
80
|
-
exports.defaultLinkStyle = defaultLinkStyle;
|
|
81
|
-
const defaultBlockQuoteStyle = (0, _styledComponents.css)`
|
|
82
|
-
${({
|
|
83
|
-
theme
|
|
84
|
-
}) => theme.fontSize.sm};
|
|
85
|
-
line-height: 1.6;
|
|
86
|
-
color: rgba(0, 9, 40, 0.66);
|
|
87
|
-
opacity: 0.87;
|
|
88
|
-
padding: 0 20px;
|
|
89
|
-
`;
|
|
90
|
-
exports.defaultBlockQuoteStyle = defaultBlockQuoteStyle;
|
|
91
|
-
const defaultSpacingBetweenContent = (0, _styledComponents.css)`
|
|
92
|
-
.public-DraftStyleDefault-block {
|
|
93
|
-
margin-top: 32px;
|
|
94
|
-
}
|
|
95
|
-
`;
|
|
96
|
-
exports.defaultSpacingBetweenContent = defaultSpacingBetweenContent;
|
|
97
|
-
const narrowSpacingBetweenContent = (0, _styledComponents.css)`
|
|
98
|
-
.public-DraftStyleDefault-block {
|
|
99
|
-
margin-top: 16px;
|
|
100
|
-
}
|
|
101
|
-
`;
|
|
102
|
-
exports.narrowSpacingBetweenContent = narrowSpacingBetweenContent;
|
|
103
|
-
const noSpacingBetweenContent = (0, _styledComponents.css)`
|
|
104
|
-
.public-DraftStyleDefault-block {
|
|
105
|
-
margin-top: unset;
|
|
106
|
-
}
|
|
107
|
-
`;
|
|
108
|
-
exports.noSpacingBetweenContent = noSpacingBetweenContent;
|
package/lib/types/index.js
DELETED
|
@@ -1,32 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.ValidPostContentType = void 0;
|
|
7
|
-
var ValidPostStyle;
|
|
8
|
-
|
|
9
|
-
(function (ValidPostStyle) {
|
|
10
|
-
ValidPostStyle["NEWS"] = "news";
|
|
11
|
-
ValidPostStyle["FRAME"] = "frame";
|
|
12
|
-
ValidPostStyle["BLANK"] = "blank";
|
|
13
|
-
ValidPostStyle["REPORT"] = "report";
|
|
14
|
-
ValidPostStyle["PROJECT3"] = "project3";
|
|
15
|
-
ValidPostStyle["EMBEDDED"] = "embedded";
|
|
16
|
-
ValidPostStyle["REVIEW"] = "review";
|
|
17
|
-
ValidPostStyle["MEMO"] = "memo";
|
|
18
|
-
ValidPostStyle["DUMMY"] = "dummy";
|
|
19
|
-
ValidPostStyle["CARD"] = "card";
|
|
20
|
-
ValidPostStyle["QA"] = "qa";
|
|
21
|
-
ValidPostStyle["SCROLLABLE_VIDEO"] = "scrollablevideo";
|
|
22
|
-
})(ValidPostStyle || (ValidPostStyle = {}));
|
|
23
|
-
|
|
24
|
-
let ValidPostContentType;
|
|
25
|
-
exports.ValidPostContentType = ValidPostContentType;
|
|
26
|
-
|
|
27
|
-
(function (ValidPostContentType) {
|
|
28
|
-
ValidPostContentType["SUMMARY"] = "summary";
|
|
29
|
-
ValidPostContentType["NORMAL"] = "normal";
|
|
30
|
-
ValidPostContentType["ACTIONLIST"] = "actionlist";
|
|
31
|
-
ValidPostContentType["CITATION"] = "citation";
|
|
32
|
-
})(ValidPostContentType || (exports.ValidPostContentType = ValidPostContentType = {}));
|
package/lib/utils/common.js
DELETED
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.removeEmptyContentBlock = exports.hasContentInRawContentBlock = void 0;
|
|
7
|
-
|
|
8
|
-
const hasContentInRawContentBlock = rawContentBlock => {
|
|
9
|
-
if (!rawContentBlock || !rawContentBlock.blocks || !rawContentBlock.blocks.length) {
|
|
10
|
-
return false;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
const hasAtomicBlock = Boolean(rawContentBlock.blocks.some(block => block.type === 'atomic'));
|
|
14
|
-
|
|
15
|
-
if (hasAtomicBlock) {
|
|
16
|
-
return hasAtomicBlock;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
const defaultBlockHasContent = Boolean(rawContentBlock.blocks.filter(block => block.type !== 'atomic').some(block => block.text.trim()));
|
|
20
|
-
return defaultBlockHasContent;
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
exports.hasContentInRawContentBlock = hasContentInRawContentBlock;
|
|
24
|
-
|
|
25
|
-
const removeEmptyContentBlock = rawContentBlock => {
|
|
26
|
-
const hasContent = hasContentInRawContentBlock(rawContentBlock);
|
|
27
|
-
|
|
28
|
-
if (!hasContent) {
|
|
29
|
-
throw new Error('There is no content in rawContentBlock, please check again.');
|
|
30
|
-
}
|
|
31
|
-
|
|
32
|
-
const blocksWithHideEmptyBlock = rawContentBlock === null || rawContentBlock === void 0 ? void 0 : rawContentBlock.blocks.map(block => {
|
|
33
|
-
if (block.type === 'atomic' || block.text) {
|
|
34
|
-
return block;
|
|
35
|
-
} else {
|
|
36
|
-
return undefined;
|
|
37
|
-
}
|
|
38
|
-
}).filter(block => block);
|
|
39
|
-
return { ...rawContentBlock,
|
|
40
|
-
blocks: blocksWithHideEmptyBlock
|
|
41
|
-
};
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
exports.removeEmptyContentBlock = removeEmptyContentBlock;
|
package/lib/utils/post.js
DELETED
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.insertRecommendInContentBlock = exports.getSideIndexEntityData = exports.getFirstBlockEntityType = void 0;
|
|
7
|
-
|
|
8
|
-
var _common = require("./common");
|
|
9
|
-
|
|
10
|
-
// eslint-disable-next-line prettier/prettier
|
|
11
|
-
const insertRecommendInContentBlock = (rawContentBlock, insertRecommend) => {
|
|
12
|
-
const relatedPostsEntityMaps = insertRecommend === null || insertRecommend === void 0 ? void 0 : insertRecommend.map(post => ({
|
|
13
|
-
data: {
|
|
14
|
-
posts: [{
|
|
15
|
-
heroImage: (post === null || post === void 0 ? void 0 : post.heroImage) || {},
|
|
16
|
-
id: (post === null || post === void 0 ? void 0 : post.id) || '',
|
|
17
|
-
name: (post === null || post === void 0 ? void 0 : post.title) || '',
|
|
18
|
-
ogImage: (post === null || post === void 0 ? void 0 : post.ogImage) || null,
|
|
19
|
-
slug: (post === null || post === void 0 ? void 0 : post.slug) || '',
|
|
20
|
-
subtitle: null
|
|
21
|
-
}]
|
|
22
|
-
},
|
|
23
|
-
type: 'RELATEDPOST',
|
|
24
|
-
mutability: 'IMMUTABLE'
|
|
25
|
-
}));
|
|
26
|
-
const insertRelatedEntities = relatedPostsEntityMaps.reduce((accumulator, current) => {
|
|
27
|
-
var _current$data;
|
|
28
|
-
|
|
29
|
-
// +1000 to increase diversity to avoid `key` duplication
|
|
30
|
-
const entityKey = Number(current === null || current === void 0 ? void 0 : (_current$data = current.data) === null || _current$data === void 0 ? void 0 : _current$data.posts[0].id) + 1000;
|
|
31
|
-
return { ...accumulator,
|
|
32
|
-
[entityKey]: current
|
|
33
|
-
};
|
|
34
|
-
}, {});
|
|
35
|
-
const entityMapWithInsertRecommend = { ...rawContentBlock.entityMap,
|
|
36
|
-
...insertRelatedEntities
|
|
37
|
-
};
|
|
38
|
-
const relatedPostsBlocks = insertRecommend.map((post, index) => {
|
|
39
|
-
// +1000 to increase diversity to avoid `key` duplication
|
|
40
|
-
const entityKey = Number(post.id) + 1000;
|
|
41
|
-
return {
|
|
42
|
-
key: `insertRecommend-${index}`,
|
|
43
|
-
data: {},
|
|
44
|
-
text: ' ',
|
|
45
|
-
//notice: if text: '' will show error
|
|
46
|
-
type: 'atomic',
|
|
47
|
-
depth: 0,
|
|
48
|
-
entityRanges: [{
|
|
49
|
-
key: entityKey,
|
|
50
|
-
length: 1,
|
|
51
|
-
offset: 0
|
|
52
|
-
}],
|
|
53
|
-
inlineStyleRanges: []
|
|
54
|
-
};
|
|
55
|
-
});
|
|
56
|
-
|
|
57
|
-
function insertRecommendBlocks(data) {
|
|
58
|
-
let i = 0;
|
|
59
|
-
let count = 0; // B: insert recommends based on related-posts amount
|
|
60
|
-
|
|
61
|
-
const paragraphs = data === null || data === void 0 ? void 0 : data.filter(item => (item === null || item === void 0 ? void 0 : item.type) === 'unstyled' && (item === null || item === void 0 ? void 0 : item.text.length));
|
|
62
|
-
let divideAmount;
|
|
63
|
-
|
|
64
|
-
if (relatedPostsBlocks.length) {
|
|
65
|
-
divideAmount = Math.round((paragraphs === null || paragraphs === void 0 ? void 0 : paragraphs.length) / (relatedPostsBlocks.length + 1)) || (paragraphs !== null && paragraphs !== void 0 && paragraphs.length ? 1 : 0);
|
|
66
|
-
} else {
|
|
67
|
-
divideAmount = 0;
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
if (data !== null && data !== void 0 && data.length) {
|
|
71
|
-
while (i < data.length && divideAmount) {
|
|
72
|
-
var _data$i, _data$i2;
|
|
73
|
-
|
|
74
|
-
if (((_data$i = data[i]) === null || _data$i === void 0 ? void 0 : _data$i.type) === 'unstyled' && (_data$i2 = data[i]) !== null && _data$i2 !== void 0 && _data$i2.text.length) {
|
|
75
|
-
count++;
|
|
76
|
-
const item = relatedPostsBlocks[count / divideAmount - 1];
|
|
77
|
-
|
|
78
|
-
if (count % divideAmount === 0 && item) {
|
|
79
|
-
data.splice(i + 1, 0, item);
|
|
80
|
-
}
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
i++;
|
|
84
|
-
}
|
|
85
|
-
} // A: insert recommends each 5 paragraphs (same as READr 2.0)
|
|
86
|
-
// if (data?.length) {
|
|
87
|
-
// while (i < data.length) {
|
|
88
|
-
// if (data[i]?.type === 'unstyled' && data[i]?.text.length) {
|
|
89
|
-
// count++
|
|
90
|
-
// const item = relatedPostsBlocks[count / 5 - 1]
|
|
91
|
-
// if (count % 5 === 0 && item) {
|
|
92
|
-
// data.splice(i + 1, 0, item)
|
|
93
|
-
// }
|
|
94
|
-
// }
|
|
95
|
-
// i++
|
|
96
|
-
// }
|
|
97
|
-
// }
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
return data;
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
const contentWithoutEmptyBlock = (0, _common.removeEmptyContentBlock)(rawContentBlock);
|
|
104
|
-
const contentWithInsertRecommend = {
|
|
105
|
-
blocks: insertRecommendBlocks(contentWithoutEmptyBlock === null || contentWithoutEmptyBlock === void 0 ? void 0 : contentWithoutEmptyBlock.blocks),
|
|
106
|
-
entityMap: entityMapWithInsertRecommend
|
|
107
|
-
};
|
|
108
|
-
return contentWithInsertRecommend;
|
|
109
|
-
};
|
|
110
|
-
|
|
111
|
-
exports.insertRecommendInContentBlock = insertRecommendInContentBlock;
|
|
112
|
-
|
|
113
|
-
const getFirstBlockEntityType = rawContentBlock => {
|
|
114
|
-
const contentBlocks = (0, _common.removeEmptyContentBlock)(rawContentBlock);
|
|
115
|
-
|
|
116
|
-
if (contentBlocks) {
|
|
117
|
-
var _contentBlocks$entity;
|
|
118
|
-
|
|
119
|
-
return contentBlocks === null || contentBlocks === void 0 ? void 0 : (_contentBlocks$entity = contentBlocks.entityMap[0]) === null || _contentBlocks$entity === void 0 ? void 0 : _contentBlocks$entity.type;
|
|
120
|
-
} else {
|
|
121
|
-
return undefined;
|
|
122
|
-
}
|
|
123
|
-
};
|
|
124
|
-
|
|
125
|
-
exports.getFirstBlockEntityType = getFirstBlockEntityType;
|
|
126
|
-
|
|
127
|
-
const getSideIndexEntityData = rawContentBlock => {
|
|
128
|
-
const contentBlocks = (0, _common.removeEmptyContentBlock)(rawContentBlock);
|
|
129
|
-
|
|
130
|
-
if (contentBlocks !== null && contentBlocks !== void 0 && contentBlocks.entityMap) {
|
|
131
|
-
return Object.values(contentBlocks.entityMap).filter(entity => entity.type === 'SIDEINDEX').map(entity => {
|
|
132
|
-
const content = entity.data ?? {};
|
|
133
|
-
const sideIndexTitle = content.sideIndexText || content.h2Text || '';
|
|
134
|
-
const key = sideIndexTitle.replace(/\s+/g, '');
|
|
135
|
-
return {
|
|
136
|
-
title: sideIndexTitle,
|
|
137
|
-
id: `header-${key}`,
|
|
138
|
-
href: (content === null || content === void 0 ? void 0 : content.sideIndexUrl) || null,
|
|
139
|
-
isActive: false
|
|
140
|
-
};
|
|
141
|
-
});
|
|
142
|
-
} else {
|
|
143
|
-
return undefined;
|
|
144
|
-
}
|
|
145
|
-
};
|
|
146
|
-
|
|
147
|
-
exports.getSideIndexEntityData = getSideIndexEntityData;
|