69 lines
1.4 KiB
TypeScript
69 lines
1.4 KiB
TypeScript
|
import { Html, debug_render } from "./html.ts";
|
||
|
import { Component } from "./jsx/jsx-runtime.ts";
|
||
|
|
||
|
const wheel = (...items: Html[]): Html => (
|
||
|
<div class="wheel">
|
||
|
{...items.map(i => <div class="wheel-item">{i} people</div>)}
|
||
|
</div>
|
||
|
);
|
||
|
|
||
|
const Take: Component = ({ subjects, objects, adjectives }, _) => (
|
||
|
<div class="take">
|
||
|
{wheel(...subjects)} who eat {wheel(...objects)} are{" "}
|
||
|
{wheel(...adjectives)}
|
||
|
</div>
|
||
|
);
|
||
|
|
||
|
// might want to have the final item be seperate
|
||
|
debug_render(
|
||
|
<Take
|
||
|
subjects={[
|
||
|
"poor",
|
||
|
"fat",
|
||
|
"dumb",
|
||
|
"tall",
|
||
|
"short",
|
||
|
"poor",
|
||
|
"fat",
|
||
|
"dumb",
|
||
|
"tall",
|
||
|
"hot",
|
||
|
]}
|
||
|
objects={[
|
||
|
"apples",
|
||
|
"bread",
|
||
|
"pasta",
|
||
|
"candy",
|
||
|
"rice",
|
||
|
"beans",
|
||
|
"apples",
|
||
|
"bread",
|
||
|
"candy",
|
||
|
"rice",
|
||
|
"beans",
|
||
|
"apples",
|
||
|
"bread",
|
||
|
"pasta",
|
||
|
"candy",
|
||
|
"rice",
|
||
|
"croissants",
|
||
|
]}
|
||
|
adjectives={[
|
||
|
"vibes",
|
||
|
"mean",
|
||
|
"dumb",
|
||
|
"cool",
|
||
|
"hot",
|
||
|
"stupid",
|
||
|
"funny",
|
||
|
"vibes",
|
||
|
"mean",
|
||
|
"dumb",
|
||
|
"cool",
|
||
|
"hot",
|
||
|
"stupid",
|
||
|
"dangerous",
|
||
|
]}
|
||
|
/>
|
||
|
);
|