@anvilkit/plugin-asset-manager 0.1.1

package/dist/ui/MetadataPanel.d.cts

@@ -0,0 +1,21 @@
+import type { UploadResult } from "../types.js";
+export interface MetadataPanelProps {
+    /**
+     * Asset whose metadata is being edited. When `null`, the panel is
+     * closed. Setting this opens it; the host clears it on cancel or
+     * after `onConfirm` resolves.
+     */
+    readonly asset: UploadResult | null;
+    /**
+     * Save handler. Receives the original asset plus the new name and
+     * tag set. May return a Promise to keep the Save button busy until
+     * the underlying registry mutation settles.
+     */
+    readonly onConfirm: (asset: UploadResult, next: {
+        readonly name: string;
+        readonly tags: readonly string[];
+    }) => void | Promise<void>;
+    readonly onCancel: () => void;
+}
+export declare function MetadataPanel({ asset, onCancel, onConfirm, }: MetadataPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MetadataPanel.d.cts.map

package/dist/ui/MetadataPanel.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetadataPanel.d.cts","sourceRoot":"","sources":["../../src/ui/MetadataPanel.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,WAAW,kBAAkB;IAClC;;;;OAIG;IACH,QAAQ,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE,CACnB,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE;QAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,IAAI,EAAE,SAAS,MAAM,EAAE,CAAA;KAAE,KAC7D,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,SAAS,GACT,EAAE,kBAAkB,2CAuIpB"}

package/dist/ui/MetadataPanel.d.ts

@@ -0,0 +1,21 @@
+import type { UploadResult } from "../types.js";
+export interface MetadataPanelProps {
+    /**
+     * Asset whose metadata is being edited. When `null`, the panel is
+     * closed. Setting this opens it; the host clears it on cancel or
+     * after `onConfirm` resolves.
+     */
+    readonly asset: UploadResult | null;
+    /**
+     * Save handler. Receives the original asset plus the new name and
+     * tag set. May return a Promise to keep the Save button busy until
+     * the underlying registry mutation settles.
+     */
+    readonly onConfirm: (asset: UploadResult, next: {
+        readonly name: string;
+        readonly tags: readonly string[];
+    }) => void | Promise<void>;
+    readonly onCancel: () => void;
+}
+export declare function MetadataPanel({ asset, onCancel, onConfirm, }: MetadataPanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=MetadataPanel.d.ts.map

package/dist/ui/MetadataPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MetadataPanel.d.ts","sourceRoot":"","sources":["../../src/ui/MetadataPanel.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEhD,MAAM,WAAW,kBAAkB;IAClC;;;;OAIG;IACH,QAAQ,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE,CACnB,KAAK,EAAE,YAAY,EACnB,IAAI,EAAE;QAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,IAAI,EAAE,SAAS,MAAM,EAAE,CAAA;KAAE,KAC7D,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,aAAa,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,SAAS,GACT,EAAE,kBAAkB,2CAuIpB"}

package/dist/ui/MetadataPanel.js

@@ -0,0 +1,113 @@
+import { Button } from "@anvilkit/ui/button";
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@anvilkit/ui/dialog";
+import { Input } from "@anvilkit/ui/input";
+import * as __rspack_external_react from "react";
+function MetadataPanel({ asset, onCancel, onConfirm }) {
+    const [name, setName] = __rspack_external_react.useState("");
+    const [tagInput, setTagInput] = __rspack_external_react.useState("");
+    const [tags, setTags] = __rspack_external_react.useState([]);
+    const [busy, setBusy] = __rspack_external_react.useState(false);
+    __rspack_external_react.useEffect(()=>{
+        if (null === asset) return;
+        setName(asset.name ?? "");
+        setTags(asset.tags ?? []);
+        setTagInput("");
+        setBusy(false);
+    }, [
+        asset
+    ]);
+    function commitTagInput() {
+        const next = tagInput.trim().toLowerCase();
+        if ("" === next) return tags;
+        if (tags.includes(next)) {
+            setTagInput("");
+            return tags;
+        }
+        const merged = [
+            ...tags,
+            next
+        ];
+        setTags(merged);
+        setTagInput("");
+        return merged;
+    }
+    function removeTag(value) {
+        setTags((current)=>current.filter((entry)=>entry !== value));
+    }
+    function handleTagKeyDown(event) {
+        if ("Enter" === event.key || "," === event.key) {
+            event.preventDefault();
+            commitTagInput();
+        }
+    }
+    async function handleConfirm() {
+        if (null === asset || busy) return;
+        const finalTags = "" === tagInput.trim() ? tags : commitTagInput();
+        setBusy(true);
+        try {
+            await onConfirm(asset, {
+                name: name.trim(),
+                tags: finalTags
+            });
+        } finally{
+            setBusy(false);
+        }
+    }
+    function handleOpenChange(nextOpen) {
+        if (!nextOpen && !busy) onCancel();
+    }
+    const open = null !== asset;
+    const mimeType = asset?.meta?.mimeType;
+    return /*#__PURE__*/ __rspack_external_react.createElement(Dialog, {
+        open: open,
+        onOpenChange: handleOpenChange
+    }, /*#__PURE__*/ __rspack_external_react.createElement(DialogContent, null, /*#__PURE__*/ __rspack_external_react.createElement(DialogHeader, null, /*#__PURE__*/ __rspack_external_react.createElement(DialogTitle, null, "Edit asset"), /*#__PURE__*/ __rspack_external_react.createElement(DialogDescription, null, asset?.id, mimeType ? ` (${mimeType})` : "")), /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        "data-asset-manager-metadata": true
+    }, /*#__PURE__*/ __rspack_external_react.createElement("label", {
+        htmlFor: "asset-metadata-name"
+    }, "Name"), /*#__PURE__*/ __rspack_external_react.createElement(Input, {
+        id: "asset-metadata-name",
+        value: name,
+        onChange: (event)=>{
+            setName(event.target.value);
+        },
+        placeholder: asset?.id ?? "",
+        disabled: busy
+    }), /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        "data-asset-manager-tag-editor": true
+    }, /*#__PURE__*/ __rspack_external_react.createElement("label", {
+        htmlFor: "asset-metadata-tag-input"
+    }, "Tags"), /*#__PURE__*/ __rspack_external_react.createElement("ul", {
+        "aria-label": "Current tags",
+        role: "list"
+    }, tags.map((tag)=>/*#__PURE__*/ __rspack_external_react.createElement("li", {
+            key: tag
+        }, /*#__PURE__*/ __rspack_external_react.createElement("span", null, tag), /*#__PURE__*/ __rspack_external_react.createElement("button", {
+            "aria-label": `Remove tag ${tag}`,
+            "data-asset-action": "remove-tag",
+            disabled: busy,
+            onClick: ()=>{
+                removeTag(tag);
+            },
+            type: "button"
+        }, "\xd7")))), /*#__PURE__*/ __rspack_external_react.createElement(Input, {
+        id: "asset-metadata-tag-input",
+        value: tagInput,
+        onChange: (event)=>{
+            setTagInput(event.target.value);
+        },
+        onKeyDown: handleTagKeyDown,
+        placeholder: "Add a tag and press Enter",
+        disabled: busy
+    }))), /*#__PURE__*/ __rspack_external_react.createElement(DialogFooter, null, /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+        disabled: busy,
+        onClick: onCancel,
+        type: "button",
+        variant: "outline"
+    }, "Cancel"), /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+        disabled: busy || null === asset,
+        onClick: handleConfirm,
+        type: "button"
+    }, busy ? "Saving…" : "Save"))));
+}
+export { MetadataPanel };

