import { defineComponent as I, reactive as $, useSlots as q, computed as s, watch as R, ref as U, createElementBlock as u, openBlock as t, Fragment as x, createElementVNode as f, createVNode as B, normalizeClass as O, createCommentVNode as d, withModifiers as F, withKeys as z, createBlock as a, normalizeStyle as H, unref as r, toDisplayString as c, withCtx as K, renderSlot as L, createTextVNode as j } from "vue";
/* empty css                   */
import { prettyBytes as g } from "@milaboratories/helpers";
import { getFileNameFromHandle as A, getFilePathFromHandle as G } from "@platforma-sdk/model";
import { getErrorMessage as J } from "../../helpers/error.js";
import Q from "../../utils/DoubleContour.vue2.js";
/* empty css                            */
import { useLabelNotch as W } from "../../utils/useLabelNotch.js";
import X from "../PlFileDialog/PlFileDialog.vue.js";
import m from "../PlIcon24/PlIcon24.vue.js";
import Y from "../PlTooltip/PlTooltip.vue.js";
import Z from "../../assets/images/required.svg.js";
import ee from "../PlSvg/PlSvg.vue.js";
const le = {
  key: 0,
  ref: "label"
}, te = ["data-placeholder"], oe = {
  key: 5,
  class: "pl-file-input__stats"
}, re = {
  key: 0,
  class: "pl-file-input__error"
}, ie = {
  key: 1,
  class: "pl-file-input__helper"
}, ke = /* @__PURE__ */ I({
  __name: "PlFileInput",
  props: {
    modelValue: {},
    label: { default: void 0 },
    required: { type: Boolean },
    dashed: { type: Boolean },
    extensions: { default: void 0 },
    placeholder: { default: void 0 },
    progress: { default: void 0 },
    error: { default: void 0 },
    helper: { default: void 0 },
    cellStyle: { type: Boolean, default: !1 },
    fileDialogTitle: { default: void 0 },
    fileDialogCloseOnOutsideClick: { type: Boolean, default: !0 }
  },
  emits: ["update:modelValue"],
  setup(l, { emit: N }) {
    const n = $({
      fileDialogOpen: !1,
      error: void 0
    }), v = q(), h = N, o = l, k = (e, i) => {
      if (e)
        try {
          return i(e);
        } catch (p) {
          return n.error = p instanceof Error ? p.message : String(p), e;
        }
    }, V = s(() => k(o.modelValue, A)), S = s(() => k(o.modelValue, G)), P = s(() => o.progress && !o.progress.done), E = s(() => o.progress && o.progress.done), _ = s(() => J(n.error, o.error)), y = s(() => typeof _.value == "string"), b = s(() => {
      const { status: e, done: i } = o.progress ?? {};
      return !e || !e.bytesTotal ? "" : e.bytesProcessed && !i ? g(e.bytesProcessed, {}) + " / " + g(e.bytesTotal, {}) : g(e.bytesTotal, {});
    }), T = s(() => {
      var i;
      const { progress: e } = o;
      return e ? {
        width: e.done ? "100%" : Math.round((((i = e.status) == null ? void 0 : i.progress) ?? 0) * 100) + "%"
      } : {};
    }), C = () => {
      n.fileDialogOpen = !0;
    }, w = (e) => {
      e.files.length && h("update:modelValue", e.files[0]);
    }, M = () => h("update:modelValue", void 0);
    R(
      () => o.modelValue,
      () => n.error = void 0,
      { immediate: !0 }
    );
    const D = U();
    return o.cellStyle || W(D), (e, i) => (t(), u(x, null, [
      f("div", {
        class: O([{ "pl-file-input__cell-style": !!l.cellStyle, "has-file": !!V.value }, "pl-file-input__envelope"])
      }, [
        f("div", {
          ref_key: "rootRef",
          ref: D,
          class: O([{ dashed: l.dashed, error: y.value }, "pl-file-input"]),
          tabindex: "0",
          onKeyup: z(C, ["enter"]),
          onClick: F(C, ["stop"])
        }, [
          f("div", {
            style: H(T.value),
            class: "pl-file-input__progress"
          }, null, 4),
          !l.cellStyle && l.label ? (t(), u("label", le, [
            l.required ? (t(), a(r(ee), {
              key: 0,
              uri: r(Z)
            }, null, 8, ["uri"])) : d("", !0),
            f("span", null, c(l.label), 1),
            r(v).tooltip || S.value ? (t(), a(r(Y), {
              key: 1,
              class: "info",
              position: "top"
            }, {
              tooltip: K(() => [
                r(v).tooltip ? L(e.$slots, "tooltip", { key: 0 }) : (t(), u(x, { key: 1 }, [
                  j(c(S.value), 1)
                ], 64))
              ]),
              _: 3
            })) : d("", !0)
          ], 512)) : d("", !0),
          y.value ? (t(), a(r(m), {
            key: 1,
            name: "restart"
          })) : P.value ? (t(), a(r(m), {
            key: 2,
            name: "cloud-upload"
          })) : E.value ? (t(), a(r(m), {
            key: 3,
            name: "success"
          })) : (t(), a(r(m), {
            key: 4,
            name: "paper-clip"
          })),
          f("div", {
            "data-placeholder": l.placeholder ?? "Choose file",
            class: "pl-file-input__filename"
          }, c(V.value), 9, te),
          b.value ? (t(), u("div", oe, c(b.value), 1)) : d("", !0),
          l.modelValue ? (t(), a(r(m), {
            key: 6,
            class: "pl-file-input__clear",
            name: "close",
            onClick: F(M, ["stop"])
          })) : d("", !0),
          B(Q, { class: "pl-file-input__contour" })
        ], 34),
        y.value ? (t(), u("div", re, c(_.value), 1)) : l.helper ? (t(), u("div", ie, c(l.helper), 1)) : d("", !0)
      ], 2),
      B(r(X), {
        modelValue: n.fileDialogOpen,
        "onUpdate:modelValue": i[0] || (i[0] = (p) => n.fileDialogOpen = p),
        "close-on-outside-click": l.fileDialogCloseOnOutsideClick,
        extensions: l.extensions,
        title: l.fileDialogTitle,
        "onImport:files": w
      }, null, 8, ["modelValue", "close-on-outside-click", "extensions", "title"])
    ], 64));
  }
});
export {
  ke as default
};
//# sourceMappingURL=PlFileInput.vue.js.map
