@reportportal/ui-kit 0.0.1-alpha.174 → 0.0.1-alpha.176

package/dist/tooltip.js

@@ -1,102 +1,105 @@
-import { jsxs as p, Fragment as P, jsx as o } from "react/jsx-runtime";
-import { useState as R, useRef as d } from "react";
+import { jsxs as p, Fragment as P, jsx as n } from "react/jsx-runtime";
+import { useState as R, useRef as f } from "react";
 import { createPortal as G } from "react-dom";
 import { c as j } from "./bind-06a7ff84.js";
-import { useFloating as k, offset as $, flip as C, arrow as U, autoUpdate as Y, FloatingArrow as Z } from "@floating-ui/react";
-import { T as f, g as q, b as z, a as B } from "./floatingUi-41f8c7b5.js";
+import { useFloating as k, offset as $, flip as B, arrow as C, autoUpdate as U, FloatingArrow as Y } from "@floating-ui/react";
+import { T as u, g as Z, b as q, a as z } from "./floatingUi-41f8c7b5.js";
 const J = {
-  "tooltip-wrapper": "_tooltip-wrapper_lwpn2_16",
-  "tooltip-content": "_tooltip-content_lwpn2_23"
-}, n = j.bind(J), K = 300, Q = 100, st = ({
-  content: u,
-  wrapperClassName: h,
-  tooltipClassName: w,
-  contentClassName: x,
-  dynamicWidth: g,
-  width: T,
-  minWidth: _ = 120,
-  safeZone: A = 4,
-  zIndex: E = 9,
-  placement: N = "bottom",
-  arrowColor: b = "rgba(34, 34, 34, 0.91)",
-  dataAutomationId: I,
-  mainAxis: O = !0,
-  children: S,
-  portalRoot: s,
-  isFloating: W = !0
+  "tooltip-wrapper": "_tooltip-wrapper_1n6ya_16",
+  "tooltip-content": "_tooltip-content_1n6ya_26"
+}, s = j.bind(J), K = 300, Q = 100, st = ({
+  content: h,
+  wrapperClassName: x,
+  tooltipClassName: g,
+  contentClassName: w,
+  dynamicWidth: T,
+  width: _,
+  minWidth: A = 120,
+  safeZone: E = 4,
+  zIndex: b = 9,
+  placement: y = "bottom",
+  arrowColor: I = "rgba(34, 34, 34, 0.91)",
+  dataAutomationId: N,
+  mainAxis: F = !0,
+  children: O,
+  portalRoot: i,
+  isFloating: S = !0
 }) => {
-  const [i, l] = R(!1), a = d(null), t = d(), { refs: r, floatingStyles: v, context: y } = k({
-    open: i,
-    placement: N,
+  const [a, l] = R(!1), r = f(null), t = f(), { refs: c, floatingStyles: W, context: v } = k({
+    open: a,
+    placement: y,
     middleware: [
       $(({ rects: D, placement: H }) => ({
-        mainAxis: A + f,
-        alignmentAxis: q(D, H)
+        mainAxis: E + u,
+        alignmentAxis: Z(D, H)
       })),
-      W && C({
-        mainAxis: O,
+      S && B({
+        mainAxis: F,
         fallbackAxisSideDirection: "start",
-        fallbackPlacements: z
+        fallbackPlacements: q
       }),
-      U({
-        element: a
+      C({
+        element: r
       })
     ],
-    whileElementsMounted: Y
-  }), e = g ? null : { width: `${T}px` }, F = document.documentElement.clientWidth, L = e || F - Q, c = () => {
+    whileElementsMounted: U
+  }), e = T ? null : { width: `${_}px` }, L = document.documentElement.clientWidth, M = e || L - Q, o = () => {
     t.current && clearTimeout(t.current), l(!1);
-  }, M = () => {
+  }, m = () => {
     t.current = setTimeout(() => l(!0), K);
-  }, m = () => /* @__PURE__ */ p(
+  }, d = () => /* @__PURE__ */ p(
     "div",
     {
-      ref: r.setFloating,
+      ref: c.setFloating,
       style: {
-        ...v,
+        ...W,
         ...e,
-        minWidth: _,
-        zIndex: E,
+        minWidth: A,
+        zIndex: b,
         pointerEvents: "none"
       },
-      "data-automation-id": I,
-      className: n(w),
+      "data-automation-id": N,
+      className: s(g),
       children: [
-        /* @__PURE__ */ o(
-          Z,
+        /* @__PURE__ */ n(
+          Y,
           {
-            ref: a,
-            context: y,
-            width: B,
-            height: f,
-            fill: b
+            ref: r,
+            context: v,
+            width: z,
+            height: u,
+            fill: I
           }
         ),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ n(
           "div",
           {
-            className: n("tooltip-content", x),
+            className: s("tooltip-content", w),
             style: {
-              maxWidth: `${L}px`
+              maxWidth: `${M}px`
             },
-            children: u
+            children: h
           }
         )
       ]
     }
   );
   return /* @__PURE__ */ p(P, { children: [
-    /* @__PURE__ */ o(
+    /* @__PURE__ */ n(
       "div",
       {
-        ref: r.setReference,
-        className: n("tooltip-wrapper", h),
-        onMouseDown: c,
-        onMouseEnter: M,
-        onMouseLeave: c,
-        children: S
+        ref: c.setReference,
+        className: s("tooltip-wrapper", x),
+        onMouseDown: o,
+        onMouseEnter: m,
+        onMouseLeave: o,
+        onFocus: m,
+        onBlur: o,
+        tabIndex: 0,
+        children: O
       }
     ),
-    i && (s ? G(m(), s) : m())
+    a && (i ? G(d(), i) : d())
   ] });
 };
 export {

package/dist/useTreeSortable-694cfbbc.js

@@ -0,0 +1,184 @@
+import { useRef as _, useState as N, useEffect as w, useCallback as b } from "react";
+import { useDrag as Z, useDrop as A } from "react-dnd";
+import { getEmptyImage as F } from "react-dnd-html5-backend";
+import { DROP_POSITIONS as D, DROP_DETECTION_MODE as d, TREE_DROP_POSITIONS as h } from "./common.js";
+const k = "SORTABLE_ITEM", y = (r) => {
+  if (!r)
+    return {
+      display: "none"
+    };
+  const { x: n, y: o } = r, i = `translate(${n}px, ${o}px)`;
+  return {
+    transform: i,
+    WebkitTransform: i
+  };
+}, L = ({
+  fromIndex: r,
+  targetIndex: n,
+  isTopZone: o
+}) => o ? r < n ? n - 1 : n : r > n ? n + 1 : n, $ = (r, n) => r / n < 0.5 ? D.TOP : D.BOTTOM, z = ({
+  id: r,
+  index: n,
+  type: o = k,
+  isDisabled: i = !1,
+  isLast: R = !1,
+  onDrop: g,
+  hideDefaultPreview: T = !1,
+  dropDetectionMode: u = d.INDEX_BASED
+}) => {
+  const p = u === d.HOVER, v = _(null), O = _(null), [E, c] = N(null), [{ isDragging: B }, I, m] = Z(
+    () => ({
+      type: o,
+      item: { id: r, index: n, type: o },
+      collect: (t) => ({
+        isDragging: t.isDragging()
+      }),
+      canDrag: () => !i
+    }),
+    [r, n, o, i]
+  );
+  w(() => {
+    T && m(F(), { captureDraggingState: !0 });
+  }, [T, m]);
+  const [{ isOver: P, draggedItemIndex: S }, C] = A(
+    () => ({
+      accept: o,
+      collect: (t) => {
+        const e = t.getItem(), l = (e == null ? void 0 : e.id) !== r ? t.isOver() : !1;
+        return {
+          isOver: l,
+          draggedItemIndex: l ? (e == null ? void 0 : e.index) ?? null : null
+        };
+      },
+      hover: (t, e) => {
+        if (!p)
+          return;
+        if (t.id === r) {
+          c(null);
+          return;
+        }
+        const a = v.current;
+        if (!a) {
+          c(null);
+          return;
+        }
+        const l = a.getBoundingClientRect(), x = l.bottom - l.top, V = e.getClientOffset();
+        if (!V) {
+          c(null);
+          return;
+        }
+        const H = V.y - l.top, Y = $(H, x);
+        Y === null ? (c(null), O.current = null) : Y === D.TOP ? (c(D.TOP), O.current = D.TOP) : (c(D.BOTTOM), O.current = D.BOTTOM);
+      },
+      drop: (t) => {
+        if (!(t.id === r || !g))
+          if (p) {
+            const e = O.current;
+            if (!e)
+              return;
+            const a = e === D.TOP, l = L({
+              fromIndex: t.index,
+              targetIndex: n,
+              isTopZone: a
+            });
+            g(t.index, l);
+          } else
+            g(t.index, n);
+      }
+    }),
+    [r, n, o, g, R, p]
+  ), M = b(
+    (t) => (v.current = t, C(t)),
+    [C]
+  );
+  w(() => {
+    P || c(null);
+  }, [P]);
+  const f = p ? E : (() => S === null ? null : S > n ? D.TOP : D.BOTTOM)();
+  return {
+    isDragging: B,
+    isOver: P,
+    draggedItemIndex: S,
+    dropPosition: f,
+    dragRef: I,
+    dropRef: M,
+    previewRef: m
+  };
+}, G = (r, n, o = !1) => {
+  if (!r || !n)
+    return null;
+  const { top: i, height: R } = n, T = r.y - i, u = 6;
+  return T >= 0 && T < u ? h.BEFORE : o && T >= R - u && T <= R ? h.AFTER : h.INSIDE;
+}, J = ({
+  id: r,
+  index: n,
+  parentId: o = null,
+  type: i = k,
+  isDisabled: R = !1,
+  acceptDrop: g = !0,
+  isLast: T = !1,
+  canDropOn: u,
+  onDrop: p,
+  hideDefaultPreview: v = !1
+}) => {
+  const O = _(null), E = _(null), [c, B] = N(null), [{ isDragging: I }, m, P] = Z(
+    () => ({
+      type: i,
+      item: { id: r, index: n, type: i, parentId: o },
+      collect: (s) => ({
+        isDragging: s.isDragging()
+      }),
+      canDrag: () => !R
+    }),
+    [r, n, i, o, R]
+  );
+  w(() => {
+    v && P(F(), { captureDraggingState: !0 });
+  }, [v, P]);
+  const [{ isOver: S }, C] = A(
+    () => ({
+      accept: i,
+      hover: (s, f) => {
+        if (O.current && s.id !== r && g)
+          if (!u || u(s, r)) {
+            const e = f.getClientOffset(), a = O.current.getBoundingClientRect();
+            if (e && a) {
+              const l = G(e, a, T);
+              l !== c && (B(l), E.current = l);
+            }
+          } else
+            c !== null && (B(null), E.current = null);
+      },
+      collect: (s) => {
+        const f = s.getItem(), t = (f == null ? void 0 : f.id) !== r && g, e = !u || !f || u(f, r), a = s.isOver({ shallow: !0 }), l = t && e;
+        return !a && c !== null && (B(null), E.current = null), {
+          isOver: a && l
+        };
+      },
+      drop: (s, f) => {
+        if (f.didDrop())
+          return;
+        const t = !u || u(s, r);
+        s.id !== r && g && t && p && E.current && p(s, r, E.current);
+      }
+    }),
+    [r, i, g, T, u, p, c]
+  );
+  return {
+    isDragging: I,
+    isOver: S,
+    dropPosition: c,
+    dragRef: m,
+    dropRef: (s) => {
+      O.current = s, C(s);
+    },
+    previewRef: P,
+    elementRef: O
+  };
+};
+export {
+  k as D,
+  J as a,
+  y as g,
+  z as u
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reportportal/ui-kit",
-  "version": "0.0.1-alpha.174",
+  "version": "0.0.1-alpha.176",
   "description": "The UI-kit library for ReportPortal Design System.",
   "type": "module",
   "scripts": {

package/dist/useTreeSortable-70a9c8f5.js

@@ -1,179 +0,0 @@
-import { useRef as C, useState as V, useEffect as d, useCallback as b } from "react";
-import { useDrag as F, useDrop as Y } from "react-dnd";
-import { getEmptyImage as k } from "react-dnd-html5-backend";
-import { DROP_POSITIONS as l, DROP_DETECTION_MODE as h, TREE_DROP_POSITIONS as Z } from "./common.js";
-const x = "SORTABLE_ITEM", z = (r) => {
-  if (!r)
-    return {
-      display: "none"
-    };
-  const { x: n, y: t } = r, s = `translate(${n}px, ${t}px)`;
-  return {
-    transform: s,
-    WebkitTransform: s
-  };
-}, $ = ({
-  fromIndex: r,
-  targetIndex: n,
-  isTopZone: t
-}) => t ? r < n ? n - 1 : n : r > n ? n + 1 : n, G = (r, n) => r / n < 0.5 ? l.TOP : l.BOTTOM, J = ({
-  id: r,
-  index: n,
-  type: t = x,
-  isDisabled: s = !1,
-  isLast: a = !1,
-  onDrop: g,
-  hideDefaultPreview: O = !1,
-  dropDetectionMode: E = h.INDEX_BASED
-}) => {
-  const T = E === h.HOVER, p = C(null), i = C(null), [_, u] = V(null), [{ isDragging: P }, I, m] = F(
-    () => ({
-      type: t,
-      item: { id: r, index: n, type: t },
-      collect: (e) => ({
-        isDragging: e.isDragging()
-      }),
-      canDrag: () => !s
-    }),
-    [r, n, t, s]
-  );
-  d(() => {
-    O && m(k(), { captureDraggingState: !0 });
-  }, [O, m]);
-  const [{ isOver: v, draggedItemIndex: B }, o] = Y(
-    () => ({
-      accept: t,
-      collect: (e) => {
-        const c = e.getItem(), D = (c == null ? void 0 : c.id) !== r ? e.isOver() : !1;
-        return {
-          isOver: D,
-          draggedItemIndex: D ? (c == null ? void 0 : c.index) ?? null : null
-        };
-      },
-      hover: (e, c) => {
-        if (!T)
-          return;
-        if (e.id === r) {
-          u(null);
-          return;
-        }
-        const R = p.current;
-        if (!R) {
-          u(null);
-          return;
-        }
-        const D = R.getBoundingClientRect(), H = D.bottom - D.top, w = c.getClientOffset();
-        if (!w) {
-          u(null);
-          return;
-        }
-        const L = w.y - D.top, N = G(L, H);
-        N === null ? (u(null), i.current = null) : N === l.TOP ? (u(l.TOP), i.current = l.TOP) : (u(l.BOTTOM), i.current = l.BOTTOM);
-      },
-      drop: (e) => {
-        if (!(e.id === r || !g))
-          if (T) {
-            const c = i.current;
-            if (!c)
-              return;
-            const R = c === l.TOP, D = $({
-              fromIndex: e.index,
-              targetIndex: n,
-              isTopZone: R
-            });
-            g(e.index, D);
-          } else
-            g(e.index, n);
-      }
-    }),
-    [r, n, t, g, a, T]
-  ), f = b(
-    (e) => (p.current = e, o(e)),
-    [o]
-  );
-  d(() => {
-    v || u(null);
-  }, [v]);
-  const S = T ? _ : (() => B === null ? null : B > n ? l.TOP : l.BOTTOM)();
-  return {
-    isDragging: P,
-    isOver: v,
-    draggedItemIndex: B,
-    dropPosition: S,
-    dragRef: I,
-    dropRef: f,
-    previewRef: m
-  };
-}, A = 2, U = (r, n) => {
-  if (!r || !n)
-    return null;
-  const { top: t, height: s } = n, a = r.y - t;
-  return a < A ? Z.BEFORE : a > s - A ? Z.AFTER : Z.INSIDE;
-}, K = ({
-  id: r,
-  index: n,
-  parentId: t = null,
-  type: s = x,
-  isDisabled: a = !1,
-  acceptDrop: g = !0,
-  canDropOn: O,
-  onDrop: E,
-  hideDefaultPreview: T = !1
-}) => {
-  const p = C(null), i = C(null), [{ isDragging: _ }, u, P] = F(
-    () => ({
-      type: s,
-      item: { id: r, index: n, type: s, parentId: t },
-      collect: (o) => ({
-        isDragging: o.isDragging()
-      }),
-      canDrag: () => !a
-    }),
-    [r, n, s, t, a]
-  );
-  d(() => {
-    T && P(k(), { captureDraggingState: !0 });
-  }, [T, P]);
-  const [{ isOver: I, dropPosition: m }, v] = Y(
-    () => ({
-      accept: s,
-      collect: (o) => {
-        const f = o.getItem(), S = (f == null ? void 0 : f.id) !== r && g && (!O || !f || O(f, r)) ? o.isOver({ shallow: !0 }) : !1;
-        let e = null;
-        if (S && p.current) {
-          const c = o.getClientOffset(), R = p.current.getBoundingClientRect();
-          e = U(c, R), i.current = e;
-        } else
-          i.current = null;
-        return {
-          isOver: S,
-          dropPosition: e
-        };
-      },
-      drop: (o, f) => {
-        if (f.didDrop())
-          return;
-        const M = !O || O(o, r);
-        o.id !== r && g && M && E && i.current && E(o, r, i.current);
-      }
-    }),
-    [r, s, g, O, E]
-  );
-  return {
-    isDragging: _,
-    isOver: I,
-    dropPosition: m,
-    dragRef: u,
-    dropRef: (o) => {
-      p.current = o, v(o);
-    },
-    previewRef: P,
-    elementRef: p
-  };
-};
-export {
-  x as D,
-  K as a,
-  z as g,
-  J as u
-};