package/dist/ui/ReplaceAssetDialog.cjs

@@ -0,0 +1,125 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    ReplaceAssetDialog: ()=>ReplaceAssetDialog
+});
+const button_namespaceObject = require("@anvilkit/ui/button");
+const dialog_namespaceObject = require("@anvilkit/ui/dialog");
+const external_react_namespaceObject = require("react");
+const external_plugin_cjs_namespaceObject = require("../plugin.cjs");
+function ReplaceAssetDialog({ acceptedMimeTypes, asset, maxFileSize, onCancel, onConfirm }) {
+    const inputRef = external_react_namespaceObject.useRef(null);
+    const [selectedFile, setSelectedFile] = external_react_namespaceObject.useState(null);
+    const [error, setError] = external_react_namespaceObject.useState(null);
+    const [busy, setBusy] = external_react_namespaceObject.useState(false);
+    const acceptAttr = external_react_namespaceObject.useMemo(()=>acceptedMimeTypes?.join(","), [
+        acceptedMimeTypes
+    ]);
+    external_react_namespaceObject.useEffect(()=>{
+        if (null === asset) {
+            setSelectedFile(null);
+            setError(null);
+            setBusy(false);
+        }
+    }, [
+        asset
+    ]);
+    function handleFileChange(event) {
+        const file = event.target.files?.[0];
+        event.target.value = "";
+        if (!file) return;
+        try {
+            (0, external_plugin_cjs_namespaceObject.validateSelectedFile)(file, {
+                acceptedMimeTypes,
+                maxFileSize
+            });
+            setError(null);
+            setSelectedFile(file);
+        } catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+            setSelectedFile(null);
+        }
+    }
+    async function handleConfirm() {
+        if (null === asset || null === selectedFile || busy) return;
+        setBusy(true);
+        try {
+            await onConfirm(asset, selectedFile);
+        } catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+        } finally{
+            setBusy(false);
+        }
+    }
+    function handleOpenChange(nextOpen) {
+        if (!nextOpen && !busy) onCancel();
+    }
+    const open = null !== asset;
+    const label = asset?.name ?? asset?.id ?? "";
+    return /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.Dialog, {
+        open: open,
+        onOpenChange: handleOpenChange
+    }, /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.DialogContent, null, /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.DialogHeader, null, /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.DialogTitle, null, "Replace asset?"), /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.DialogDescription, null, label ? `Pick a file to replace ${label} with. Existing asset:// references will resolve to the new bytes.` : "Pick a file to replace this asset with.")), /*#__PURE__*/ external_react_namespaceObject.createElement("input", {
+        "aria-label": "Replacement file",
+        "data-testid": "replace-asset-file-input",
+        hidden: true,
+        onChange: handleFileChange,
+        ref: inputRef,
+        type: "file",
+        ...acceptAttr ? {
+            accept: acceptAttr
+        } : {}
+    }), /*#__PURE__*/ external_react_namespaceObject.createElement("div", {
+        "data-asset-manager-replace-state": true
+    }, /*#__PURE__*/ external_react_namespaceObject.createElement(button_namespaceObject.Button, {
+        type: "button",
+        variant: "outline",
+        onClick: ()=>inputRef.current?.click(),
+        disabled: busy
+    }, selectedFile ? "Choose a different file" : "Choose file"), /*#__PURE__*/ external_react_namespaceObject.createElement("p", {
+        "aria-live": "polite",
+        role: "status"
+    }, selectedFile ? `Selected: ${selectedFile.name}` : "No file selected."), error ? /*#__PURE__*/ external_react_namespaceObject.createElement("p", {
+        "data-asset-manager-replace-error": true,
+        role: "alert"
+    }, error) : null), /*#__PURE__*/ external_react_namespaceObject.createElement(dialog_namespaceObject.DialogFooter, null, /*#__PURE__*/ external_react_namespaceObject.createElement(button_namespaceObject.Button, {
+        type: "button",
+        variant: "outline",
+        onClick: onCancel,
+        disabled: busy
+    }, "Cancel"), /*#__PURE__*/ external_react_namespaceObject.createElement(button_namespaceObject.Button, {
+        type: "button",
+        onClick: handleConfirm,
+        disabled: busy || null === asset || null === selectedFile
+    }, busy ? "Replacing…" : "Replace"))));
+}
+exports.ReplaceAssetDialog = __webpack_exports__.ReplaceAssetDialog;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "ReplaceAssetDialog"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/ui/ReplaceAssetDialog.d.cts

