@reportportal/ui-kit 0.0.1-alpha.70 → 0.0.1-alpha.72

package/dist/close-4d480ef7.js

@@ -0,0 +1,5 @@
+import * as e from "react";
+const t = (l) => /* @__PURE__ */ e.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...l }, /* @__PURE__ */ e.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M0.732184 15.2698C0.330645 14.8683 0.330646 14.2172 0.732185 13.8157L6.54859 7.99928L0.732185 2.18288C0.330646 1.78134 0.330645 1.13031 0.732184 0.728774C1.13372 0.327235 1.78475 0.327235 2.18629 0.728774L8.00269 6.54518L13.8191 0.728767C14.2206 0.327229 14.8717 0.327228 15.2732 0.728767C15.6747 1.13031 15.6747 1.78133 15.2732 2.18287L9.45679 7.99928L15.2732 13.8157C15.6747 14.2172 15.6747 14.8683 15.2732 15.2698C14.8717 15.6713 14.2206 15.6713 13.8191 15.2698L8.00269 9.45338L2.18629 15.2698C1.78475 15.6713 1.13372 15.6713 0.732184 15.2698Z", fill: "#A2AAB5" }));
+export {
+  t as S
+};

package/dist/components/checkbox/checkbox.d.ts

@@ -1,7 +1,7 @@
 import { FC, ReactNode, ChangeEventHandler, HTMLAttributes } from 'react';
 
 interface CheckboxProps extends HTMLAttributes<HTMLInputElement> {
-    value: boolean;
+    value?: boolean;
     children?: ReactNode;
     disabled?: boolean;
     className?: string;

package/dist/components/fieldText/fieldText.d.ts

@@ -1,6 +1,6 @@
 import { ChangeEventHandler, ReactNode, InputHTMLAttributes } from 'react';
-import { InputType } from './types';
 
+type InputType = 'password' | 'text' | 'email';
 export interface FieldTextProps extends InputHTMLAttributes<HTMLInputElement> {
     value?: string;
     className?: string;
@@ -29,3 +29,4 @@ export interface FieldTextProps extends InputHTMLAttributes<HTMLInputElement> {
     loading?: boolean;
 }
 export declare const FieldText: import('react').ForwardRefExoticComponent<FieldTextProps & import('react').RefAttributes<HTMLInputElement>>;
+export {};

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

@@ -5,6 +5,7 @@ export { default as ArrowDownIcon } from './svg/arrowDown.svg';
 export { default as ArrowUpIcon } from './svg/arrowUp.svg';
 export { default as BreadcrumbsTreeIcon } from './svg/breadcrumbsTree.svg';
 export { default as CalendarIcon } from './svg/calendar.svg';
+export { default as CheckmarkIcon } from './svg/checkmark.svg';
 export { default as CalendarArrowIcon } from './svg/calendarArrow.svg';
 export { default as ChevronDownDropdownIcon } from './svg/chevronDownDropdown.svg';
 export { default as ChevronRightBreadcrumbsIcon } from './svg/chevronRightBreadcrumbs.svg';

package/dist/{datePicker-382ef010.js → datePicker-e6c2c36d.js}

@@ -2,9 +2,9 @@ import { jsxs as x, Fragment as U, jsx as t } from "react/jsx-runtime";
 import $ from "react-datepicker/dist/es/index.js";
 import { c as R } from "./bind-06a7ff84.js";
 import { useMemo as P, useRef as B } from "react";
-import { F as D } from "./fieldText-e605a521.js";
+import { F as D } from "./fieldText-450abb26.js";
 import { a as E, S as j } from "./calendarArrow-3e1339ea.js";
-import { D as T } from "./dropdown-13d7d50e.js";
+import { D as T } from "./dropdown-3c979474.js";
 import { registerLocale as G } from "react-datepicker";
 const pe = (r, s) => {
   G(r, s);

package/dist/datePicker.js

@@ -1,17 +1,17 @@
-import { D as t } from "./datePicker-382ef010.js";
-import { r as v } from "./datePicker-382ef010.js";
+import { D as t } from "./datePicker-e6c2c36d.js";
+import { r as v } from "./datePicker-e6c2c36d.js";
 import "react/jsx-runtime";
 import "react-datepicker/dist/es/index.js";
 import "./bind-06a7ff84.js";
 import "react";
-import "./fieldText-e605a521.js";
+import "./fieldText-450abb26.js";
 import "./openEye-7b9cf080.js";
 import "./button-33bc880f.js";
 import "./spinLoader-c4a53718.js";
 import "./maxValueDisplay-9be01a75.js";
 import "./fieldLabel.js";
 import "./calendarArrow-3e1339ea.js";
-import "./dropdown-13d7d50e.js";
+import "./dropdown-3c979474.js";
 import "@floating-ui/react-dom";
 import "downshift";
 import "rc-scrollbars";

package/dist/dropdown-3c979474.js

@@ -0,0 +1,278 @@
+import { jsxs as f, jsx as o, Fragment as U } from "react/jsx-runtime";
+import { forwardRef as _e, useState as q, useRef as he } from "react";
+import { c as J } from "./bind-06a7ff84.js";
+import { useFloating as fe, offset as ge, flip as ue } from "@floating-ui/react-dom";
+import { useSelect as P } from "downshift";
+import { Scrollbars as pe } from "rc-scrollbars";
+import { u as me } from "./useOnClickOutside-c332f7d3.js";
+import { K as u } from "./keyCodes-f63c0e11.js";
+import { B as ye } from "./baseIconButton-251479f7.js";
+import { S as be } from "./dropdown-0260bb66.js";
+import { FieldLabel as Ce } from "./fieldLabel.js";
+import { C as Oe } from "./checkbox-aa91985d.js";
+const Ne = "_disabled_1a01l_12", De = "_hidden_1a01l_16", Ee = "_hover_1a01l_22", we = {
+  "dropdown-option": "_dropdown-option_1a01l_1",
+  disabled: Ne,
+  hidden: De,
+  hover: Ee,
+  "single-option": "_single-option_1a01l_35",
+  "sub-option": "_sub-option_1a01l_42"
+}, z = J.bind(we), G = _e(
+  (a, t) => {
+    const {
+      option: { value: n, disabled: l, hidden: v, label: p, title: c, groupRef: s },
+      selected: K,
+      onChange: m,
+      render: b,
+      highlightHovered: C,
+      onMouseEnter: A,
+      multiSelect: y,
+      isPartiallyChecked: O = !1
+    } = a, x = (N) => {
+      (N.target instanceof HTMLDivElement || N.target instanceof HTMLInputElement) && (m == null || m(n));
+    };
+    return /* @__PURE__ */ f(
+      "div",
+      {
+        className: z("dropdown-option", {
+          disabled: l,
+          hidden: v,
+          hover: C
+        }),
+        title: c,
+        onClick: x,
+        ref: t,
+        onMouseEnter: A,
+        children: [
+          y && /* @__PURE__ */ o(Oe, { value: !!K, partiallyChecked: O }),
+          /* @__PURE__ */ o("div", { className: z("single-option", { "sub-option": !!s }), children: b ? b(a) : p })
+        ]
+      }
+    );
+  }
+), ve = [
+  u.ENTER_KEY_CODE,
+  u.SPACE_KEY_CODE,
+  u.ARROW_DOWN_KEY_CODE
+], Ke = [u.ESCAPE_KEY_CODE, u.TAB_KEY_CODE];
+var g = /* @__PURE__ */ ((a) => (a.ON_KEY_DOWN = "onKeyDown", a.ON_CLICK = "onClick", a))(g || {});
+const Ae = (a, t) => {
+  const n = Array.isArray(t) ? t : [t];
+  return a.findIndex(({ value: l }) => n.includes(l));
+}, xe = (a, t) => (a % t + t) % t, Y = (a, t = 0, n = 1) => {
+  if (!a[t].disabled)
+    return t;
+  const l = a.length;
+  return Y(
+    a,
+    xe(t + n, l),
+    n
+  );
+}, Ie = (a, t) => Y(a, t), ke = (a, t) => Y(a, t, -1), Pe = "_container_1ou1a_1", Ye = "_icon_1ou1a_7", Re = "_arrow_1ou1a_13", Te = "_dropdown_1ou1a_19", He = "_disabled_1ou1a_36", Me = "_value_1ou1a_43", We = "_error_1ou1a_46", Le = "_touched_1ou1a_46", Se = "_opened_1ou1a_50", je = "_placeholder_1ou1a_83", Ve = "_ghost_1ou1a_118", $e = "_divider_1ou1a_135", Ue = {
+  container: Pe,
+  icon: Ye,
+  arrow: Re,
+  dropdown: Te,
+  "transparent-background": "_transparent-background_1ou1a_33",
+  disabled: He,
+  value: Me,
+  error: We,
+  touched: Le,
+  opened: Se,
+  placeholder: je,
+  "mobile-disabled": "_mobile-disabled_1ou1a_87",
+  "select-list": "_select-list_1ou1a_92",
+  "limited-width": "_limited-width_1ou1a_109",
+  "options-container": "_options-container_1ou1a_113",
+  ghost: Ve,
+  divider: $e
+}, i = J.bind(Ue), st = ({
+  multiSelect: a = !1,
+  value: t = a ? [] : "",
+  options: n = [],
+  disabled: l = !1,
+  error: v,
+  onChange: p,
+  onFocus: c,
+  onBlur: s,
+  mobileDisabled: K,
+  title: m,
+  touched: b = !1,
+  icon: C,
+  variant: A,
+  placeholder: y = "",
+  label: O = "",
+  renderOption: x,
+  transparentBackground: N = !1,
+  className: Q,
+  toggleButtonClassName: X,
+  isListWidthLimited: Z = !1,
+  optionAll: R = { value: "all", label: "All" },
+  isOptionAllVisible: T = !1,
+  onSelectAll: F = () => {
+  },
+  formatDisplayedValue: H,
+  notScrollable: B = !1,
+  footer: M
+}) => {
+  const [_, h] = q(!1), W = he(null), [ee, D] = q(null), I = a && Array.isArray(t) ? n.filter((e) => t.includes(e.value)) : null, { refs: L, floatingStyles: te } = fe({
+    placement: "bottom-start",
+    middleware: [
+      ge(5),
+      ue({
+        fallbackPlacements: ["bottom-start", "top-start", "bottom", "top"]
+      })
+    ]
+  }), ae = () => {
+    if (T && Array.isArray(t)) {
+      const e = n.map((r) => r.value);
+      p(t.length === n.length ? [] : e), F();
+    }
+  };
+  me(W, () => {
+    _ && (h(!1), s == null || s());
+  });
+  const S = (e) => {
+    if (!e.disabled) {
+      if (a) {
+        const r = Array.isArray(t) ? [...t] : [], d = r.indexOf(e.value);
+        d === -1 ? r.push(e.value) : r.splice(d, 1), p(r);
+      } else
+        p(e.value);
+      h((r) => a || !r);
+    }
+  }, ne = () => n.find(({ value: e }) => e === t), j = Ae(n, t), {
+    getToggleButtonProps: re,
+    getLabelProps: se,
+    getMenuProps: oe,
+    getItemProps: de,
+    setHighlightedIndex: E,
+    highlightedIndex: V,
+    selectedItem: w
+  } = P({
+    items: n,
+    itemToString: (e) => (e != null && e.label ? String(e.label) : y) || "",
+    selectedItem: ne(),
+    isOpen: _,
+    circularNavigation: !0,
+    defaultHighlightedIndex: j,
+    onHighlightedIndexChange: (e) => {
+      switch (e.type) {
+        case P.stateChangeTypes.MenuKeyDownArrowUp:
+          return D(g.ON_KEY_DOWN), E(ke(n, e.highlightedIndex)), e;
+        case P.stateChangeTypes.MenuKeyDownArrowDown:
+          return D(g.ON_KEY_DOWN), E(Ie(n, e.highlightedIndex)), e;
+        default:
+          return e;
+      }
+    }
+  }), le = () => {
+    l || (h((e) => !e), _ ? s == null || s() : c == null || c(), D(g.ON_CLICK));
+  }, k = (() => {
+    if (a && Array.isArray(t) && n.length === t.length)
+      return R.label;
+    const e = n.reduce((r, d) => ((Array.isArray(t) && t.includes(d.value) || d.value === t) && r.push(d.label), r), []);
+    if (e.length > 0)
+      return e.join(", ");
+    if (!t && t !== !1 && t !== 0 || Array.isArray(t) && !t.length)
+      return y;
+  })(), ie = (e) => {
+    const { keyCode: r } = e;
+    ve.includes(r) && !_ && (e.preventDefault(), E(j), h(!0), c == null || c(), D(g.ON_KEY_DOWN));
+  }, ce = (e) => {
+    const { keyCode: r } = e;
+    if (r === u.ENTER_KEY_CODE) {
+      const d = n[V];
+      S(d), a || (h(!1), s == null || s());
+      return;
+    }
+    Ke.includes(r) && (e.stopPropagation(), h(!1), s == null || s());
+  }, $ = () => /* @__PURE__ */ f("div", { className: i("options-container"), children: [
+    a && T && Array.isArray(t) && /* @__PURE__ */ f(U, { children: [
+      /* @__PURE__ */ o(
+        G,
+        {
+          option: R,
+          selected: t.length === n.length,
+          onChange: ae,
+          multiSelect: a,
+          isPartiallyChecked: !!t.length
+        }
+      ),
+      /* @__PURE__ */ o("div", { className: i("divider") }),
+      " "
+    ] }),
+    n.map((e, r) => /* @__PURE__ */ o(
+      G,
+      {
+        ...de({
+          item: e,
+          index: r
+        }),
+        multiSelect: a,
+        selected: a ? I == null ? void 0 : I.some((d) => d.value === e.value) : e.value === ((w == null ? void 0 : w.value) ?? w),
+        option: { title: e.label, ...e },
+        highlightHovered: V === r && ee !== g.ON_CLICK,
+        render: x,
+        onChange: e.disabled ? null : () => S(e),
+        onMouseEnter: () => E(r)
+      },
+      e.value
+    )),
+    M && /* @__PURE__ */ f(U, { children: [
+      /* @__PURE__ */ o("div", { className: i("divider") }),
+      M
+    ] })
+  ] });
+  return /* @__PURE__ */ f("div", { ref: W, className: i("container", Q), title: m, children: [
+    O && /* @__PURE__ */ o(Ce, { ...se(), children: O }),
+    /* @__PURE__ */ f(
+      "button",
+      {
+        disabled: l,
+        ...re({
+          className: i("dropdown", A, X, {
+            "transparent-background": N,
+            opened: _,
+            disabled: l,
+            error: v,
+            touched: b,
+            "mobile-disabled": K
+          }),
+          onClick: le,
+          onKeyDown: ie,
+          ref: L.setReference
+        }),
+        type: "button",
+        children: [
+          C && /* @__PURE__ */ o("span", { className: i("icon"), children: C }),
+          /* @__PURE__ */ o(
+            "span",
+            {
+              className: i("value", {
+                placeholder: k === y
+              }),
+              children: H ? H(k) : k
+            }
+          ),
+          /* @__PURE__ */ o(ye, { className: i("arrow"), tabIndex: -1, children: /* @__PURE__ */ o(be, {}) })
+        ]
+      }
+    ),
+    _ && /* @__PURE__ */ o(
+      "div",
+      {
+        style: te,
+        className: i("select-list", { opened: _, "limited-width": Z }),
+        ...oe({
+          onKeyDown: ce,
+          ref: L.setFloating
+        }),
+        children: B ? $() : /* @__PURE__ */ o(pe, { autoHeight: !0, autoHeightMax: 216, hideTracksWhenNotNeeded: !0, children: $() })
+      }
+    )
+  ] });
+};
+export {
+  st as D
+};

package/dist/dropdown.js

@@ -1,4 +1,4 @@
-import { D as r } from "./dropdown-13d7d50e.js";
+import { D as r } from "./dropdown-3c979474.js";
 import "react/jsx-runtime";
 import "react";
 import "./bind-06a7ff84.js";

package/dist/fieldText-450abb26.js

@@ -0,0 +1,157 @@
+import { jsx as e, jsxs as o, Fragment as v } from "react/jsx-runtime";
+import { forwardRef as W, useRef as X, useId as Y, useState as B } from "react";
+import { c as Z } from "./bind-06a7ff84.js";
+import { b as q, a as ee, S as ne } from "./openEye-7b9cf080.js";
+import { B as te } from "./button-33bc880f.js";
+import { S as se } from "./spinLoader-c4a53718.js";
+import { M as oe } from "./maxValueDisplay-9be01a75.js";
+import { FieldLabel as ae } from "./fieldLabel.js";
+const ce = "_collapsed_1xyy3_13", re = "_field_1xyy3_21", ie = "_placeholder_1xyy3_46", le = "_disabled_1xyy3_49", de = "_error_1xyy3_52", _e = "_touched_1xyy3_52", pe = "_input_1xyy3_70", ye = "_icon_1xyy3_1", ue = "_text_1xyy3_168", xe = {
+  "icon-container": "_icon-container_1xyy3_1",
+  "icon-container-end": "_icon-container-end_1xyy3_1",
+  "icon-container-start": "_icon-container-start_1xyy3_1",
+  collapsed: ce,
+  field: re,
+  "default-width": "_default-width_1xyy3_33",
+  placeholder: ie,
+  disabled: le,
+  error: de,
+  touched: _e,
+  "max-length-display": "_max-length-display_1xyy3_59",
+  "input-container": "_input-container_1xyy3_70",
+  "type-password": "_type-password_1xyy3_74",
+  input: pe,
+  "eye-icon": "_eye-icon_1xyy3_78",
+  icon: ye,
+  "start-icon": "_start-icon_1xyy3_124",
+  "clear-icon": "_clear-icon_1xyy3_125",
+  "additional-content": "_additional-content_1xyy3_161",
+  text: ue,
+  "error-text": "_error-text_1xyy3_188",
+  "help-text": "_help-text_1xyy3_192"
+}, n = Z.bind(xe), be = W(
+  ({
+    value: s = "",
+    className: C,
+    classNameHelpText: D,
+    error: i,
+    placeholder: y,
+    disabled: a = !1,
+    onChange: T,
+    touched: u = !1,
+    title: V,
+    label: l,
+    helpText: d,
+    defaultWidth: k = !0,
+    startIcon: x,
+    endIcon: m,
+    clearable: L = !1,
+    onClear: f,
+    isRequired: h = !1,
+    hasDoubleMessage: P = !1,
+    type: c = "text",
+    displayError: R = !0,
+    collapsible: j = !1,
+    loading: H = !1,
+    maxLengthDisplay: I,
+    onFocus: O = () => {
+    },
+    onBlur: U = () => {
+    },
+    ...$
+  }, z) => {
+    const A = X(null), _ = z || A, N = Y(), [w, g] = B(!1), [F, S] = B(!1), G = (t) => {
+      g(!0), O(t);
+    }, J = (t) => {
+      g(!1), U(t);
+    }, K = () => {
+      var t;
+      f && (f(s), (t = _.current) == null || t.focus());
+    }, b = R && i && u, E = /* @__PURE__ */ e("span", { className: n("text", "help-text", D), children: d }), Q = () => c !== "password" ? c : F ? "text" : "password", M = (t) => {
+      t.preventDefault(), S(!0);
+    }, r = (t) => {
+      t.preventDefault(), S(!1);
+    };
+    return /* @__PURE__ */ o(v, { children: [
+      l && /* @__PURE__ */ e(ae, { isRequired: h, htmlFor: N, children: l }),
+      /* @__PURE__ */ o(
+        "div",
+        {
+          className: n("field", C, {
+            error: i,
+            touched: u,
+            disabled: a,
+            "default-width": k,
+            collapsed: j && !w && !s
+          }),
+          title: V,
+          children: [
+            H ? /* @__PURE__ */ e(se, {}) : x && /* @__PURE__ */ e(
+              "span",
+              {
+                className: n("icon-container-start"),
+                onClick: () => {
+                  var p;
+                  (p = _.current) == null || p.focus();
+                },
+                children: /* @__PURE__ */ e("span", { className: n("icon", { "start-icon": !w }), children: x })
+              }
+            ),
+            /* @__PURE__ */ o("span", { className: n("input-container", `type-${c}`), children: [
+              /* @__PURE__ */ e(
+                "input",
+                {
+                  ref: _,
+                  type: Q(),
+                  className: n("input"),
+                  value: s,
+                  disabled: a,
+                  id: N,
+                  onChange: T,
+                  onFocus: G,
+                  onBlur: J,
+                  ...$
+                }
+              ),
+              c === "password" && s && /* @__PURE__ */ e(
+                te,
+                {
+                  icon: F ? /* @__PURE__ */ e(q, {}) : /* @__PURE__ */ e(ee, {}),
+                  variant: "text",
+                  className: n("eye-icon"),
+                  onMouseDown: M,
+                  onMouseLeave: r,
+                  onMouseUp: r,
+                  onTouchStart: M,
+                  onTouchEnd: r,
+                  onTouchCancel: r
+                }
+              ),
+              y && !s && /* @__PURE__ */ o("span", { className: n("placeholder"), children: [
+                y,
+                h && !l && /* @__PURE__ */ e("span", { className: n("asterisk") })
+              ] })
+            ] }),
+            /* @__PURE__ */ e(
+              oe,
+              {
+                className: n("max-length-display"),
+                value: s.length,
+                maxValue: I
+              }
+            ),
+            m && /* @__PURE__ */ e("span", { className: n("icon-container-end"), children: /* @__PURE__ */ e("span", { className: n("icon"), children: m }) }),
+            L && s.length > 0 && /* @__PURE__ */ e("span", { className: n("icon-container-end"), children: /* @__PURE__ */ e("button", { type: "button", className: n("clear-icon", { disabled: a }), onClick: K, children: /* @__PURE__ */ e(ne, {}) }) })
+          ]
+        }
+      ),
+      (b || d) && /* @__PURE__ */ e("div", { className: n("additional-content", { disabled: a }), children: b ? /* @__PURE__ */ o(v, { children: [
+        /* @__PURE__ */ e("span", { className: n("text", "error-text"), children: i }),
+        P && E
+      ] }) : d && E })
+    ] });
+  }
+);
+export {
+  be as F
+};

package/dist/fieldText.js

@@ -1,4 +1,4 @@
-import { F as o } from "./fieldText-e605a521.js";
+import { F as o } from "./fieldText-450abb26.js";
 import "react/jsx-runtime";
 import "react";
 import "./bind-06a7ff84.js";