@kids-reporter/draft-renderer 0.4.4 → 0.4.6

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.
Files changed (5) hide show
  1. package/lib/block-renderers/blockquote.js +7 -7
  2. package/lib/block-renderers/image-block.js +55 -10
  3. package/lib/block-renderers/info-box-block.js +10 -10
  4. package/lib/entity-decorators/annotation-decorator.js +2 -2
  5. package/package.json +1 -1
package/lib/block-renderers/blockquote.js CHANGED
@@ -75,15 +75,15 @@ const ArticleBodyContainer = _styledComponents.default.div`
75
75
  margin-right: auto;
76
76
  `}
77
77
  `;
78
- var BlockquoteType = /*#__PURE__*/function (BlockquoteType) {
79
- BlockquoteType["borderLeft"] = "border_left";
80
- BlockquoteType["quoteLeft"] = "quote_left";
81
- return BlockquoteType;
82
- }(BlockquoteType || {});
78
+ var BlockquoteTypeEnum = /*#__PURE__*/function (BlockquoteTypeEnum) {
79
+ BlockquoteTypeEnum["borderLeft"] = "border_left";
80
+ BlockquoteTypeEnum["quoteLeft"] = "quote_left";
81
+ return BlockquoteTypeEnum;
82
+ }(BlockquoteTypeEnum || {});
83
83
  function BlockquoteInArticleBody({
84
84
  className = '',
85
85
  data = {
86
- type: BlockquoteType.borderLeft,
86
+ type: BlockquoteTypeEnum.borderLeft,
87
87
  text: ''
88
88
  }
89
89
  }) {
@@ -91,7 +91,7 @@ function BlockquoteInArticleBody({
91
91
  type,
92
92
  text
93
93
  } = data;
94
- const BlockQuote = type === BlockquoteType.quoteLeft ? QuoteLeftBlockquote : BorderLeftBlockquote;
94
+ const BlockQuote = type === BlockquoteTypeEnum.quoteLeft ? QuoteLeftBlockquote : BorderLeftBlockquote;
95
95
  return /*#__PURE__*/_react.default.createElement(ArticleBodyContainer, {
96
96
  className: className
97
97
  }, /*#__PURE__*/_react.default.createElement(BlockQuote, {
package/lib/block-renderers/image-block.js CHANGED
@@ -50,7 +50,7 @@ function ImageBlock({
50
50
  src: imageFile === null || imageFile === void 0 ? void 0 : imageFile.url,
51
51
  srcSet: imgSrcSetArr.join(','),
52
52
  sizes: "(min-width: 1200px) 1000px, 100vw"
53
- }), /*#__PURE__*/_react.default.createElement(FigureCaption, null, desc));
53
+ }), desc && /*#__PURE__*/_react.default.createElement(FigureCaption, null, desc));
54
54
  return imgBlock;
55
55
  }
56
56
  const ArticleBodyContainer = _styledComponents.default.div`
@@ -59,6 +59,12 @@ const ArticleBodyContainer = _styledComponents.default.div`
59
59
  margin: 0;
60
60
  }
61
61
 
62
+ &::after {
63
+ content: '';
64
+ display: table;
65
+ clear: both;
66
+ }
67
+
62
68
  max-width: 100%;
63
69
  margin: 0 auto 27px auto;
64
70
 
@@ -72,20 +78,34 @@ const ArticleBodyContainer = _styledComponents.default.div`
72
78
 
