Uploads
Preview Available in release assets
Submit files through native multipart forms with optional server progress fragments.
Server contract
Use .thin-uploads on a stable identified region. Datastar 1.0.2 may request server fragments; the application owns permissions, validation, idempotency, persistence, and reconciliation.
Server-rendered content, real links, native controls, and ordinary submitted forms preserve the complete workflow without Datastar or JavaScript.
Uploads primary example
<form class="thin-uploads" id="document-upload" action="/api/advanced/dashboard?view=upload" method="post" enctype="multipart/form-data">
<h2>Upload documents</h2>
<label>Files<input name="documents" type="file" multiple required>
</label>
<button class="thin-button">Upload</button>
<p>Native multipart submission is canonical; the server validates type, size, authorization, and storage.</p>
</form>Show code
<form class="thin-uploads" id="document-upload" action="/api/advanced/dashboard?view=upload" method="post" enctype="multipart/form-data">
<h2>Upload documents</h2>
<label>Files<input name="documents" type="file" multiple required>
</label>
<button class="thin-button">Upload</button>
<p>Native multipart submission is canonical; the server validates type, size, authorization, and storage.</p>
</form>Anatomy
- Stable server-owned region
- Heading and current status
- Native links or form controls
- Server result and error text
Variants and sizes
- Single file
- Multiple files
Gallery coverage: No structured variant fixtures are published yet; the primary example above is the only verified production markup.
States and difficult content
Rendered fixtures exercise authored content and constrained layouts with the same production assets.
- Idle
- Pending
- Empty
- Partial success
- Error
- Forbidden
- Long content
- Narrow container
- Reconnect
Structured state fixtures are not published for this item yet.
Interaction and keyboard behavior
Native multipart upload is canonical. The server owns limits, scanning, storage, failure, retry identity, and completion; optional progress never claims persistence early.
Accessibility
Use semantic headings, native controls, explicit labels, selected counts, text status/error messages, and predictable focus. Announce completed server changes, not every intermediate client event; preserve source and focus order across patches.
- Contract
LIVE- Basis
- Native forms, links, file inputs, status regions, and action buttons; async semantics must be chosen per update
- Evidence
tests/unit/library/dashboard-recipes.test.ts
API
Use .thin-uploads on a stable identified region. Datastar 1.0.2 may request server fragments; the application owns permissions, validation, idempotency, persistence, and reconciliation.
Behavior tier: datastar-required
Structured host, property, and example tables are not authored for this item yet. Use the summary above and the primary example.
Fallback
Server-rendered content, real links, native controls, and ordinary submitted forms preserve the complete workflow without Datastar or JavaScript.
Assets and dependencies
/components.css
Dependencies: datastar@1.0.2
Source: packages/ui/src/items/dashboard/style.ts
Composition
Derived from the examples and style specs, not authored.