import { defineComponent as M, mergeModels as g, useModel as F, ref as m, computed as k, watch as c, createElementBlock as N, openBlock as n, createBlock as p, createCommentVNode as A, createVNode as r, unref as l, withCtx as f, createTextVNode as E, toDisplayString as R } from "vue";
import { p as S, d as h, I as $, X as U, Y as D } from "./start-CE9SawgU.js";
import "vue-i18n";
import "pinia";
import { K as P } from "./header-Bn1EKnBE.js";
import { k as B } from "./validation-BkM0nwzq.js";
const Y = { class: "d-flex justify-space-between align-center" }, G = /* @__PURE__ */ M({
  __name: "KeyTextField",
  props: /* @__PURE__ */ g({
    editable: { type: Boolean },
    readonly: { type: Boolean },
    loading: { type: Boolean },
    label: { default: "datahub-ui.dh-table.key" },
    title: { default: "datahub-ui.dh-shared.updateKeyTitle" },
    warning: { default: "datahub-ui.dh-shared.updateKeyWarning" },
    pattern: { default: P }
  }, {
    modelValue: {},
    modelModifiers: {}
  }),
  emits: /* @__PURE__ */ g(["updated", "validation"], ["update:modelValue"]),
  setup(v, { expose: w, emit: T }) {
    const y = v, b = T, d = F(v, "modelValue"), V = m(), i = m(!1), t = m("");
    function C() {
      V.value?.focus();
    }
    const u = k(B(t, y.pattern)), s = k(B(d, y.pattern));
    function K() {
      d.value = t.value, i.value = !1, b("updated", t.value);
    }
    return c(s, (e) => b("validation", !!e), {
      immediate: !0
    }), c(
      d,
      (e) => {
        t.value = e;
      },
      { immediate: !0 }
    ), w({ focus: C }), (e, a) => (n(), N("div", Y, [
      e.loading ? (n(), p(l(S), {
        key: 0,
        height: "16",
        type: "text"
      })) : (n(), p(l(h), {
        key: 1,
        ref_key: "keyTextFieldRef",
        ref: V,
        modelValue: d.value,
        "onUpdate:modelValue": a[0] || (a[0] = (o) => d.value = o),
        label: e.$t(e.label),
        readonly: !e.editable,
        "error-messages": !e.readonly && s.value ? e.$t(s.value) : void 0,
        autofocus: ""
      }, null, 8, ["modelValue", "label", "readonly", "error-messages"])),
      !e.readonly && !e.editable ? (n(), p(l($), {
        key: 2,
        class: "ml-4",
        icon: "lucide:pencil",
        variant: "text",
        disabled: e.loading,
        onClick: a[1] || (a[1] = (o) => i.value = !0)
      }, null, 8, ["disabled"])) : A("", !0),
      r(l(U), {
        modelValue: i.value,
        "onUpdate:modelValue": a[3] || (a[3] = (o) => i.value = o),
        title: e.$t(e.title),
        "min-width": "600px",
        "max-width": "800px"
      }, {
        actions: f(() => [
          r(l($), {
            text: e.$t("datahub-ui.dh-shared.save"),
            disabled: !!u.value,
            color: "primary",
            onClick: K
          }, null, 8, ["text", "disabled"])
        ]),
        default: f(() => [
          r(l(D), {
            icon: "lucide:triangle-alert",
            type: "error",
            class: "mb-4"
          }, {
            default: f(() => [
              E(R(e.$t(e.warning)), 1)
            ]),
            _: 1
          }),
          r(l(h), {
            modelValue: t.value,
            "onUpdate:modelValue": a[2] || (a[2] = (o) => t.value = o),
            label: e.$t(e.label),
            "error-messages": !e.readonly && u.value ? e.$t(u.value) : void 0
          }, null, 8, ["modelValue", "label", "error-messages"])
        ]),
        _: 1
      }, 8, ["modelValue", "title"])
    ]));
  }
});
export {
  G as _
};
