@lerianstudio/sindarian-ui 2.0.0-beta.24 → 2.0.0-beta.26

package/dist/components/ui/file-upload/index.js

@@ -1,574 +1 @@
-'use client';
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MultipleFileUpload = exports.FileUpload = void 0;
-exports.validateFile = validateFile;
-exports.humanizeSize = humanizeSize;
-const jsx_runtime_1 = require("react/jsx-runtime");
-/**
- * FileUpload — a controlled "pick a file, hand it back" primitive. The defining
- * job: select one file (by click, keyboard, or drag-and-drop), validate it
- * against an accept filter + a byte ceiling, and emit `{ file, text }`.
- *
- * `readAs` decides whether the bytes are decoded on the way through. `'text'`
- * (the default) reads UTF-8 via FileReader.readAsText, which is what a PEM/CSV
- * host wants. `'none'` hands the `File` over untouched and is the only mode a
- * BINARY file can use: a PDF, XLSX or PFX put through readAsText decodes into
- * replacement-character garbage, and that garbage string is then retained for
- * as long as the host holds the value — 20 MiB of PDF became a useless 20 MiB
- * string, and the host still had to read the file a second time to get at the
- * real bytes.
- *
- * The real `<input type="file">` IS the accessible control: it is `sr-only`
- * (visually hidden) but focusable and labelable — never `aria-hidden`, never
- * `tabIndex={-1}`. The FormControl-injected ARIA (`id`, `aria-invalid`,
- * `aria-required`, `aria-describedby`) flows onto the input via `...rest`, so
- * react-hook-form's `field.ref` (forwarded here) focuses the real control on
- * error and FormLabel's `htmlFor` names it. The styled zone is a plain `<div>`
- * with a click handler, NOT a wrapping `<label>`: a label would contribute its
- * text to the input's accessible name and double-name it alongside a field's
- * own label. Keyboard users Tab to the focusable input and Enter/Space opens
- * the picker natively, so no key proxy is needed. Drag-and-drop is an
- * enhancement layered on the zone.
- *
- * Errors are DUAL by design and both announced: size/type/read failures are
- * the primitive's own concern, surfaced inline via `role="alert"` so it works
- * standalone outside a form; a form wrapper (FileUploadField) adds the
- * react-hook-form validation surface separately. A rejected pick never writes
- * a value, so it cannot masquerade as valid. `accept` is validated against
- * BOTH extension and MIME because the native `accept` attribute is only a
- * browser hint and is bypassable via drag-drop.
- *
- * A host that already announces the rejection itself — a toast in its own
- * locale, driven off `onError` — silences this one by returning nothing from
- * `labels.error`. Two announcements for one event, in two languages, is the
- * accessibility defect; the wording is not.
- */
-const React = __importStar(require("react"));
-const lucide_react_1 = require("lucide-react");
-const icon_button_1 = require("../../../components/ui/icon-button");
-const utils_1 = require("../../../lib/utils");
-/**
- * Validate a chosen file against an accept filter and a byte ceiling. Exported
- * so hosts can pre-validate before handing a file over. `accept` is matched
- * against BOTH the filename extension and the MIME type — a `.pem`/`text/plain`
- * style filter passes if EITHER matches a token. When `accept` is omitted, any
- * type passes. Returns the first error, or null when the file is acceptable.
- */
-function validateFile(file, opts) {
-    const { accept, maxSizeBytes } = opts;
-    if (typeof maxSizeBytes === 'number' && file.size > maxSizeBytes) {
-        return { kind: 'too-large', file, maxSizeBytes };
-    }
-    if (accept && accept.trim() !== '' && !matchesAccept(file, accept)) {
-        return { kind: 'wrong-type', file, accept };
-    }
-    return null;
-}
-/**
- * Does the file satisfy a comma-separated accept list? Each token is either a
- * dot-extension (`.pem`, case-insensitive against the filename), an exact MIME
- * (`text/plain`), or a MIME wildcard (`text/*`). True if ANY token matches.
- */
-function matchesAccept(file, accept) {
-    const name = file.name.toLowerCase();
-    const mime = file.type.toLowerCase();
-    return accept
-        .split(',')
-        .map((t) => t.trim().toLowerCase())
-        .filter((t) => t !== '')
-        .some((token) => {
-        if (token.startsWith('.'))
-            return name.endsWith(token);
-        if (token.endsWith('/*'))
-            return mime.startsWith(token.slice(0, -1));
-        return mime === token;
-    });
-}
-/**
- * Humanize a byte count for the selected-file chip. Binary units, 1 decimal.
- * Exported so a `labels.error` override can format `maxSizeBytes` exactly the
- * way the chip and the default message do, instead of re-deriving binary units.
- */
-function humanizeSize(bytes) {
-    if (bytes < 1024)
-        return `${bytes} B`;
-    const units = ['KB', 'MB', 'GB'];
-    let size = bytes / 1024;
-    let unit = 0;
-    while (size >= 1024 && unit < units.length - 1) {
-        size /= 1024;
-        unit += 1;
-    }
-    return `${size.toFixed(1)} ${units[unit]}`;
-}
-/** The default English announcement for each rejection kind. */
-function defaultErrorMessage(error) {
-    switch (error.kind) {
-        case 'too-large':
-            return `File is too large (max ${humanizeSize(error.maxSizeBytes)}).`;
-        case 'wrong-type':
-            return `File type not allowed (expected ${error.accept}).`;
-        case 'read-failed':
-            return 'Could not read the file.';
-    }
-}
-exports.FileUpload = React.forwardRef(function FileUpload({ accept, maxSizeBytes, value, readAs = 'text', labels, onSelect, onError, disabled = false, id, className, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, 'aria-describedby': ariaDescribedby, 'aria-label': ariaLabel, ...rest }, ref) {
-    const internalRef = React.useRef(null);
-    React.useImperativeHandle(ref, () => internalRef.current);
-    const reactId = React.useId();
-    const inputId = id ?? reactId;
-    const errorId = `${inputId}-file-upload-error`;
-    const [dragActive, setDragActive] = React.useState(false);
-    const [error, setError] = React.useState(null);
-    // The destructive styling is driven by the consumer's aria-invalid OR the
-    // component's own validation/read error — a self-detected bad pick must read
-    // as invalid even outside a form.
-    const invalid = ariaInvalid || error !== null;
-    // Resolve the announcement BEFORE deciding whether the alert exists: a
-    // consumer that returns nothing is opting out of this surface entirely,
-    // and an association pointing at an unrendered node is worse than none.
-    const resolved = error
-        ? labels?.error
-            ? labels.error(error)
-            : defaultErrorMessage(error)
-        : null;
-    const errorText = resolved ? resolved : null;
-    // Radix Slot OVERWRITES aria-describedby (it does not merge), so merge the
-    // primitive's own role=alert error id with the FormControl-injected one so
-    // both associations coexist on the input. A plain join, never `cn` —
-    // tailwind-merge treats these as class names and would drop an id that
-    // happens to look like a conflicting utility.
-    const describedBy = [ariaDescribedby, errorText ? errorId : undefined]
-        .filter(Boolean)
-        .join(' ') || undefined;
-    // Last-resolved-wins: a slow read for pick A must not overwrite a newer
-    // pick B. Track the active reader and abort any in-flight read first.
-    const readerRef = React.useRef(null);
-    const handleFile = (file) => {
-        if (!file)
-            return;
-        readerRef.current?.abort();
-        const validationError = validateFile(file, { accept, maxSizeBytes });
-        if (validationError) {
-            setError(validationError);
-            onError?.(validationError);
-            return;
-        }
-        // Binary path: no decode, no reader, no retained garbage string. The
-        // stale-rejection clear still has to happen here — the alert is this
-        // component's own state and a good pick must retire it.
-        if (readAs === 'none') {
-            readerRef.current = null;
-            setError(null);
-            onSelect({ file, text: '' });
-            return;
-        }
-        const reader = new FileReader();
-        readerRef.current = reader;
-        reader.onload = () => {
-            if (readerRef.current !== reader)
-                return;
-            readerRef.current = null;
-            setError(null);
-            onSelect({ file, text: String(reader.result ?? '') });
-        };
-        reader.onerror = () => {
-            if (readerRef.current !== reader)
-                return;
-            readerRef.current = null;
-            const readError = { kind: 'read-failed', file };
-            setError(readError);
-            onError?.(readError);
-        };
-        reader.readAsText(file);
-    };
-    const onInputChange = (event) => {
-        const file = event.target.files?.[0];
-        // Release the FileList the moment it has been read. The browser fires
-        // `change` only when the selection DIFFERS from what the input already
-        // holds, so keeping it meant re-picking the same file after a host reset
-        // (or retrying a rejected one) was silently a no-op — the picker opened,
-        // the user chose the file, and nothing happened.
-        event.target.value = '';
-        handleFile(file);
-    };
-    // `preventDefault` FIRST, and unconditionally. Returning before it does
-    // not merely refuse the drop: nothing cancels the browser's OWN action for
-    // a dropped file, so the window navigates to the file and whatever the
-    // page held unsaved is gone. A zone the host turned off has to swallow the
-    // drop, never hand it back to the browser. `dropEffect` says so to the
-    // cursor while the file is still in the air.
-    const onDragOver = (event) => {
-        event.preventDefault();
-        if (disabled) {
-            event.dataTransfer.dropEffect = 'none';
-            return;
-        }
-        setDragActive(true);
-    };
-    const onDragLeave = (event) => {
-        event.preventDefault();
-        setDragActive(false);
-    };
-    const onDrop = (event) => {
-        event.preventDefault();
-        // Cleared before the gate, not after, so a host that disables the zone
-        // mid-drag does not leave it highlighted for a drag that can no longer
-        // land.
-        setDragActive(false);
-        if (disabled)
-            return;
-        handleFile(event.dataTransfer.files?.[0]);
-    };
-    // Mouse convenience only: clicking the styled zone opens the picker. A
-    // click that ORIGINATED on the input already opens it natively and bubbles
-    // up to here — re-firing .click() would open the picker twice, so ignore it.
-    const openPicker = (event) => {
-        if (disabled || event.target === internalRef.current)
-            return;
-        internalRef.current?.click();
-    };
-    const clear = () => {
-        readerRef.current?.abort();
-        readerRef.current = null;
-        setError(null);
-        onSelect(null);
-        // Reset the native input so re-picking the same filename fires onChange.
-        if (internalRef.current)
-            internalRef.current.value = '';
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('space-y-2', className), children: [(0, jsx_runtime_1.jsxs)("div", { onClick: openPicker, onDragOver: onDragOver, onDragLeave: onDragLeave, onDrop: onDrop, className: (0, utils_1.cn)('border-input-border bg-card focus-within:ring-ring focus-within:ring-offset-background aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-within:ring-destructive flex w-full items-center gap-3 rounded-md border px-3 py-4 text-sm shadow-xs transition-colors focus-within:ring-2 focus-within:ring-offset-1 focus-within:outline-none', dragActive &&
-                    'border-ring ring-ring ring-offset-background ring-2 ring-offset-1', disabled
-                    ? 'border-muted bg-muted/30 cursor-not-allowed shadow-none'
-                    : 'cursor-pointer'), "aria-invalid": invalid || undefined, children: [(0, jsx_runtime_1.jsx)("input", { ref: internalRef, id: inputId, type: "file", accept: accept, disabled: disabled, className: "sr-only", "aria-invalid": invalid || undefined, "aria-required": ariaRequired || undefined, "aria-describedby": describedBy, "aria-label": ariaLabel, onChange: onInputChange, ...rest }), (0, jsx_runtime_1.jsx)(lucide_react_1.Upload, { className: "text-muted-foreground size-4 shrink-0", "aria-hidden": "true" }), value ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("span", { className: "min-w-0 flex-1 truncate", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-foreground font-medium", children: value.file.name }), ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-muted-foreground tabular-nums", children: humanizeSize(value.file.size) })] }), (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { type: "button", variant: "plain", size: "small", disabled: disabled, "aria-label": labels?.remove?.trim() ? labels.remove : 'Remove file', onClick: (event) => {
-                                    // Don't bubble to the zone's openPicker and re-open the dialog.
-                                    event.stopPropagation();
-                                    clear();
-                                }, children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "size-4", "aria-hidden": "true" }) })] })) : ((0, jsx_runtime_1.jsxs)("span", { className: "text-muted-foreground", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-foreground font-medium", children: labels?.action ?? 'Choose a file' }), ' ', labels?.hint ?? 'or drag and drop'] }))] }), errorText ? ((0, jsx_runtime_1.jsx)("p", { id: errorId, role: "alert", className: "text-system-error-h1a text-xs font-medium", children: errorText })) : null] }));
-});
-exports.FileUpload.displayName = 'FileUpload';
-/** The default English announcement for each rejection kind. */
-function defaultMultipleErrorMessage(error) {
-    if (error.kind === 'too-many') {
-        return `Too many files (max ${error.maxFiles}). ${error.file.name} was not added.`;
-    }
-    return defaultErrorMessage(error);
-}
-/** The default zone copy once the cap is reached, in grammatical English. */
-function defaultFullMessage(maxFiles) {
-    return maxFiles === 1
-        ? 'Maximum of 1 file reached.'
-        : `Maximum of ${maxFiles} files reached.`;
-}
-/**
- * MultipleFileUpload: the plural sibling of FileUpload. Pick SEVERAL files,
- * accumulate them across repeated picks, validate each one, cap the total, and
- * hand back `FileUploadResult[]`.
- *
- * A SIBLING COMPONENT, not a `multiple` flag. This library already answers
- * "this one takes many" that way (`Select` / `MultipleSelect`), and FileUpload
- * strips `'multiple'` from its props on purpose: single-file is its contract,
- * not a default it happens to have. A boolean would have forced every prop
- * here into a union that means one thing when the flag is set and another when
- * it is not: `value` as `Result | Result[] | null`, a `maxFiles` that is
- * meaningless in half the configurations, and a remove control whose
- * accessible name is fixed copy in one mode and per-file in the other. The
- * plural props follow the house shape for plural components: `value?: T[]`
- * with `onValueChange?: (values: T[]) => void`.
- *
- * WHERE THE LINE SITS: this component owns SELECTION and nothing after it.
- * Choosing, validating, capping, listing and removing are its job; uploading
- * is not. That split is not squeamishness about scope, it is where the
- * knowledge actually lives. An upload needs an endpoint, an auth scheme, a
- * concurrency policy, a retry policy and, very often, a parent id that does
- * not exist yet when the files are chosen: the motivating host stages evidence
- * files while a form is being filled and can only upload them against the id
- * that its create call returns afterwards. None of that is knowable from
- * inside a library primitive, and a component that guessed would have to be
- * fought rather than used. So the host keeps its own per-file record with
- * status and retry, and this component keeps the part a form can hold and
- * validate: the chosen files. `FileUploadResult[]` is a value; an upload state
- * machine is not.
- *
- * ACCUMULATION is the defining behaviour. A second pick ADDS to the selection
- * rather than replacing it, because a user assembling five documents does it
- * in two or three trips to the file dialog, not one. Everything else follows
- * from that: room is measured against what is already selected, and the batch
- * that overflows the cap still contributes the files that fit.
- *
- * A BATCH SURVIVES ITS OWN CASUALTIES. One file rejected for type, size or a
- * failed read does not discard the rest of the batch, and it does not consume
- * a slot either: validation runs over the WHOLE batch before the cap is
- * applied, so a file that was never eligible cannot cost an eligible one its
- * place, and `'too-many'` always names a file a slot would genuinely have
- * taken. The alternative punishes
- * a user for a mistake in one file by throwing away four good ones, and hands
- * back no way to tell which was which. Every rejection is reported through
- * `onError` and announced together in one `role="alert"`.
- *
- * Accessibility follows the sibling BELOW THE CAP: the real `<input
- * type="file">` is `sr-only` but focusable and labelable, and never
- * `aria-hidden`, so FormControl-injected ARIA and react-hook-form's focus on
- * error both work while the picker is enabled. At the cap that changes, and
- * the paragraph below says how.
- * The file list sits OUTSIDE the click zone, so activating a remove control
- * cannot also reopen the picker, and each remove control is named after its
- * own file: a column of identical "Remove file" buttons tells a screen-reader
- * user nothing about which row they are on.
- *
- * AT THE CAP the picker takes the native `disabled` attribute, and that DOES
- * take it out of the tab order. This is the one state in which the input is
- * not a focus target, and the one state in which focus-on-error cannot land on
- * it, so it is a real cost rather than a free win. The cap has no counterpart
- * in the single-file sibling, so the precedent followed here is
- * `DateRangePicker`'s trigger: a control whose only job is to open a dialog has
- * no state worth keeping focusable, and native `disabled` is what both removes
- * it from the tab order and keeps the dialog shut. The alternative, an enabled
- * picker that opens the file dialog and then refuses every file with
- * `too-many`, is a control that lies about being available. What keeps the cap
- * from being a dead end is the escape hatch: the remove controls answer to
- * `disabled` alone and NEVER to the cap, so they stay focusable and removing
- * one file reopens the picker.
- */
-exports.MultipleFileUpload = React.forwardRef(function MultipleFileUpload({ accept, maxSizeBytes, maxFiles, value = [], readAs = 'text', labels, onValueChange, onError, disabled = false, id, className, 'aria-invalid': ariaInvalid, 'aria-required': ariaRequired, 'aria-describedby': ariaDescribedby, 'aria-label': ariaLabel, ...rest }, ref) {
-    const internalRef = React.useRef(null);
-    React.useImperativeHandle(ref, () => internalRef.current);
-    const reactId = React.useId();
-    const inputId = id ?? reactId;
-    const errorId = `${inputId}-file-upload-error`;
-    const [dragActive, setDragActive] = React.useState(false);
-    const [errors, setErrors] = React.useState([]);
-    // The authoritative base for the next append. Props win on every render, so
-    // the host stays in control; the commit below also writes through, so a
-    // second batch that settles before the host has re-rendered still appends to
-    // the first batch's result instead of overwriting it.
-    const valueRef = React.useRef(value);
-    React.useEffect(() => {
-        valueRef.current = value;
-    });
-    // Superseding is NOT the contract here the way it is in the single-file
-    // sibling — batches accumulate, so an in-flight read is never stale. The
-    // readers are tracked for the one case that does have to stop them: an
-    // unmount. A read that lands afterwards would settle its batch and commit,
-    // calling the host's `onValueChange` for a component that no longer exists.
-    const readersRef = React.useRef(new Set());
-    React.useEffect(() => () => {
-        for (const reader of readersRef.current)
-            reader.abort();
-        readersRef.current.clear();
-    }, []);
-    const invalid = ariaInvalid || errors.length > 0;
-    // Resolve the announcements BEFORE deciding whether the alert exists: a
-    // consumer that returns nothing for every rejection is opting out of this
-    // surface, and an association pointing at an unrendered node is worse than
-    // none.
-    const messages = errors
-        .map((failure) => labels?.error
-        ? labels.error(failure)
-        : defaultMultipleErrorMessage(failure))
-        .filter((message) => Boolean(message));
-    // A plain join, never `cn`: tailwind-merge treats these as class names and
-    // would drop an id that happens to look like a conflicting utility.
-    const describedBy = [ariaDescribedby, messages.length > 0 ? errorId : undefined]
-        .filter(Boolean)
-        .join(' ') || undefined;
-    const full = maxFiles !== undefined && value.length >= maxFiles;
-    // Removing must stay possible at the cap, so only the PICKER closes.
-    const pickerDisabled = disabled || full;
-    const roomFor = (selected) => maxFiles === undefined
-        ? Number.POSITIVE_INFINITY
-        : Math.max(maxFiles - selected, 0);
-    // The cap is enforced HERE, at the only place that appends, because only the
-    // commit knows the base it lands on. `ingest` measures room too, but for an
-    // asynchronous batch it measures it BEFORE any read settles: two overlapping
-    // batches both see the pre-commit selection and would each believe they fit.
-    const commit = (accepted, rejections) => {
-        const room = roomFor(valueRef.current.length);
-        const fitting = accepted.slice(0, room);
-        const overflow = accepted[room];
-        const failures = overflow !== undefined && maxFiles !== undefined
-            ? [
-                ...rejections,
-                { kind: 'too-many', file: overflow.file, maxFiles }
-            ]
-            : rejections;
-        setErrors(failures);
-        for (const rejection of failures)
-            onError?.(rejection);
-        if (fitting.length === 0)
-            return;
-        const next = [...valueRef.current, ...fitting];
-        valueRef.current = next;
-        onValueChange(next);
-    };
-    const ingest = (incoming) => {
-        if (incoming.length === 0)
-            return;
-        const room = roomFor(valueRef.current.length);
-        const rejections = [];
-        // Validate EVERY file BEFORE the cap is applied. Slicing to the remaining
-        // room first would let a file that was never eligible consume a slot a
-        // good file could have used — one bad pick costing a good one, which is
-        // the opposite of a batch surviving its own casualties — and it would
-        // leave every file past the slice window neither validated nor reported.
-        // Validation is pure metadata (size and accept), so running it over files
-        // that may not fit costs nothing.
-        const eligible = [];
-        for (const file of incoming) {
-            const rejection = validateFile(file, { accept, maxSizeBytes });
-            // Continue rather than abort: one bad file must not cost the good ones.
-            if (rejection) {
-                rejections.push(rejection);
-                continue;
-            }
-            eligible.push(file);
-        }
-        // The cap then applies to the SURVIVORS. One rejection for the batch,
-        // naming the FIRST eligible file that did not fit: naming one already
-        // refused for its size or type would blame the cap for the wrong thing,
-        // and repeating it per overflowing file buries the actionable part.
-        if (eligible.length > room && maxFiles !== undefined) {
-            rejections.push({ kind: 'too-many', file: eligible[room], maxFiles });
-        }
-        const candidates = eligible.slice(0, room);
-        // Binary path: no decode, no reader, no retained garbage string.
-        if (readAs === 'none') {
-            commit(candidates.map((file) => ({ file, text: '' })), rejections);
-            return;
-        }
-        if (candidates.length === 0) {
-            commit([], rejections);
-            return;
-        }
-        // Slot-per-candidate so the emitted batch keeps PICK order regardless of
-        // the order the reads settle in. A null slot is a read that failed; the
-        // batch commits once every read has settled, one way or the other.
-        const slots = new Array(candidates.length).fill(null);
-        let remaining = candidates.length;
-        const settle = () => {
-            remaining -= 1;
-            if (remaining > 0)
-                return;
-            const accepted = [];
-            const readFailures = [];
-            slots.forEach((slot, index) => {
-                if (slot)
-                    accepted.push(slot);
-                else
-                    readFailures.push({ kind: 'read-failed', file: candidates[index] });
-            });
-            commit(accepted, [...rejections, ...readFailures]);
-        };
-        candidates.forEach((file, index) => {
-            const reader = new FileReader();
-            readersRef.current.add(reader);
-            // Deliberately no `onabort` handler: an aborted read must NOT settle,
-            // or the batch would commit at exactly the moment we are stopping it.
-            reader.onload = () => {
-                readersRef.current.delete(reader);
-                slots[index] = { file, text: String(reader.result ?? '') };
-                settle();
-            };
-            reader.onerror = () => {
-                readersRef.current.delete(reader);
-                settle();
-            };
-            reader.readAsText(file);
-        });
-    };
-    const onInputChange = (event) => {
-        const files = Array.from(event.target.files ?? []);
-        // Release the FileList the moment it has been read, or re-picking the same
-        // file is silently a no-op: the browser fires `change` only when the
-        // selection DIFFERS from what the input already holds.
-        event.target.value = '';
-        ingest(files);
-    };
-    // `preventDefault` FIRST, and unconditionally. Returning before it does
-    // not merely refuse the drop: nothing cancels the browser's OWN action for
-    // a dropped file, so the window navigates to the file and whatever the
-    // page held unsaved is gone. A zone the host turned off has to swallow the
-    // drop, never hand it back to the browser. `dropEffect` says so to the
-    // cursor while the file is still in the air.
-    const onDragOver = (event) => {
-        event.preventDefault();
-        if (disabled) {
-            event.dataTransfer.dropEffect = 'none';
-            return;
-        }
-        setDragActive(true);
-    };
-    const onDragLeave = (event) => {
-        event.preventDefault();
-        setDragActive(false);
-    };
-    const onDrop = (event) => {
-        event.preventDefault();
-        // Cleared before the gate, not after, so a host that disables the zone
-        // mid-drag does not leave it highlighted for a drag that can no longer
-        // land.
-        setDragActive(false);
-        if (disabled)
-            return;
-        // Deliberately NOT gated on `full`: a drop onto a full zone is answered
-        // with the too-many rejection, which says why, instead of nothing at all.
-        ingest(Array.from(event.dataTransfer.files ?? []));
-    };
-    // Mouse convenience only. A click that ORIGINATED on the input already opens
-    // the picker natively and bubbles up here, so ignore it or it opens twice.
-    const openPicker = (event) => {
-        if (pickerDisabled || event.target === internalRef.current)
-            return;
-        internalRef.current?.click();
-    };
-    const removeAt = (index) => {
-        // By index, not by name: two files can share a filename and identity is
-        // what the row actually stands for.
-        const next = valueRef.current.filter((_, position) => position !== index);
-        valueRef.current = next;
-        onValueChange(next);
-    };
-    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)('space-y-2', className), children: [(0, jsx_runtime_1.jsxs)("div", { onClick: openPicker, onDragOver: onDragOver, onDragLeave: onDragLeave, onDrop: onDrop, className: (0, utils_1.cn)('border-input-border bg-card focus-within:ring-ring focus-within:ring-offset-background aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-within:ring-destructive flex w-full items-center gap-3 rounded-md border px-3 py-4 text-sm shadow-xs transition-colors focus-within:ring-2 focus-within:ring-offset-1 focus-within:outline-none', dragActive &&
-                    'border-ring ring-ring ring-offset-background ring-2 ring-offset-1', pickerDisabled
-                    ? 'border-muted bg-muted/30 cursor-not-allowed shadow-none'
-                    : 'cursor-pointer'), "aria-invalid": invalid || undefined, children: [(0, jsx_runtime_1.jsx)("input", { ref: internalRef, id: inputId, type: "file", multiple: true, accept: accept, disabled: pickerDisabled, className: "sr-only", "aria-invalid": invalid || undefined, "aria-required": ariaRequired || undefined, "aria-describedby": describedBy, "aria-label": ariaLabel, onChange: onInputChange, ...rest }), (0, jsx_runtime_1.jsx)(lucide_react_1.Upload, { className: "text-muted-foreground size-4 shrink-0", "aria-hidden": "true" }), full && maxFiles !== undefined ? ((0, jsx_runtime_1.jsx)("span", { className: "text-muted-foreground", children: labels?.full
-                            ? labels.full(maxFiles)
-                            : defaultFullMessage(maxFiles) })) : ((0, jsx_runtime_1.jsxs)("span", { className: "text-muted-foreground", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-foreground font-medium", children: labels?.action ?? 'Choose files' }), ' ', labels?.hint ?? 'or drag and drop'] }))] }), value.length > 0 ? ((0, jsx_runtime_1.jsx)("ul", { className: "space-y-1", children: value.map((entry, index) => ((0, jsx_runtime_1.jsxs)("li", { className: "flex items-center gap-3 text-sm", children: [(0, jsx_runtime_1.jsxs)("span", { className: "min-w-0 flex-1 truncate", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-foreground font-medium", children: entry.file.name }), ' ', (0, jsx_runtime_1.jsx)("span", { className: "text-muted-foreground tabular-nums", children: humanizeSize(entry.file.size) })] }), (0, jsx_runtime_1.jsx)(icon_button_1.IconButton, { type: "button", variant: "plain", size: "small", disabled: disabled, "aria-label": labels?.remove
-                                ? labels.remove(entry.file)
-                                : `Remove ${entry.file.name}`, onClick: () => removeAt(index), children: (0, jsx_runtime_1.jsx)(lucide_react_1.X, { className: "size-4", "aria-hidden": "true" }) })] }, `${entry.file.name}-${index}`))) })) : null, messages.length > 0 ? ((0, jsx_runtime_1.jsx)("div", { id: errorId, role: "alert", className: "space-y-1", children: messages.map((message, index) => ((0, jsx_runtime_1.jsx)("p", { className: "text-system-error-h1a text-xs font-medium", children: message }, index))) })) : null] }));
-});
-exports.MultipleFileUpload.displayName = 'MultipleFileUpload';
+"use client";"use strict";var __createBinding=this&&this.__createBinding||(Object.create?(function(r,n,a,e){if(e===void 0)e=a;var i=Object.getOwnPropertyDescriptor(n,a);if(!i||("get"in i?!n.__esModule:i.writable||i.configurable)){i={enumerable:true,get:function(){return n[a]}}}Object.defineProperty(r,e,i)}):(function(r,n,a,e){if(e===void 0)e=a;r[e]=n[a]}));var __setModuleDefault=this&&this.__setModuleDefault||(Object.create?(function(r,n){Object.defineProperty(r,"default",{enumerable:true,value:n})}):function(r,n){r["default"]=n});var __importStar=this&&this.__importStar||(function(){var r=function(n){r=Object.getOwnPropertyNames||function(a){var e=[];for(var i in a)if(Object.prototype.hasOwnProperty.call(a,i))e[e.length]=i;return e};return r(n)};return function(n){if(n&&n.__esModule)return n;var a={};if(n!=null){for(var e=r(n),i=0;i<e.length;i++)if(e[i]!=="default")__createBinding(a,n,e[i])}__setModuleDefault(a,n);return a}})();Object.defineProperty(exports,"__esModule",{value:true});exports.MultipleFileUpload=exports.FileUpload=void 0;exports.validateFile=validateFile;exports.humanizeSize=humanizeSize;const jsx_runtime_1=require("react/jsx-runtime");const React=__importStar(require("react"));const lucide_react_1=require("lucide-react");const icon_button_1=require("../../../components/ui/icon-button");const utils_1=require("../../../lib/utils");function validateFile(r,n){const{accept:a,maxSizeBytes:e}=n;if(typeof e==="number"&&r.size>e){return{kind:"too-large",file:r,maxSizeBytes:e}}if(a&&a.trim()!==""&&!matchesAccept(r,a)){return{kind:"wrong-type",file:r,accept:a}}return null}function matchesAccept(r,n){const a=r.name.toLowerCase();const e=r.type.toLowerCase();return n.split(",").map(i=>i.trim().toLowerCase()).filter(i=>i!=="").some(i=>{if(i.startsWith("."))return a.endsWith(i);if(i.endsWith("/*"))return e.startsWith(i.slice(0,-1));return e===i})}function humanizeSize(r){if(r<1024)return`${r} B`;const n=["KB","MB","GB"];let a=r/1024;let e=0;while(a>=1024&&e<n.length-1){a/=1024;e+=1}return`${a.toFixed(1)} ${n[e]}`}function defaultErrorMessage(r){switch(r.kind){case"too-large":return`File is too large (max ${humanizeSize(r.maxSizeBytes)}).`;case"wrong-type":return`File type not allowed (expected ${r.accept}).`;case"read-failed":return"Could not read the file."}}exports.FileUpload=React.forwardRef(function r({accept:n,maxSizeBytes:a,value:e,readAs:i="text",labels:v,onSelect:l,onError:M,disabled:b=false,id:D,className:W,"aria-invalid":H,"aria-required":K,"aria-describedby":X,"aria-label":G,...Y},J){const j=React.useRef(null);React.useImperativeHandle(J,()=>j.current);const I=React.useId();const $=D??I;const R=`${$}-file-upload-error`;const[E,z]=React.useState(false);const[w,y]=React.useState(null);const S=H||w!==null;const c=w?v?.error?v.error(w):defaultErrorMessage(w):null;const p=c?c:null;const U=[X,p?R:void 0].filter(Boolean).join(" ")||void 0;const u=React.useRef(null);const A=o=>{if(!o)return;u.current?.abort();const N=validateFile(o,{accept:n,maxSizeBytes:a});if(N){y(N);M?.(N);return}if(i==="none"){u.current=null;y(null);l({file:o,text:""});return}const m=new FileReader;u.current=m;m.onload=()=>{if(u.current!==m)return;u.current=null;y(null);l({file:o,text:String(m.result??"")})};m.onerror=()=>{if(u.current!==m)return;u.current=null;const q={kind:"read-failed",file:o};y(q);M?.(q)};m.readAsText(o)};const P=o=>{const N=o.target.files?.[0];o.target.value="";A(N)};const O=o=>{o.preventDefault();if(b){o.dataTransfer.dropEffect="none";return}z(true)};const T=o=>{o.preventDefault();z(false)};const B=o=>{o.preventDefault();z(false);if(b)return;A(o.dataTransfer.files?.[0])};const k=o=>{if(b||o.target===j.current)return;j.current?.click()};const Q=()=>{u.current?.abort();u.current=null;y(null);l(null);if(j.current)j.current.value=""};return(0,jsx_runtime_1.jsxs)("div",{className:(0,utils_1.cn)("space-y-2",W),children:[(0,jsx_runtime_1.jsxs)("div",{onClick:k,onDragOver:O,onDragLeave:T,onDrop:B,className:(0,utils_1.cn)("border-input-border bg-card focus-within:ring-ring focus-within:ring-offset-background aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-within:ring-destructive flex w-full items-center gap-3 rounded-md border px-3 py-4 text-sm shadow-xs transition-colors focus-within:ring-2 focus-within:ring-offset-1 focus-within:outline-none",E&&"border-ring ring-ring ring-offset-background ring-2 ring-offset-1",b?"border-muted bg-muted/30 cursor-not-allowed shadow-none":"cursor-pointer"),"aria-invalid":S||void 0,children:[(0,jsx_runtime_1.jsx)("input",{ref:j,id:$,type:"file",accept:n,disabled:b,className:"sr-only","aria-invalid":S||void 0,"aria-required":K||void 0,"aria-describedby":U,"aria-label":G,onChange:P,...Y}),(0,jsx_runtime_1.jsx)(lucide_react_1.Upload,{className:"text-muted-foreground size-4 shrink-0","aria-hidden":"true"}),e?(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsxs)("span",{className:"min-w-0 flex-1 truncate",children:[(0,jsx_runtime_1.jsx)("span",{className:"text-foreground font-medium",children:e.file.name})," ",(0,jsx_runtime_1.jsx)("span",{className:"text-muted-foreground tabular-nums",children:humanizeSize(e.file.size)})]}),(0,jsx_runtime_1.jsx)(icon_button_1.IconButton,{type:"button",variant:"plain",size:"small",disabled:b,"aria-label":v?.remove?.trim()?v.remove:"Remove file",onClick:o=>{o.stopPropagation();Q()},children:(0,jsx_runtime_1.jsx)(lucide_react_1.X,{className:"size-4","aria-hidden":"true"})})]}):(0,jsx_runtime_1.jsxs)("span",{className:"text-muted-foreground",children:[(0,jsx_runtime_1.jsx)("span",{className:"text-foreground font-medium",children:v?.action??"Choose a file"})," ",v?.hint??"or drag and drop"]})]}),p?(0,jsx_runtime_1.jsx)("p",{id:R,role:"alert",className:"text-system-error-h1a text-xs font-medium",children:p}):null]})});exports.FileUpload.displayName="FileUpload";function defaultMultipleErrorMessage(r){if(r.kind==="too-many"){return`Too many files (max ${r.maxFiles}). ${r.file.name} was not added.`}return defaultErrorMessage(r)}function defaultFullMessage(r){return r===1?"Maximum of 1 file reached.":`Maximum of ${r} files reached.`}exports.MultipleFileUpload=React.forwardRef(function r({accept:n,maxSizeBytes:a,maxFiles:e,value:i=[],readAs:v="text",labels:l,onValueChange:M,onError:b,disabled:D=false,id:W,className:H,"aria-invalid":K,"aria-required":X,"aria-describedby":G,"aria-label":Y,...J},j){const I=React.useRef(null);React.useImperativeHandle(j,()=>I.current);const $=React.useId();const R=W??$;const E=`${R}-file-upload-error`;const[z,w]=React.useState(false);const[y,S]=React.useState([]);const c=React.useRef(i);React.useEffect(()=>{c.current=i});const p=React.useRef(new Set);React.useEffect(()=>()=>{for(const t of p.current)t.abort();p.current.clear()},[]);const U=K||y.length>0;const u=y.map(t=>l?.error?l.error(t):defaultMultipleErrorMessage(t)).filter(t=>Boolean(t));const A=[G,u.length>0?E:void 0].filter(Boolean).join(" ")||void 0;const P=e!==void 0&&i.length>=e;const O=D||P;const T=t=>e===void 0?Number.POSITIVE_INFINITY:Math.max(e-t,0);const B=(t,s)=>{const g=T(c.current.length);const h=t.slice(0,g);const x=t[g];const C=x!==void 0&&e!==void 0?[...s,{kind:"too-many",file:x.file,maxFiles:e}]:s;S(C);for(const L of C)b?.(L);if(h.length===0)return;const F=[...c.current,...h];c.current=F;M(F)};const k=t=>{if(t.length===0)return;const s=T(c.current.length);const g=[];const h=[];for(const d of t){const _=validateFile(d,{accept:n,maxSizeBytes:a});if(_){g.push(_);continue}h.push(d)}if(h.length>s&&e!==void 0){g.push({kind:"too-many",file:h[s],maxFiles:e})}const x=h.slice(0,s);if(v==="none"){B(x.map(d=>({file:d,text:""})),g);return}if(x.length===0){B([],g);return}const C=new Array(x.length).fill(null);let F=x.length;const L=()=>{F-=1;if(F>0)return;const d=[];const _=[];C.forEach((f,Z)=>{if(f)d.push(f);else _.push({kind:"read-failed",file:x[Z]})});B(d,[...g,..._])};x.forEach((d,_)=>{const f=new FileReader;p.current.add(f);f.onload=()=>{p.current.delete(f);C[_]={file:d,text:String(f.result??"")};L()};f.onerror=()=>{p.current.delete(f);L()};f.readAsText(d)})};const Q=t=>{const s=Array.from(t.target.files??[]);t.target.value="";k(s)};const o=t=>{t.preventDefault();if(D){t.dataTransfer.dropEffect="none";return}w(true)};const N=t=>{t.preventDefault();w(false)};const m=t=>{t.preventDefault();w(false);if(D)return;k(Array.from(t.dataTransfer.files??[]))};const q=t=>{if(O||t.target===I.current)return;I.current?.click()};const V=t=>{const s=c.current.filter((g,h)=>h!==t);c.current=s;M(s)};return(0,jsx_runtime_1.jsxs)("div",{className:(0,utils_1.cn)("space-y-2",H),children:[(0,jsx_runtime_1.jsxs)("div",{onClick:q,onDragOver:o,onDragLeave:N,onDrop:m,className:(0,utils_1.cn)("border-input-border bg-card focus-within:ring-ring focus-within:ring-offset-background aria-[invalid=true]:border-destructive aria-[invalid=true]:focus-within:ring-destructive flex w-full items-center gap-3 rounded-md border px-3 py-4 text-sm shadow-xs transition-colors focus-within:ring-2 focus-within:ring-offset-1 focus-within:outline-none",z&&"border-ring ring-ring ring-offset-background ring-2 ring-offset-1",O?"border-muted bg-muted/30 cursor-not-allowed shadow-none":"cursor-pointer"),"aria-invalid":U||void 0,children:[(0,jsx_runtime_1.jsx)("input",{ref:I,id:R,type:"file",multiple:true,accept:n,disabled:O,className:"sr-only","aria-invalid":U||void 0,"aria-required":X||void 0,"aria-describedby":A,"aria-label":Y,onChange:Q,...J}),(0,jsx_runtime_1.jsx)(lucide_react_1.Upload,{className:"text-muted-foreground size-4 shrink-0","aria-hidden":"true"}),P&&e!==void 0?(0,jsx_runtime_1.jsx)("span",{className:"text-muted-foreground",children:l?.full?l.full(e):defaultFullMessage(e)}):(0,jsx_runtime_1.jsxs)("span",{className:"text-muted-foreground",children:[(0,jsx_runtime_1.jsx)("span",{className:"text-foreground font-medium",children:l?.action??"Choose files"})," ",l?.hint??"or drag and drop"]})]}),i.length>0?(0,jsx_runtime_1.jsx)("ul",{className:"space-y-1",children:i.map((t,s)=>(0,jsx_runtime_1.jsxs)("li",{className:"flex items-center gap-3 text-sm",children:[(0,jsx_runtime_1.jsxs)("span",{className:"min-w-0 flex-1 truncate",children:[(0,jsx_runtime_1.jsx)("span",{className:"text-foreground font-medium",children:t.file.name})," ",(0,jsx_runtime_1.jsx)("span",{className:"text-muted-foreground tabular-nums",children:humanizeSize(t.file.size)})]}),(0,jsx_runtime_1.jsx)(icon_button_1.IconButton,{type:"button",variant:"plain",size:"small",disabled:D,"aria-label":l?.remove?l.remove(t.file):`Remove ${t.file.name}`,onClick:()=>V(s),children:(0,jsx_runtime_1.jsx)(lucide_react_1.X,{className:"size-4","aria-hidden":"true"})})]},`${t.file.name}-${s}`))}):null,u.length>0?(0,jsx_runtime_1.jsx)("div",{id:E,role:"alert",className:"space-y-1",children:u.map((t,s)=>(0,jsx_runtime_1.jsx)("p",{className:"text-system-error-h1a text-xs font-medium",children:t},s))}):null]})});exports.MultipleFileUpload.displayName="MultipleFileUpload";