73
79
  ${props => {
74
80
  switch (props.$alignment) {
81
+ case 'paragraph-width':
82
+ return `
83
+ ${_index.theme.breakpoint.xl} {
84
+ figure {
85
+ width: 700px;
86
+ margin-left: auto;
87
+ margin-right: auto;
88
+ }
89
+ }
90
+ `;
75
91
  case 'right':
76
92
  return `
77
93
  ${_index.theme.breakpoint.xl} {
78
- width: 361px;
79
- float: right;
80
- margin: 5px 0px 5px 27px;
94
+ figure {
95
+ width: 361px;
96
+ float: right;
97
+ margin: 5px 0px 5px 27px;
98
+ }
81
99
  }
82
100
  `;
83
101
  case 'left':
84
102
  return `
85
103
  ${_index.theme.breakpoint.xl} {
86
- width: 361px;
87
- float: left;
88
- margin: 5px 27px 5px 0px;
104
+ figure {
105
+ width: 361px;
106
+ float: left;
107
+ margin: 5px 27px 5px 0px;
108
+ }
89
109
  }
90
110
  `;
91
111
  }
@@ -110,15 +130,40 @@ const InfoBoxContainer = _styledComponents.default.div`
110
130
  margin-bottom: 30px;
111
131
  width: fit-content;
112
132
 
133
+ &::after {
134
+ content: '';
135
+ display: table;
136
+ clear: both;
137
+ }
138
+
113
139
  ${props => {
114
140
  switch (props.$alignment) {
115
- case 'center':
141
+ case 'paragraph-width':
116
142
  {
117
- return `margin-left: auto; margin-right: auto;`;
143
+ return `
144
+ figure {
145
+ margin-left: auto;
146
+ margin-right: auto;
147
+ }
148
+ `;
149
+ }
150
+ case 'left':
151
+ {
152
+ return `
153
+ figure {
154
+ max-width: 50%;
155
+ margin-right: auto;
156
+ }
157
+ `;
118
158
  }
119
159
  case 'right':
120
160
  {
121
- return `margin-left: auto`;
161
+ return `
162
+ figure {
163
+ max-width: 50%;
164
+ margin-left: auto;
165
+ }
166
+ `;
122
167
  }
123
168
  }
124
169
  }}
package/lib/block-renderers/info-box-block.js CHANGED
@@ -16,12 +16,12 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
16
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
17
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
18
18
  // @ts-ignore pkg does not contain ts header file
19
- var InfoBoxType = /*#__PURE__*/function (InfoBoxType) {
20
- InfoBoxType["newsChargeStation"] = "news-charge-station";
21
- InfoBoxType["headerBorder"] = "header-border";
22
- InfoBoxType["boxBorder"] = "box-border";
23
- return InfoBoxType;
24
- }(InfoBoxType || {});
19
+ var InfoBoxTypeEnum = /*#__PURE__*/function (InfoBoxTypeEnum) {
20
+ InfoBoxTypeEnum["newsChargeStation"] = "news-charge-station";
21
+ InfoBoxTypeEnum["headerBorder"] = "header-border";
22
+ InfoBoxTypeEnum["boxBorder"] = "box-border";
23
+ return InfoBoxTypeEnum;
24
+ }(InfoBoxTypeEnum || {});
25
25
  const containerStyles = (0, _styledComponents.css)`
26
26
  padding: 40px;
27
27
  border-radius: 30px;
@@ -75,7 +75,7 @@ const HeaderBorderContainer = _styledComponents.default.div`
75
75
  default:
76
76
  {
77
77
  logoColor = 'yellow';
78
- bgColor = '#3a4f66';
78
+ bgColor = '#d2f5ff';
79
79
  break;
80
80
  }
81
81
  }
@@ -158,18 +158,18 @@ function InfoBoxInArticleBody({
158
158
  let Component;
159
159
  let blockRenderMap = _blockRenderMap.blockRenderMapForInfoBox;
160
160
  switch (type) {
161
- case InfoBoxType.headerBorder:
161
+ case InfoBoxTypeEnum.headerBorder:
162
162
  {
163
163
  Component = HeaderBorder;
164
164
  blockRenderMap = _blockRenderMap.blockRenderMapForInfoBoxWithHeaderBorder;
165
165
  break;
166
166
  }
167
- case InfoBoxType.boxBorder:
167
+ case InfoBoxTypeEnum.boxBorder:
168
168
  {
169
169
  Component = BoxBorder;
170
170
  break;
171
171
  }
172
- case InfoBoxType.newsChargeStation:
172
+ case InfoBoxTypeEnum.newsChargeStation:
173
173
  default:
174
174
  {
175
175
  Component = NewsChargeStation;
package/lib/entity-decorators/annotation-decorator.js CHANGED
@@ -49,7 +49,7 @@ const ArrowIcon = _styledComponents.default.span`
49
49
  height: 6.5px;
50
50
  top: 5px;
51
51
  right: 5px;
52
- transform: ${props => props.$showContent ? 'rotate(45deg)' : 'rotate(-45deg)'};
52
+ transform: ${props => props.$showContent ? 'rotate(-45deg)' : 'rotate(45deg)'};
53
53
  display: block;
54
54
  position: absolute;
55
55
  transition: transform 200ms ease 0s;
@@ -64,7 +64,7 @@ const ArrowIcon = _styledComponents.default.span`
64
64
  height: 6.5px;
65
65
  top: 5px;
66
66
  left: 5px;
67
- transform: ${props => props.$showContent ? 'rotate(-45deg)' : 'rotate(45deg)'};
67
+ transform: ${props => props.$showContent ? 'rotate(45deg)' : 'rotate(-45deg)'};
68
68
  display: block;
69
69
  position: absolute;
70
70
  transition: transform 200ms ease 0s;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kids-reporter/draft-renderer",
3
- "version": "0.4.4",
3
+ "version": "0.4.6",
4
4
  "description": "",
5
5
  "main": "lib/index.js",
6
6
  "scripts": {