table.jdd.tsx
No OneTemporary
Actions

Size

1 KB

Referenced Files

None

Subscribers

None

table.jdd.tsx
View Options

	import { TempstreamJSX } from "tempstream";
	import type { ComponentToHTMLArgs } from "@sealcode/jdd";
	import { Component, ComponentArguments, isTableHeader } from "@sealcode/jdd";

	const component_arguments = {
	table: new ComponentArguments.Table(
	new ComponentArguments.ShortText(),
	new ComponentArguments.Structured({
	content: new ComponentArguments.ShortText().setExampleValues([""]),
	})
	),
	} as const;

	export class Table extends Component<typeof component_arguments> {
	getArguments() {
	return component_arguments;
	}

	toHTML({
	args: { table },
	classes,
	index,
	}: ComponentToHTMLArgs<typeof component_arguments>) {
	return (
	<div class={["table", ...classes]} style={`--jdd-index: ${index}`}>
	<table>
	<tbody>
	{table.rows.map((row) =>
	isTableHeader(row) ? (
	<tr>
	<th
	colspan={this.getArguments()
	.table.getColumnsCount(table)
	.toString()}
	>
	{row.header_content}
	</th>
	</tr>
	) : (
	<tr>
	{row.cells.map(({ content }) => (
	<td style>{content}</td>
	))}
	</tr>
	)
	)}
	</tbody>
	</table>
	</div>
	);
	}
	}