energy-components 1.22.0 → 2.0.0-beta.0

package/dist/components/tooltip.es.js

@@ -1,11 +1,11 @@
-import { defineComponent as q, toRefs as G, ref as u, computed as T, onBeforeUnmount as J, createElementBlock as x, openBlock as m, createElementVNode as v, createBlock as K, renderSlot as D, Teleport as Q, normalizeClass as N, createCommentVNode as O, unref as A, createVNode as Z, toDisplayString as E, createTextVNode as ee, nextTick as te } from "vue";
-import { a as oe, o as le, f as ae, s as ie, b as se, c as re, d as ne } from "./floating-ui.vue-DHEoOe5S.js";
-import { R as ue } from "./icon-svg-K8-vLJgV.js";
+import { defineComponent as q, toRefs as G, ref as n, computed as T, onBeforeUnmount as J, createElementBlock as x, openBlock as f, createElementVNode as m, createBlock as K, renderSlot as A, Teleport as Q, normalizeClass as D, createCommentVNode as N, unref as O, createVNode as Z, toDisplayString as U, createTextVNode as ee, nextTick as te } from "vue";
+import { a as oe, o as le, f as ae, s as ie, b as se, c as re, d as ne } from "./floating-ui.vue-C-DgKOwt.js";
+import { I as ue } from "./icon-svg-DxlNo61Q.js";
 import { _ as de } from "./_plugin-vue_export-helper-CHgC5LLL.js";
