import { r as a, c as t, h as i, H as c } from "./index.61732cef.js";
import { c as l } from "./index-orsBiyT_.fc4357c3.js";
import { F as r } from "./FileSaver.min-DISpcNDq.9430eab9.js";
import { a as n, b as p, c as d, e as h, f, h as u } from "./utils-CCck-DTo.e4e43b6a.js";
import "react";
import "react-dom";
const w = () => ":host{display:inline-block;max-width:100%}.file-chip{display:flex;position:relative;max-width:100%;min-width:15rem;font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm);background-color:transparent;border-radius:var(--s-border-radius-sm);outline:1px solid var(--s-border-strong);outline-offset:-1px;padding-right:var(--s-space-16);gap:var(--s-space-12)}.file-chip:hover.file-chip--one-action .file-chip__info>*,.file-chip:focus-within.file-chip--one-action .file-chip__info>*{width:calc(100% - 44px - var(--s-space-12))}.file-chip:hover.file-chip--two-actions .file-chip__info>*,.file-chip:focus-within.file-chip--two-actions .file-chip__info>*{width:calc(100% - 88px - var(--s-space-12))}.file-chip:hover .file-chip__actions,.file-chip:focus-within .file-chip__actions{opacity:1}.file-chip__icon{display:flex;flex-shrink:0;padding:var(--s-space-16);background:var(--s-state-hovered);border-radius:var(--s-border-radius-sm) 0 0 var(--s-border-radius-sm);color:var(--s-icon-default)}.file-chip__info{display:flex;flex-direction:column;justify-content:center;min-width:0;flex-grow:1}.file-chip__name{font-weight:var(--s-font-weight-semibold)}.file-chip__description{color:var(--s-text-subdued)}.file-chip__name,.file-chip__description{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-chip__actions{display:flex;align-items:center;position:absolute;right:var(--s-space-16);top:0;bottom:0;opacity:0}.file-chip--type-image .file-chip__icon{color:var(--s-decorative-kiwi-text);background-color:var(--s-decorative-kiwi-surface-subdued)}.file-chip--type-video .file-chip__icon{color:var(--s-decorative-radish-text);background-color:var(--s-decorative-radish-surface-subdued)}.file-chip--type-audio .file-chip__icon{color:var(--s-decorative-grape-text);background-color:var(--s-decorative-grape-surface-subdued)}.file-chip--type-pdf .file-chip__icon{color:var(--s-decorative-chilli-text);background-color:var(--s-decorative-chilli-surface-subdued)}.file-chip--type-compressed .file-chip__icon{color:var(--s-decorative-pumpkin-text);background-color:var(--s-decorative-pumpkin-surface-subdued)}.file-chip--type-document .file-chip__icon{color:var(--s-decorative-blueberry-text);background-color:var(--s-decorative-blueberry-surface-subdued)}.file-chip--type-unknown .file-chip__icon{color:var(--s-decorative-banana-text);background-color:var(--s-decorative-banana-surface-subdued)}", v = class {
  constructor(e) {
    a(this, e), this.preview = t(this, "preview", 7), this.download = t(this, "download", 7), this.loadingLabel = "Loading", this.downloadButtonLabel = "Download", this.previewButtonLabel = "Preview", this.isHovered = !1, this.fileType = "unknown", this.fileIconMap = {
      image: i("swirl-icon-image", null),
      video: i("swirl-icon-video-player", null),
      audio: i("swirl-icon-audio-file", null),
      pdf: i("swirl-icon-picture-as-pdf", null),
      compressed: i("swirl-icon-folder", null),
      document: i("swirl-icon-file", null),
      unknown: i("swirl-icon-attachment", null)
    }, this.handleDownloadClick = () => {
      if (this.download.emit(), this.skipNativeDownload)
        return;
      const o = this.name || this.url.split("/").pop();
      fetch(this.url).then((s) => s.blob()).then((s) => {
        r.saveAs(s, o);
      });
    }, this.handlePreviewClick = () => {
      this.preview.emit();
    };
  }
  componentWillLoad() {
    this.setFileType();
  }
  watchType() {
    this.setFileType();
  }
  getFileIcon() {
    return this.loading ? i("swirl-spinner", { size: "s", label: this.loadingLabel }) : this.fileIconMap[this.fileType];
  }
  setFileType() {
    n(this.type) ? this.fileType = "image" : p(this.type) ? this.fileType = "video" : d(this.type) ? this.fileType = "audio" : h(this.type) ? this.fileType = "pdf" : f(this.type) ? this.fileType = "compressed" : u(this.type) ? this.fileType = "document" : this.fileType = "unknown";
  }
  render() {
    const e = +this.showPreviewButton + +this.showDownloadButton, o = l("file-chip", `file-chip--type-${this.fileType}`, {
      "file-chip--loading": this.loading,
      "file-chip--one-action": e === 1,
      "file-chip--two-actions": e === 2
    });
    return i(c, { key: "38301d94fac2123e53237e3b56d86dfab74babc3" }, i("span", { key: "74ba2d2f9d2f71761f980769a068ca99e0ca34c2", role: "group", class: o }, i("span", { key: "29daeb1add2752aaa329ec2e15b5cf0cc26eaf33", class: "file-chip__icon" }, this.getFileIcon()), i("span", { key: "ce91febea38f7843bb973b7d99fcbb45a56ba549", class: "file-chip__info" }, i("span", { key: "a1c6111f58b54845a5d9cf89e3f1e4694d80d299", class: "file-chip__name", title: this.name }, this.name), this.description && i("span", { key: "4a659e12d49528f78b48cacac0d140bb404c4667", class: "file-chip__description" }, this.description)), i("swirl-button-group", { key: "2cf078a2b31dc7c4b5ffe2d9930c1f9517762b85", class: "file-chip__actions" }, this.showPreviewButton && i("swirl-button", { key: "0a5188396d98fc503e4163e830d144a167f74e5e", variant: "flat", icon: "<swirl-icon-preview></swirl-icon-preview>", onClick: this.handlePreviewClick, label: this.previewButtonLabel, hideLabel: !0, part: "file-chip__preview" }), this.showDownloadButton && i("swirl-button", { key: "97c4cbadd38658e60ee1610c0cc6dd9ed911838b", variant: "flat", icon: "<swirl-icon-download></swirl-icon-download>", onClick: this.handleDownloadClick, label: this.downloadButtonLabel, hideLabel: !0, part: "file-chip__download" }))));
  }
  static get watchers() {
    return {
      type: [{
        watchType: 0
      }]
    };
  }
};
v.style = w();
export {
  v as swirl_file_chip
};
