@nextcloud/vue/dist/Components/NcSelect.mjs

Nextcloud vue components

import "../assets/index10.css";
import { VueSelect as r } from "@nextcloud/vue-select";
import "@nextcloud/vue-select/dist/vue-select.css";
import { autoUpdate as c, computePosition as u, offset as p, flip as f, shift as d, limitShift as m } from "@floating-ui/dom";
import y from "vue-material-design-icons/ChevronDown.vue";
import h from "vue-material-design-icons/Close.vue";
import g from "./NcEllipsisedOption.mjs";
import b from "./NcListItemIcon.mjs";
import S from "./NcLoadingIcon.mjs";
import { l as _ } from "../chunks/l10n-05baf7da.mjs";
import { n as L } from "../chunks/_plugin-vue2_normalizer-5b4c43a4.mjs";
const B = { name: "NcSelect", components: { ChevronDown: y, NcEllipsisedOption: g, NcListItemIcon: b, NcLoadingIcon: S, VueSelect: r }, mixins: [_], props: { ...r.props, appendToBody: { type: Boolean, default: !0 }, calculatePosition: { type: Function, default: null }, closeOnSelect: { type: Boolean, default: !0 }, components: { type: Object, default: () => ({ Deselect: { render: (e) => e(h, { props: { size: 20, fillColor: "var(--vs-controls-color)" }, style: { cursor: "pointer" } }) } }) }, limit: { type: Number, default: null }, disabled: { type: Boolean, default: !1 }, dropdownShouldOpen: { type: Function, default: ({ noDrop: e, open: l }) => e ? !1 : l }, filterBy: { type: Function, default: null }, inputClass: { type: [String, Object], default: null }, inputId: { type: String, default: null }, keyboardFocusBorder: { type: Boolean, default: !0 }, label: { type: String, default: null }, loading: { type: Boolean, default: !1 }, multiple: { type: Boolean, default: !1 }, noWrap: { type: Boolean, default: !1 }, options: { type: Array, default: () => [] }, placeholder: { type: String, default: "" }, mapKeydown: { type: Function, default(e, l) {
  return { ...e, 27: (t) => {
    l.open && t.stopPropagation(), e[27](t);
  } };
} }, placement: { type: String, default: "bottom" }, resetFocusOnOptionsChange: { type: Boolean, default: !0 }, userSelect: { type: Boolean, default: !1 }, value: { type: [String, Number, Object, Array], default: null }, " ": {} }, emits: [" "], data() {
  return { search: "" };
}, computed: { localCalculatePosition() {
  return this.calculatePosition !== null ? this.calculatePosition : (e, l, { width: t }) => {
    e.style.width = t;
    const o = { name: "addClass", fn(a) {
      return e.classList.add("vs__dropdown-menu--floating"), {};
    } }, n = { name: "togglePlacementClass", fn({ placement: a }) {
      return l.$el.classList.toggle("select--drop-up", a === "top"), e.classList.toggle("vs__dropdown-menu--floating-placement-top", a === "top"), {};
    } }, s = () => {
      u(l.$refs.toggle, e, { placement: this.placement, middleware: [p(-1), o, n, f(), d({ limiter: m() })] }).then(({ x: a, y: i }) => {
        Object.assign(e.style, { left: `${a}px`, top: `${i}px` });
      });
    };
    return c(l.$refs.toggle, e, s);
  };
}, localFilterBy() {
  return this.filterBy !== null ? this.filterBy : this.userSelect ? (e, l, t) => (`${l} ${e.subname}` || "").toLocaleLowerCase().indexOf(t.toLocaleLowerCase()) > -1 : r.props.filterBy.default;
}, localLabel() {
  return this.label !== null ? this.label : this.userSelect ? "displayName" : r.props.label.default;
}, propsToForward() {
  const { inputClass: e, noWrap: l, placement: t, userSelect: o, ...n } = this.$props;
  return { ...n, calculatePosition: this.localCalculatePosition, filterBy: this.localFilterBy, label: this.localLabel };
} } };
var v = function() {
  var e = this, l = e._self._c;
  return l("VueSelect", e._g(e._b({ staticClass: "select", class: { "select--no-wrap": e.noWrap }, on: { search: (t) => e.search = t }, scopedSlots: e._u([{ key: "search", fn: function({ attributes: t, events: o }) {
    return [l("input", e._g(e._b({ class: ["vs__search", e.inputClass] }, "input", t, !1), o))];
  } }, { key: "open-indicator", fn: function({ attributes: t }) {
    return [l("ChevronDown", e._b({ attrs: { "fill-color": "var(--vs-controls-color)", size: 26 } }, "ChevronDown", t, !1))];
  } }, { key: "option", fn: function(t) {
    return [e.userSelect ? l("NcListItemIcon", e._b({ attrs: { name: t[e.localLabel], search: e.search } }, "NcListItemIcon", t, !1)) : l("NcEllipsisedOption", { attrs: { name: String(t[e.localLabel]), search: e.search } })];
  } }, { key: "selected-option", fn: function(t) {
    return [e.userSelect ? l("NcListItemIcon", e._b({ attrs: { name: t[e.localLabel], search: e.search } }, "NcListItemIcon", t, !1)) : l("NcEllipsisedOption", { attrs: { name: String(t[e.localLabel]), search: e.search } })];
  } }, { key: "spinner", fn: function(t) {
    return [t.loading ? l("NcLoadingIcon") : e._e()];
  } }, { key: "no-options", fn: function() {
    return [e._v(" " + e._s(e.t("No results")) + " ")];
  }, proxy: !0 }, e._l(e.$scopedSlots, function(t, o) {
    return { key: o, fn: function(n) {
      return [e._t(o, null, null, n)];
    } };
  })], null, !0) }, "VueSelect", e.propsToForward, !1), e.$listeners));
}, C = [], N = L(B, v, C, !1, null, null, null, null);
const A = N.exports;
export {
  A as default
};