-import './style/tooltip.css';const ce = ["id"], fe = {
+import './style/tooltip.css';const ce = ["id"], pe = {
   key: 0,
   class: "rds-e-tooltip__header"
-}, pe = { class: "rds-e-tooltip__title" }, me = { class: "rds-e-tooltip__content" }, ve = /* @__PURE__ */ q({
+}, fe = { class: "rds-e-tooltip__title" }, me = { class: "rds-e-tooltip__content" }, ve = /* @__PURE__ */ q({
   __name: "tooltip",
   props: {
     /**
@@ -111,68 +111,68 @@ import './style/tooltip.css';const ce = ["id"], fe = {
      */
     "hide"
   ],
-  setup(a, { expose: H, emit: V }) {
-    const o = a, d = V, { large: S, fullWidth: j, title: i, inverse: I } = G(o), c = u(), s = u(), r = u(), e = u(!0), h = u("");
-    let l = null, _ = !1, y = !1, t = null;
-    const b = T(() => Math.min(Math.max(o.hideDelay, 0), 3e3)), U = T(() => ({
+  setup(a, { expose: E, emit: H }) {
+    const t = a, u = H, { large: S, fullWidth: I, title: v, inverse: V } = G(t), d = n(), i = n(), s = n(), e = n(!0), h = n("");
+    let l = null, _ = !1, y = !1, o = null;
+    const b = T(() => Math.min(Math.max(t.hideDelay, 0), 3e3)), j = T(() => ({
       "rds-e-tooltip__tooltip": !0,
       "rds-e-tooltip__tooltip-hidden": e.value,
       "rds-e-tooltip__tooltip--large": S.value,
-      "rds-e-tooltip__tooltip--inverse": I.value
+      "rds-e-tooltip__tooltip--inverse": V.value
     })), k = async () => {
-      const n = [
-        le(o.offsetSpace),
+      const r = [
+        le(t.offsetSpace),
         ae(),
         ie(),
         se({
-          apply({ availableHeight: f, availableWidth: p, elements: w }) {
+          apply({ availableHeight: c, availableWidth: p, elements: w }) {
             Object.assign(w.floating.style, {
-              maxWidth: j.value ? `${Math.max(0, p)}px` : "380px",
+              maxWidth: I.value ? `${Math.max(0, p)}px` : "380px",
               width: "max-content",
-              maxHeight: `${Math.max(0, f)}px`
+              maxHeight: `${Math.max(0, c)}px`
             });
           }
         })
       ];
-      !o.hideArrow && r.value && n.push(re({
-        element: r.value,
+      !t.hideArrow && s.value && r.push(re({
+        element: s.value,
         padding: S.value ? 16 : 8
       }));
-      const { x: $, y: Y, middlewareData: C, placement: M } = await ne(
-        c.value,
-        s.value,
+      const { x: C, y: Y, middlewareData: M, placement: R } = await ne(
+        d.value,
+        i.value,
         {
-          placement: o.placement,
-          middleware: n
+          placement: t.placement,
+          middleware: r
         }
       );
-      if (Object.assign(s.value.style, {
-        left: `${$}px`,
+      if (Object.assign(i.value.style, {
+        left: `${C}px`,
         top: `${Y}px`
-      }), !o.hideArrow && r.value && C.arrow) {
-        const { x: f, y: p } = C.arrow, w = {
+      }), !t.hideArrow && s.value && M.arrow) {
+        const { x: c, y: p } = M.arrow, w = {
           left: "right",
           right: "left",
           bottom: "top",
           top: "bottom"
         };
-        h.value = `rds-e-tooltip__tooltip-arrow--${M}`, Object.assign(r.value.style, {
-          left: f != null ? `${f}px` : "",
+        h.value = `rds-e-tooltip__tooltip-arrow--${R}`, Object.assign(s.value.style, {
+          left: c != null ? `${c}px` : "",
           top: p != null ? `${p}px` : "",
           bottom: "",
           right: "",
-          [w[M.split("-")[0]]]: "-4px"
+          [w[R.split("-")[0]]]: "-4px"
         });
-      } else o.hideArrow && (h.value = "");
+      } else t.hideArrow && (h.value = "");
     }, W = () => {
-      clearTimeout(l), e.value ? e.value = !0 : (e.value = !0, d("hide"));
+      clearTimeout(l), e.value ? e.value = !0 : (e.value = !0, u("hide"));
     }, B = () => {
-      i != null && i.value || (e.value ? e.value = !0 : (e.value = !0, d("hide"))), clearTimeout(l);
+      v?.value || (e.value ? e.value = !0 : (e.value = !0, u("hide"))), clearTimeout(l);
     }, g = () => {
-      o.suppressed || (clearTimeout(l), e.value = !1, d("show"), te(() => {
-        k(), o.autoUpdate && c.value && s.value && (t == null || t(), t = oe(
-          c.value,
-          s.value,
+      t.suppressed || (clearTimeout(l), e.value = !1, u("show"), te(() => {
+        k(), t.autoUpdate && d.value && i.value && (o?.(), o = oe(
+          d.value,
+          i.value,
           () => {
             k();
           }
@@ -190,62 +190,62 @@ import './style/tooltip.css';const ce = ["id"], fe = {
       _ = !1, y || (l = setTimeout(() => {
         B();
       }, b.value));
-    }, R = () => {
-      e.value || (e.value = !0, d("hide"), t && (t(), t = null));
+    }, $ = () => {
+      e.value || (e.value = !0, u("hide"), o && (o(), o = null));
     }, X = () => {
-      R();
+      $();
     };
-    return H({
+    return E({
       show: g,
-      hide: R,
+      hide: $,
       isOpen: T(() => !e.value)
     }), J(() => {
-      clearTimeout(l), t && (t(), t = null);
-    }), (n, $) => (m(), x("div", {
+      clearTimeout(l), o && (o(), o = null);
+    }), (r, C) => (f(), x("div", {
       id: a.id,
       class: "rds-e-tooltip"
     }, [
-      v("div", {
+      m("div", {
         ref_key: "referenceRef",
-        ref: c,
+        ref: d,
         class: "rds-e-tooltip__trigger",
         onBlur: W,
         onFocus: g,
         onMouseenter: z,
         onMouseleave: L
       }, [
-        D(n.$slots, "default", {}, void 0, !0)
+        A(r.$slots, "default", {}, void 0, !0)
       ], 544),
-      (m(), K(Q, {
+      (f(), K(Q, {
         to: a.teleportTo,
         disabled: !a.teleportTo
       }, [
-        v("div", {
+        m("div", {
           ref_key: "floatingRef",
-          ref: s,
-          class: N(U.value),
+          ref: i,
+          class: D(j.value),
           onMouseenter: P,
           onMouseleave: F
         }, [
-          A(i) ? (m(), x("div", fe, [
-            v("h3", pe, E(A(i)), 1),
+          O(v) ? (f(), x("div", pe, [
+            m("h3", fe, U(O(v)), 1),
             Z(ue, {
               name: "close",
               "aria-hidden": "true",
               class: "rds-e-tooltip__icon",
               onClick: X
             })
-          ])) : O("", !0),
-          v("div", me, [
-            D(n.$slots, "tooltip-content", {}, () => [
-              ee(E(a.content), 1)
+          ])) : N("", !0),
+          m("div", me, [
+            A(r.$slots, "tooltip-content", {}, () => [
+              ee(U(a.content), 1)
             ], !0)
           ]),
-          a.hideArrow ? O("", !0) : (m(), x("div", {
+          a.hideArrow ? N("", !0) : (f(), x("div", {
             key: 1,
             ref_key: "arrowRef",
-            ref: r,
-            class: N(["rds-e-tooltip__tooltip-arrow", h.value])
+            ref: s,
+            class: D(["rds-e-tooltip__tooltip-arrow", h.value])
           }, null, 2))
         ], 34)
       ], 8, ["to", "disabled"]))