@reportportal/ui-kit 0.0.1-alpha.167 → 0.0.1-alpha.169

package/dist/components/datePicker/datePicker.d.ts

@@ -1,15 +1,13 @@
-import { FC, ReactNode, ReactElement } from 'react';
+import { ReactNode, ReactElement } from 'react';
 
-interface DatePickerProps {
-    onChange?: (date: Date | null) => void;
+type DateRangeValue = [Date | null, Date | null];
+interface DatePickerBaseProps {
     onBlur?: () => void;
     onFocus?: () => void;
     headerNodes?: ReactNode;
     disabled?: boolean;
     shouldCloseOnSelect?: boolean;
     fixedHeight?: boolean;
-    startDate?: Date | undefined;
-    endDate?: Date | undefined;
     customClassName?: string;
     popperClassName?: string;
     calendarClassName?: string;
@@ -18,8 +16,17 @@ interface DatePickerProps {
     yearsOptions?: number[];
     placeholder?: string;
     dateFormat?: string;
-    selects?: 'start' | 'end' | 'none';
+}
+interface DatePickerSingleProps extends DatePickerBaseProps {
+    selectsRange?: false;
     value?: Date | null;
+    onChange?: (date: Date | null) => void;
+}
+interface DatePickerRangeProps extends DatePickerBaseProps {
+    selectsRange: true;
+    value?: DateRangeValue;
+    onChange?: (dates: DateRangeValue) => void;
 }
-export declare const DatePicker: FC<DatePickerProps>;
+type DatePickerProps = DatePickerSingleProps | DatePickerRangeProps;
+export declare const DatePicker: (props: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,4 +1,5 @@
-import { FieldText } from './fieldText';
+import { FieldText, FieldTextProps } from './fieldText';
 
 export { FieldText };
+export type { FieldTextProps };
 export default FieldText;

package/dist/components/filterItem/filterItem.d.ts

@@ -0,0 +1,18 @@
+import { ReactElement } from 'react';
+import { ActionItem } from '../actionMenu';
+
+export interface FilterItemProps {
+    id: string;
+    caption: string;
+    actions: ActionItem[];
+    onClick?: (id: string) => void;
+    onHover?: (id: string, isHovering: boolean) => void;
+    className?: string;
+    captionClassName?: string;
+    popoverClassName?: string;
+    disabled?: boolean;
+    selected?: boolean;
+    editMode?: boolean;
+}
+export declare const FilterItem: ({ id, caption, actions, onClick, onHover, className, captionClassName, popoverClassName, disabled, selected, editMode, }: FilterItemProps) => ReactElement;
+export default FilterItem;

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

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2026 EPAM Systems
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export { FilterItem } from './filterItem';
+export type { FilterItemProps } from './filterItem';

package/dist/components/index.d.ts

@@ -1,4 +1,6 @@
 export { AdaptiveTagList } from './adaptiveTagList';
+export { ActionMenu, ActionMenuItem } from './actionMenu';
+export { ACTION_MENU_DIVIDER } from './actionMenu/constants';
 export { AttachedFile } from './attachedFile';
 export { BaseIconButton } from './baseIconButton';
 export { Breadcrumbs } from './breadcrumbs';
@@ -15,12 +17,14 @@ export { FieldText } from './fieldText';
 export { FieldTextFlex } from './fieldTextFlex';
 export { FileDropArea } from './fileDropArea';
 export { FiltersButton } from './filtersButton';
+export { FilterItem } from './filterItem';
 export { IssueList } from './issueList';
 export { Modal } from './modal';
 export { MultipleAutocomplete } from './autocompletes/multipleAutocomplete';
 export { Pagination } from './pagination';
 export { Popover } from './popover';
 export { Radio } from './radio';
+export { SegmentedControl } from './segmentedControl';
 export { Selection } from './selection';
 export { SpinLoader } from './spinLoader';
 export { SystemAlert } from './systemAlert';

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

@@ -0,0 +1,17 @@
+/*!
+ * Copyright 2026 EPAM Systems
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+export { SegmentedControl } from './segmentedControl';
+export type { SegmentedControlProps, SegmentedControlValue, SegmentedControlOption } from './types';

package/dist/components/segmentedControl/segmentedControl.d.ts

@@ -0,0 +1,4 @@
+import { ReactElement } from 'react';
+import { SegmentedControlProps } from './types';
+
+export declare const SegmentedControl: ({ options: initialOptions, onChange, className, fullWidth, ariaLabel, }: SegmentedControlProps) => ReactElement;

package/dist/components/segmentedControl/types.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+
+export type SegmentedControlValue = string | number;
+export type SegmentedControlOption = {
+    value: SegmentedControlValue;
+    label: string;
+    icon?: ReactNode;
+    disabled?: boolean;
+    selected?: boolean;
+    className?: string;
+};
+export interface SegmentedControlProps {
+    options: SegmentedControlOption[];
+    onChange?: (value: SegmentedControlValue) => void;
+    className?: string;
+    fullWidth?: boolean;
+    ariaLabel?: string;
+}

package/dist/datePicker-ad4a758c.js

@@ -0,0 +1,208 @@
+import { jsxs as F, Fragment as j, jsx as r } from "react/jsx-runtime";
+import M from "react-datepicker/dist/es/index.js";
+import { c as U } from "./bind-06a7ff84.js";
+import { useMemo as E, forwardRef as W, useRef as q } from "react";
+import { F as $ } from "./fieldText-1749da7a.js";
+import { D as I } from "./dropdown-7d024c49.js";
+import { S as L } from "./calendarArrow-44c7e60e.js";
+import { registerLocale as z } from "react-datepicker";
+const we = (e, s) => {
+  z(e, s);
+}, J = (e, s = 20) => {
+  const d = e + s;
+  return new Array(d - e).fill(void 0).map((u, _) => e - _);
+}, K = "_header_1s3dn_1", Q = "_disabled_1s3dn_25", X = "_dropdown_1s3dn_8", Z = {
+  header: K,
+  "dropdowns-wrapper": "_dropdowns-wrapper_1s3dn_8",
+  "button-prev": "_button-prev_1s3dn_13",
+  "button-next": "_button-next_1s3dn_14",
+  disabled: Q,
+  dropdown: X,
+  "month-dropdown": "_month-dropdown_1s3dn_44",
+  "toggle-button": "_toggle-button_1s3dn_47"
+}, c = U.bind(Z), ee = ({
+  date: e = /* @__PURE__ */ new Date(),
+  changeYear: s = () => {
+  },
+  changeMonth: d = () => {
+  },
+  decreaseMonth: u = () => {
+  },
+  increaseMonth: _ = () => {
+  },
+  prevMonthButtonDisabled: b = !1,
+  nextMonthButtonDisabled: w = !1,
+  headerNodes: g = null,
+  customClassName: y = "",
+  yearsOptions: f = [],
+  locale: C
+}) => {
+  const p = e.getFullYear(), N = e.getMonth(), A = E(() => {
+    const n = Array(12).keys(), t = new Intl.DateTimeFormat(C, {
+      month: "long"
+    }), o = (h) => t.format(new Date(p, h));
+    return Array.from(n, o).reduce((h, D, S) => h.concat({
+      value: S,
+      label: D
+    }), []);
+  }, [C, p]), R = E(() => (f.length > 0 ? f : J(p)).reduce(
+    (t, o) => t.concat({ value: o, label: `${o}` }),
+    []
+  ), [f, p]), a = (n) => {
+    d(n);
+  }, l = (n) => {
+    s(n);
+  };
+  return /* @__PURE__ */ F(j, { children: [
+    g && /* @__PURE__ */ r("div", { className: c(y), children: g }),
+    /* @__PURE__ */ F("div", { className: c("header"), children: [
+      /* @__PURE__ */ r(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Previous Months",
+          disabled: b,
+          onClick: (n) => {
+            n.stopPropagation(), u();
+          },
+          className: c("button-prev", { disabled: b }),
+          children: /* @__PURE__ */ r(L, {})
+        }
+      ),
+      /* @__PURE__ */ F("div", { className: c("dropdowns-wrapper"), children: [
+        /* @__PURE__ */ r(
+          I,
+          {
+            options: A,
+            value: N,
+            onChange: a,
+            transparentBackground: !0,
+            className: c("dropdown", "month-dropdown"),
+            toggleButtonClassName: c("toggle-button")
+          }
+        ),
+        /* @__PURE__ */ r(
+          I,
+          {
+            options: R,
+            value: p,
+            onChange: l,
+            transparentBackground: !0,
+            className: c("dropdown"),
+            toggleButtonClassName: c("toggle-button")
+          }
+        )
+      ] }),
+      /* @__PURE__ */ r(
+        "button",
+        {
+          type: "button",
+          "aria-label": "Next Months",
+          disabled: w,
+          onClick: (n) => {
+            n.stopPropagation(), _();
+          },
+          className: c("button-next", { disabled: w }),
+          children: /* @__PURE__ */ r(L, {})
+        }
+      )
+    ] })
+  ] });
+}, te = "_calendar_evrpf_5", ne = "_date_evrpf_103", oe = "_disabled_evrpf_149", re = "_popper_evrpf_157", ae = "_input_evrpf_161", se = {
+  calendar: te,
+  "current-date": "_current-date_evrpf_102",
+  date: ne,
+  "end-date": "_end-date_evrpf_120",
+  "selected-range": "_selected-range_evrpf_130",
+  disabled: oe,
+  popper: re,
+  input: ae,
+  "input-range": "_input-range_evrpf_168"
+}, i = U.bind(se), de = "en", v = "MM-dd-yyyy", ce = " to ", le = W(({ value: e, ...s }, d) => {
+  const u = (e == null ? void 0 : e.replace(" - ", ce)) ?? "";
+  return /* @__PURE__ */ r($, { ...s, value: u, ref: d });
+}), Ce = (e) => {
+  const {
+    onChange: s = () => {
+    },
+    disabled: d = !1,
+    onBlur: u = () => {
+    },
+    onFocus: _ = () => {
+    },
+    headerNodes: b = null,
+    customClassName: w = "",
+    customTimeInput: g = void 0,
+    shouldCloseOnSelect: y = !0,
+    popperClassName: f = "",
+    calendarClassName: C = "",
+    fixedHeight: p = !1,
+    language: N = de,
+    yearsOptions: A = [],
+    dateFormat: R = v,
+    value: a = null
+  } = e, l = "selectsRange" in e && e.selectsRange === !0, n = q(null), t = l ? (a == null ? void 0 : a[0]) ?? void 0 : void 0, o = l ? (a == null ? void 0 : a[1]) ?? void 0 : void 0, x = t == null ? void 0 : t.toDateString(), h = o == null ? void 0 : o.toDateString(), D = o && t && o > t, S = l ? `${v.toUpperCase()} to ${v.toUpperCase()}` : v.toUpperCase(), Y = e.placeholder ?? S, B = (m) => {
+    if (!l) {
+      const H = a == null ? void 0 : a.toDateString(), V = m.toDateString();
+      return i("date", {
+        "current-date": V === H,
+        disabled: d
+      });
+    }
+    const T = m.toDateString(), O = T === x, k = D && T === h, G = t && o && m > t && m < o;
+    return i("date", {
+      "current-date": O,
+      "selected-range": G && !k,
+      "end-date": k && D,
+      disabled: d
+    });
+  }, P = {
+    customInput: l ? /* @__PURE__ */ r(le, { className: i("input", "input-range"), defaultWidth: !1, ref: n }) : /* @__PURE__ */ r($, { className: i("input"), defaultWidth: !1, ref: n }),
+    placeholderText: Y,
+    disabled: d,
+    shouldCloseOnSelect: y,
+    fixedHeight: p,
+    locale: N,
+    showPopperArrow: !1,
+    dayClassName: B,
+    calendarClassName: i(C, "calendar"),
+    renderCustomHeader: (m) => /* @__PURE__ */ r(
+      ee,
+      {
+        ...m,
+        headerNodes: b,
+        customClassName: w,
+        yearsOptions: A,
+        locale: N
+      }
+    ),
+    onBlur: u,
+    onFocus: _,
+    customTimeInput: g,
+    showTimeInput: !!g,
+    popperClassName: i(f, "popper"),
+    dateFormat: R,
+    className: i("datepicker")
+  };
+  return l ? /* @__PURE__ */ r(
+    M,
+    {
+      ...P,
+      selectsRange: !0,
+      startDate: t,
+      endDate: o,
+      onChange: s
+    }
+  ) : /* @__PURE__ */ r(
+    M,
+    {
+      ...P,
+      selected: a,
+      onChange: s
+    }
+  );
+};
+export {
+  Ce as D,
+  we as r
+};

