Page MenuHomeSealhub
Files F969875

No OneTemporary
Actions

View Options

diff --git a/src/component-arguments/markdown.ts b/src/component-arguments/markdown.ts
index eb6c0fa..69adbaa 100644
--- a/src/component-arguments/markdown.ts
+++ b/src/component-arguments/markdown.ts
@@ -1,54 +1,54 @@
import { is, predicates } from "@sealcode/ts-predicates";
import { JDDContext } from "../jdd-context.js";
import { MaybePromise } from "../utils/util-types.js";
import { StringBasedArgument } from "./string-based-argument.js";
import { Component, JDDHeading } from "../component.js";
import { Tokens, marked } from "marked";
import slug from "slug";
export class MarkdownArgument extends StringBasedArgument<string> {
getTypeName() {
return "markdown";
}
getEmptyValue() {
return "";
}
countWords(value: string): number {
return value.toString().split(" ").length;
}
example_values = [
`*Lorem ipsum* dolor sit amet, **consectetur adipiscing elit**, sed [do eiusmod](#) tempor incididunt ut labore et dolore magna aliqua. Posuere lorem ipsum dolor sit amet consectetur adipiscing elit. Porttitor massa id neque aliquam vestibulum. Turpis egestas pretium aenean pharetra.
Ullamcorper dignissim cras tincidunt lobortis feugiat vivamus at augue. Tellus cras adipiscing enim eu turpis egestas. Sagittis id consectetur purus ut faucibus pulvinar elementum. Pulvinar etiam non quam lacus suspendisse. Viverra adipiscing at in tellus integer feugiat scelerisque. Ultricies leo integer malesuada nunc vel risus commodo. Morbi leo urna molestie at elementum. Justo laoreet sit amet cursus sit amet. `,
`**Duis ut diam quam nulla**.
Lectus mauris *ultrices* eros [in cursus turpis massa](#).
Pulvinar neque laoreet suspendisse interdum consectetur. Orci phasellus egestas tellus rutrum tellus.`,
];
parseFormInput(
_: JDDContext,
input: unknown
): MaybePromise<string | string[] | null> {
if (is(input, predicates.string)) {
return input;
} else {
return null;
}
}
extractHeadings(value: string): JDDHeading[] {
return marked
.lexer(value)
.filter((t) => t.type == "heading")
.map((t: Tokens.Heading) => ({
text: t.text,
level: t.depth,
- slug: slug(t.text),
+ id: slug(t.text),
}));
}
}
diff --git a/src/components/markdown.test.ts b/src/components/markdown.test.ts
index 4af90ff..aedf6e9 100644
--- a/src/components/markdown.test.ts
+++ b/src/components/markdown.test.ts
@@ -1,79 +1,79 @@
import { JDD } from "../jdd.js";
import { Registry } from "../registry.js";
import { Markdown } from "./markdown.js";
import {
documentContainerFromParsed,
makeSimpleEnglishJDDContext,
} from "../index.js";
import assert from "assert";
import { FileManager } from "@sealcode/file-manager";
import { formatWithPrettier } from "../test-utils/prettier.js";
describe("markdown component", () => {
it("renders as a part of a JDD", async () => {
const document = documentContainerFromParsed([
{ component_name: "markdown", args: { markdown: `# Hello World` } },
{
component_name: "markdown",
args: { markdown: `Multiple components ftw` },
},
]);
const registry = new Registry();
registry.add("markdown", Markdown);
const result = await new JDD(
registry,
makeSimpleEnglishJDDContext(
new FileManager("/tmp", "/uploaded_files")
),
document
).render();
assert.strictEqual(
await formatWithPrettier(result, "html"),
// note the soft hyphens
await formatWithPrettier(
/* HTML */ `<section class="jdd-component component-number-0">
<h1 id="hello-world">
<a class="anchor" href="#hello-world">
<span class="markdown-header-link"></span>
</a>
Hello World
</h1>
</section>
<section class="jdd-component component-number-1">
<p>Mul­ti­ple com­po­nents ftw</p>
</section>`,
"html"
)
);
});
it("properly returns the headings", () => {
const headings = new Markdown().getHeadings(
makeSimpleEnglishJDDContext(
new FileManager("/tmp", "/uploaded_files")
),
{
markdown: `# Heading level 1
some content
## Heading level 2
some content as well
# Another heading level 1`,
}
);
assert.deepStrictEqual(headings, [
- { text: "Heading level 1", level: 1, slug: "heading-level-1" },
- { text: "Heading level 2", level: 2, slug: "heading-level-2" },
+ { text: "Heading level 1", level: 1, id: "heading-level-1" },
+ { text: "Heading level 2", level: 2, id: "heading-level-2" },
{
text: "Another heading level 1",
level: 1,
- slug: "another-heading-level-1",
+ id: "another-heading-level-1",
},
]);
});
});
diff --git a/src/components/markdown.ts b/src/components/markdown.ts
index b7ac50f..0c63375 100644
--- a/src/components/markdown.ts
+++ b/src/components/markdown.ts
@@ -1,32 +1,32 @@
import { FlatTemplatable, tempstream } from "tempstream";
-import { Component, ComponentToHTMLArgs } from "../component.js";
+import { Component, ComponentToHTMLArgs, JDDHeading } from "../component.js";
import { MarkdownArgument } from "../component-arguments/markdown.js";
import { ExtractStructuredComponentArgumentsParsed } from "../index.js";
import { JDDContext } from "../jdd-context.js";
const component_arguments = { markdown: new MarkdownArgument() } as const;
export class Markdown extends Component<typeof component_arguments> {
getArguments() {
return component_arguments;
}
toHTML({
args: { markdown },
classes,
jdd_context: { render_markdown, language },
}: ComponentToHTMLArgs<typeof component_arguments>): FlatTemplatable {
return tempstream`<section class="${classes.join(" ")}">
${render_markdown(language, markdown)}
</section>`;
}
getHeadings(
context: JDDContext,
args: ExtractStructuredComponentArgumentsParsed<{
readonly markdown: MarkdownArgument;
}>
- ): { text: string; level: number; id?: string | undefined }[] {
+ ): JDDHeading[] {
return this.getArguments().markdown.extractHeadings(args.markdown);
}
}
diff --git a/src/jdd.test.ts b/src/jdd.test.ts
index 30e99c9..012267a 100644
--- a/src/jdd.test.ts
+++ b/src/jdd.test.ts
@@ -1,39 +1,39 @@
import assert from "assert";
import { Markdown } from "./components/markdown.js";
import { JDD } from "./jdd.js";
import { Registry } from "./registry.js";
import { simplestContext } from "./test-utils/simplest-context.js";
describe("jdd", () => {
it("properly extracts headings from multiple components", () => {
const registry = new Registry();
registry.add("markdown", Markdown);
const jdd = JDD.fromParsed(registry, simplestContext(), [
{
component_name: "markdown",
args: {
markdown: `
# heading one
## heading two
### heading three`,
},
},
{
component_name: "markdown",
args: {
markdown: `
# heading four
`,
},
},
]);
assert.deepEqual(jdd.getHeadings(), [
- { text: "heading one", level: 1, slug: "heading-one" },
- { text: "heading two", level: 2, slug: "heading-two" },
- { text: "heading three", level: 3, slug: "heading-three" },
- { text: "heading four", level: 1, slug: "heading-four" },
+ { text: "heading one", level: 1, id: "heading-one" },
+ { text: "heading two", level: 2, id: "heading-two" },
+ { text: "heading three", level: 3, id: "heading-three" },
+ { text: "heading four", level: 1, id: "heading-four" },
]);
});
});

File Metadata

Mime Type
text/x-diff
Expires
Sun, Nov 24, 02:05 (22 h, 26 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
548078
Default Alt Text
(7 KB)

Event Timeline