Page MenuHomeSealhub
Files F21590065

component-input-file.ts
No OneTemporary
Actions

Authored By
Unknown
Size
1 KB
Referenced Files
None
Subscribers
None

component-input-file.ts
View Options

import type { Context } from "koa";
import { PathFilePointer, type FilePointer } from "@sealcode/file-manager";
import type { File, JDDContext } from "@sealcode/jdd";
import type { StatefulPage } from "@sealcode/sealgen";
import type { ComponentPreviewActions } from "../component-preview-actions.js";
import type { JDDPageState } from "../jdd-page.js";
import { tempstream } from "tempstream";
import { printArgPath } from "./print-arg-path.js";
import { htmlEscape } from "escape-goat";
export function ComponentInputFile<State extends JDDPageState>({
arg_path,
arg,
value,
ctx,
page,
state,
makeJDDContext,
}: {
state: State;
arg_path: string[];
arg: File;
value: FilePointer | null;
page: StatefulPage<JDDPageState, typeof ComponentPreviewActions>;
ctx: Context;
makeJDDContext: (ctx: Context) => JDDContext;
}): JSX.Element {
const jdd_context = makeJDDContext(ctx);
console.log({ value });
return tempstream /* HTML */ `<div
style="margin-bottom: 10px display: flex; align-items: center; column-gap: 10px; flex-flow: row;"
>
<label style="display: flex; flex-flow: row; column-gap: 10px;">
${arg_path.at(-1) || ""}
<span
>${value instanceof PathFilePointer
? value.original_filename
: ""}</span
>
<input
type="file"
name="${`$${printArgPath(arg_path)}.new`}"
value=""
autocomplete="off"
data-action="change->input-image-preview#handleChange"
${arg.hasParent("list") ? "multiple" : ""}
/>
</label>
<div>
<input
type="hidden"
name="${`$${printArgPath(arg_path)}.old`}"
value="${htmlEscape(value?.token || "")}"
autocomplete="off"
/>
</div>
${page.makeActionButton(
state,
{
action: "remove_file",
label: "❌",
},
arg_path
)}
</div>`;
}

File Metadata

Mime Type
application/javascript
Expires
Mon, Nov 9, 13:47 (5 h, 8 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
1182229
Default Alt Text
component-input-file.ts (1 KB)

Event Timeline