@dv.net/ui-kit 7.3.1 → 7.4.1

package/dist/assets/{UiTooltip.vue_vue_type_script_setup_true_lang.C_cxTfXA.js → UiTooltip.vue_vue_type_script_setup_true_lang.CptSEao7.js}

@@ -1,15 +1,15 @@
-import { defineComponent as I, mergeModels as E, ref as k, useModel as O, computed as j, onUnmounted as P, createElementBlock as l, openBlock as i, createElementVNode as d, createBlock as g, createCommentVNode as r, withKeys as w, withModifiers as B, normalizeClass as s, renderSlot as m, Transition as Z, withCtx as q, Teleport as A, normalizeStyle as T, unref as h, Fragment as V, createTextVNode as R, toDisplayString as z } from "vue";
-import { u as G, b as J, o as Q, a as W, s as X, f as Y, c as x } from "./floating-ui.vue.CQbj4WJd.js";
+import { defineComponent as U, mergeModels as R, ref as g, useModel as F, computed as I, onUnmounted as O, createElementBlock as r, openBlock as l, createElementVNode as p, createBlock as b, createCommentVNode as n, withKeys as h, withModifiers as E, normalizeClass as a, renderSlot as m, Transition as j, withCtx as P, Teleport as Z, normalizeStyle as k, unref as w, Fragment as B, createTextVNode as T, toDisplayString as V } from "vue";
+import { u as q, b as A, o as G, a as J, s as Q, f as X, c as Y } from "./floating-ui.vue.CQbj4WJd.js";
 import { o as _ } from "./index.CWUzDs_o.js";
 import "./vue3-lottie.es.BGWavb2-.js";
 import "./style.CD0jFgS4.js";
 /* empty css                                                */
 /* empty css                                                         */
 /* empty css                                                    */
-import "./useDatePicker.DpkmuZRe.js";
+import "./useDatePicker.DnhbkLG1.js";
 import "../config/index.js";
 /* empty css                                                           */
-import { _ as ee } from "./UiIconButton.vue_vue_type_script_setup_true_lang.CsRgGcFe.js";
+import { _ as ee } from "./UiIconButton.vue_vue_type_script_setup_true_lang.O2daaEIF.js";
 import "../components/UiDatepicker/composables/useDatePickerPresets.js";
 /* empty css                                                       */
 /* empty css                                                   */
@@ -30,12 +30,12 @@ import "vue-router";
 /* empty css                                                    */
 /* empty css                                                               */
 /* empty css                                                    */
-const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip__content" }, re = { class: "ui-tooltip__content-inner" }, ne = {
+const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip__content-inner" }, re = {
   key: 1,
   class: "ui-tooltip__line"
