@obinexusltd/obix-component-fileupload

The ObixFileUpload form component — a drag-and-drop file field with per-file <progress> bars, maxSize rejection, an overall progress figure, and a visually-hidden native input.

Split out of @obinexusltd/obix-component-forms as an independent package.

npm install @obinexusltd/obix-component-fileupload

Zero dependencies. Data-Oriented: createX(config) returns { name, state, actions, render }. Actions are pure (state, …args) => newState; render(state) is deterministic, HTML-escaped markup. renderX(config, overrides?) renders in one call.

API

import { createFileUpload, renderFileUpload } from "@obinexusltd/obix-component-fileupload";

const el = createFileUpload({ label: "…" /* see docs/02-usage.md */ });
el.render(el.state);              // initial HTML
renderFileUpload({ label: "…" });      // same, one call

// actions are pure — feed state through them and re-render
const next = el.actions.addFiles(el.state, /* … */);
el.render(next);

Actions — addFiles(state, files) · removeFile(state, i) · setProgress(state, i, pct) · startUpload · completeUpload · setDragging(state, bool) · clearErrors

Documentation

| # | Guide | |---|-------| | 01 | Overview | | 02 | Usage & API | | 03 | Accessibility | | 04 | State & rendered HTML |

Related

Part of the OBIX form set: @obinexusltd/obix-component-``input · checkbox · radiogroup · select · textarea · form · datepicker · fileupload.

License

MIT — OBINexus Computing