@nextcloud/vue/dist/chunks/NcPasswordField-Be5_qcfm.mjs

Nextcloud vue components

import '../assets/NcPasswordField-BN4HFgU5.css';
import { defineComponent, useModel, useTemplateRef, ref, computed, watch, openBlock, createBlock, mergeProps, unref, createSlots, withCtx, createVNode, renderSlot, mergeModels } from "vue";
import { q as mdiEyeOff, r as mdiEye } from "./mdi-CpchYUUV.mjs";
import axios from "@nextcloud/axios";
import { getCapabilities } from "@nextcloud/capabilities";
import { generateOcsUrl } from "@nextcloud/router";
import debounce from "debounce";
import { N as NcIconSvgWrapper } from "./NcIconSvgWrapper-g8ubWhoz.mjs";
import { N as NcInputField } from "./NcInputField-B1bGxYHt.mjs";
import { r as register, n as t29, a as t } from "./_l10n-CG4CuN3H.mjs";
import { l as logger } from "./logger-D3RVzcfQ.mjs";
import { _ as _export_sfc } from "./_plugin-vue_export-helper-1tPrXgE0.mjs";
register(t29);
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "NcPasswordField",
  props: /* @__PURE__ */ mergeModels({
    class: {},
    inputClass: { default: "" },
    id: {},
    label: {},
    labelOutside: { type: Boolean },
    placeholder: {},
    showTrailingButton: { type: Boolean, default: true },
    success: { type: Boolean },
    error: { type: Boolean },
    helperText: {},
    disabled: { type: Boolean },
    pill: { type: Boolean },
    checkPasswordStrength: { type: Boolean },
    minlength: { default: void 0 },
    asText: { type: Boolean }
  }, {
    "modelValue": { default: "" },
    "modelModifiers": {},
    "visible": { type: Boolean, ...{ default: false } },
    "visibleModifiers": {}
  }),
  emits: /* @__PURE__ */ mergeModels(["valid", "invalid"], ["update:modelValue", "update:visible"]),
  setup(__props, { expose: __expose, emit: __emit }) {
    const modelValue = useModel(__props, "modelValue");
    const visible = useModel(__props, "visible");
    const props = __props;
    const emit = __emit;
    __expose({
      focus,
      select
    });
    const { password_policy: passwordPolicy } = getCapabilities();
    const inputFieldInstance = useTemplateRef("inputField");
    const internalHelpMessage = ref("");
    const isValid = ref();
    const propsToForward = computed(() => {
      const all = { ...props };
      delete all.checkPasswordStrength;
      delete all.minlength;
      delete all.asText;
      delete all.error;
      delete all.helperText;
      delete all.inputClass;
      delete all.success;
      return all;
    });
    const minLengthWithPolicy = computed(() => {
      return props.minlength ?? (props.checkPasswordStrength ? passwordPolicy?.minLength : void 0) ?? void 0;
    });
    watch(modelValue, () => {
      isValid.value = void 0;
      internalHelpMessage.value = "";
    });
    watch(modelValue, debounce(checkPassword, 500));
    async function checkPassword() {
      if (!props.checkPasswordStrength || !modelValue.value) {
        return;
      }
      try {
        const { data } = await axios.post(generateOcsUrl("apps/password_policy/api/v1/validate"), { password: modelValue.value });
        isValid.value = data.ocs.data.passed;
        if (data.ocs.data.passed) {
          internalHelpMessage.value = t("Password is secure");
          emit("valid");
          return;
        }
        internalHelpMessage.value = data.ocs.data.reason;
        emit("invalid");
      } catch (error) {
        logger.error("Password policy returned an error", { error });
      }
    }
    function toggleVisibility() {
      visible.value = !visible.value;
    }
    function focus(options) {
      inputFieldInstance.value.focus(options);
    }
    function select() {
      inputFieldInstance.value.select();
    }
    return (_ctx, _cache) => {
      return openBlock(), createBlock(NcInputField, mergeProps(propsToForward.value, {
        ref: "inputField",
        modelValue: modelValue.value,
        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modelValue.value = $event),
        error: __props.error || isValid.value === false,
        helperText: __props.helperText || internalHelpMessage.value,
        inputClass: [__props.inputClass, { "password-field__input--secure-text": !visible.value && __props.asText }],
        minlength: minLengthWithPolicy.value,
        success: __props.success || isValid.value === true,
        trailingButtonLabel: visible.value ? unref(t)("Hide password") : unref(t)("Show password"),
        type: visible.value || __props.asText ? "text" : "password",
        onTrailingButtonClick: toggleVisibility
      }), createSlots({
        "trailing-button-icon": withCtx(() => [
          createVNode(NcIconSvgWrapper, {
            path: visible.value ? unref(mdiEyeOff) : unref(mdiEye)
          }, null, 8, ["path"])
        ]),
        _: 2
      }, [
        !!_ctx.$slots.icon ? {
          name: "icon",
          fn: withCtx(() => [
            renderSlot(_ctx.$slots, "icon", {}, void 0, true)
          ]),
          key: "0"
        } : void 0
      ]), 1040, ["modelValue", "error", "helperText", "inputClass", "minlength", "success", "trailingButtonLabel", "type"]);
    };
  }
});
const NcPasswordField = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cb828737"]]);
export {
  NcPasswordField as N
};
//# sourceMappingURL=NcPasswordField-Be5_qcfm.mjs.map