-}, Ie = /* @__PURE__ */ I({
+}, Ne = /* @__PURE__ */ U({
   __name: "UiTooltip",
-  props: /* @__PURE__ */ E({
+  props: /* @__PURE__ */ R({
     position: { default: "top" },
     title: { default: "" },
     text: { default: "" },
@@ -45,43 +45,48 @@ const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip
     timeout: { default: 100 },
     teleport: { type: [String, Boolean], default: "body" },
     isShowIconClose: { type: Boolean },
-    tabindex: { default: 0 }
+    tabindex: { default: 0 },
+    backgroundColor: { default: "#222" },
+    maxWidth: { default: "314px" },
+    padding: { default: "16px" },
+    borderRadius: { default: "8px" },
+    width: { default: "fit-content" }
   }, {
     modelValue: { type: Boolean, default: !1 },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ E(["close", "click"], ["update:modelValue"]),
-  setup(b, { emit: H }) {
-    const $ = H, n = b;
-    let a = null;
-    const f = k(null), M = k(null), v = k(null), o = O(b, "modelValue");
+  emits: /* @__PURE__ */ R(["close", "click"], ["update:modelValue"]),
+  setup($, { emit: z }) {
+    const C = z, t = $;
+    let s = null;
+    const f = g(null), M = g(null), v = g(null), i = F($, "modelValue");
     _(
       v,
       (e) => {
-        e && (o.value = !1);
+        e && (i.value = !1);
       },
       { ignore: [f] }
     );
-    const { middlewareData: D, placement: S, floatingStyles: K } = G(f, v, {
-      whileElementsMounted: J,
-      placement: n.position,
+    const { middlewareData: H, placement: S, floatingStyles: W } = q(f, v, {
+      whileElementsMounted: A,
+      placement: t.position,
       middleware: [
-        Q(10),
-        W(),
-        X({
-          apply({ availableHeight: e, elements: t }) {
-            Object.assign(t.floating.style, {
+        G(10),
+        J(),
+        Q({
+          apply({ availableHeight: e, elements: o }) {
+            Object.assign(o.floating.style, {
               maxHeight: `${Math.max(300, e)}px`
             });
           }
         }),
-        Y({
+        X({
           fallbackStrategy: "initialPlacement"
         }),
-        x({ element: M, padding: 30 })
+        Y({ element: M, padding: 30 })
       ]
-    }), L = j(() => {
-      const e = D.value.arrow, t = {
+    }), D = I(() => {
+      const e = H.value.arrow, o = {
         top: "bottom",
         right: "left",
         bottom: "top",
@@ -92,109 +97,119 @@ const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip
         top: e?.y != null ? `${e?.y}px` : "",
         right: "",
         bottom: "",
-        [t]: "-8px"
+        [o]: "-8px",
+        fill: t.backgroundColor
       };
     });
-    function N() {
-      o.value = !1;
+    function K() {
+      i.value = !1;
     }
-    function U() {
-      o.value = !0;
+    function L() {
+      i.value = !0;
     }
-    function u() {
-      o.value = !o.value;
+    function d() {
+      i.value = !i.value;
     }
-    function F() {
-      u(), $("close");
+    function N() {
+      d(), C("close");
     }
-    function c(e, t) {
-      if (e === "click" && $("click"), te())
-        return e === "hover" ? void 0 : u();
-      if (n.showEvent === "click" && e === "click")
-        return u();
-      if (n.showEvent === "hover" && e === "hover") {
-        if (!o.value) return o.value = !0;
-        t === "enter" ? (y(), o.value = !0) : t === "leave" && (a = setTimeout(() => o.value = !1, n.timeout));
+    function c(e, o) {
+      if (e === "click" && C("click"), te())
+        return e === "hover" ? void 0 : d();
+      if (t.showEvent === "click" && e === "click")
+        return d();
+      if (t.showEvent === "hover" && e === "hover") {
+        if (!i.value) return i.value = !0;
+        o === "enter" ? (y(), i.value = !0) : o === "leave" && (s = setTimeout(() => i.value = !1, t.timeout));
       }
     }
-    function C(e) {
-      n.showEvent === "hover" && (e === "enter" ? y() : e === "leave" && (a = setTimeout(() => o.value = !1, n.timeout)));
+    function x(e) {
+      t.showEvent === "hover" && (e === "enter" ? y() : e === "leave" && (s = setTimeout(() => i.value = !1, t.timeout)));
     }
     function y() {
-      a && clearTimeout(a);
+      s && clearTimeout(s);
     }
-    return P(() => {
+    return O(() => {
       y();
-    }), (e, t) => (i(), l("div", oe, [
-      d("div", {
+    }), (e, o) => (l(), r("div", oe, [
+      p("div", {
         role: "button",
         tabindex: e.tabindex,
         ref_key: "triggerRefer",
         ref: f,
         "aria-describedby": "tooltip",
-        class: s(["ui-tooltip__trigger", { "click-event": e.showEvent === "click", "is-disabled": e.disabled }]),
-        onMouseenter: t[0] || (t[0] = (p) => c("hover", "enter")),
-        onMouseleave: t[1] || (t[1] = (p) => c("hover", "leave")),
+        class: a(["ui-tooltip__trigger", { "click-event": e.showEvent === "click", "is-disabled": e.disabled }]),
+        onMouseenter: o[0] || (o[0] = (u) => c("hover", "enter")),
+        onMouseleave: o[1] || (o[1] = (u) => c("hover", "leave")),
         onKeydown: [
-          w(u, ["enter"]),
-          w(N, ["tab"])
+          h(d, ["enter"]),
+          h(K, ["tab"])
         ],
-        onClick: t[2] || (t[2] = B((p) => c("click"), ["stop", "prevent"])),
-        onKeyup: w(U, ["tab"])
+        onClick: o[2] || (o[2] = E((u) => c("click"), ["stop", "prevent"])),
+        onKeyup: h(L, ["tab"])
       }, [
         m(e.$slots, "default")
       ], 42, ie),
-      e.disabled ? r("", !0) : (i(), g(Z, {
+      e.disabled ? n("", !0) : (l(), b(j, {
         key: 0,
         name: "fade"
       }, {
-        default: q(() => [
-          o.value ? (i(), g(A, {
+        default: P(() => [
+          i.value ? (l(), b(Z, {
             key: 0,
             disabled: !e.teleport,
             to: typeof e.teleport == "string" ? e.teleport : "body"
           }, [
-            o.value ? (i(), l("div", {
+            i.value ? (l(), r("div", {
               key: 0,
-              class: s([[{ "click-event": e.showEvent === "click" }, e.popperClass], "ui-tooltip__content-wrapper"]),
-              style: T(h(K)),
+              class: a([[{ "click-event": e.showEvent === "click" }, e.popperClass], "ui-tooltip__content-wrapper"]),
+              style: k(w(W)),
               ref_key: "contentRefer",
               ref: v,
               role: "tooltip",
-              onMouseenter: t[3] || (t[3] = (p) => C("enter")),
-              onMouseleave: t[4] || (t[4] = (p) => C("leave"))
+              onMouseenter: o[3] || (o[3] = (u) => x("enter")),
+              onMouseleave: o[4] || (o[4] = (u) => x("leave"))
             }, [
-              d("div", le, [
-                d("div", re, [
-                  e.$slots.title || e.title ? (i(), l("div", {
+              p("div", {
+                class: "ui-tooltip__content",
+                style: k({
+                  backgroundColor: t.backgroundColor,
+                  maxWidth: typeof t.maxWidth == "number" ? `${t.maxWidth}px` : t.maxWidth,
+                  padding: typeof t.padding == "number" ? `${t.padding}px` : t.padding,
+                  borderRadius: typeof t.borderRadius == "number" ? `${t.borderRadius}px` : t.borderRadius,
+                  width: typeof t.width == "number" ? `${t.width}px` : t.width
+                })
+              }, [
+                p("div", le, [
+                  e.$slots.title || e.title ? (l(), r("div", {
                     key: 0,
-                    class: s([{ "ui-tooltip__title": e.title }, "ui-tooltip--title"])
+                    class: a([{ "ui-tooltip__title": e.title }, "ui-tooltip--title"])
                   }, [
-                    e.title ? (i(), l(V, { key: 0 }, [
-                      R(z(e.title), 1)
+                    e.title ? (l(), r(B, { key: 0 }, [
+                      T(V(e.title), 1)
                     ], 64)) : m(e.$slots, "title", { key: 1 }),
-                    e.isShowIconClose ? (i(), g(h(ee), {
+                    e.isShowIconClose ? (l(), b(w(ee), {
                       key: 2,
-                      onClick: B(F, ["stop"]),
+                      onClick: E(N, ["stop"]),
                       "icon-color": "#fff",
                       "no-size": "",
                       "icon-name": "close",
                       "icon-type": "400",
                       size: "sm"
-                    })) : r("", !0)
-                  ], 2)) : r("", !0),
-                  (e.$slots.title || e.title) && (e.$slots.text || e.text) ? (i(), l("div", ne)) : r("", !0),
-                  e.$slots.text || e.text ? (i(), l("div", {
+                    })) : n("", !0)
+                  ], 2)) : n("", !0),
+                  (e.$slots.title || e.title) && (e.$slots.text || e.text) ? (l(), r("div", re)) : n("", !0),
+                  e.$slots.text || e.text ? (l(), r("div", {
                     key: 2,
-                    class: s({ "ui-tooltip__text": e.text })
+                    class: a({ "ui-tooltip__text": e.text })
                   }, [
-                    e.text ? (i(), l(V, { key: 0 }, [
-                      R(z(e.text), 1)
+                    e.text ? (l(), r(B, { key: 0 }, [
+                      T(V(e.text), 1)
                     ], 64)) : m(e.$slots, "text", { key: 1 })
-                  ], 2)) : r("", !0),
-                  e.$slots.append ? m(e.$slots, "append", { key: 3 }) : r("", !0)
+                  ], 2)) : n("", !0),
+                  e.$slots.append ? m(e.$slots, "append", { key: 3 }) : n("", !0)
                 ]),
-                (i(), l("svg", {
+                (l(), r("svg", {
                   ref_key: "arrowRefer",
                   ref: M,
                   width: "20",
@@ -202,14 +217,14 @@ const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip
                   viewBox: "0 0 20 8",
                   fill: "none",
                   xmlns: "http://www.w3.org/2000/svg",
-                  style: T(L.value),
-                  class: s(["ui-tooltip__arrow", h(S)])
-                }, [...t[5] || (t[5] = [
-                  d("path", { d: "M9.89637 8L0 0L20 0L9.89637 8Z" }, null, -1)
+                  style: k(D.value),
+                  class: a(["ui-tooltip__arrow", w(S)])
+                }, [...o[5] || (o[5] = [
+                  p("path", { d: "M9.89637 8L0 0L20 0L9.89637 8Z" }, null, -1)
                 ])], 6))
-              ])
-            ], 38)) : r("", !0)
-          ], 8, ["disabled", "to"])) : r("", !0)
+              ], 4)
+            ], 38)) : n("", !0)
+          ], 8, ["disabled", "to"])) : n("", !0)
         ]),
         _: 3
       }))
@@ -217,5 +232,5 @@ const oe = { class: "ui-tooltip" }, ie = ["tabindex"], le = { class: "ui-tooltip
   }
 });
 export {
-  Ie as _
+  Ne as _
 };