@@ -0,0 +1,14 @@
+import type { AssetManagerOptions, UploadResult } from "../types.js";
+export interface ReplaceAssetDialogProps extends Pick<AssetManagerOptions, "acceptedMimeTypes" | "maxFileSize"> {
+    /** Asset to replace. `null` closes the dialog. */
+    readonly asset: UploadResult | null;
+    /**
+     * Receives the selected file. Typically calls
+     * `studioAssetSource.replace(asset.id, file)` or
+     * `registry.replace(asset.id, await uploader(file))`.
+     */
+    readonly onConfirm: (asset: UploadResult, file: File) => void | Promise<void>;
+    readonly onCancel: () => void;
+}
+export declare function ReplaceAssetDialog({ acceptedMimeTypes, asset, maxFileSize, onCancel, onConfirm, }: ReplaceAssetDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ReplaceAssetDialog.d.cts.map

package/dist/ui/ReplaceAssetDialog.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReplaceAssetDialog.d.cts","sourceRoot":"","sources":["../../src/ui/ReplaceAssetDialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAErE,MAAM,WAAW,uBAChB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,mBAAmB,GAAG,aAAa,CAAC;IACtE,kDAAkD;IAClD,QAAQ,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,IAAI,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9E,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,kBAAkB,CAAC,EAClC,iBAAiB,EACjB,KAAK,EACL,WAAW,EACX,QAAQ,EACR,SAAS,GACT,EAAE,uBAAuB,2CAuHzB"}

package/dist/ui/ReplaceAssetDialog.d.ts

@@ -0,0 +1,14 @@
+import type { AssetManagerOptions, UploadResult } from "../types.js";
+export interface ReplaceAssetDialogProps extends Pick<AssetManagerOptions, "acceptedMimeTypes" | "maxFileSize"> {
+    /** Asset to replace. `null` closes the dialog. */
+    readonly asset: UploadResult | null;
+    /**
+     * Receives the selected file. Typically calls
+     * `studioAssetSource.replace(asset.id, file)` or
+     * `registry.replace(asset.id, await uploader(file))`.
+     */
+    readonly onConfirm: (asset: UploadResult, file: File) => void | Promise<void>;
+    readonly onCancel: () => void;
+}
+export declare function ReplaceAssetDialog({ acceptedMimeTypes, asset, maxFileSize, onCancel, onConfirm, }: ReplaceAssetDialogProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ReplaceAssetDialog.d.ts.map

package/dist/ui/ReplaceAssetDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReplaceAssetDialog.d.ts","sourceRoot":"","sources":["../../src/ui/ReplaceAssetDialog.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAErE,MAAM,WAAW,uBAChB,SAAQ,IAAI,CAAC,mBAAmB,EAAE,mBAAmB,GAAG,aAAa,CAAC;IACtE,kDAAkD;IAClD,QAAQ,CAAC,KAAK,EAAE,YAAY,GAAG,IAAI,CAAC;IACpC;;;;OAIG;IACH,QAAQ,CAAC,SAAS,EAAE,CAAC,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,IAAI,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9E,QAAQ,CAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;CAC9B;AAED,wBAAgB,kBAAkB,CAAC,EAClC,iBAAiB,EACjB,KAAK,EACL,WAAW,EACX,QAAQ,EACR,SAAS,GACT,EAAE,uBAAuB,2CAuHzB"}

package/dist/ui/ReplaceAssetDialog.js

@@ -0,0 +1,91 @@
+import { Button } from "@anvilkit/ui/button";
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "@anvilkit/ui/dialog";
+import { validateSelectedFile } from "../plugin.js";
+import * as __rspack_external_react from "react";
+function ReplaceAssetDialog({ acceptedMimeTypes, asset, maxFileSize, onCancel, onConfirm }) {
+    const inputRef = __rspack_external_react.useRef(null);
+    const [selectedFile, setSelectedFile] = __rspack_external_react.useState(null);
+    const [error, setError] = __rspack_external_react.useState(null);
+    const [busy, setBusy] = __rspack_external_react.useState(false);
+    const acceptAttr = __rspack_external_react.useMemo(()=>acceptedMimeTypes?.join(","), [
+        acceptedMimeTypes
+    ]);
+    __rspack_external_react.useEffect(()=>{
+        if (null === asset) {
+            setSelectedFile(null);
+            setError(null);
+            setBusy(false);
+        }
+    }, [
+        asset
+    ]);
+    function handleFileChange(event) {
+        const file = event.target.files?.[0];
+        event.target.value = "";
+        if (!file) return;
+        try {
+            validateSelectedFile(file, {
+                acceptedMimeTypes,
+                maxFileSize
+            });
+            setError(null);
+            setSelectedFile(file);
+        } catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+            setSelectedFile(null);
+        }
+    }
+    async function handleConfirm() {
+        if (null === asset || null === selectedFile || busy) return;
+        setBusy(true);
+        try {
+            await onConfirm(asset, selectedFile);
+        } catch (err) {
+            setError(err instanceof Error ? err.message : String(err));
+        } finally{
+            setBusy(false);
+        }
+    }
+    function handleOpenChange(nextOpen) {
+        if (!nextOpen && !busy) onCancel();
+    }
+    const open = null !== asset;
+    const label = asset?.name ?? asset?.id ?? "";
+    return /*#__PURE__*/ __rspack_external_react.createElement(Dialog, {
+        open: open,
+        onOpenChange: handleOpenChange
+    }, /*#__PURE__*/ __rspack_external_react.createElement(DialogContent, null, /*#__PURE__*/ __rspack_external_react.createElement(DialogHeader, null, /*#__PURE__*/ __rspack_external_react.createElement(DialogTitle, null, "Replace asset?"), /*#__PURE__*/ __rspack_external_react.createElement(DialogDescription, null, label ? `Pick a file to replace ${label} with. Existing asset:// references will resolve to the new bytes.` : "Pick a file to replace this asset with.")), /*#__PURE__*/ __rspack_external_react.createElement("input", {
+        "aria-label": "Replacement file",
+        "data-testid": "replace-asset-file-input",
+        hidden: true,
+        onChange: handleFileChange,
+        ref: inputRef,
+        type: "file",
+        ...acceptAttr ? {
+            accept: acceptAttr
+        } : {}
+    }), /*#__PURE__*/ __rspack_external_react.createElement("div", {
+        "data-asset-manager-replace-state": true
+    }, /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+        type: "button",
+        variant: "outline",
+        onClick: ()=>inputRef.current?.click(),
+        disabled: busy
+    }, selectedFile ? "Choose a different file" : "Choose file"), /*#__PURE__*/ __rspack_external_react.createElement("p", {
+        "aria-live": "polite",
+        role: "status"
+    }, selectedFile ? `Selected: ${selectedFile.name}` : "No file selected."), error ? /*#__PURE__*/ __rspack_external_react.createElement("p", {
+        "data-asset-manager-replace-error": true,
+        role: "alert"
+    }, error) : null), /*#__PURE__*/ __rspack_external_react.createElement(DialogFooter, null, /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+        type: "button",
+        variant: "outline",
+        onClick: onCancel,
+        disabled: busy
+    }, "Cancel"), /*#__PURE__*/ __rspack_external_react.createElement(Button, {
+        type: "button",
+        onClick: handleConfirm,
+        disabled: busy || null === asset || null === selectedFile
+    }, busy ? "Replacing…" : "Replace"))));
+}
+export { ReplaceAssetDialog };

