@reportportal/ui-kit 0.0.1-alpha.41 → 0.0.1-alpha.43

package/dist/components/dropdown/dropdown.d.ts

@@ -14,7 +14,7 @@ export interface DropdownProps {
     transparentBackground?: boolean;
     className?: string;
     toggleButtonClassName?: string;
-    onChange: (value: DropdownValue) => void;
+    onChange: (value: DropdownValue | DropdownValue[]) => void;
     onFocus?: () => void;
     onBlur?: () => void;
     renderOption?: RenderDropdownOption;

package/dist/components/index.d.ts

@@ -17,7 +17,7 @@ export { Pagination } from './pagination';
 export { Table } from './table';
 export { DatePicker } from './datePicker';
 export { DatePicker1 } from './datePicker1';
-export { DatePicker2 } from './dataPicker2/dataPicker2';
 export { Date2 } from './date2';
+export { ReactDatePicker2 } from './reactDatePicker2';
 export { SystemAlert } from './systemAlert';
 export * from './icons';

package/dist/components/reactDatePicker/index.d.ts

@@ -0,0 +1,3 @@
+import { ReactDatePicker2 } from './reactDatePicker';
+export { ReactDatePicker2 };
+export default ReactDatePicker2;

package/dist/components/reactDatePicker/reactDatePicker.d.ts

@@ -0,0 +1,2 @@
+import ReactDatePicker from 'react-datepicker';
+export declare const ReactDatePicker2: typeof ReactDatePicker;

package/dist/components/reactDatePicker2/index.d.ts

@@ -0,0 +1,3 @@
+import { ReactDatePicker2 } from './reactDatePicker2';
+export { ReactDatePicker2 };
+export default ReactDatePicker2;

package/dist/components/reactDatePicker2/reactDatePicker2.d.ts

@@ -0,0 +1,2 @@
+import ReactDatePicker from 'react-datepicker';
+export declare const ReactDatePicker2: typeof ReactDatePicker;

package/dist/{datePicker-a005ebc6.js → datePicker-0d4910b6.js}

@@ -5,7 +5,7 @@ import { useMemo as E, useRef as B } from "react";
 import { F as D } from "./fieldText-65e4c614.js";
 import "./baseIconButton-b6adc843.js";
 import { S as T, a as G } from "./calendar-f154eb78.js";
-import { D as P } from "./dropdown-9f4d1928.js";
+import { D as P } from "./dropdown-b78dd5d4.js";
 const H = (a, c = 20) => {
   const l = a + c;
   return new Array(l - a).fill(void 0).map((g, e) => a - e);

package/dist/{datePicker-e85bee1d.js → datePicker-543e9043.js}

@@ -5,7 +5,7 @@ import { useMemo as E, useRef as B } from "react";
 import { F as D } from "./fieldText-65e4c614.js";
 import "./baseIconButton-b6adc843.js";
 import { S as T, a as G } from "./calendar-f154eb78.js";
-import { D as P } from "./dropdown-9f4d1928.js";
+import { D as P } from "./dropdown-b78dd5d4.js";
 const H = (a, c = 20) => {
   const l = a + c;
   return new Array(l - a).fill(void 0).map((g, e) => a - e);

package/dist/datePicker.js

@@ -1,4 +1,4 @@
-import { D as t } from "./datePicker-a005ebc6.js";
+import { D as t } from "./datePicker-543e9043.js";
 import "react/jsx-runtime";
 import "react-datepicker";
 import "./bind-06a7ff84.js";
@@ -6,7 +6,7 @@ import "react";
 import "./fieldText-65e4c614.js";
 import "./baseIconButton-b6adc843.js";
 import "./calendar-f154eb78.js";
-import "./dropdown-9f4d1928.js";
+import "./dropdown-b78dd5d4.js";
 import "@floating-ui/react-dom";
 import "downshift";
 import "rc-scrollbars";

package/dist/datePicker1.js

@@ -1,4 +1,4 @@
-import { D as t } from "./datePicker-e85bee1d.js";
+import { D as t } from "./datePicker-0d4910b6.js";
 import "react/jsx-runtime";
 import "react-datepicker";
 import "./bind-06a7ff84.js";
@@ -6,7 +6,7 @@ import "react";
 import "./fieldText-65e4c614.js";
 import "./baseIconButton-b6adc843.js";
 import "./calendar-f154eb78.js";
-import "./dropdown-9f4d1928.js";
+import "./dropdown-b78dd5d4.js";
 import "@floating-ui/react-dom";
 import "downshift";
 import "rc-scrollbars";

package/dist/dropdown-b78dd5d4.js

@@ -0,0 +1,256 @@
+import { jsxs as g, jsx as d, Fragment as S } from "react/jsx-runtime";
+import * as V from "react";
+import { forwardRef as le, useState as $, useRef as oe } from "react";
+import { c as q } from "./bind-06a7ff84.js";
+import { useFloating as ce, offset as _e, flip as he } from "@floating-ui/react-dom";
+import { useSelect as k } from "downshift";
+import { Scrollbars as ge } from "rc-scrollbars";
+import { u as fe } from "./useOnClickOutside-c332f7d3.js";
+import { K as p } from "./keyCodes-f63c0e11.js";
+import { B as pe } from "./baseIconButton-b6adc843.js";
+import { C as me } from "./checkbox-9a6c7ce1.js";
+const Ce = (r) => /* @__PURE__ */ V.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...r }, /* @__PURE__ */ V.createElement("path", { d: "M14.2174 5.82426C14.3736 5.66805 14.3736 5.41479 14.2174 5.25858L14.0759 5.11716C13.9197 4.96095 13.6665 4.96095 13.5103 5.11716L8.16726 10.4602L2.82426 5.11716C2.66805 4.96095 2.41479 4.96095 2.25858 5.11716L2.11716 5.25858C1.96095 5.41479 1.96095 5.66805 2.11716 5.82426L7.89176 11.5989C8.04797 11.7551 8.30124 11.7551 8.45745 11.5989L8.88171 11.1746L8.87436 11.1673L14.2174 5.82426Z", fill: "#A2AAB5" })), ye = "_disabled_t3cjj_12", ue = "_hidden_t3cjj_16", we = "_hover_t3cjj_22", Oe = {
+  "dropdown-option": "_dropdown-option_t3cjj_1",
+  disabled: ye,
+  hidden: ue,
+  hover: we,
+  "single-option": "_single-option_t3cjj_35",
+  "sub-option": "_sub-option_t3cjj_42"
+}, U = q.bind(Oe), Z = le(
+  (r, e) => {
+    const {
+      option: { value: n, disabled: l, hidden: D, label: m, title: c, groupRef: a },
+      selected: v,
+      onChange: C,
+      render: y,
+      highlightHovered: u,
+      onMouseEnter: A,
+      multiSelect: w,
+      isPartiallyChecked: K = !1
+    } = r, x = (O) => {
+      (O.target instanceof HTMLDivElement || O.target instanceof HTMLInputElement) && (C == null || C(n));
+    };
+    return /* @__PURE__ */ g(
+      "div",
+      {
+        className: U("dropdown-option", {
+          disabled: l,
+          hidden: D,
+          hover: u
+        }),
+        title: c,
+        onClick: x,
+        ref: e,
+        onMouseEnter: A,
+        children: [
+          w && /* @__PURE__ */ d(me, { value: !!v, partiallyChecked: K }),
+          /* @__PURE__ */ d("div", { className: U("single-option", { "sub-option": !!a }), children: y ? y(r) : m })
+        ]
+      }
+    );
+  }
+), be = [
+  p.ENTER_KEY_CODE,
+  p.SPACE_KEY_CODE,
+  p.ARROW_DOWN_KEY_CODE
+], Ee = [p.ESCAPE_KEY_CODE, p.TAB_KEY_CODE];
+var f = /* @__PURE__ */ ((r) => (r.ON_KEY_DOWN = "onKeyDown", r.ON_CLICK = "onClick", r))(f || {});
+const Ne = (r, e) => {
+  const n = Array.isArray(e) ? e : [e];
+  return r.findIndex(({ value: l }) => n.includes(l));
+}, De = (r, e) => (r % e + e) % e, j = (r, e = 0, n = 1) => {
+  if (!r[e].disabled)
+    return e;
+  const l = r.length;
+  return j(
+    r,
+    De(e + n, l),
+    n
+  );
+}, ve = (r, e) => j(r, e), Ae = (r, e) => j(r, e, -1), Ke = "_container_re5ge_1", xe = "_icon_re5ge_7", Ie = "_arrow_re5ge_13", ke = "_dropdown_re5ge_19", je = "_disabled_re5ge_36", Le = "_value_re5ge_43", Pe = "_error_re5ge_46", Re = "_touched_re5ge_46", Ye = "_opened_re5ge_50", Te = "_placeholder_re5ge_72", He = "_ghost_re5ge_118", Me = "_divider_re5ge_132", We = {
+  container: Ke,
+  icon: xe,
+  arrow: Ie,
+  dropdown: ke,
+  "transparent-background": "_transparent-background_re5ge_33",
+  disabled: je,
+  value: Le,
+  error: Pe,
+  touched: Re,
+  opened: Ye,
+  placeholder: Te,
+  "mobile-disabled": "_mobile-disabled_re5ge_87",
+  "select-list": "_select-list_re5ge_92",
+  "limited-width": "_limited-width_re5ge_109",
+  "options-container": "_options-container_re5ge_113",
+  ghost: He,
+  divider: Me
+}, o = q.bind(We), Fe = ({
+  multiSelect: r = !1,
+  value: e = r ? [] : "",
+  options: n = [],
+  disabled: l = !1,
+  error: D,
+  onChange: m,
+  onFocus: c,
+  onBlur: a,
+  mobileDisabled: v,
+  title: C,
+  touched: y = !1,
+  icon: u,
+  variant: A,
+  placeholder: w = "",
+  renderOption: K,
+  transparentBackground: x = !1,
+  className: O,
+  toggleButtonClassName: z,
+  isListWidthLimited: G = !1,
+  optionAll: L = { value: "all", label: "All" },
+  isOptionAllVisible: P = !1,
+  onSelectAll: J = () => {
+  },
+  footer: R
+}) => {
+  const [_, h] = $(!1), Y = oe(null), [Q, b] = $(null), I = r && Array.isArray(e) ? n.filter((t) => e.includes(t.value)) : null, { refs: T, floatingStyles: X } = ce({
+    middleware: [
+      _e(5),
+      he({
+        fallbackPlacements: ["bottom", "top"]
+      })
+    ]
+  }), F = () => {
+    if (P && Array.isArray(e)) {
+      const t = n.map((s) => s.value);
+      m(e.length === n.length ? [] : t), J();
+    }
+  };
+  fe(Y, () => {
+    _ && (h(!1), a == null || a());
+  });
+  const H = (t) => {
+    if (!t.disabled) {
+      if (r) {
+        const s = Array.isArray(e) ? [...e] : [], i = s.indexOf(t.value);
+        i === -1 ? s.push(t.value) : s.splice(i, 1), m(s);
+      } else
+        m(t.value);
+      h((s) => r || !s);
+    }
+  }, B = () => n.find(({ value: t }) => t === e), M = Ne(n, e), {
+    getToggleButtonProps: ee,
+    getMenuProps: te,
+    getItemProps: re,
+    setHighlightedIndex: E,
+    highlightedIndex: W,
+    selectedItem: N
+  } = k({
+    items: n,
+    itemToString: (t) => (t != null && t.label ? String(t.label) : w) || "",
+    selectedItem: B(),
+    isOpen: _,
+    circularNavigation: !0,
+    defaultHighlightedIndex: M,
+    onHighlightedIndexChange: (t) => {
+      switch (t.type) {
+        case k.stateChangeTypes.MenuKeyDownArrowUp:
+          return b(f.ON_KEY_DOWN), E(Ae(n, t.highlightedIndex)), t;
+        case k.stateChangeTypes.MenuKeyDownArrowDown:
+          return b(f.ON_KEY_DOWN), E(ve(n, t.highlightedIndex)), t;
+        default:
+          return t;
+      }
+    }
+  }), ne = () => {
+    l || (h((t) => !t), _ ? a == null || a() : c == null || c(), b(f.ON_CLICK));
+  }, se = () => !e && e !== !1 && e !== 0 || Array.isArray(e) && !e.length ? w : r && Array.isArray(e) && n.length === e.length ? L.label : n.reduce((s, i) => ((Array.isArray(e) && e.includes(i.value) || i.value === e) && s.push(i.label), s), []).join(", "), ae = (t) => {
+    const { keyCode: s } = t;
+    be.includes(s) && !_ && (t.preventDefault(), E(M), h(!0), c == null || c(), b(f.ON_KEY_DOWN));
+  }, de = (t) => {
+    const { keyCode: s } = t;
+    if (s === p.ENTER_KEY_CODE) {
+      const i = n[W];
+      H(i), r || (h(!1), a == null || a());
+      return;
+    }
+    Ee.includes(s) && (t.stopPropagation(), h(!1), a == null || a());
+  }, ie = () => /* @__PURE__ */ g("div", { className: o("options-container"), children: [
+    r && P && Array.isArray(e) && /* @__PURE__ */ g(S, { children: [
+      /* @__PURE__ */ d(
+        Z,
+        {
+          option: L,
+          selected: e.length === n.length,
+          onChange: F,
+          multiSelect: r,
+          isPartiallyChecked: !!e.length
+        }
+      ),
+      /* @__PURE__ */ d("div", { className: o("divider") }),
+      " "
+    ] }),
+    n.map((t, s) => /* @__PURE__ */ d(
+      Z,
+      {
+        ...re({
+          item: t,
+          index: s
+        }),
+        multiSelect: r,
+        selected: r ? I == null ? void 0 : I.some((i) => i.value === t.value) : t.value === ((N == null ? void 0 : N.value) ?? N),
+        option: { title: t.label, ...t },
+        highlightHovered: W === s && Q !== f.ON_CLICK,
+        render: K,
+        onChange: t.disabled ? null : () => H(t),
+        onMouseEnter: () => E(s)
+      },
+      t.value
+    )),
+    R && /* @__PURE__ */ g(S, { children: [
+      /* @__PURE__ */ d("div", { className: o("divider") }),
+      R
+    ] })
+  ] });
+  return /* @__PURE__ */ g("div", { ref: Y, className: o("container", O), title: C, children: [
+    /* @__PURE__ */ g(
+      "button",
+      {
+        disabled: l,
+        ...ee({
+          className: o("dropdown", A, z, {
+            "transparent-background": x,
+            opened: _,
+            disabled: l,
+            error: D,
+            touched: y,
+            "mobile-disabled": v
+          }),
+          onClick: ne,
+          onKeyDown: ae,
+          ref: T.setReference
+        }),
+        type: "button",
+        children: [
+          u && /* @__PURE__ */ d("span", { className: o("icon"), children: u }),
+          /* @__PURE__ */ d("span", { className: o("value", { placeholder: !e }), children: se() }),
+          /* @__PURE__ */ d(pe, { className: o("arrow"), tabIndex: -1, children: /* @__PURE__ */ d(Ce, {}) })
+        ]
+      }
+    ),
+    _ && /* @__PURE__ */ d(
+      "div",
+      {
+        style: X,
+        className: o("select-list", { opened: _, "limited-width": G }),
+        ...te({
+          onKeyDown: de,
+          ref: T.setFloating
+        }),
+        children: /* @__PURE__ */ d(ge, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: ie() })
+      }
+    )
+  ] });
+};
+export {
+  Fe as D,
+  Ce as S
+};

package/dist/dropdown.js

@@ -1,4 +1,4 @@
-import { D as r } from "./dropdown-9f4d1928.js";
+import { D as r } from "./dropdown-b78dd5d4.js";
 import "react/jsx-runtime";
 import "react";
 import "./bind-06a7ff84.js";