@nextcloud/vue 8.11.2 → 8.12.0

package/dist/chunks/NcActionInput-N2wrvq5K.cjs

@@ -1,235 +0,0 @@
-require('../assets/NcActionInput-8F2WF3yH.css');
-"use strict";
-const n = require("../Components/NcDateTimePicker.cjs"), r = require("../Components/NcDateTimePickerNative.cjs"), c = require("./NcPasswordField-BooDzf0Z.cjs"), o = require("./NcSelect-Bn3oTHtq.cjs"), u = require("./NcTextField-B5cUYgRy.cjs"), d = require("./actionGlobal-DL1VaQzF.cjs"), s = require("./GenRandomId-B2O1GMbH.cjs"), l = require("./_l10n-B8iumFKB.cjs"), p = require("./_plugin-vue2_normalizer-GXKvuwrq.cjs");
-l.register(l.t41);
-const b = {
-  name: "NcActionInput",
-  components: {
-    NcDateTimePicker: n,
-    NcDateTimePickerNative: r,
-    NcPasswordField: c.NcPasswordField,
-    NcSelect: o.NcSelect,
-    NcTextField: u.NcTextField
-  },
-  mixins: [d.ActionGlobalMixin],
-  props: {
-    /**
-     * id attribute of the checkbox element
-     */
-    id: {
-      type: String,
-      default: () => "action-" + s.GenRandomId(),
-      validator: (t) => t.trim() !== ""
-    },
-    /**
-     * id attribute of the text input element
-     */
-    inputId: {
-      type: String,
-      default: () => "action-input-" + s.GenRandomId(),
-      validator: (t) => t.trim() !== ""
-    },
-    /**
-     * Icon to show with the action, can be either a CSS class or an URL
-     */
-    icon: {
-      type: String,
-      default: ""
-    },
-    /**
-     * type attribute of the input field
-     */
-    type: {
-      type: String,
-      default: "text",
-      validator(t) {
-        return [
-          "date",
-          "datetime-local",
-          "month",
-          "multiselect",
-          "number",
-          "password",
-          "search",
-          "tel",
-          "text",
-          "time",
-          "url",
-          "week",
-          "color",
-          "email"
-        ].indexOf(t) > -1;
-      }
-    },
-    /**
-     * id attribute for the native date time picker
-     */
-    idNativeDateTimePicker: {
-      type: String,
-      default: "date-time-picker_id"
-    },
-    /**
-     * Flag to use a native date time picker
-     */
-    isNativePicker: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * The visible input label for accessibility purposes.
-     */
-    label: {
-      type: String,
-      default: null
-    },
-    /**
-     * If you want to show the label just above the
-     * input field, pass in `true` to this prop.
-     */
-    labelOutside: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * value attribute of the input field
-     */
-    value: {
-      type: [String, Date, Number, Array],
-      default: ""
-    },
-    /**
-     * disabled state of the input field
-     */
-    disabled: {
-      type: Boolean,
-      default: !1
-    },
-    /**
-     * aria-label attribute of the input field
-     */
-    ariaLabel: {
-      type: String,
-      default: ""
-    },
-    /**
-     * @deprecated To be removed in @nextcloud/vue 9. Migration guide: remove ariaHidden prop from NcAction* components.
-     * @todo Add a check in @nextcloud/vue 9 that this prop is not provided,
-     * otherwise root element will inherit incorrect aria-hidden.
-     */
-    ariaHidden: {
-      type: Boolean,
-      default: null
-    },
-    /**
-     * Attribute forwarded to the underlying NcPasswordField and NcTextField
-     */
-    showTrailingButton: {
-      type: Boolean,
-      default: !0
-    },
-    /**
-     * Trailing button label forwarded to the underlying NcTextField
-     */
-    trailingButtonLabel: {
-      type: String,
-      default: l.t("Submit")
-    }
-  },
-  emits: [
-    "input",
-    "submit",
-    "change",
-    "update:value"
-  ],
-  computed: {
-    isIconUrl() {
-      try {
-        return new URL(this.icon);
-      } catch {
-        return !1;
-      }
-    },
-    isMultiselectType() {
-      return this.type === "multiselect";
-    },
-    nativeDatePickerType() {
-      switch (this.type) {
-        case "date":
-        case "month":
-        case "time":
-        case "week":
-        case "datetime-local":
-          return this.type;
-      }
-      return !1;
-    },
-    datePickerType() {
-      if (!this.isNativePicker)
-        switch (this.type) {
-          case "date":
-          case "month":
-          case "time":
-            return this.type;
-          case "datetime-local":
-            return "datetime";
-        }
-      return !1;
-    },
-    /**
-     * determines if the action is focusable
-     *
-     * @return {boolean} is the action focusable ?
-     */
-    isFocusable() {
-      return !this.disabled;
-    }
-  },
-  methods: {
-    // closing datepicker popup on mouseleave = unfocus
-    onLeave() {
-      this.$refs.datetimepicker && this.$refs.datetimepicker.$refs.datepicker && this.$refs.datetimepicker.$refs.datepicker.closePopup();
-    },
-    onInput(t) {
-      this.$emit("input", t), this.$emit("update:value", t.target ? t.target.value : t);
-    },
-    onSubmit(t) {
-      if (t.preventDefault(), t.stopPropagation(), !this.disabled)
-        this.$emit("submit", t);
-      else
-        return !1;
-    },
-    onChange(t) {
-      this.$emit("change", t);
-    }
-  }
-};
-var m = function() {
-  var e = this, i = e._self._c;
-  return i("li", { staticClass: "action", class: { "action--disabled": e.disabled } }, [i("span", { staticClass: "action-input", class: {
-    "action-input-picker--disabled": e.disabled,
-    "action-input--visible-label": e.labelOutside && e.label
-  }, on: { mouseleave: e.onLeave } }, [i("span", { staticClass: "action-input__icon-wrapper" }, [e._t("icon", function() {
-    return [i("span", { staticClass: "action-input__icon", class: [e.isIconUrl ? "action-input__icon--url" : e.icon], style: { backgroundImage: e.isIconUrl ? "url(".concat(e.icon, ")") : null }, attrs: { "aria-hidden": "true" } })];
-  })], 2), i("form", { ref: "form", staticClass: "action-input__form", attrs: { disabled: e.disabled }, on: { submit: function(a) {
-    return a.preventDefault(), e.onSubmit.apply(null, arguments);
-  } } }, [i("div", { staticClass: "action-input__container" }, [e.label && e.labelOutside ? i("label", { staticClass: "action-input__text-label", class: { "action-input__text-label--hidden": !e.labelOutside }, attrs: { for: e.inputId } }, [e._v(" " + e._s(e.label) + " ")]) : e._e(), i("div", { staticClass: "action-input__input-container" }, [e.datePickerType ? i("NcDateTimePicker", e._b({ ref: "datetimepicker", staticClass: "action-input__datetimepicker", staticStyle: { "z-index": "99999999999" }, attrs: { value: e.value, placeholder: e.text, disabled: e.disabled, type: e.datePickerType, "input-class": ["mx-input", { focusable: e.isFocusable }] }, on: { input: e.onInput, change: e.onChange } }, "NcDateTimePicker", e.$attrs, !1)) : e.isNativePicker ? i("NcDateTimePickerNative", e._b({ staticClass: "action-input__datetimepicker", attrs: { id: e.idNativeDateTimePicker, value: e.value, type: e.nativeDatePickerType, "input-class": { focusable: e.isFocusable } }, on: { input: function(a) {
-    return e.$emit("input", a);
-  }, change: function(a) {
-    return e.$emit("change", a);
-  } } }, "NcDateTimePickerNative", e.$attrs, !1)) : e.isMultiselectType ? i("NcSelect", e._g(e._b({ staticClass: "action-input__multi", attrs: { value: e.value, placeholder: e.text, disabled: e.disabled, "append-to-body": e.$attrs.appendToBody || e.$attrs["append-to-body"] || !1, "input-class": { focusable: e.isFocusable } } }, "NcSelect", e.$attrs, !1), e.$listeners)) : e.type === "password" ? i("NcPasswordField", e._g(e._b({ attrs: { id: e.inputId, value: e.value, label: e.label, "label-outside": !e.label || e.labelOutside, placeholder: e.text, disabled: e.disabled, "input-class": { focusable: e.isFocusable }, "show-trailing-button": e.showTrailingButton && !e.disabled }, on: { input: e.onInput, change: e.onChange } }, "NcPasswordField", e.$attrs, !1), e.$listeners)) : e.type === "color" ? i("div", { staticClass: "action-input__container" }, [e.label && e.type === "color" ? i("label", { staticClass: "action-input__text-label", class: { "action-input__text-label--hidden": !e.labelOutside }, attrs: { for: e.inputId } }, [e._v(" " + e._s(e.label) + " ")]) : e._e(), i("div", { staticClass: "action-input__input-container" }, [i("NcColorPicker", e._g(e._b({ staticClass: "colorpicker__trigger", attrs: { id: "inputId", value: e.value }, on: { input: e.onInput, submit: function(a) {
-    return e.$refs.form.requestSubmit();
-  } } }, "NcColorPicker", e.$attrs, !1), e.$listeners), [i("button", { staticClass: "colorpicker__preview", class: { focusable: e.isFocusable }, style: { "background-color": e.value } })])], 1)]) : i("NcTextField", e._g(e._b({ attrs: { id: e.inputId, value: e.value, label: e.label, "label-outside": !e.label || e.labelOutside, placeholder: e.text, disabled: e.disabled, "input-class": { focusable: e.isFocusable }, type: e.type, "trailing-button-icon": "arrowRight", "trailing-button-label": e.trailingButtonLabel, "show-trailing-button": e.showTrailingButton && !e.disabled }, on: { "trailing-button-click": function(a) {
-    return e.$refs.form.requestSubmit();
-  }, input: e.onInput, change: e.onChange } }, "NcTextField", e.$attrs, !1), e.$listeners))], 1)])])])]);
-}, _ = [], f = /* @__PURE__ */ p.normalizeComponent(
-  b,
-  m,
-  _,
-  !1,
-  null,
-  "3706febe",
-  null,
-  null
-);
-const h = f.exports;
-exports.NcActionInput = h;