package/dist/ui/UploadButton.cjs

@@ -0,0 +1,189 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    UploadButton: ()=>UploadButton
+});
+const button_namespaceObject = require("@anvilkit/ui/button");
+const external_react_namespaceObject = require("react");
+const external_plugin_cjs_namespaceObject = require("../plugin.cjs");
+const external_validate_upload_result_cjs_namespaceObject = require("../validate-upload-result.cjs");
+function UploadButton({ acceptedMimeTypes, allowMixedScriptHostnames, dataUrlAllowlistOptIn, maxFileSize, onError, onProgress, onUploaded, uploader }) {
+    const inputRef = external_react_namespaceObject.useRef(null);
+    const [errorMessage, setErrorMessage] = external_react_namespaceObject.useState(null);
+    const [batch, setBatch] = external_react_namespaceObject.useState(null);
+    const [isDragOver, setIsDragOver] = external_react_namespaceObject.useState(false);
+    const isUploading = null !== batch;
+    const acceptAttr = external_react_namespaceObject.useMemo(()=>acceptedMimeTypes?.join(","), [
+        acceptedMimeTypes
+    ]);
+    async function processFiles(files) {
+        if (0 === files.length) return;
+        const total = files.length;
+        setErrorMessage(null);
+        const initial = {
+            completed: 0,
+            total
+        };
+        setBatch(initial);
+        onProgress?.(initial);
+        let lastError = null;
+        for(let index = 0; index < files.length; index += 1){
+            const file = files[index];
+            if (file) try {
+                (0, external_plugin_cjs_namespaceObject.validateSelectedFile)(file, {
+                    acceptedMimeTypes,
+                    maxFileSize
+                });
+                const uploaded = await uploader(file);
+                const validated = (0, external_validate_upload_result_cjs_namespaceObject.validateUploadResult)({
+                    ...uploaded,
+                    meta: {
+                        size: file.size,
+                        ...file.type ? {
+                            mimeType: file.type
+                        } : {},
+                        ...uploaded.meta ?? {}
+                    }
+                }, {
+                    dataUrlAllowlistOptIn,
+                    allowMixedScriptHostnames
+                });
+                onUploaded?.(validated);
+            } catch (error) {
+                lastError = error instanceof Error ? error.message : String(error);
+                onError?.(error);
+            } finally{
+                const next = {
+                    completed: index + 1,
+                    total
+                };
+                setBatch(next);
+                onProgress?.(next);
+            }
+        }
+        if (null !== lastError) setErrorMessage(lastError);
+        setBatch(null);
+        onProgress?.(null);
+    }
+    async function handleChange(event) {
+        const list = event.currentTarget.files;
+        const picked = list ? Array.from(list) : [];
+        try {
+            await processFiles(picked);
+        } finally{
+            if (inputRef.current) inputRef.current.value = "";
+        }
+    }
+    function handleDragEnter(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (event.dataTransfer?.types?.includes("Files")) setIsDragOver(true);
+    }
+    function handleDragOver(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (event.dataTransfer) event.dataTransfer.dropEffect = "copy";
+    }
+    function handleDragLeave(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        setIsDragOver(false);
+    }
+    async function handleDrop(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        setIsDragOver(false);
+        const files = event.dataTransfer?.files ? Array.from(event.dataTransfer.files) : [];
+        await processFiles(files);
+    }
+    const statusMessage = errorMessage ?? (null !== batch ? `Uploading ${Math.min(batch.completed + 1, batch.total)} of ${batch.total}…` : "Accepted files upload through the configured adapter.");
+    return /*#__PURE__*/ external_react_namespaceObject.createElement("div", {
+        "data-asset-manager-drop-zone": true,
+        "data-drag-over": isDragOver ? "true" : void 0,
+        onDragEnter: handleDragEnter,
+        onDragLeave: handleDragLeave,
+        onDragOver: handleDragOver,
+        onDrop: (event)=>{
+            handleDrop(event);
+        },
+        tabIndex: -1
+    }, /*#__PURE__*/ external_react_namespaceObject.createElement("input", {
+        accept: acceptAttr,
+        multiple: true,
+        onChange: (event)=>{
+            handleChange(event);
+        },
+        ref: inputRef,
+        style: {
+            display: "none"
+        },
+        type: "file"
+    }), /*#__PURE__*/ external_react_namespaceObject.createElement(button_namespaceObject.Button, {
+        "aria-label": "Upload asset file",
+        disabled: isUploading,
+        onClick: ()=>{
+            inputRef.current?.click();
+        },
+        type: "button",
+        variant: "outline"
+    }, isUploading ? /*#__PURE__*/ external_react_namespaceObject.createElement(UploadSpinner, null) : null, /*#__PURE__*/ external_react_namespaceObject.createElement("span", null, isUploading ? "Uploading…" : "Upload asset")), /*#__PURE__*/ external_react_namespaceObject.createElement("p", {
+        "aria-live": "polite",
+        role: "status"
+    }, statusMessage));
+}
+function UploadSpinner() {
+    return /*#__PURE__*/ external_react_namespaceObject.createElement("svg", {
+        "aria-hidden": true,
+        fill: "none",
+        height: 14,
+        style: {
+            display: "inline-block",
+            marginRight: 6,
+            animation: "spin 1s linear infinite"
+        },
+        viewBox: "0 0 24 24",
+        width: 14
+    }, /*#__PURE__*/ external_react_namespaceObject.createElement("circle", {
+        cx: "12",
+        cy: "12",
+        opacity: "0.25",
+        r: "10",
+        stroke: "currentColor",
+        strokeWidth: "4"
+    }), /*#__PURE__*/ external_react_namespaceObject.createElement("path", {
+        d: "M4 12a8 8 0 0 1 8-8",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeWidth: "4"
+    }));
+}
+exports.UploadButton = __webpack_exports__.UploadButton;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "UploadButton"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/ui/UploadButton.d.cts

