67 lines
1.7 KiB
TypeScript

import type { FlatTemplatable } from "tempstream";
import { TempstreamJSX } from "tempstream";
import type {
ComponentToHTMLArgs,
ExtractStructuredComponentArgumentsParsed,
JDDContext,
} from "@sealcode/jdd";
import { Component, ComponentArguments } from "@sealcode/jdd";
const component_arguments = {
color: new ComponentArguments.Enum(["transparent", "normal", "accent", "accent2"]),
content: new ComponentArguments.Markdown(),
side_content: new ComponentArguments.NestedComponent(),
} as const;
export class Tekst extends Component<typeof component_arguments> {
getArguments() {
return component_arguments;
}
getTitle(
_: JDDContext,
args: ExtractStructuredComponentArgumentsParsed<typeof component_arguments>
) {
return args.content.slice(0, 20) + "..." || null;
}
getCSSClumps(
jdd_context: JDDContext,
args: ExtractStructuredComponentArgumentsParsed<typeof component_arguments>
) {
const result = args?.side_content?.getCSSClumps(jdd_context) || [];
return result;
}
toHTML({
args: { color, content, side_content },
classes,
jdd_context,
index,
}: ComponentToHTMLArgs<typeof component_arguments>): FlatTemplatable {
const { render_markdown, language } = jdd_context;
return (
<div
class={["tekst markdown", ...classes, `tekst--color-${color}`]}
style={`--jdd-index: ${index}`}
>
{side_content.isEmpty() ? (
""
) : (
<div class="side-content">{side_content.render(jdd_context)}</div>
)}
{render_markdown(language, content)}
</div>
);
}
getHeadings(
_context: JDDContext,
args: ExtractStructuredComponentArgumentsParsed<{
readonly content: ComponentArguments.Markdown;
}>
) {
return this.getArguments().content.extractHeadings(args.content);
}
}