nodoku-core 0.2.1 → 0.2.2
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/esm/content/nd-content.js +5 -2
- package/esm/core/dummy-comp.jsx +5 -6
- package/esm/core/rendering-page.jsx +2 -1
- package/esm/index.js +2 -2
- package/esm/providers/content/content-markdown-provider.js +47 -20
- package/package.json +1 -1
- package/types/content/nd-content.d.ts +6 -2
- package/types/index.d.ts +2 -2
|
@@ -3,6 +3,10 @@ export class NdContentImage {
|
|
|
3
3
|
title;
|
|
4
4
|
alt;
|
|
5
5
|
}
|
|
6
|
+
export class NdCallToAction {
|
|
7
|
+
ctaUrl = {};
|
|
8
|
+
ctaTitle;
|
|
9
|
+
}
|
|
6
10
|
export class NdTranslatableText {
|
|
7
11
|
key = "";
|
|
8
12
|
ns = "";
|
|
@@ -49,9 +53,8 @@ export class NdContentBlock {
|
|
|
49
53
|
h4;
|
|
50
54
|
h5;
|
|
51
55
|
h6;
|
|
52
|
-
|
|
56
|
+
callToActions = [];
|
|
53
57
|
paragraphs = [];
|
|
54
|
-
// bgImageUrl?: NdTranslatableText;
|
|
55
58
|
images = [];
|
|
56
59
|
htmlElements = [];
|
|
57
60
|
constructor(id, ns, lng) {
|
package/esm/core/dummy-comp.jsx
CHANGED
|
@@ -6,10 +6,7 @@ export async function DummyComp(props) {
|
|
|
6
6
|
return <div>{await render(rowIndex, componentIndex, content[0], t)}</div>;
|
|
7
7
|
}
|
|
8
8
|
async function render(rowIndex, componentIndex, block, t) {
|
|
9
|
-
|
|
10
|
-
// if (block.bgImageUrl) {
|
|
11
|
-
// style = {backgroundImage: `url(${t(block.bgImageUrl)})`}
|
|
12
|
-
// }
|
|
9
|
+
console.log("this is my block", block.callToActions.map(cta => `${cta.ctaUrl.key}`));
|
|
13
10
|
return (<div className={"w-full w-full flex flex-col items-left justify-left border border-4 border-red-200 relative pb-10"}>
|
|
14
11
|
{/*<div className={"top-0 bottom-0 left-0 right-0 absolute bg-cover bg-no-repeat"}*/}
|
|
15
12
|
{/* style={{...style, zIndex: -11}}>*/}
|
|
@@ -86,8 +83,10 @@ async function render(rowIndex, componentIndex, block, t) {
|
|
|
86
83
|
</div>
|
|
87
84
|
|
|
88
85
|
<div className={"absolute bottom-0 p-5"}>
|
|
89
|
-
{block.
|
|
90
|
-
|
|
86
|
+
{block.callToActions.map((cta) => {
|
|
87
|
+
return <p><b>{`${t(cta.ctaTitle || cta.ctaUrl)}: ${t(cta.ctaUrl)}`}</b>{`${cta.ctaUrl.key}: ${t(cta.ctaUrl)}`}</p>;
|
|
88
|
+
})}
|
|
89
|
+
|
|
91
90
|
</div>
|
|
92
91
|
|
|
93
92
|
</div>);
|
|
@@ -6,6 +6,7 @@ import yaml from "js-yaml";
|
|
|
6
6
|
import fs from "node:fs";
|
|
7
7
|
import { mergeTheme } from "../theme-utils/theme-merger";
|
|
8
8
|
import { defaultRowThemeImpl } from "../theme-utils/row-style";
|
|
9
|
+
import { ts } from "../index";
|
|
9
10
|
async function defaultComponentResolver() {
|
|
10
11
|
const compoDef = new NdComponentDefinition("unlimited", undefined, {});
|
|
11
12
|
return { compo: DummyComp, compoDef: compoDef };
|
|
@@ -137,7 +138,7 @@ async function createRow(row, iRow, blocks, lng, imageProvider, i18nProvider, co
|
|
|
137
138
|
rowDisplay = "flex flex-row justify-center flex-wrap flex-1";
|
|
138
139
|
}
|
|
139
140
|
return (<div key={`row-${iRow}`} className={`${rowDisplay} ${rowEffectiveTheme?.base} ${rowEffectiveTheme?.decoration} class-row-${iRow}`}>
|
|
140
|
-
{rowComponents.map((c) => <div className={`nd-component-holder ${flexBasis} ${rowEffectiveTheme.componentHolder?.base} ${rowEffectiveTheme.componentHolder?.decoration}`}>
|
|
141
|
+
{rowComponents.map((c) => <div className={`nd-component-holder ${flexBasis} ${ts(rowEffectiveTheme, "componentHolder")} ${rowEffectiveTheme.componentHolder?.base} ${rowEffectiveTheme.componentHolder?.decoration}`}>
|
|
141
142
|
{c}
|
|
142
143
|
</div>)}
|
|
143
144
|
</div>);
|
package/esm/index.js
CHANGED
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { NdContentImage, NdTranslatableText, NdList, NdCode, NdContentBlock } from "./content/nd-content";
|
|
1
|
+
import { NdContentImage, NdTranslatableText, NdList, NdCode, NdCallToAction, NdContentBlock } from "./content/nd-content";
|
|
2
2
|
import { NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy } from "./skin/nd-skin";
|
|
3
3
|
import { RenderingPageProps, RenderingPriority } from "./core/rendering-page-props";
|
|
4
4
|
import { RenderingPage } from "./core/rendering-page";
|
|
5
5
|
import { mergeTheme } from "./theme-utils/theme-merger";
|
|
6
6
|
import { defaultRowThemeImpl } from "./theme-utils/row-style";
|
|
7
|
-
export { NdContentImage, NdTranslatableText, NdList, NdCode, NdContentBlock, NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy };
|
|
7
|
+
export { NdContentImage, NdTranslatableText, NdList, NdCode, NdCallToAction, NdContentBlock, NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy };
|
|
8
8
|
export { RenderingPageProps, RenderingPriority, RenderingPage };
|
|
9
9
|
export { mergeTheme };
|
|
10
10
|
export { DummyComp } from "./core/dummy-comp";
|
|
@@ -2,6 +2,7 @@ import { NdTranslatableText, NdList, NdContentBlock, NdContentImage, NdCode } fr
|
|
|
2
2
|
import { Marked } from '@ts-stack/markdown';
|
|
3
3
|
import { parse } from 'node-html-parser';
|
|
4
4
|
import yaml from "js-yaml";
|
|
5
|
+
import { NdCallToAction } from "../../content/nd-content";
|
|
5
6
|
const nsRegex = /.*\/(.*)\.md/;
|
|
6
7
|
export async function contentMarkdownProvider(mdFileUrl, contentLng, ns = undefined) {
|
|
7
8
|
return await fetch(mdFileUrl)
|
|
@@ -19,7 +20,7 @@ export async function contentMarkdownProvider(mdFileUrl, contentLng, ns = undefi
|
|
|
19
20
|
return parseMarkdownAsContent(fileContent, contentLng, ns);
|
|
20
21
|
});
|
|
21
22
|
}
|
|
22
|
-
const
|
|
23
|
+
const callToActionPattern = /^\|(.*)\|/;
|
|
23
24
|
const codePattern = /<code class="lang-(\w+)">(.*)<\/code>/s;
|
|
24
25
|
class BlockHolder {
|
|
25
26
|
blockIndex;
|
|
@@ -34,7 +35,7 @@ class BlockHolder {
|
|
|
34
35
|
this.blockIndex = blockIndex;
|
|
35
36
|
this.blockDefIndex = blockDefIndex;
|
|
36
37
|
}
|
|
37
|
-
blockContent = { paragraphsIndex: [], imagesIndex: [], htmlStream: [] };
|
|
38
|
+
blockContent = { paragraphsIndex: [], imagesIndex: [], callToActionIndex: [], htmlStream: [] };
|
|
38
39
|
hasContentH1AndBelow() {
|
|
39
40
|
return this.blockContent.titleIndex != undefined || this.hasContentH2AndBelow();
|
|
40
41
|
}
|
|
@@ -128,6 +129,12 @@ class BlockHolder {
|
|
|
128
129
|
this.blockContent.htmlStream.push(childNode);
|
|
129
130
|
return this;
|
|
130
131
|
}
|
|
132
|
+
addCallToAction(childNode) {
|
|
133
|
+
this.blockContent.callToActionIndex.push(this.blockContent.htmlStream.length);
|
|
134
|
+
// console.log("adding html for cta", childNode.innerHTML)
|
|
135
|
+
this.blockContent.htmlStream.push(childNode);
|
|
136
|
+
return this;
|
|
137
|
+
}
|
|
131
138
|
addHorizontalLine(childNode) {
|
|
132
139
|
this.blockContent.htmlStream.push(childNode);
|
|
133
140
|
return this;
|
|
@@ -168,6 +175,7 @@ class BlockHolder {
|
|
|
168
175
|
// console.log("creating block: ", this.blockContent.paragraphsIndex)
|
|
169
176
|
let pi = 0;
|
|
170
177
|
let imi = 0;
|
|
178
|
+
let ci = 0;
|
|
171
179
|
this.blockContent.htmlStream.forEach((htmlElem, i) => {
|
|
172
180
|
let text = undefined;
|
|
173
181
|
if (i === this.blockContent.titleIndex) {
|
|
@@ -242,21 +250,41 @@ class BlockHolder {
|
|
|
242
250
|
imi++;
|
|
243
251
|
}
|
|
244
252
|
}
|
|
253
|
+
else if (this.blockContent.callToActionIndex.indexOf(i) >= 0) {
|
|
254
|
+
const cta = this.parseCallToAction(blockId, htmlElem, ci);
|
|
255
|
+
if (cta) {
|
|
256
|
+
newBlock.callToActions.push(cta);
|
|
257
|
+
text = cta;
|
|
258
|
+
ci++;
|
|
259
|
+
// console.log("added call to action: ", cta)
|
|
260
|
+
}
|
|
261
|
+
}
|
|
245
262
|
else {
|
|
246
263
|
text = new NdTranslatableText(this.ns, `${blockId}.htmlElements.${newBlock.htmlElements.length}`, "");
|
|
247
264
|
}
|
|
248
265
|
newBlock.htmlElements.push({ htmlElem: htmlElem, translatedText: text });
|
|
249
266
|
});
|
|
250
|
-
if (this.blockContent.footer && this.blockContent.footer.trim().length > 0) {
|
|
251
|
-
|
|
252
|
-
}
|
|
253
|
-
// if (this.blockContent.bgImage && this.blockContent.bgImage.getAttribute("src")) {
|
|
254
|
-
// newBlock.bgImageUrl = new NdTranslatableText(this.ns, `${blockId}.bgImageUrl`,
|
|
255
|
-
// this.blockContent.bgImage.getAttribute("src") as string, true);
|
|
267
|
+
// if (this.blockContent.footer && this.blockContent.footer.trim().length > 0) {
|
|
268
|
+
// newBlock.footer = new NdTranslatableText(this.ns, `${blockId}.footer`, this.blockContent.footer);
|
|
256
269
|
// }
|
|
257
|
-
// console.log("added block", newBlock)
|
|
258
270
|
return newBlock;
|
|
259
271
|
}
|
|
272
|
+
parseCallToAction(blockId, ctaHtml, ci) {
|
|
273
|
+
const cta = new NdCallToAction();
|
|
274
|
+
// console.log("parsing callToAction", ctaHtml.innerHTML, ctaHtml.rawTagName, ctaHtml.attributes, ctaHtml.childNodes.map(cn => cn.rawTagName));
|
|
275
|
+
// const res = callToActionPattern.exec(ctaHtml.innerHTML)
|
|
276
|
+
const cnRef = ctaHtml.childNodes.find(cn => cn.rawTagName === "a");
|
|
277
|
+
let url = "n/a";
|
|
278
|
+
let title = ctaHtml.innerHTML;
|
|
279
|
+
if (cnRef) {
|
|
280
|
+
url = cnRef.getAttribute("href") || url;
|
|
281
|
+
title = cnRef.textContent;
|
|
282
|
+
}
|
|
283
|
+
cta.ctaUrl = new NdTranslatableText(this.ns, `${blockId}.callToActions.${ci}.ctaUrl`, url);
|
|
284
|
+
cta.ctaTitle = new NdTranslatableText(this.ns, `${blockId}.callToActions.${ci}.ctaTitle`, title);
|
|
285
|
+
// console.log("returnin created cta: ", cta)
|
|
286
|
+
return cta;
|
|
287
|
+
}
|
|
260
288
|
parseParagraph(blockId, p, pi) {
|
|
261
289
|
if (p.rawTagName === "p" || p.rawTagName === "blockquote") {
|
|
262
290
|
return new NdTranslatableText(this.ns, `${blockId}.paragraphs.${pi}`, p.innerHTML);
|
|
@@ -341,23 +369,22 @@ export function parseMarkdownAsContent(fileContents, contentLng, ns) {
|
|
|
341
369
|
currentBlock.addParagraph(childNode);
|
|
342
370
|
}
|
|
343
371
|
else if (childNode.rawTagName === "p" || childNode.rawTagName === "blockquote") {
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
currentBlock.blockContent.footer = rFooter[1];
|
|
347
|
-
}
|
|
348
|
-
else if (childNode.childNodes && childNode.childNodes.filter(cn => cn.rawTagName == "img").length > 0) {
|
|
372
|
+
if (childNode.childNodes &&
|
|
373
|
+
childNode.childNodes.filter(cn => cn.rawTagName == "img").length > 0) {
|
|
349
374
|
childNode.childNodes.filter(cn => cn.rawTagName == "img")
|
|
350
375
|
.forEach((cn) => {
|
|
351
|
-
const l = cn;
|
|
352
|
-
// if (l.getAttribute("alt") === "bg-image") {
|
|
353
|
-
// currentBlock.blockContent.bgImage = l;
|
|
354
|
-
// } else {
|
|
355
376
|
currentBlock.addImage(cn);
|
|
356
|
-
// }
|
|
357
377
|
});
|
|
358
378
|
}
|
|
359
379
|
else {
|
|
360
|
-
|
|
380
|
+
const rCta = callToActionPattern.exec(childNode.innerHTML);
|
|
381
|
+
if (rCta) {
|
|
382
|
+
// console.log("cta childNode", childNode)
|
|
383
|
+
currentBlock.addCallToAction(childNode);
|
|
384
|
+
}
|
|
385
|
+
else {
|
|
386
|
+
currentBlock.addParagraph(childNode);
|
|
387
|
+
}
|
|
361
388
|
}
|
|
362
389
|
}
|
|
363
390
|
else if (childNode.rawTagName === "figure") {
|
package/package.json
CHANGED
|
@@ -4,6 +4,10 @@ export declare class NdContentImage {
|
|
|
4
4
|
title?: NdTranslatableText;
|
|
5
5
|
alt?: NdTranslatableText;
|
|
6
6
|
}
|
|
7
|
+
export declare class NdCallToAction {
|
|
8
|
+
ctaUrl: NdTranslatableText;
|
|
9
|
+
ctaTitle?: NdTranslatableText;
|
|
10
|
+
}
|
|
7
11
|
export declare class NdTranslatableText {
|
|
8
12
|
key: string;
|
|
9
13
|
ns: string;
|
|
@@ -38,12 +42,12 @@ export declare class NdContentBlock {
|
|
|
38
42
|
h4?: NdTranslatableText;
|
|
39
43
|
h5?: NdTranslatableText;
|
|
40
44
|
h6?: NdTranslatableText;
|
|
41
|
-
|
|
45
|
+
callToActions: NdCallToAction[];
|
|
42
46
|
paragraphs: (NdTranslatableText | NdList | NdCode)[];
|
|
43
47
|
images: NdContentImage[];
|
|
44
48
|
htmlElements: {
|
|
45
49
|
htmlElem: HTMLElement;
|
|
46
|
-
translatedText: (NdTranslatableText | NdContentImage | NdList | NdCode);
|
|
50
|
+
translatedText: (NdTranslatableText | NdContentImage | NdList | NdCode | NdCallToAction);
|
|
47
51
|
}[];
|
|
48
52
|
constructor(id: string, ns: string, lng: string);
|
|
49
53
|
getByKey(key: string, ns: string): string | undefined;
|
package/types/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { NdContentImage, NdTranslatableText, NdList, NdCode, NdContentBlock } from "./content/nd-content";
|
|
1
|
+
import { NdContentImage, NdTranslatableText, NdList, NdCode, NdCallToAction, NdContentBlock } from "./content/nd-content";
|
|
2
2
|
import { NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy, NdDefaultThemeName } from "./skin/nd-skin";
|
|
3
3
|
import { RenderingPageProps, RenderingPriority } from "./core/rendering-page-props";
|
|
4
4
|
import { RenderingPage } from "./core/rendering-page";
|
|
@@ -8,7 +8,7 @@ import { ThemeStyle } from "./theme-utils/theme-style";
|
|
|
8
8
|
import { ExtendedThemeStyle } from "./theme-utils/extended-theme-style";
|
|
9
9
|
import { ImageStyle } from "./theme-utils/image-style";
|
|
10
10
|
import { RowStyle } from "./theme-utils/row-style";
|
|
11
|
-
export { NdContentImage, NdTranslatableText, NdList, NdCode, NdContentBlock, NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy, type NdDefaultThemeName, type NdImageProps };
|
|
11
|
+
export { NdContentImage, NdTranslatableText, NdList, NdCode, NdCallToAction, NdContentBlock, NdSkinComponent, NdRow, NdPageSkin, NdSkinComponentProps, NdContentSelector, NdComponentDefinition, NdThemeHierarchy, type NdDefaultThemeName, type NdImageProps };
|
|
12
12
|
export { RenderingPageProps, RenderingPriority, RenderingPage };
|
|
13
13
|
export { mergeTheme, type ThemeStyle, type ExtendedThemeStyle, type ImageStyle };
|
|
14
14
|
export type { I18nextProvider, AsyncFunctionComponent, ImageProvider };
|