@@ -0,0 +1,17 @@
+import type { AssetManagerOptions, UploadResult } from "../types.js";
+export interface UploadProgressSnapshot {
+    readonly completed: number;
+    readonly total: number;
+}
+export interface UploadButtonProps extends Pick<AssetManagerOptions, "acceptedMimeTypes" | "maxFileSize" | "uploader" | "dataUrlAllowlistOptIn" | "allowMixedScriptHostnames"> {
+    readonly onUploaded?: (asset: UploadResult) => void;
+    readonly onError?: (error: unknown) => void;
+    /**
+     * Fires whenever the in-flight batch advances. Emitted as
+     * `{ completed, total }` while a batch is running and `null` once the
+     * batch settles. Used by `AssetManagerUI` to surface an aggregate bar.
+     */
+    readonly onProgress?: (snapshot: UploadProgressSnapshot | null) => void;
+}
+export declare function UploadButton({ acceptedMimeTypes, allowMixedScriptHostnames, dataUrlAllowlistOptIn, maxFileSize, onError, onProgress, onUploaded, uploader, }: UploadButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UploadButton.d.cts.map

package/dist/ui/UploadButton.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadButton.d.cts","sourceRoot":"","sources":["../../src/ui/UploadButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGrE,MAAM,WAAW,sBAAsB;IACtC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,iBAChB,SAAQ,IAAI,CACX,mBAAmB,EACjB,mBAAmB,GACnB,aAAa,GACb,UAAU,GACV,uBAAuB,GACvB,2BAA2B,CAC7B;IACD,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IACpD,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,sBAAsB,GAAG,IAAI,KAAK,IAAI,CAAC;CACxE;AAED,wBAAgB,YAAY,CAAC,EAC5B,iBAAiB,EACjB,yBAAyB,EACzB,qBAAqB,EACrB,WAAW,EACX,OAAO,EACP,UAAU,EACV,UAAU,EACV,QAAQ,GACR,EAAE,iBAAiB,2CAwJnB"}

package/dist/ui/UploadButton.d.ts

@@ -0,0 +1,17 @@
+import type { AssetManagerOptions, UploadResult } from "../types.js";
+export interface UploadProgressSnapshot {
+    readonly completed: number;
+    readonly total: number;
+}
+export interface UploadButtonProps extends Pick<AssetManagerOptions, "acceptedMimeTypes" | "maxFileSize" | "uploader" | "dataUrlAllowlistOptIn" | "allowMixedScriptHostnames"> {
+    readonly onUploaded?: (asset: UploadResult) => void;
+    readonly onError?: (error: unknown) => void;
+    /**
+     * Fires whenever the in-flight batch advances. Emitted as
+     * `{ completed, total }` while a batch is running and `null` once the
+     * batch settles. Used by `AssetManagerUI` to surface an aggregate bar.
+     */
+    readonly onProgress?: (snapshot: UploadProgressSnapshot | null) => void;
+}
+export declare function UploadButton({ acceptedMimeTypes, allowMixedScriptHostnames, dataUrlAllowlistOptIn, maxFileSize, onError, onProgress, onUploaded, uploader, }: UploadButtonProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=UploadButton.d.ts.map

package/dist/ui/UploadButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UploadButton.d.ts","sourceRoot":"","sources":["../../src/ui/UploadButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAGrE,MAAM,WAAW,sBAAsB;IACtC,QAAQ,CAAC,SAAS,EAAE,MAAM,CAAC;IAC3B,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACvB;AAED,MAAM,WAAW,iBAChB,SAAQ,IAAI,CACX,mBAAmB,EACjB,mBAAmB,GACnB,aAAa,GACb,UAAU,GACV,uBAAuB,GACvB,2BAA2B,CAC7B;IACD,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IACpD,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC5C;;;;OAIG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC,QAAQ,EAAE,sBAAsB,GAAG,IAAI,KAAK,IAAI,CAAC;CACxE;AAED,wBAAgB,YAAY,CAAC,EAC5B,iBAAiB,EACjB,yBAAyB,EACzB,qBAAqB,EACrB,WAAW,EACX,OAAO,EACP,UAAU,EACV,UAAU,EACV,QAAQ,GACR,EAAE,iBAAiB,2CAwJnB"}