package/dist/datePicker.js

@@ -1,5 +1,5 @@
-import { D as t } from "./datePicker-9d52ba44.js";
-import { r as A } from "./datePicker-9d52ba44.js";
+import { D as t } from "./datePicker-ad4a758c.js";
+import { r as A } from "./datePicker-ad4a758c.js";
 import "react/jsx-runtime";
 import "react-datepicker/dist/es/index.js";
 import "./bind-06a7ff84.js";

package/dist/filterItem.js

@@ -0,0 +1,96 @@
+import { jsxs as O, jsx as l } from "react/jsx-runtime";
+import { useRef as _, useEffect as T, useCallback as o } from "react";
+import { c as W } from "./bind-06a7ff84.js";
+import { A as j } from "./actionMenu-77a63b96.js";
+import "./meatballMenu-535635a9.js";
+import "./baseIconButton-251479f7.js";
+import "./popover.js";
+import "@floating-ui/react";
+import "./floatingUi-41f8c7b5.js";
+const D = "_disabled_1of31_29", I = "_selected_1of31_32", K = {
+  "filter-item": "_filter-item_1of31_16",
+  disabled: D,
+  selected: I,
+  "actions-button": "_actions-button_1of31_37",
+  "caption-wrapper": "_caption-wrapper_1of31_58"
+}, p = W.bind(K), S = ({
+  id: e,
+  caption: f,
+  actions: h,
+  onClick: r,
+  onHover: s,
+  className: b,
+  captionClassName: w,
+  popoverClassName: N,
+  disabled: t = !1,
+  selected: x = !1,
+  editMode: u = !1
+}) => {
+  const n = _(null), m = _(null);
+  T(() => {
+    const a = () => {
+      n.current && (n.current.scrollWidth > n.current.clientWidth ? n.current.setAttribute("title", f) : n.current.removeAttribute("title"));
+    };
+    if (a(), typeof ResizeObserver < "u" && n.current) {
+      const c = new ResizeObserver(a);
+      return c.observe(n.current), () => c.disconnect();
+    }
+  }, [f]);
+  const y = o(
+    (a) => {
+      var i;
+      if (t || u)
+        return;
+      const c = a.target;
+      (i = m.current) != null && i.contains(c) || r == null || r(e);
+    },
+    [e, r, t, u]
+  ), R = o(
+    (a) => {
+      var c;
+      if (a.key === "Enter" && !t && !u) {
+        const i = a.target;
+        if ((c = m.current) != null && c.contains(i))
+          return;
+        r == null || r(e);
+      }
+    },
+    [e, r, t, u]
+  ), g = o(() => {
+    t || s == null || s(e, !0);
+  }, [e, s, t]), A = o(() => {
+    t || s == null || s(e, !1);
+  }, [e, s, t]), E = p("filter-item", b, {
+    selected: x,
+    disabled: t
+  }), z = p("caption-wrapper", w);
+  return /* @__PURE__ */ O(
+    "div",
+    {
+      className: E,
+      "data-filter-item-container": !0,
+      onClick: y,
+      onKeyDown: R,
+      onMouseEnter: g,
+      onMouseLeave: A,
+      role: "button",
+      tabIndex: t ? -1 : 0,
+      children: [
+        /* @__PURE__ */ l("div", { className: z, ref: n, children: f }),
+        /* @__PURE__ */ l("div", { ref: m, children: /* @__PURE__ */ l(
+          j,
+          {
+            items: h,
+            disabled: t || u,
+            buttonClassName: p("actions-button"),
+            popoverClassName: N,
+            placement: "bottom-start"
+          }
+        ) })
+      ]
+    }
+  );
+};
+export {
+  S as FilterItem
+};