Page MenuHomeSealhub

components.sreact.tsx
No OneTemporary

components.sreact.tsx

import { documentContainerFromParsed, renderEarlyAssets } from "@sealcode/jdd";
import type { BaseContext } from "koa";
import type { Templatable } from "tempstream";
import { tempstream, TempstreamJSX } from "tempstream";
import type { Stringifiable } from "tempstream/@types/stringify.js";
import html, { defaultHead } from "../html.js";
import { registry } from "../jdd-components/components.js";
import { makeJDDContext } from "../jdd-context.js";
import { ComponentPreviewActions } from "./component-preview/component-preview-actions.js";
import type { JDDPageState } from "./component-preview/jdd-page.js";
import JDDPage from "./component-preview/jdd-page.js";
export const actionName = "Components";
export default new (class JddcomponentDebuggerPage extends JDDPage {
renderParameterButtons(state: JDDPageState): Stringifiable {
const all_components = super.getRegistryCompoments();
return (
<div>
<input type="submit" value="Preview" />
<select
name="component"
onchange={this.makeActionCallback("change_component")}
autocomplete="off"
>
{Object.entries(all_components).map(([name]) => (
<option
value={name}
selected={name == state.components[0].component_name}
>
{name}
</option>
))}
</select>
{this.makeActionButton(state, "randomize_args", "0")}
</div>
);
}
actions = ComponentPreviewActions;
async getInitialState(ctx: BaseContext) {
const [component_name, component] = Object.entries(registry.getAll())[0];
const initial_state = {
components: [
{
component_name: component_name,
args: await component.getExampleValues(makeJDDContext(ctx)),
},
],
};
return initial_state;
}
wrapInLayout(
ctx: BaseContext,
content: Templatable,
state: JDDPageState
): Templatable {
return html(
ctx,
"Components",
content,
{
morphing: true,
preserveScroll: true,
autoRefreshCSS: true,
navbar: () => ``,
},
(...args) =>
tempstream`${defaultHead(...args)}${renderEarlyAssets(
registry,
documentContainerFromParsed(state.components),
makeJDDContext(ctx)
)}`
);
}
containerSizes = ["320", "600", "800", "1024", "1300", "1920"];
})();

File Metadata

Mime Type
text/x-java
Expires
Fri, Jul 4, 08:02 (5 h, 7 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
797014
Default Alt Text
components.sreact.tsx (2 KB)

Event Timeline