vitam-uikit-apps 0.1.0

package/dist/vitam-uikit-apps.esm.js

@@ -0,0 +1,1990 @@
+import { defineComponent as I, openBlock as t, createElementBlock as a, normalizeClass as $, createCommentVNode as u, renderSlot as B, createTextVNode as z, toDisplayString as m, computed as S, createElementVNode as o, ref as T, watch as M, normalizeStyle as O, Fragment as p, renderList as V, onMounted as j, onBeforeUnmount as D, createVNode as K, Transition as N, withCtx as A, nextTick as R, createBlock as E, Teleport as P, withDirectives as G, vShow as W, resolveDynamicComponent as U, withKeys as L, withModifiers as F } from "vue";
+const H = ["type", "disabled", "aria-busy"], J = ["src"], Ua = /* @__PURE__ */ I({
+  __name: "Button",
+  props: {
+    label: {},
+    variant: { default: "info" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    loading: { type: Boolean, default: !1 },
+    type: { default: "button" },
+    fullWidth: { type: Boolean, default: !1 },
+    leftIconSrc: {}
+  },
+  emits: ["click"],
+  setup(e, { emit: c }) {
+    const l = e, d = c;
+    function n(s) {
+      !l.disabled && !l.loading && d("click", s);
+    }
+    return (s, i) => (t(), a("button", {
+      type: e.type,
+      disabled: e.disabled || e.loading,
+      "aria-busy": e.loading || void 0,
+      class: $([
+        "vk-button",
+        `vk-button--${e.variant}`,
+        `vk-button--${e.size}`,
+        { "vk-button--full-width": e.fullWidth },
+        { "vk-button--loading": e.loading },
+        { "vk-button--disabled": e.disabled }
+      ]),
+      onClick: n
+    }, [
+      e.leftIconSrc ? (t(), a("img", {
+        key: 0,
+        src: e.leftIconSrc,
+        class: "vk-button__icon vk-button__icon--left",
+        "aria-hidden": "true",
+        alt: ""
+      }, null, 8, J)) : u("", !0),
+      B(s.$slots, "default", {}, () => [
+        z(m(e.label), 1)
+      ])
+    ], 10, H));
+  }
+}), Q = ["for"], X = {
+  key: 0,
+  class: "vk-input__required",
+  "aria-hidden": "true"
+}, Y = { class: "vk-input__wrapper" }, Z = ["src"], ee = ["id", "type", "value", "placeholder", "disabled", "readonly", "required", "aria-describedby", "aria-invalid"], te = ["id"], ae = ["id"], Ha = /* @__PURE__ */ I({
+  __name: "Input",
+  props: {
+    modelValue: {},
+    type: { default: "text" },
+    placeholder: {},
+    label: {},
+    hint: {},
+    error: {},
+    leftIconSrc: {},
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "info" },
+    id: {}
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(
+      () => l.id ?? `vk-input-${Math.random().toString(36).slice(2, 9)}`
+    ), s = S(() => l.error ? `${n.value}-error` : l.hint ? `${n.value}-hint` : null);
+    function i(f) {
+      const v = f.target;
+      d("update:modelValue", v.value);
+    }
+    return (f, v) => (t(), a("div", {
+      class: $([
+        "vk-input",
+        `vk-input--${e.size}`,
+        `vk-input--${e.variant}`,
+        { "vk-input--error": !!e.error },
+        { "vk-input--disabled": e.disabled }
+      ])
+    }, [
+      e.label ? (t(), a("label", {
+        key: 0,
+        for: n.value,
+        class: "vk-input__label"
+      }, [
+        z(m(e.label) + " ", 1),
+        e.required ? (t(), a("span", X, "*")) : u("", !0)
+      ], 8, Q)) : u("", !0),
+      o("div", Y, [
+        e.leftIconSrc ? (t(), a("img", {
+          key: 0,
+          src: e.leftIconSrc,
+          class: "vk-input__icon vk-input__icon--left",
+          "aria-hidden": "true",
+          alt: ""
+        }, null, 8, Z)) : u("", !0),
+        o("input", {
+          id: n.value,
+          type: e.type,
+          value: e.modelValue,
+          placeholder: e.placeholder,
+          disabled: e.disabled,
+          readonly: e.readonly,
+          required: e.required,
+          "aria-describedby": s.value || void 0,
+          "aria-invalid": e.error ? "true" : void 0,
+          class: $(["vk-input__field", { "vk-input__field--has-icon": !!e.leftIconSrc }]),
+          onInput: i,
+          onBlur: v[0] || (v[0] = (h) => d("blur", h)),
+          onFocus: v[1] || (v[1] = (h) => d("focus", h))
+        }, null, 42, ee)
+      ]),
+      e.error ? (t(), a("span", {
+        key: 1,
+        id: `${n.value}-error`,
+        class: "vk-input__message vk-input__message--error",
+        role: "alert"
+      }, m(e.error), 9, te)) : e.hint ? (t(), a("span", {
+        key: 2,
+        id: `${n.value}-hint`,
+        class: "vk-input__message vk-input__message--hint"
+      }, m(e.hint), 9, ae)) : u("", !0)
+    ], 2));
+  }
+}), le = ["for"], ne = {
+  key: 0,
+  class: "vk-textarea__required",
+  "aria-hidden": "true"
+}, ie = { class: "vk-textarea__wrapper" }, se = ["src"], oe = ["id", "value", "placeholder", "rows", "maxlength", "disabled", "readonly", "required", "aria-describedby", "aria-invalid"], re = { class: "vk-textarea__footer" }, ce = ["id"], de = ["id"], ue = ["aria-label"], Ja = /* @__PURE__ */ I({
+  __name: "TextArea",
+  props: {
+    modelValue: {},
+    label: {},
+    placeholder: {},
+    hint: {},
+    error: {},
+    rows: { default: 4 },
+    maxLength: {},
+    resize: { default: "vertical" },
+    leftIconSrc: {},
+    disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "info" },
+    id: {}
+  },
+  emits: ["update:modelValue", "blur", "focus"],
+  setup(e, { emit: c }) {
+    var v;
+    const l = e, d = c, n = S(
+      () => l.id ?? `vk-textarea-${Math.random().toString(36).slice(2, 9)}`
+    ), s = T(((v = l.modelValue) == null ? void 0 : v.length) ?? 0);
+    M(
+      () => l.modelValue,
+      (h) => {
+        s.value = (h == null ? void 0 : h.length) ?? 0;
+      }
+    );
+    const i = S(() => l.error ? `${n.value}-error` : l.hint ? `${n.value}-hint` : null);
+    function f(h) {
+      const k = h.target;
+      s.value = k.value.length, d("update:modelValue", k.value);
+    }
+    return (h, k) => (t(), a("div", {
+      class: $([
+        "vk-textarea",
+        `vk-textarea--${e.size}`,
+        `vk-textarea--${e.variant}`,
+        { "vk-textarea--error": !!e.error },
+        { "vk-textarea--disabled": e.disabled }
+      ])
+    }, [
+      e.label ? (t(), a("label", {
+        key: 0,
+        for: n.value,
+        class: "vk-textarea__label"
+      }, [
+        z(m(e.label) + " ", 1),
+        e.required ? (t(), a("span", ne, "*")) : u("", !0)
+      ], 8, le)) : u("", !0),
+      o("div", ie, [
+        e.leftIconSrc ? (t(), a("img", {
+          key: 0,
+          src: e.leftIconSrc,
+          class: "vk-textarea__icon",
+          "aria-hidden": "true",
+          alt: ""
+        }, null, 8, se)) : u("", !0),
+        o("textarea", {
+          id: n.value,
+          value: e.modelValue,
+          placeholder: e.placeholder,
+          rows: e.rows,
+          maxlength: e.maxLength,
+          disabled: e.disabled,
+          readonly: e.readonly,
+          required: e.required,
+          "aria-describedby": i.value || void 0,
+          "aria-invalid": e.error ? "true" : void 0,
+          class: $([
+            "vk-textarea__field",
+            { "vk-textarea__field--has-icon": !!e.leftIconSrc }
+          ]),
+          style: O({ resize: e.resize }),
+          onInput: f,
+          onBlur: k[0] || (k[0] = (r) => d("blur", r)),
+          onFocus: k[1] || (k[1] = (r) => d("focus", r))
+        }, null, 46, oe)
+      ]),
+      o("div", re, [
+        e.error ? (t(), a("span", {
+          key: 0,
+          id: `${n.value}-error`,
+          class: "vk-textarea__message vk-textarea__message--error",
+          role: "alert"
+        }, m(e.error), 9, ce)) : e.hint ? (t(), a("span", {
+          key: 1,
+          id: `${n.value}-hint`,
+          class: "vk-textarea__message vk-textarea__message--hint"
+        }, m(e.hint), 9, de)) : u("", !0),
+        e.maxLength ? (t(), a("span", {
+          key: 2,
+          class: "vk-textarea__char-count",
+          "aria-label": `${s.value} of ${e.maxLength} characters used`
+        }, m(s.value) + "/" + m(e.maxLength), 9, ue)) : u("", !0)
+      ])
+    ], 2));
+  }
+}), ve = ["for"], fe = {
+  key: 0,
+  class: "vk-selector__required",
+  "aria-hidden": "true"
+}, ke = { class: "vk-selector__wrapper" }, be = ["src"], he = ["id", "value", "disabled", "required", "aria-describedby", "aria-invalid"], me = ["selected"], _e = ["value", "disabled"], ye = ["id"], Qa = /* @__PURE__ */ I({
+  __name: "Selector",
+  props: {
+    modelValue: {},
+    options: {},
+    label: {},
+    placeholder: { default: "Select an option" },
+    leftIconSrc: {},
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    error: {},
+    size: { default: "md" },
+    variant: { default: "info" },
+    id: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(
+      () => l.id ?? `vk-selector-${Math.random().toString(36).slice(2, 9)}`
+    );
+    function s(i) {
+      const v = i.target.value, h = l.options.find((r) => String(r.value) === v), k = h ? h.value : v || null;
+      d("update:modelValue", k), d("change", k);
+    }
+    return (i, f) => (t(), a("div", {
+      class: $([
+        "vk-selector",
+        `vk-selector--${e.size}`,
+        `vk-selector--${e.variant}`,
+        { "vk-selector--error": !!e.error },
+        { "vk-selector--disabled": e.disabled }
+      ])
+    }, [
+      e.label ? (t(), a("label", {
+        key: 0,
+        for: n.value,
+        class: "vk-selector__label"
+      }, [
+        z(m(e.label) + " ", 1),
+        e.required ? (t(), a("span", fe, "*")) : u("", !0)
+      ], 8, ve)) : u("", !0),
+      o("div", ke, [
+        e.leftIconSrc ? (t(), a("img", {
+          key: 0,
+          src: e.leftIconSrc,
+          class: "vk-selector__icon vk-selector__icon--left",
+          "aria-hidden": "true",
+          alt: ""
+        }, null, 8, be)) : u("", !0),
+        o("select", {
+          id: n.value,
+          value: e.modelValue ?? "",
+          disabled: e.disabled,
+          required: e.required,
+          "aria-describedby": e.error ? `${n.value}-error` : void 0,
+          "aria-invalid": e.error ? "true" : void 0,
+          class: $([
+            "vk-selector__field",
+            { "vk-selector__field--has-icon": !!e.leftIconSrc },
+            { "vk-selector__field--placeholder": e.modelValue === null || e.modelValue === void 0 }
+          ]),
+          onChange: s
+        }, [
+          e.placeholder ? (t(), a("option", {
+            key: 0,
+            value: "",
+            disabled: "",
+            selected: e.modelValue === null || e.modelValue === void 0,
+            hidden: ""
+          }, m(e.placeholder), 9, me)) : u("", !0),
+          (t(!0), a(p, null, V(e.options, (v) => (t(), a("option", {
+            key: v.value,
+            value: v.value,
+            disabled: v.disabled
+          }, m(v.label), 9, _e))), 128))
+        ], 42, he),
+        f[0] || (f[0] = o("span", {
+          class: "vk-selector__caret",
+          "aria-hidden": "true"
+        }, null, -1))
+      ]),
+      e.error ? (t(), a("span", {
+        key: 1,
+        id: `${n.value}-error`,
+        class: "vk-selector__message vk-selector__message--error",
+        role: "alert"
+      }, m(e.error), 9, ye)) : u("", !0)
+    ], 2));
+  }
+}), $e = ["for"], ge = { class: "vk-checkbox__control" }, xe = ["id", "checked", "disabled", "required"], we = {
+  class: "vk-checkbox__box",
+  "aria-hidden": "true"
+}, Ie = {
+  key: 0,
+  class: "vk-checkbox__mark",
+  viewBox: "0 0 12 12",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, Se = {
+  key: 1,
+  class: "vk-checkbox__mark",
+  viewBox: "0 0 12 12",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, Be = {
+  key: 0,
+  class: "vk-checkbox__content"
+}, Ce = {
+  key: 0,
+  class: "vk-checkbox__label"
+}, pe = {
+  key: 0,
+  class: "vk-checkbox__required",
+  "aria-hidden": "true"
+}, Ve = {
+  key: 1,
+  class: "vk-checkbox__description"
+}, Xa = /* @__PURE__ */ I({
+  __name: "Checkbox",
+  props: {
+    modelValue: { type: Boolean, default: !1 },
+    label: {},
+    description: {},
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    indeterminate: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "info" },
+    id: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(
+      () => l.id ?? `vk-checkbox-${Math.random().toString(36).slice(2, 9)}`
+    ), s = T(null);
+    M(
+      () => l.indeterminate,
+      (f) => {
+        s.value && (s.value.indeterminate = f);
+      },
+      { immediate: !0 }
+    );
+    function i(f) {
+      const v = f.target.checked;
+      d("update:modelValue", v), d("change", v);
+    }
+    return (f, v) => (t(), a("label", {
+      for: n.value,
+      class: $([
+        "vk-checkbox",
+        `vk-checkbox--${e.size}`,
+        `vk-checkbox--${e.variant}`,
+        { "vk-checkbox--checked": e.modelValue },
+        { "vk-checkbox--indeterminate": e.indeterminate },
+        { "vk-checkbox--disabled": e.disabled }
+      ])
+    }, [
+      o("span", ge, [
+        o("input", {
+          id: n.value,
+          ref_key: "inputRef",
+          ref: s,
+          type: "checkbox",
+          class: "vk-checkbox__input",
+          checked: e.modelValue,
+          disabled: e.disabled,
+          required: e.required,
+          onChange: i
+        }, null, 40, xe),
+        o("span", we, [
+          e.modelValue && !e.indeterminate ? (t(), a("svg", Ie, [...v[0] || (v[0] = [
+            o("polyline", {
+              points: "1.5,6 4.5,9.5 10.5,2.5",
+              stroke: "currentColor",
+              "stroke-width": "2",
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round"
+            }, null, -1)
+          ])])) : e.indeterminate ? (t(), a("svg", Se, [...v[1] || (v[1] = [
+            o("line", {
+              x1: "2",
+              y1: "6",
+              x2: "10",
+              y2: "6",
+              stroke: "currentColor",
+              "stroke-width": "2",
+              "stroke-linecap": "round"
+            }, null, -1)
+          ])])) : u("", !0)
+        ])
+      ]),
+      e.label || e.description ? (t(), a("span", Be, [
+        e.label ? (t(), a("span", Ce, [
+          z(m(e.label) + " ", 1),
+          e.required ? (t(), a("span", pe, "*")) : u("", !0)
+        ])) : u("", !0),
+        e.description ? (t(), a("span", Ve, m(e.description), 1)) : u("", !0)
+      ])) : u("", !0)
+    ], 10, $e));
+  }
+}), Te = ["disabled"], qe = {
+  key: 0,
+  class: "vk-radio-group__legend"
+}, ze = {
+  key: 0,
+  class: "vk-radio-group__required",
+  "aria-hidden": "true"
+}, Me = { class: "vk-radio__control" }, De = ["name", "value", "checked", "disabled", "required", "onChange"], Oe = { class: "vk-radio__content" }, Ae = { class: "vk-radio__label" }, Ee = {
+  key: 0,
+  class: "vk-radio__description"
+}, Ya = /* @__PURE__ */ I({
+  __name: "RadioGroup",
+  props: {
+    modelValue: {},
+    name: {},
+    options: {},
+    label: {},
+    direction: { default: "vertical" },
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    variant: { default: "info" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: c }) {
+    const l = c;
+    function d(n) {
+      l("update:modelValue", n), l("change", n);
+    }
+    return (n, s) => (t(), a("fieldset", {
+      class: $([
+        "vk-radio-group",
+        `vk-radio-group--${e.direction}`,
+        { "vk-radio-group--disabled": e.disabled }
+      ]),
+      disabled: e.disabled
+    }, [
+      e.label ? (t(), a("legend", qe, [
+        z(m(e.label) + " ", 1),
+        e.required ? (t(), a("span", ze, "*")) : u("", !0)
+      ])) : u("", !0),
+      (t(!0), a(p, null, V(e.options, (i) => (t(), a("label", {
+        key: i.value,
+        class: $([
+          "vk-radio",
+          `vk-radio--${e.variant}`,
+          { "vk-radio--checked": e.modelValue === i.value },
+          { "vk-radio--disabled": e.disabled || i.disabled }
+        ])
+      }, [
+        o("span", Me, [
+          o("input", {
+            type: "radio",
+            name: e.name,
+            value: i.value,
+            checked: e.modelValue === i.value,
+            disabled: e.disabled || i.disabled,
+            required: e.required,
+            class: "vk-radio__input",
+            onChange: (f) => d(i.value)
+          }, null, 40, De),
+          s[0] || (s[0] = o("span", {
+            class: "vk-radio__dot",
+            "aria-hidden": "true"
+          }, null, -1))
+        ]),
+        o("span", Oe, [
+          o("span", Ae, m(i.label), 1),
+          i.description ? (t(), a("span", Ee, m(i.description), 1)) : u("", !0)
+        ])
+      ], 2))), 128))
+    ], 10, Te));
+  }
+}), Le = ["for"], Fe = { class: "vk-switch__control" }, Ke = ["id", "checked", "aria-checked", "disabled"], Ne = {
+  key: 0,
+  class: "vk-switch__content"
+}, Re = {
+  key: 0,
+  class: "vk-switch__label"
+}, Pe = {
+  key: 1,
+  class: "vk-switch__description"
+}, Za = /* @__PURE__ */ I({
+  __name: "Switch",
+  props: {
+    modelValue: { type: Boolean, default: !1 },
+    label: {},
+    description: {},
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "info" },
+    id: {}
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(
+      () => l.id ?? `vk-switch-${Math.random().toString(36).slice(2, 9)}`
+    );
+    function s(i) {
+      const f = i.target.checked;
+      d("update:modelValue", f), d("change", f);
+    }
+    return (i, f) => (t(), a("label", {
+      for: n.value,
+      class: $([
+        "vk-switch",
+        `vk-switch--${e.size}`,
+        `vk-switch--${e.variant}`,
+        { "vk-switch--checked": e.modelValue },
+        { "vk-switch--disabled": e.disabled }
+      ])
+    }, [
+      o("span", Fe, [
+        o("input", {
+          id: n.value,
+          type: "checkbox",
+          class: "vk-switch__input",
+          role: "switch",
+          checked: e.modelValue,
+          "aria-checked": e.modelValue ? "true" : "false",
+          disabled: e.disabled,
+          onChange: s
+        }, null, 40, Ke),
+        f[0] || (f[0] = o("span", {
+          class: "vk-switch__track",
+          "aria-hidden": "true"
+        }, [
+          o("span", { class: "vk-switch__thumb" })
+        ], -1))
+      ]),
+      e.label || e.description ? (t(), a("span", Ne, [
+        e.label ? (t(), a("span", Re, m(e.label), 1)) : u("", !0),
+        e.description ? (t(), a("span", Pe, m(e.description), 1)) : u("", !0)
+      ])) : u("", !0)
+    ], 10, Le));
+  }
+}), je = ["for"], Ge = ["src"], We = {
+  key: 1,
+  class: "vk-label__required",
+  "aria-hidden": "true"
+}, el = /* @__PURE__ */ I({
+  __name: "Label",
+  props: {
+    text: {},
+    forId: {},
+    variant: { default: "info" },
+    size: { default: "md" },
+    disabled: { type: Boolean, default: !1 },
+    required: { type: Boolean, default: !1 },
+    leftIconSrc: {}
+  },
+  setup(e) {
+    return (c, l) => (t(), a("label", {
+      for: e.forId,
+      class: $([
+        "vk-label",
+        `vk-label--${e.variant}`,
+        `vk-label--${e.size}`,
+        { "vk-label--disabled": e.disabled }
+      ])
+    }, [
+      e.leftIconSrc ? (t(), a("img", {
+        key: 0,
+        src: e.leftIconSrc,
+        class: "vk-label__icon",
+        "aria-hidden": "true",
+        alt: ""
+      }, null, 8, Ge)) : u("", !0),
+      B(c.$slots, "default", {}, () => [
+        z(m(e.text), 1)
+      ]),
+      e.required ? (t(), a("span", We, "*")) : u("", !0)
+    ], 10, je));
+  }
+}), Ue = ["aria-hidden", "aria-label"], He = ["src"], Je = { class: "vk-badge__text" }, tl = /* @__PURE__ */ I({
+  __name: "Badge",
+  props: {
+    text: {},
+    count: {},
+    max: { default: 99 },
+    size: { default: "md" },
+    variant: { default: "info" },
+    leftIconSrc: {},
+    decorative: { type: Boolean, default: !1 },
+    ariaLabel: {}
+  },
+  setup(e) {
+    const c = e, l = S(() => typeof c.count == "number" ? c.count > c.max ? `${c.max}+` : String(c.count) : c.text ?? "");
+    return (d, n) => (t(), a("span", {
+      class: $([
+        "vk-badge",
+        `vk-badge--${e.size}`,
+        `vk-badge--${e.variant}`
+      ]),
+      "aria-hidden": e.decorative ? "true" : void 0,
+      "aria-label": !e.decorative && e.ariaLabel ? e.ariaLabel : void 0
+    }, [
+      e.leftIconSrc ? (t(), a("img", {
+        key: 0,
+        src: e.leftIconSrc,
+        class: "vk-badge__icon",
+        alt: "",
+        "aria-hidden": "true"
+      }, null, 8, He)) : u("", !0),
+      o("span", Je, m(l.value), 1)
+    ], 10, Ue));
+  }
+}), al = /* @__PURE__ */ I({
+  __name: "Pill",
+  props: {
+    label: {},
+    variant: { default: "info" },
+    size: { default: "md" },
+    outlined: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    return (c, l) => (t(), a("span", {
+      class: $([
+        "vk-pill",
+        `vk-pill--${e.variant}`,
+        `vk-pill--${e.size}`,
+        { "vk-pill--outlined": e.outlined }
+      ])
+    }, m(e.label), 3));
+  }
+}), Qe = ["role"], Xe = ["src"], Ye = { class: "vk-toast__content" }, Ze = {
+  key: 0,
+  class: "vk-toast__title"
+}, et = { class: "vk-toast__message" }, ll = /* @__PURE__ */ I({
+  __name: "Toast",
+  props: {
+    title: {},
+    message: {},
+    variant: { default: "info" },
+    duration: { default: 4e3 },
+    dismissible: { type: Boolean, default: !0 },
+    leftIconSrc: {}
+  },
+  emits: ["close", "timeout"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(() => l.variant === "alert" || l.variant === "error" ? "alert" : "status");
+    let s = null;
+    return j(() => {
+      l.duration > 0 && (s = window.setTimeout(() => {
+        d("timeout");
+      }, l.duration));
+    }), D(() => {
+      s !== null && window.clearTimeout(s);
+    }), (i, f) => (t(), a("div", {
+      class: $(["vk-toast", `vk-toast--${e.variant}`]),
+      role: n.value,
+      "aria-live": "polite"
+    }, [
+      e.leftIconSrc ? (t(), a("img", {
+        key: 0,
+        src: e.leftIconSrc,
+        class: "vk-toast__icon",
+        alt: "",
+        "aria-hidden": "true"
+      }, null, 8, Xe)) : u("", !0),
+      o("div", Ye, [
+        e.title ? (t(), a("p", Ze, m(e.title), 1)) : u("", !0),
+        o("p", et, m(e.message), 1)
+      ]),
+      e.dismissible ? (t(), a("button", {
+        key: 1,
+        type: "button",
+        class: "vk-toast__close",
+        "aria-label": "Dismiss notification",
+        onClick: f[0] || (f[0] = (v) => d("close"))
+      }, " × ")) : u("", !0)
+    ], 10, Qe));
+  }
+}), tt = ["aria-describedby"], at = ["id"], nl = /* @__PURE__ */ I({
+  __name: "Tooltip",
+  props: {
+    text: {},
+    placement: { default: "top" },
+    openDelay: { default: 150 },
+    closeDelay: { default: 100 },
+    variant: { default: "info-inverted" },
+    maxWidth: { default: "240px" },
+    id: {}
+  },
+  setup(e) {
+    const c = e, l = T(!1), d = S(
+      () => c.id ?? `vk-tooltip-${Math.random().toString(36).slice(2, 9)}`
+    );
+    let n = null, s = null;
+    function i() {
+      n !== null && (window.clearTimeout(n), n = null), s !== null && (window.clearTimeout(s), s = null);
+    }
+    function f() {
+      s !== null && (window.clearTimeout(s), s = null), !l.value && (n = window.setTimeout(() => {
+        l.value = !0, n = null;
+      }, c.openDelay));
+    }
+    function v() {
+      n !== null && (window.clearTimeout(n), n = null), s = window.setTimeout(() => {
+        l.value = !1, s = null;
+      }, c.closeDelay);
+    }
+    return D(() => {
+      i();
+    }), (h, k) => (t(), a("span", {
+      class: "vk-tooltip",
+      onMouseenter: f,
+      onMouseleave: v,
+      onFocusin: f,
+      onFocusout: v
+    }, [
+      o("span", {
+        class: "vk-tooltip__trigger",
+        "aria-describedby": l.value ? d.value : void 0
+      }, [
+        B(h.$slots, "default", {}, () => [
+          k[0] || (k[0] = o("button", {
+            type: "button",
+            class: "vk-tooltip__fallback-trigger"
+          }, "?", -1))
+        ])
+      ], 8, tt),
+      K(N, { name: "vk-tooltip-fade" }, {
+        default: A(() => [
+          l.value ? (t(), a("span", {
+            key: 0,
+            id: d.value,
+            role: "tooltip",
+            class: $([
+              "vk-tooltip__content",
+              `vk-tooltip__content--${e.placement}`,
+              `vk-tooltip__content--${e.variant}`
+            ]),
+            style: O({ maxWidth: e.maxWidth })
+          }, m(e.text), 15, at)) : u("", !0)
+        ]),
+        _: 1
+      })
+    ], 32));
+  }
+}), lt = {
+  class: "vk-navbar__inner",
+  "aria-label": "Main navigation"
+}, nt = { class: "vk-navbar__brand" }, it = { class: "vk-navbar__list" }, st = ["href", "aria-current", "aria-disabled", "tabindex", "onClick"], ot = ["disabled", "aria-current", "onClick"], rt = {
+  key: 0,
+  class: "vk-navbar__actions"
+}, il = /* @__PURE__ */ I({
+  __name: "NavBar",
+  props: {
+    items: {},
+    activeValue: {},
+    brand: { default: "" },
+    sticky: { type: Boolean, default: !1 },
+    variant: {}
+  },
+  emits: ["navigate"],
+  setup(e, { emit: c }) {
+    const l = c;
+    function d(n, s) {
+      if (s.disabled) {
+        n.preventDefault();
+        return;
+      }
+      l("navigate", { value: s.value }), s.href || n.preventDefault();
+    }
+    return (n, s) => (t(), a("header", {
+      class: $([
+        "vk-navbar",
+        { "vk-navbar--sticky": e.sticky },
+        e.variant ? `vk-navbar--${e.variant}` : void 0
+      ])
+    }, [
+      o("nav", lt, [
+        o("div", nt, [
+          B(n.$slots, "brand", {}, () => [
+            z(m(e.brand), 1)
+          ])
+        ]),
+        o("ul", it, [
+          (t(!0), a(p, null, V(e.items, (i) => (t(), a("li", {
+            key: i.value,
+            class: "vk-navbar__item"
+          }, [
+            i.href ? (t(), a("a", {
+              key: 0,
+              href: i.href,
+              class: $([
+                "vk-navbar__link",
+                { "vk-navbar__link--active": i.value === e.activeValue },
+                { "vk-navbar__link--disabled": i.disabled }
+              ]),
+              "aria-current": i.value === e.activeValue ? "page" : void 0,
+              "aria-disabled": i.disabled ? "true" : void 0,
+              tabindex: i.disabled ? -1 : void 0,
+              onClick: (f) => d(f, i)
+            }, m(i.label), 11, st)) : (t(), a("button", {
+              key: 1,
+              type: "button",
+              class: $([
+                "vk-navbar__link",
+                "vk-navbar__link--button",
+                { "vk-navbar__link--active": i.value === e.activeValue },
+                { "vk-navbar__link--disabled": i.disabled }
+              ]),
+              disabled: i.disabled,
+              "aria-current": i.value === e.activeValue ? "page" : void 0,
+              onClick: (f) => d(f, i)
+            }, m(i.label), 11, ot))
+          ]))), 128))
+        ]),
+        n.$slots.actions ? (t(), a("div", rt, [
+          B(n.$slots, "actions")
+        ])) : u("", !0)
+      ])
+    ], 2));
+  }
+}), ct = {
+  key: 0,
+  class: "vk-nav-menu__header"
+}, dt = {
+  class: "vk-nav-menu__nav",
+  "aria-label": "Mobile navigation"
+}, ut = { class: "vk-nav-menu__list" }, vt = ["href", "aria-current", "aria-disabled", "tabindex", "onClick"], ft = ["disabled", "aria-current", "onClick"], kt = {
+  key: 1,
+  class: "vk-nav-menu__footer"
+}, sl = /* @__PURE__ */ I({
+  __name: "NavMenu",
+  props: {
+    open: { type: Boolean, default: !1 },
+    items: {},
+    activeValue: {},
+    showBackdrop: { type: Boolean, default: !0 },
+    variant: { default: "info" }
+  },
+  emits: ["navigate", "close"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = T(null), s = T(null);
+    function i() {
+      const r = n.value;
+      if (!r) return [];
+      const _ = [
+        "a[href]",
+        "button:not([disabled])",
+        "textarea:not([disabled])",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(",");
+      return Array.from(r.querySelectorAll(_));
+    }
+    function f(r) {
+      var x;
+      if (r.key !== "Tab") return;
+      const _ = i();
+      if (_.length === 0) {
+        r.preventDefault(), (x = n.value) == null || x.focus();
+        return;
+      }
+      const y = _[0], g = _[_.length - 1], b = document.activeElement;
+      r.shiftKey && b === y ? (r.preventDefault(), g.focus()) : !r.shiftKey && b === g && (r.preventDefault(), y.focus());
+    }
+    function v(r) {
+      if (r.key === "Escape") {
+        r.preventDefault(), d("close");
+        return;
+      }
+      f(r);
+    }
+    function h(r, _) {
+      if (_.disabled) {
+        r.preventDefault();
+        return;
+      }
+      d("navigate", { value: _.value }), d("close"), _.href || r.preventDefault();
+    }
+    function k(r) {
+      document.body.style.overflow = r ? "hidden" : "";
+    }
+    return M(
+      () => l.open,
+      async (r) => {
+        var _, y;
+        r ? (s.value = document.activeElement, k(!0), await R(), (_ = i()[0] ?? n.value) == null || _.focus()) : (k(!1), (y = s.value) == null || y.focus());
+      },
+      { immediate: !0 }
+    ), D(() => {
+      k(!1);
+    }), (r, _) => (t(), E(P, { to: "body" }, [
+      K(N, { name: "vk-nav-menu-fade" }, {
+        default: A(() => [
+          e.open ? (t(), a("div", {
+            key: 0,
+            class: "vk-nav-menu",
+            role: "dialog",
+            "aria-modal": "true",
+            "aria-label": "Navigation menu",
+            onKeydown: v
+          }, [
+            e.showBackdrop ? (t(), a("div", {
+              key: 0,
+              class: "vk-nav-menu__backdrop",
+              onClick: _[0] || (_[0] = (y) => d("close"))
+            })) : u("", !0),
+            o("aside", {
+              ref_key: "panelRef",
+              ref: n,
+              class: $(["vk-nav-menu__panel", `vk-nav-menu__panel--${e.variant}`]),
+              tabindex: "-1"
+            }, [
+              r.$slots.header ? (t(), a("header", ct, [
+                B(r.$slots, "header")
+              ])) : u("", !0),
+              o("nav", dt, [
+                o("ul", ut, [
+                  (t(!0), a(p, null, V(e.items, (y) => (t(), a("li", {
+                    key: y.value,
+                    class: "vk-nav-menu__item"
+                  }, [
+                    y.href ? (t(), a("a", {
+                      key: 0,
+                      href: y.href,
+                      class: $([
+                        "vk-nav-menu__link",
+                        { "vk-nav-menu__link--active": y.value === e.activeValue },
+                        { "vk-nav-menu__link--disabled": y.disabled }
+                      ]),
+                      "aria-current": y.value === e.activeValue ? "page" : void 0,
+                      "aria-disabled": y.disabled ? "true" : void 0,
+                      tabindex: y.disabled ? -1 : void 0,
+                      onClick: (g) => h(g, y)
+                    }, m(y.label), 11, vt)) : (t(), a("button", {
+                      key: 1,
+                      type: "button",
+                      class: $([
+                        "vk-nav-menu__link",
+                        "vk-nav-menu__link--button",
+                        { "vk-nav-menu__link--active": y.value === e.activeValue },
+                        { "vk-nav-menu__link--disabled": y.disabled }
+                      ]),
+                      disabled: y.disabled,
+                      "aria-current": y.value === e.activeValue ? "page" : void 0,
+                      onClick: (g) => h(g, y)
+                    }, m(y.label), 11, ft))
+                  ]))), 128))
+                ])
+              ]),
+              r.$slots.footer ? (t(), a("footer", kt, [
+                B(r.$slots, "footer")
+              ])) : u("", !0)
+            ], 2)
+          ], 32)) : u("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+}), bt = ["disabled", "aria-label", "aria-expanded", "aria-controls"], ht = {
+  class: "vk-burger-button__icon-wrap",
+  "aria-hidden": "true"
+}, mt = ["src"], ol = /* @__PURE__ */ I({
+  __name: "BurgerButton",
+  props: {
+    open: { type: Boolean, default: !1 },
+    labelOpen: { default: "Open menu" },
+    labelClose: { default: "Close menu" },
+    disabled: { type: Boolean, default: !1 },
+    variant: { default: "info" },
+    openIconSrc: {},
+    closedIconSrc: {},
+    ariaControls: {}
+  },
+  emits: ["toggle"],
+  setup(e, { emit: c }) {
+    const l = e, d = [
+      "info",
+      "success",
+      "warning",
+      "alert",
+      "error",
+      "info-alt",
+      "info-inverted",
+      "success-inverted",
+      "warning-inverted",
+      "alert-inverted",
+      "error-inverted",
+      "info-alt-inverted"
+    ], n = S(() => typeof l.variant == "string" && d.includes(l.variant) ? l.variant : "info"), s = c;
+    function i() {
+      l.disabled || s("toggle", !l.open);
+    }
+    return (f, v) => (t(), a("button", {
+      type: "button",
+      class: $(["vk-burger-button", [
+        { "vk-burger-button--open": e.open },
+        `vk-burger-button--${n.value}`
+      ]]),
+      disabled: e.disabled,
+      "aria-label": e.open ? e.labelClose : e.labelOpen,
+      "aria-expanded": e.open ? "true" : "false",
+      "aria-controls": e.ariaControls || void 0,
+      onClick: i
+    }, [
+      o("span", ht, [
+        o("img", {
+          src: e.open ? e.openIconSrc : e.closedIconSrc,
+          alt: "",
+          class: "vk-burger-button__icon"
+        }, null, 8, mt)
+      ])
+    ], 10, bt));
+  }
+}), _t = { class: "vk-footer__inner" }, yt = { class: "vk-footer__left" }, $t = {
+  key: 0,
+  "aria-label": "Footer links"
+}, gt = { class: "vk-footer__links" }, xt = ["href", "target", "rel"], wt = { class: "vk-footer__right" }, It = {
+  key: 0,
+  class: "vk-footer__copyright"
+}, rl = /* @__PURE__ */ I({
+  __name: "Footer",
+  props: {
+    links: { default: () => [] },
+    copyright: {},
+    compact: { type: Boolean, default: !1 },
+    variant: {}
+  },
+  setup(e) {
+    return (c, l) => (t(), a("footer", {
+      class: $([
+        "vk-footer",
+        { "vk-footer--compact": e.compact },
+        e.variant ? `vk-footer--${e.variant}` : void 0
+      ])
+    }, [
+      o("div", _t, [
+        o("div", yt, [
+          B(c.$slots, "left", {}, () => {
+            var d;
+            return [
+              (d = e.links) != null && d.length ? (t(), a("nav", $t, [
+                o("ul", gt, [
+                  (t(!0), a(p, null, V(e.links, (n) => (t(), a("li", {
+                    key: n.href,
+                    class: "vk-footer__link-item"
+                  }, [
+                    o("a", {
+                      href: n.href,
+                      class: "vk-footer__link",
+                      target: n.external ? "_blank" : void 0,
+                      rel: n.external ? "noopener noreferrer" : void 0
+                    }, m(n.label), 9, xt)
+                  ]))), 128))
+                ])
+              ])) : u("", !0)
+            ];
+          })
+        ]),
+        o("div", wt, [
+          B(c.$slots, "right", {}, () => [
+            e.copyright ? (t(), a("small", It, m(e.copyright), 1)) : u("", !0)
+          ])
+        ])
+      ])
+    ], 2));
+  }
+}), St = ["aria-orientation"], Bt = ["id", "tabindex", "aria-selected", "aria-controls", "disabled", "onClick"], Ct = ["src"], pt = ["id", "aria-labelledby"], cl = /* @__PURE__ */ I({
+  __name: "Tabs",
+  props: {
+    modelValue: {},
+    items: {},
+    variant: { default: "info" },
+    orientation: { default: "horizontal" }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = T([]);
+    function s() {
+      var b;
+      return ((b = l.items.find((x) => !x.disabled)) == null ? void 0 : b.value) ?? "";
+    }
+    const i = S(() => {
+      const b = l.modelValue ?? s();
+      return l.items.some((w) => w.value === b && !w.disabled) ? b : s();
+    });
+    M(
+      () => l.modelValue,
+      () => {
+        const b = l.items.findIndex((x) => x.value === i.value);
+        k(b);
+      }
+    );
+    function f(b) {
+      return `vk-tab-${b}`;
+    }
+    function v(b) {
+      return `vk-tabpanel-${b}`;
+    }
+    function h(b) {
+      const x = l.items.find((w) => w.value === b);
+      !x || x.disabled || (d("update:modelValue", b), d("change", b));
+    }
+    function k(b) {
+      b < 0 || !n.value[b] || n.value[b].focus();
+    }
+    function r(b, x) {
+      const w = l.items.length;
+      let C = b;
+      for (let q = 0; q < w; q += 1)
+        if (C = (C + x + w) % w, !l.items[C].disabled) return C;
+      return b;
+    }
+    function _() {
+      return l.items.findIndex((b) => !b.disabled);
+    }
+    function y() {
+      for (let b = l.items.length - 1; b >= 0; b -= 1)
+        if (!l.items[b].disabled) return b;
+      return -1;
+    }
+    function g(b) {
+      const x = l.items.findIndex((q) => q.value === i.value);
+      if (x < 0) return;
+      const w = l.orientation === "horizontal";
+      let C = x;
+      if (w && b.key === "ArrowRight" || !w && b.key === "ArrowDown")
+        C = r(x, 1);
+      else if (w && b.key === "ArrowLeft" || !w && b.key === "ArrowUp")
+        C = r(x, -1);
+      else if (b.key === "Home")
+        C = _();
+      else if (b.key === "End")
+        C = y();
+      else
+        return;
+      if (b.preventDefault(), C >= 0) {
+        const q = l.items[C].value;
+        h(q), k(C);
+      }
+    }
+    return (b, x) => (t(), a("div", {
+      class: $(["vk-tabs", `vk-tabs--${e.orientation}`])
+    }, [
+      o("div", {
+        class: "vk-tabs__list",
+        role: "tablist",
+        "aria-orientation": e.orientation,
+        onKeydown: g
+      }, [
+        (t(!0), a(p, null, V(e.items, (w) => (t(), a("button", {
+          id: f(w.value),
+          key: w.value,
+          ref_for: !0,
+          ref_key: "tabRefs",
+          ref: n,
+          type: "button",
+          role: "tab",
+          tabindex: i.value === w.value ? 0 : -1,
+          "aria-selected": i.value === w.value ? "true" : "false",
+          "aria-controls": v(w.value),
+          disabled: w.disabled,
+          class: $([
+            "vk-tabs__tab",
+            `vk-tabs__tab--${e.variant}`,
+            { "vk-tabs__tab--active": i.value === w.value },
+            { "vk-tabs__tab--disabled": w.disabled }
+          ]),
+          onClick: (C) => h(w.value)
+        }, [
+          w.leftIconSrc ? (t(), a("img", {
+            key: 0,
+            src: w.leftIconSrc,
+            class: "vk-tabs__icon",
+            alt: "",
+            "aria-hidden": "true"
+          }, null, 8, Ct)) : u("", !0),
+          o("span", null, m(w.label), 1)
+        ], 10, Bt))), 128))
+      ], 40, St),
+      o("div", {
+        id: v(i.value),
+        class: "vk-tabs__panel",
+        role: "tabpanel",
+        "aria-labelledby": f(i.value),
+        tabindex: "0"
+      }, [
+        B(b.$slots, `panel-${i.value}`, { activeValue: i.value })
+      ], 8, pt)
+    ], 2));
+  }
+}), Vt = {
+  class: "vk-breadcrumb",
+  "aria-label": "Breadcrumb"
+}, Tt = { class: "vk-breadcrumb__list" }, qt = ["href", "onClick"], zt = ["src"], Mt = { class: "vk-breadcrumb__label" }, Dt = ["onClick"], Ot = ["src"], At = { class: "vk-breadcrumb__label" }, Et = {
+  key: 2,
+  class: "vk-breadcrumb__current",
+  "aria-current": "page"
+}, Lt = ["src"], Ft = { class: "vk-breadcrumb__label" }, Kt = {
+  key: 3,
+  class: "vk-breadcrumb__separator",
+  "aria-hidden": "true"
+}, dl = /* @__PURE__ */ I({
+  __name: "Breadcrumb",
+  props: {
+    items: {},
+    separator: { default: "/" },
+    variant: { default: "info" }
+  },
+  emits: ["navigate"],
+  setup(e, { emit: c }) {
+    const l = c;
+    function d(n, s) {
+      l("navigate", { value: s.value, href: s.href }), s.href || n.preventDefault();
+    }
+    return (n, s) => (t(), a("nav", Vt, [
+      o("ol", Tt, [
+        (t(!0), a(p, null, V(e.items, (i, f) => (t(), a("li", {
+          key: `${i.label}-${f}`,
+          class: $([
+            "vk-breadcrumb__item",
+            `vk-breadcrumb__item--${e.variant}`,
+            { "vk-breadcrumb__item--current": f === e.items.length - 1 }
+          ])
+        }, [
+          f !== e.items.length - 1 && i.href ? (t(), a("a", {
+            key: 0,
+            href: i.href,
+            class: "vk-breadcrumb__link",
+            onClick: (v) => d(v, i)
+          }, [
+            i.leftIconSrc ? (t(), a("img", {
+              key: 0,
+              src: i.leftIconSrc,
+              class: "vk-breadcrumb__icon",
+              alt: "",
+              "aria-hidden": "true"
+            }, null, 8, zt)) : u("", !0),
+            o("span", Mt, m(i.label), 1)
+          ], 8, qt)) : f !== e.items.length - 1 ? (t(), a("button", {
+            key: 1,
+            type: "button",
+            class: "vk-breadcrumb__link vk-breadcrumb__link--button",
+            onClick: (v) => d(v, i)
+          }, [
+            i.leftIconSrc ? (t(), a("img", {
+              key: 0,
+              src: i.leftIconSrc,
+              class: "vk-breadcrumb__icon",
+              alt: "",
+              "aria-hidden": "true"
+            }, null, 8, Ot)) : u("", !0),
+            o("span", At, m(i.label), 1)
+          ], 8, Dt)) : (t(), a("span", Et, [
+            i.leftIconSrc ? (t(), a("img", {
+              key: 0,
+              src: i.leftIconSrc,
+              class: "vk-breadcrumb__icon",
+              alt: "",
+              "aria-hidden": "true"
+            }, null, 8, Lt)) : u("", !0),
+            o("span", Ft, m(i.label), 1)
+          ])),
+          f !== e.items.length - 1 ? (t(), a("span", Kt, m(e.separator), 1)) : u("", !0)
+        ], 2))), 128))
+      ])
+    ]));
+  }
+}), Nt = {
+  class: "vk-pagination",
+  "aria-label": "Pagination"
+}, Rt = { class: "vk-pagination__list" }, Pt = { key: 0 }, jt = ["disabled"], Gt = ["disabled"], Wt = ["src"], Ut = { key: 1 }, Ht = {
+  key: 0,
+  class: "vk-pagination__ellipsis",
+  "aria-hidden": "true"
+}, Jt = ["aria-current", "aria-label", "onClick"], Qt = ["disabled"], Xt = ["src"], Yt = { key: 1 }, Zt = { key: 1 }, ea = ["disabled"], ul = /* @__PURE__ */ I({
+  __name: "Pagination",
+  props: {
+    page: {},
+    totalPages: {},
+    maxVisible: { default: 7 },
+    showFirstLast: { type: Boolean, default: !0 },
+    variant: { default: "info" },
+    prevIconSrc: {},
+    nextIconSrc: {}
+  },
+  emits: ["update:page", "change"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(() => Math.max(1, l.totalPages)), s = S(() => Math.min(Math.max(1, l.page), n.value)), i = S(() => {
+      const v = n.value, h = s.value, k = Math.max(5, l.maxVisible);
+      if (v <= k)
+        return Array.from({ length: v }, (b, x) => ({ type: "page", key: `p-${x + 1}`, page: x + 1 }));
+      const r = [], _ = Math.max(1, Math.floor((k - 3) / 2));
+      let y = Math.max(2, h - _), g = Math.min(v - 1, h + _);
+      y <= 2 && (g = Math.min(v - 1, g + (2 - y + 1))), g >= v - 1 && (y = Math.max(2, y - (g - (v - 1) + 1))), r.push({ type: "page", key: "p-1", page: 1 }), y > 2 && r.push({ type: "ellipsis", key: "e-left" });
+      for (let b = y; b <= g; b += 1)
+        r.push({ type: "page", key: `p-${b}`, page: b });
+      return g < v - 1 && r.push({ type: "ellipsis", key: "e-right" }), r.push({ type: "page", key: `p-${v}`, page: v }), r;
+    });
+    function f(v) {
+      const h = Math.min(Math.max(1, v), n.value);
+      h !== s.value && (d("update:page", h), d("change", h));
+    }
+    return (v, h) => (t(), a("nav", Nt, [
+      o("ul", Rt, [
+        e.showFirstLast ? (t(), a("li", Pt, [
+          o("button", {
+            type: "button",
+            class: $(["vk-pagination__btn vk-pagination__btn--nav", `vk-pagination__btn--${e.variant}`]),
+            disabled: s.value <= 1,
+            "aria-label": "Go to first page",
+            onClick: h[0] || (h[0] = (k) => f(1))
+          }, " « ", 10, jt)
+        ])) : u("", !0),
+        o("li", null, [
+          o("button", {
+            type: "button",
+            class: $(["vk-pagination__btn vk-pagination__btn--nav", `vk-pagination__btn--${e.variant}`]),
+            disabled: s.value <= 1,
+            "aria-label": "Go to previous page",
+            onClick: h[1] || (h[1] = (k) => f(s.value - 1))
+          }, [
+            e.prevIconSrc ? (t(), a("img", {
+              key: 0,
+              src: e.prevIconSrc,
+              class: "vk-pagination__icon",
+              alt: "",
+              "aria-hidden": "true"
+            }, null, 8, Wt)) : (t(), a("span", Ut, "‹"))
+          ], 10, Gt)
+        ]),
+        (t(!0), a(p, null, V(i.value, (k) => (t(), a("li", {
+          key: k.key
+        }, [
+          k.type === "ellipsis" ? (t(), a("span", Ht, " … ")) : (t(), a("button", {
+            key: 1,
+            type: "button",
+            class: $(["vk-pagination__btn vk-pagination__btn--page", [
+              `vk-pagination__btn--${e.variant}`,
+              { "vk-pagination__btn--active": k.page === s.value }
+            ]]),
+            "aria-current": k.page === s.value ? "page" : void 0,
+            "aria-label": `Go to page ${k.page}`,
+            onClick: (r) => f(k.page)
+          }, m(k.page), 11, Jt))
+        ]))), 128)),
+        o("li", null, [
+          o("button", {
+            type: "button",
+            class: $(["vk-pagination__btn vk-pagination__btn--nav", `vk-pagination__btn--${e.variant}`]),
+            disabled: s.value >= n.value,
+            "aria-label": "Go to next page",
+            onClick: h[2] || (h[2] = (k) => f(s.value + 1))
+          }, [
+            e.nextIconSrc ? (t(), a("img", {
+              key: 0,
+              src: e.nextIconSrc,
+              class: "vk-pagination__icon",
+              alt: "",
+              "aria-hidden": "true"
+            }, null, 8, Xt)) : (t(), a("span", Yt, "›"))
+          ], 10, Qt)
+        ]),
+        e.showFirstLast ? (t(), a("li", Zt, [
+          o("button", {
+            type: "button",
+            class: $(["vk-pagination__btn vk-pagination__btn--nav", `vk-pagination__btn--${e.variant}`]),
+            disabled: s.value >= n.value,
+            "aria-label": "Go to last page",
+            onClick: h[3] || (h[3] = (k) => f(n.value))
+          }, " » ", 10, ea)
+        ])) : u("", !0)
+      ])
+    ]));
+  }
+}), ta = { class: "vk-accordion" }, aa = { class: "vk-accordion__heading" }, la = ["disabled", "aria-expanded", "aria-controls", "id", "onClick"], na = { class: "vk-accordion__title-wrap" }, ia = ["src"], sa = { class: "vk-accordion__title" }, oa = {
+  class: "vk-accordion__chevron",
+  "aria-hidden": "true"
+}, ra = ["id", "aria-labelledby"], ca = {
+  key: 0,
+  class: "vk-accordion__content"
+}, vl = /* @__PURE__ */ I({
+  __name: "Accordion",
+  props: {
+    items: {},
+    multiple: { type: Boolean, default: !1 },
+    modelValue: { default: () => [] },
+    variant: { default: "info" }
+  },
+  emits: ["update:modelValue", "toggle"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = S(() => l.modelValue);
+    function s(h) {
+      return n.value.includes(h);
+    }
+    function i(h) {
+      const k = l.items.find((y) => y.id === h);
+      if (!k || k.disabled) return;
+      const r = s(h);
+      let _;
+      l.multiple ? _ = r ? n.value.filter((y) => y !== h) : [...n.value, h] : _ = r ? [] : [h], d("update:modelValue", _), d("toggle", { id: h, open: !r });
+    }
+    function f(h) {
+      return `vk-accordion-trigger-${h}`;
+    }
+    function v(h) {
+      return `vk-accordion-panel-${h}`;
+    }
+    return (h, k) => (t(), a("div", ta, [
+      (t(!0), a(p, null, V(e.items, (r) => (t(), a("section", {
+        key: r.id,
+        class: $([
+          "vk-accordion__item",
+          `vk-accordion__item--${e.variant}`,
+          { "vk-accordion__item--open": s(r.id) },
+          { "vk-accordion__item--disabled": r.disabled }
+        ])
+      }, [
+        o("h3", aa, [
+          o("button", {
+            type: "button",
+            class: "vk-accordion__trigger",
+            disabled: r.disabled,
+            "aria-expanded": s(r.id) ? "true" : "false",
+            "aria-controls": v(r.id),
+            id: f(r.id),
+            onClick: (_) => i(r.id)
+          }, [
+            o("span", na, [
+              r.leftIconSrc ? (t(), a("img", {
+                key: 0,
+                src: r.leftIconSrc,
+                class: "vk-accordion__icon",
+                alt: "",
+                "aria-hidden": "true"
+              }, null, 8, ia)) : u("", !0),
+              o("span", sa, m(r.title), 1)
+            ]),
+            o("span", oa, m(s(r.id) ? "−" : "+"), 1)
+          ], 8, la)
+        ]),
+        G(o("div", {
+          id: v(r.id),
+          class: "vk-accordion__panel",
+          role: "region",
+          "aria-labelledby": f(r.id)
+        }, [
+          B(h.$slots, `item-${r.id}`, { item: r }, () => [
+            r.content ? (t(), a("p", ca, m(r.content), 1)) : u("", !0)
+          ])
+        ], 8, ra), [
+          [W, s(r.id)]
+        ])
+      ], 2))), 128))
+    ]));
+  }
+}), da = ["tabindex"], ua = {
+  key: 0,
+  class: "vk-card__header"
+}, va = { class: "vk-card__body" }, fa = {
+  key: 1,
+  class: "vk-card__footer"
+}, fl = /* @__PURE__ */ I({
+  __name: "Card",
+  props: {
+    variant: { default: "info" },
+    surface: { default: "outlined" },
+    padding: { default: "md" },
+    interactive: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    return (c, l) => (t(), a("article", {
+      class: $([
+        "vk-card",
+        `vk-card--${e.variant}`,
+        `vk-card--${e.surface}`,
+        `vk-card--pad-${e.padding}`,
+        { "vk-card--interactive": e.interactive }
+      ]),
+      tabindex: e.interactive ? 0 : void 0
+    }, [
+      c.$slots.header ? (t(), a("header", ua, [
+        B(c.$slots, "header")
+      ])) : u("", !0),
+      o("div", va, [
+        B(c.$slots, "default")
+      ]),
+      c.$slots.footer ? (t(), a("footer", fa, [
+        B(c.$slots, "footer")
+      ])) : u("", !0)
+    ], 10, da));
+  }
+}), ka = { class: "vk-title-card__main" }, ba = { class: "vk-title-card__title-row" }, ha = ["src"], ma = {
+  key: 0,
+  class: "vk-title-card__subtitle"
+}, _a = {
+  key: 0,
+  class: "vk-title-card__actions"
+}, kl = /* @__PURE__ */ I({
+  __name: "TitleCard",
+  props: {
+    title: {},
+    subtitle: {},
+    align: { default: "left" },
+    variant: { default: "info" },
+    level: { default: 2 },
+    leftIconSrc: {}
+  },
+  setup(e) {
+    const c = e, l = S(() => `h${c.level}`);
+    return (d, n) => (t(), a("section", {
+      class: $(["vk-title-card", `vk-title-card--${e.align}`, `vk-title-card--${e.variant}`])
+    }, [
+      o("div", ka, [
+        o("div", ba, [
+          e.leftIconSrc ? (t(), a("img", {
+            key: 0,
+            src: e.leftIconSrc,
+            class: "vk-title-card__icon",
+            alt: "",
+            "aria-hidden": "true"
+          }, null, 8, ha)) : u("", !0),
+          (t(), E(U(l.value), { class: "vk-title-card__title" }, {
+            default: A(() => [
+              z(m(e.title), 1)
+            ]),
+            _: 1
+          }))
+        ]),
+        e.subtitle ? (t(), a("p", ma, m(e.subtitle), 1)) : u("", !0)
+      ]),
+      d.$slots.actions ? (t(), a("div", _a, [
+        B(d.$slots, "actions")
+      ])) : u("", !0)
+    ], 2));
+  }
+}), ya = ["aria-hidden"], $a = ["src", "alt"], ga = ["aria-label"], xa = ["src"], wa = {
+  key: 3,
+  class: "vk-avatar__default-dot",
+  "aria-hidden": "true"
+}, bl = /* @__PURE__ */ I({
+  __name: "Avatar",
+  props: {
+    src: {},
+    alt: {},
+    name: {},
+    size: { default: "md" },
+    shape: { default: "circle" },
+    fallbackIconSrc: {},
+    variant: { default: "info-inverted" },
+    decorative: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const c = e, l = T(!1);
+    M(
+      () => c.src,
+      () => {
+        l.value = !1;
+      }
+    );
+    const d = S(() => !!c.src && !l.value), n = S(() => {
+      var k, r;
+      if (!c.name) return "";
+      const f = c.name.trim().split(/\s+/).filter(Boolean);
+      if (f.length === 0) return "";
+      const v = ((k = f[0]) == null ? void 0 : k[0]) ?? "", h = f.length > 1 ? ((r = f[f.length - 1]) == null ? void 0 : r[0]) ?? "" : "";
+      return `${v}${h}`.toUpperCase();
+    }), s = S(() => c.alt !== void 0 ? c.alt : c.name ? `${c.name} avatar` : "User avatar");
+    function i() {
+      l.value = !0;
+    }
+    return (f, v) => (t(), a("span", {
+      class: $([
+        "vk-avatar",
+        `vk-avatar--${e.size}`,
+        `vk-avatar--${e.shape}`,
+        `vk-avatar--${e.variant}`
+      ]),
+      "aria-hidden": e.decorative ? "true" : void 0
+    }, [
+      d.value ? (t(), a("img", {
+        key: 0,
+        src: e.src,
+        alt: e.decorative ? "" : s.value,
+        class: "vk-avatar__image",
+        onError: i
+      }, null, 40, $a)) : n.value ? (t(), a("span", {
+        key: 1,
+        class: "vk-avatar__initials",
+        "aria-label": e.decorative ? void 0 : s.value
+      }, m(n.value), 9, ga)) : e.fallbackIconSrc ? (t(), a("img", {
+        key: 2,
+        src: e.fallbackIconSrc,
+        class: "vk-avatar__icon",
+        alt: "",
+        "aria-hidden": "true"
+      }, null, 8, xa)) : (t(), a("span", wa))
+    ], 10, ya));
+  }
+}), Ia = { class: "vk-empty-state__content" }, Sa = ["src"], Ba = { class: "vk-empty-state__text" }, Ca = { class: "vk-empty-state__title" }, pa = {
+  key: 0,
+  class: "vk-empty-state__description"
+}, Va = {
+  key: 0,
+  class: "vk-empty-state__actions"
+}, hl = /* @__PURE__ */ I({
+  __name: "EmptyState",
+  props: {
+    title: {},
+    description: {},
+    variant: { default: "info-inverted" },
+    leftIconSrc: {}
+  },
+  setup(e) {
+    return (c, l) => (t(), a("section", {
+      class: $(["vk-empty-state", `vk-empty-state--${e.variant}`])
+    }, [
+      o("div", Ia, [
+        e.leftIconSrc ? (t(), a("img", {
+          key: 0,
+          src: e.leftIconSrc,
+          class: "vk-empty-state__icon",
+          alt: "",
+          "aria-hidden": "true"
+        }, null, 8, Sa)) : u("", !0),
+        o("div", Ba, [
+          o("h3", Ca, m(e.title), 1),
+          e.description ? (t(), a("p", pa, m(e.description), 1)) : u("", !0)
+        ])
+      ]),
+      c.$slots.actions ? (t(), a("div", Va, [
+        B(c.$slots, "actions")
+      ])) : u("", !0)
+    ], 2));
+  }
+}), Ta = ["aria-sort"], qa = ["onClick"], za = ["src"], Ma = {
+  class: "vk-table__sort-indicator",
+  "aria-hidden": "true"
+}, Da = {
+  key: 1,
+  class: "vk-table__header-label"
+}, Oa = ["src"], Aa = ["onClick", "onKeydown"], Ea = {
+  key: 0,
+  class: "vk-table__empty-row"
+}, La = ["colspan"], ml = /* @__PURE__ */ I({
+  __name: "Table",
+  props: {
+    columns: {},
+    rows: {},
+    rowKey: { type: [String, Function], default: "id" },
+    striped: { type: Boolean, default: !1 },
+    compact: { type: Boolean, default: !1 },
+    variant: { default: "info" }
+  },
+  emits: ["sort", "rowClick"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = T(null), s = T("asc");
+    function i(k) {
+      if (typeof l.rowKey == "function")
+        return l.rowKey(k);
+      const r = k[l.rowKey];
+      return typeof r == "string" || typeof r == "number" ? r : JSON.stringify(k);
+    }
+    function f(k) {
+      n.value === k ? s.value = s.value === "asc" ? "desc" : "asc" : (n.value = k, s.value = "asc"), d("sort", { key: k, direction: s.value });
+    }
+    function v(k) {
+      return !k.sortable || n.value !== k.key ? "none" : s.value === "asc" ? "ascending" : "descending";
+    }
+    function h(k) {
+      return n.value !== k ? "↕" : s.value === "asc" ? "↑" : "↓";
+    }
+    return (k, r) => (t(), a("div", {
+      class: $(["vk-table-wrap", `vk-table-wrap--${e.variant}`])
+    }, [
+      o("table", {
+        class: $([
+          "vk-table",
+          { "vk-table--striped": e.striped },
+          { "vk-table--compact": e.compact }
+        ])
+      }, [
+        o("thead", null, [
+          o("tr", null, [
+            (t(!0), a(p, null, V(e.columns, (_) => (t(), a("th", {
+              key: _.key,
+              scope: "col",
+              "aria-sort": v(_),
+              class: $(["vk-table__th", { "vk-table__th--sortable": _.sortable }])
+            }, [
+              _.sortable ? (t(), a("button", {
+                key: 0,
+                type: "button",
+                class: "vk-table__sort-btn",
+                onClick: (y) => f(_.key)
+              }, [
+                _.leftIconSrc ? (t(), a("img", {
+                  key: 0,
+                  src: _.leftIconSrc,
+                  class: "vk-table__icon",
+                  alt: "",
+                  "aria-hidden": "true"
+                }, null, 8, za)) : u("", !0),
+                o("span", null, m(_.label), 1),
+                o("span", Ma, m(h(_.key)), 1)
+              ], 8, qa)) : (t(), a("span", Da, [
+                _.leftIconSrc ? (t(), a("img", {
+                  key: 0,
+                  src: _.leftIconSrc,
+                  class: "vk-table__icon",
+                  alt: "",
+                  "aria-hidden": "true"
+                }, null, 8, Oa)) : u("", !0),
+                o("span", null, m(_.label), 1)
+              ]))
+            ], 10, Ta))), 128))
+          ])
+        ]),
+        o("tbody", null, [
+          (t(!0), a(p, null, V(e.rows, (_) => (t(), a("tr", {
+            key: i(_),
+            class: "vk-table__tr",
+            tabindex: "0",
+            onClick: (y) => d("rowClick", _),
+            onKeydown: [
+              L(F((y) => d("rowClick", _), ["prevent"]), ["enter"]),
+              L(F((y) => d("rowClick", _), ["prevent"]), ["space"])
+            ]
+          }, [
+            (t(!0), a(p, null, V(e.columns, (y) => (t(), a("td", {
+              key: `${i(_)}-${y.key}`,
+              class: "vk-table__td"
+            }, m(String(_[y.key] ?? "")), 1))), 128))
+          ], 40, Aa))), 128)),
+          e.rows.length === 0 ? (t(), a("tr", Ea, [
+            o("td", {
+              colspan: e.columns.length,
+              class: "vk-table__empty-cell"
+            }, " No data available. ", 8, La)
+          ])) : u("", !0)
+        ])
+      ], 2)
+    ], 2));
+  }
+}), Fa = ["aria-labelledby"], Ka = {
+  key: 0,
+  class: "vk-modal__header"
+}, Na = { class: "vk-modal__body" }, Ra = {
+  key: 1,
+  class: "vk-modal__footer"
+}, _l = /* @__PURE__ */ I({
+  __name: "Modal",
+  props: {
+    open: { type: Boolean, default: !1 },
+    title: {},
+    size: { default: "md" },
+    variant: { default: "info" },
+    closeOnEsc: { type: Boolean, default: !0 },
+    closeOnOverlay: { type: Boolean, default: !0 }
+  },
+  emits: ["close"],
+  setup(e, { emit: c }) {
+    const l = e, d = c, n = T(null), s = `vk-modal-title-${Math.random().toString(36).slice(2, 9)}`, i = T(null), f = S(() => !!l.title || !!(n.value && !1));
+    function v() {
+      d("close");
+    }
+    function h() {
+      l.closeOnOverlay && v();
+    }
+    function k() {
+      const g = n.value;
+      if (!g) return [];
+      const b = [
+        "a[href]",
+        "button:not([disabled])",
+        "textarea:not([disabled])",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(",");
+      return Array.from(g.querySelectorAll(b)).filter(
+        (x) => !x.hasAttribute("disabled") && !x.getAttribute("aria-hidden")
+      );
+    }
+    function r(g) {
+      var q;
+      if (g.key !== "Tab") return;
+      const b = k();
+      if (b.length === 0) {
+        g.preventDefault(), (q = n.value) == null || q.focus();
+        return;
+      }
+      const x = b[0], w = b[b.length - 1], C = document.activeElement;
+      g.shiftKey && C === x ? (g.preventDefault(), w.focus()) : !g.shiftKey && C === w && (g.preventDefault(), x.focus());
+    }
+    function _(g) {
+      if (g.key === "Escape" && l.closeOnEsc) {
+        g.preventDefault(), v();
+        return;
+      }
+      r(g);
+    }
+    function y(g) {
+      document.body.style.overflow = g ? "hidden" : "";
+    }
+    return M(
+      () => l.open,
+      async (g) => {
+        var b, x;
+        g ? (i.value = document.activeElement, y(!0), await R(), (b = k()[0] ?? n.value) == null || b.focus()) : (y(!1), (x = i.value) == null || x.focus());
+      },
+      { immediate: !0 }
+    ), D(() => {
+      y(!1);
+    }), (g, b) => (t(), E(P, { to: "body" }, [
+      e.open ? (t(), a("div", {
+        key: 0,
+        class: "vk-modal",
+        onKeydown: _
+      }, [
+        o("div", {
+          class: "vk-modal__overlay",
+          onClick: h
+        }),
+        o("section", {
+          ref_key: "dialogRef",
+          ref: n,
+          class: $([
+            "vk-modal__dialog",
+            `vk-modal__dialog--${e.size}`,
+            `vk-modal__dialog--${e.variant}`
+          ]),
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-labelledby": f.value ? s : void 0,
+          tabindex: "-1"
+        }, [
+          g.$slots.header || e.title ? (t(), a("header", Ka, [
+            B(g.$slots, "header", {}, () => [
+              o("h2", {
+                id: s,
+                class: "vk-modal__title"
+              }, m(e.title), 1)
+            ]),
+            o("button", {
+              type: "button",
+              class: "vk-modal__close",
+              "aria-label": "Close dialog",
+              onClick: v
+            }, " × ")
+          ])) : u("", !0),
+          o("div", Na, [
+            B(g.$slots, "default")
+          ]),
+          g.$slots.footer ? (t(), a("footer", Ra, [
+            B(g.$slots, "footer")
+          ])) : u("", !0)
+        ], 10, Fa)
+      ], 32)) : u("", !0)
+    ]));
+  }
+}), yl = /* @__PURE__ */ I({
+  __name: "Overlay",
+  props: {
+    show: { type: Boolean, default: !1 },
+    opacity: { default: "medium" },
+    variant: { default: "info" },
+    blur: { type: Boolean, default: !1 },
+    zIndex: { default: 1e3 },
+    closeOnClick: { type: Boolean, default: !0 }
+  },
+  emits: ["clickOutside"],
+  setup(e, { emit: c }) {
+    const l = e, d = c;
+    function n(s) {
+      l.closeOnClick && d("clickOutside", s);
+    }
+    return (s, i) => e.show ? (t(), a("div", {
+      key: 0,
+      class: $([
+        "vk-overlay",
+        `vk-overlay--${e.opacity}`,
+        `vk-overlay--${e.variant}`,
+        { "vk-overlay--blur": e.blur }
+      ]),
+      style: O({ zIndex: String(e.zIndex) }),
+      "aria-hidden": "true",
+      onClick: n
+    }, null, 6)) : u("", !0);
+  }
+}), Pa = ["aria-label"], ja = { class: "vk-overlay-loader__content" }, Ga = { class: "vk-overlay-loader__message" }, $l = /* @__PURE__ */ I({
+  __name: "OverlayLoader",
+  props: {
+    show: { type: Boolean, default: !1 },
+    message: { default: "Loading..." },
+    fullscreen: { type: Boolean, default: !1 },
+    size: { default: "md" },
+    variant: { default: "info" }
+  },
+  setup(e) {
+    return (c, l) => e.show ? (t(), a("div", {
+      key: 0,
+      class: $([
+        "vk-overlay-loader",
+        `vk-overlay-loader--${e.size}`,
+        `vk-overlay-loader--${e.variant}`,
+        { "vk-overlay-loader--fullscreen": e.fullscreen }
+      ]),
+      role: "status",
+      "aria-live": "polite",
+      "aria-label": e.message
+    }, [
+      l[1] || (l[1] = o("div", {
+        class: "vk-overlay-loader__backdrop",
+        "aria-hidden": "true"
+      }, null, -1)),
+      o("div", ja, [
+        l[0] || (l[0] = o("span", {
+          class: "vk-overlay-loader__spinner",
+          "aria-hidden": "true"
+        }, null, -1)),
+        o("span", Ga, m(e.message), 1)
+      ])
+    ], 10, Pa)) : u("", !0);
+  }
+});
+export {
+  vl as Accordion,
+  bl as Avatar,
+  tl as Badge,
+  dl as Breadcrumb,
+  ol as BurgerButton,
+  Ua as Button,
+  fl as Card,
+  Xa as Checkbox,
+  hl as EmptyState,
+  rl as Footer,
+  Ha as Input,
+  el as Label,
+  _l as Modal,
+  il as NavBar,
+  sl as NavMenu,
+  yl as Overlay,
+  $l as OverlayLoader,
+  ul as Pagination,
+  al as Pill,
+  Ya as RadioGroup,
+  Qa as Selector,
+  Za as Switch,
+  ml as Table,
+  cl as Tabs,
+  Ja as TextArea,
+  kl as TitleCard,
+  ll as Toast,
+  nl as Tooltip
+};
+//# sourceMappingURL=vitam-uikit-apps.esm.js.map