import { formatFileSize as e } from "../internal/utils/strings.js";
import { I18nController as t } from "../internal/controllers/i18n.controller.js";
import { removeEmptyTextNode as n } from "../internal/utils/dom.js";
import { scopedRegistry as r } from "../internal/decorators/scoped-registry.js";
import { useStyles as i } from "../internal/styles/index.js";
import { __decorate as a } from "../_virtual/_@oxc-project_runtime@0.130.0/helpers/decorate.js";
import { Icon as o } from "../icon/icon2.js";
import s from "./dropzone.js";
import { fileSizeValidator as c, fileTypeValidator as l, getFileTypeSpecifiers as u } from "./dropzone.util.js";
import { LitElement as d, html as f } from "lit";
import { property as p } from "lit/decorators/property.js";
import { FormControlMixin as m } from "@nvidia-elements/forms/mixins";
import { query as h } from "lit/decorators/query.js";
//#region src/dropzone/dropzone.ts
var g = class extends m(d) {
	#e;
	static {
		this.styles = i([s]);
	}
	static {
		this.metadata = {
			tag: "nve-dropzone",
			version: "0.2.3",
			validators: [l, c],
			valueSchema: {
				type: "array",
				items: {
					type: "object",
					properties: {
						name: { type: "string" },
						size: { type: "number" },
						type: { type: "string" }
					}
				}
			}
		};
	}
	static {
		this.elementDefinitions = { [o.metadata.tag]: o };
	}
	formResetCallback() {
		this.value = [], this.requestUpdate();
	}
	constructor() {
		super(), this.accept = "image/gif, image/jpeg, image/png, image/svg+xml", this.maxFileSize = 2 * 1024 ** 2, this.#e = new t(this), this.i18n = this.#e.i18n, this.value = [];
	}
	connectedCallback() {
		super.connectedCallback(), this.setAttribute("nve-control", ""), globalThis.document.addEventListener("dragover", this.#t), globalThis.document.addEventListener("drop", this.#t);
	}
	disconnectedCallback() {
		super.disconnectedCallback(), globalThis.document.removeEventListener("dragover", this.#t), globalThis.document.removeEventListener("drop", this.#t);
	}
	#t(e) {
		e.preventDefault(), e.stopPropagation();
	}
	#n() {
		this.fileInput.click();
	}
	#r(e) {
		this.#t(e), this.#u(!0);
	}
	#i(e) {
		this.#t(e), this.#u(!0);
	}
	#a(e) {
		this.#t(e), this.#u(!1);
	}
	#o(e) {
		this.#t(e), this.#u(!1);
		let t = Array.from(e.dataTransfer.files);
		this.#c(t);
	}
	#s(e) {
		this.#t(e);
		let t = Array.from(this.fileInput.files);
		this.#c(t), this.fileInput.value = "";
	}
	#c(e) {
		this.value = [...this.value ?? [], ...e], this.dispatchChangeEvent();
	}
	#l(e) {
		let t = u(e);
		if (t.length === 1) return t[0].toUpperCase();
		let n = t.pop();
		return `${t.join(", ").toUpperCase()} or ${n.toUpperCase()}`;
	}
	#u(e) {
		this.toggleAttribute("highlighted", e);
	}
	#d(e) {
		e.target.assignedNodes().forEach((e) => n(e));
	}
	render() {
		return f`<div internal-host><div class="container" @click="${this.#n}" @dragenter="${this.#r}" @dragover="${this.#i}" @dragleave="${this.#a}" @drop="${this.#o}"><svg class="border" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg"><rect width="100%" height="100%" fill="none" rx="4" ry="4" stroke="currentColor" stroke-width="2" stroke-dasharray="6,6" stroke-dashoffset="0" stroke-linecap="square"/></svg><slot name="icon"><nve-icon part="icon" class="icon" name="upload"></nve-icon></slot><slot @slotchange="${this.#d}"><div class="text-center"><div class="text-bold">${this.i18n.dragAndDrop} ${this.i18n.files} ${this.i18n.or} <span class="text-emphasized">${this.i18n.browseFiles}</span></div><div class="text-muted">${this.#l(this.accept)} — ${this.i18n.maxFileSize} ${e(this.maxFileSize)}</div></div></slot><input id="dropzone-input" type="file" accept="${this.accept}" @change="${this.#s}" multiple="multiple" hidden></div></div>`;
	}
};
a([p()], g.prototype, "accept", void 0), a([p({
	attribute: "max-file-size",
	type: Number
})], g.prototype, "maxFileSize", void 0), a([p({ type: Object })], g.prototype, "i18n", void 0), a([h("#dropzone-input")], g.prototype, "fileInput", void 0), g = a([r()], g);
//#endregion
export { g as Dropzone };

//# sourceMappingURL=dropzone2.js.map