@reportportal/ui-kit 0.0.1-alpha.210 → 0.0.1-alpha.211

package/dist/components/popover/popover.d.ts

@@ -12,9 +12,14 @@ export interface PopoverProps {
     safeZone?: number;
     arrowColor?: string;
     dataAutomationId?: string;
-    isOpened?: boolean;
-    isCentered?: boolean;
     strategy?: Strategy;
+    transitionDuration?: number | Partial<{
+        open: number;
+        close: number;
+    }>;
+    isCentered?: boolean;
+    isFocusDisabled?: boolean;
+    isOpened?: boolean;
     shouldUsePortal?: boolean;
     setIsOpened?: (isOpened: boolean) => void;
 }

package/dist/popover.js

@@ -1,86 +1,95 @@
-import { jsxs as f, Fragment as j, jsx as s } from "react/jsx-runtime";
-import { useRef as C, useState as L, useCallback as M } from "react";
-import { useFloating as W, offset as U, flip as q, arrow as z, autoUpdate as B, useClick as J, useDismiss as K, useRole as Q, useInteractions as V, FloatingFocusManager as X, FloatingArrow as Y, FloatingPortal as Z } from "@floating-ui/react";
-import { c as $ } from "./bind-06a7ff84.js";
-import { g as ee, T as g, a as te, A as se, b as ne, m as oe } from "./floatingUi-46f5b896.js";
-const le = "_popover_n3nff_1", ae = "_title_n3nff_28", re = {
+import { jsxs as f, Fragment as W, jsx as s } from "react/jsx-runtime";
+import { useRef as U, useState as q, useCallback as z } from "react";
+import { useFloating as B, offset as J, flip as K, arrow as Q, autoUpdate as V, useClick as X, useDismiss as Y, useRole as Z, useInteractions as $, useTransitionStyles as ee, FloatingFocusManager as te, FloatingArrow as se, FloatingPortal as ne } from "@floating-ui/react";
+import { c as oe } from "./bind-06a7ff84.js";
+import { g as ae, T as u, a as le, A as ie, b as re, m as ce } from "./floatingUi-46f5b896.js";
+const pe = "_popover_n3nff_1", me = "_title_n3nff_28", fe = {
   "popover-wrapper": "_popover-wrapper_n3nff_1",
-  popover: le,
-  title: ae
-}, a = $.bind(re), ge = ({
-  content: u,
-  children: d,
-  className: _,
-  placement: h = "bottom",
-  fallbackPlacements: v = te,
-  title: r,
-  arrowOffset: n = se,
+  popover: pe,
+  title: me
+}, l = oe.bind(fe), he = ({
+  content: d,
+  children: g,
+  placement: v = "bottom",
+  fallbackPlacements: _ = le,
+  className: h,
+  title: i,
+  arrowOffset: n = ie,
   safeZone: A = 4,
   arrowColor: F = "white",
   dataAutomationId: x,
-  isOpened: R,
-  isCentered: i = !0,
-  strategy: w = "absolute",
-  shouldUsePortal: E = !1,
+  strategy: y = "absolute",
+  transitionDuration: R = 0,
+  isCentered: r = !0,
+  isFocusDisabled: w = !1,
+  isOpened: E,
+  shouldUsePortal: b = !1,
   setIsOpened: o
 }) => {
-  const c = C(null), [b, N] = L(!1), m = o ? R : b, P = (e) => {
+  const c = U(null), [T, N] = q(!1), p = o ? E : T, P = (e) => {
     o ? o(e) : N(e);
-  }, T = M(
-    (e, l) => ee(e, l, n, i),
-    [n, i]
-  ), { placement: y, refs: p, floatingStyles: k, context: t } = W({
-    open: m,
+  }, S = z(
+    (e, a) => ae(e, a, n, r),
+    [n, r]
+  ), { placement: k, refs: m, floatingStyles: I, context: t } = B({
+    open: p,
     onOpenChange: P,
-    placement: h,
-    strategy: w,
+    placement: v,
+    strategy: y,
     middleware: [
-      U(({ rects: e, placement: l }) => ({
-        mainAxis: A + g,
-        alignmentAxis: T(e, l)
+      J(({ rects: e, placement: a }) => ({
+        mainAxis: A + u,
+        alignmentAxis: S(e, a)
       })),
-      q({
+      K({
         fallbackAxisSideDirection: "start",
-        fallbackPlacements: v
+        fallbackPlacements: _
       }),
-      z({
+      Q({
         element: c
       })
     ],
-    whileElementsMounted: B
-  }), I = J(t), S = K(t), D = Q(t), { getReferenceProps: G, getFloatingProps: H } = V([I, S, D]), O = () => {
-    const e = /* @__PURE__ */ s(X, { context: t, modal: !1, children: /* @__PURE__ */ f(
+    whileElementsMounted: V
+  }), D = X(t), G = Y(t), H = Z(t), { getReferenceProps: M, getFloatingProps: O } = $([D, G, H]), { isMounted: j, styles: C } = ee(t, {
+    duration: R,
+    initial: { opacity: 0 }
+  }), L = () => {
+    const e = /* @__PURE__ */ s(te, { context: t, modal: !1, disabled: w, children: /* @__PURE__ */ f(
       "div",
       {
-        className: a("popover", _),
+        className: l("popover", h),
         "data-automation-id": x,
-        ref: p.setFloating,
-        style: k,
-        ...H(),
+        ref: m.setFloating,
+        style: {
+          ...I,
+          ...C,
+          pointerEvents: p ? "auto" : "none"
+        },
+        ...O(),
         children: [
           /* @__PURE__ */ s(
-            Y,
+            se,
             {
               ref: c,
               context: t,
-              width: ne,
-              height: g,
+              width: re,
+              height: u,
               fill: F,
-              staticOffset: oe.includes(y) ? null : n
+              staticOffset: ce.includes(k) ? null : n
             }
           ),
-          r && /* @__PURE__ */ s("div", { className: a("title"), children: r }),
-          u
+          i && /* @__PURE__ */ s("div", { className: l("title"), children: i }),
+          d
         ]
       }
     ) });
-    return E ? /* @__PURE__ */ s(Z, { children: e }) : e;
+    return b ? /* @__PURE__ */ s(ne, { children: e }) : e;
   };
-  return /* @__PURE__ */ f(j, { children: [
-    /* @__PURE__ */ s("div", { ref: p.setReference, ...G(), className: a("popover-wrapper"), children: d }),
-    m && O()
+  return /* @__PURE__ */ f(W, { children: [
+    /* @__PURE__ */ s("div", { ref: m.setReference, ...M(), className: l("popover-wrapper"), children: g }),
+    j && L()
   ] });
 };
 export {
-  ge as Popover
+  he as Popover
 };

package/package.json

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