@reportportal/ui-kit 0.0.1-alpha.17 → 0.0.1-alpha.170

package/dist/components/table/hooks/useTableExpansion.d.ts

@@ -0,0 +1,15 @@
+import { Column, FixedColumn } from '../types';
+
+interface UseTableExpansionProps {
+    primaryColumns: Column[];
+    fixedColumns: FixedColumn[];
+    expandedRowIds: (string | number)[];
+    onToggleRowExpansion: (id: string | number) => void;
+}
+interface UseTableExpansionReturn {
+    expandedCells: Set<string>;
+    handleToggleRowExpansion: (id: string | number) => void;
+    isCellExpanded: (rowId: string | number, columnKey: string) => boolean;
+}
+export declare const useTableExpansion: ({ primaryColumns, fixedColumns, expandedRowIds, onToggleRowExpansion, }: UseTableExpansionProps) => UseTableExpansionReturn;
+export {};

package/dist/components/table/hooks/useTableHover.d.ts

@@ -0,0 +1,10 @@
+interface UseTableHoverReturn {
+    hoveredColumn: string | null;
+    hoveredRow: number | null;
+    handleColumnMouseEnter: (columnKey: string) => void;
+    handleColumnMouseLeave: () => void;
+    handleRowMouseEnter: (rowIndex: number) => void;
+    handleRowMouseLeave: () => void;
+}
+export declare const useTableHover: () => UseTableHoverReturn;
+export {};

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

@@ -1,3 +1,5 @@
 import { Table } from './table';
+
 export { Table };
+export type { RowData, Column, PrimaryColumn, FixedColumn, PinnedColumn, RowConfigs, DetailedCellData, MetaData, SortConfig, SortingDirection, TableComponentProps, } from './types';
 export default Table;

package/dist/components/table/resizeHandle/index.d.ts

@@ -0,0 +1 @@
+export { ResizeHandle } from './resizeHandle';

package/dist/components/table/resizeHandle/resizeHandle.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare const ResizeHandle: (props: import('react').HTMLAttributes<HTMLDivElement> & import('react').RefAttributes<HTMLDivElement>) => import('react').ReactElement<any, string | import('react').JSXElementConstructor<any>> | null;

package/dist/components/table/table.d.ts

@@ -1,3 +1,4 @@
 import { FC } from 'react';
 import { TableComponentProps } from './types';
+
 export declare const Table: FC<TableComponentProps>;

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

@@ -1,14 +1,25 @@
-import { ReactNode } from 'react';
+import { Dispatch, ReactNode, RefObject, SetStateAction } from 'react';
+import { ASC, DESC } from './constants';
+
 export interface Column {
     key: string;
     header: string;
 }
 export interface PrimaryColumn extends Column {
     primary: boolean;
+    width?: string | number;
+    minWidth?: number;
+    maxWidth?: number;
 }
 export interface FixedColumn extends Column {
     width: string | number;
     align?: 'left' | 'center' | 'right';
+    minWidth?: number;
+    maxWidth?: number;
+}
+export interface PinnedColumn extends FixedColumn {
+    pinned: boolean;
+    pinnedPosition?: number;
 }
 export interface RowConfigs {
     size?: 'small' | 'medium' | 'large';
@@ -17,33 +28,56 @@ export interface DetailedCellData {
     content: string | number;
     component: ReactNode;
 }
+export interface MetaData {
+    [key: string]: any;
+}
 export interface RowData {
     id: string | number;
     [key: string]: DetailedCellData | RowConfigs | string | number | any;
     rowConfigs?: RowConfigs;
+    metaData?: MetaData;
 }
-export declare enum SortDirection {
-    ASC = "asc",
-    DESC = "desc"
-}
+export type SortingDirection = typeof ASC | typeof DESC | Uppercase<typeof ASC | typeof DESC>;
 export interface SortConfig {
     key: string;
-    direction: SortDirection;
+    direction: SortingDirection;
 }
 export interface TableComponentProps {
     data: RowData[];
-    primaryColumn: Column;
+    primaryColumn: Column | Column[];
     fixedColumns: FixedColumn[];
-    rowActionMenu?: ReactNode;
+    renderRowActions?: (metaData?: MetaData) => ReactNode;
     selectable?: boolean;
+    isCheckboxOutside?: boolean;
     className?: string;
+    wrapperClassName?: string;
     headerClassName?: string;
+    bodyClassName?: string;
     rowClassName?: string;
     selectedRowIds?: (string | number)[];
-    sortingDirection?: SortDirection;
+    sortingDirection?: SortingDirection;
     sortingColumn?: Column;
     sortableColumns?: string[];
+    isHeaderFixed?: boolean;
+    isHorizontallyScrollable?: boolean;
+    pinnedColumnKeys?: string[];
+    isRowsExpandable?: boolean;
+    expandedRowIds?: (string | number)[];
+    isSelectAllCheckboxAlwaysVisible?: boolean;
+    setExpandedRowIds?: Dispatch<SetStateAction<Set<string | number>>>;
+    isAllExpandedByDefault?: boolean;
+    expandAllTooltip?: ReactNode;
+    isResizable?: boolean;
+    minColumnWidth?: number;
+    maxColumnWidth?: number;
     onChangeSorting?: (sortConfig?: SortConfig) => void;
     onToggleRowSelection?: (id: string | number) => void;
     onToggleAllRowsSelection?: () => void;
+    onToggleRowExpansion?: (id: string | number) => void;
+    onToggleAllRowsExpansion?: () => void;
+    onColumnResize?: (columnKey: string, width: number) => void;
+    externalScrollContainerRef?: RefObject<HTMLElement> | RefObject<Element> | null | undefined;
+    portalContainer?: HTMLElement | null;
+    rightGradientClassName?: string;
+    pinnedGradientClassName?: string;
 }

package/dist/components/table/utils.d.ts

@@ -1,3 +1,12 @@
-import { Column, RowData, SortConfig } from './types';
+import { CSSProperties, MutableRefObject } from 'react';
+import { Column, RowData, SortConfig, SortingDirection, PrimaryColumn, FixedColumn } from './types';
+
+export declare const isAsc: (direction: SortingDirection) => boolean;
 export declare const sortTableData: (tableData: RowData[], sortConfig?: SortConfig) => RowData[];
 export declare const getColumnsKeys: (columns: Column[]) => string[];
+export declare const toggleDirection: (direction: SortingDirection) => "asc" | "desc";
+export declare const isPrimaryColumn: (column: PrimaryColumn | FixedColumn) => boolean;
+export declare const getRowSizeClassName: (rowData: RowData) => string;
+export declare const calculatePinnedPosition: (columnIndex: number, columns: (PrimaryColumn | FixedColumn)[], columnWidthsRef: MutableRefObject<Map<string, number>>, isRowsExpandable: boolean, selectable: boolean, isCheckboxOutside?: boolean) => number;
+export declare const getCellStyle: (column: FixedColumn | PrimaryColumn, isPinned: boolean, pinnedIndex: number | undefined, pinnedColumns: (PrimaryColumn | FixedColumn)[], columnWidthsRef: MutableRefObject<Map<string, number>>, isRowsExpandable: boolean, selectable: boolean, isCheckboxOutside?: boolean) => CSSProperties;
+export declare const getGridTemplateColumns: (pinnedColumns: (PrimaryColumn | FixedColumn)[], scrollableColumns: (PrimaryColumn | FixedColumn)[], isRowsExpandable: boolean, selectable: boolean, renderRowActions: boolean, isHeader?: boolean, columnWidths?: Record<string, number>, isResizable?: boolean, isCheckboxOutside?: boolean) => string;

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

@@ -1,3 +1,4 @@
 import { ThemeProvider } from './themeProvider';
+
 export { ThemeProvider };
 export default ThemeProvider;

package/dist/components/themeProvider/themeProvider.d.ts

@@ -1,4 +1,5 @@
 import { ReactNode } from 'react';
+
 type ThemeKey = 'light' | 'dark' | string;
 interface ITheme {
     [themeKey: ThemeKey]: string;

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

@@ -1,3 +1,4 @@
 import { Toggle } from './toggle';
+
 export { Toggle };
 export default Toggle;

package/dist/components/toggle/toggle.d.ts

@@ -1,4 +1,5 @@
 import { ChangeEventHandler, FC, HTMLAttributes, ReactNode } from 'react';
+
 interface ToggleProps extends HTMLAttributes<HTMLInputElement> {
     value: boolean;
     title?: string;

package/dist/components/tooltip/tooltip.d.ts

@@ -1,14 +1,23 @@
 import { FC, ReactNode } from 'react';
-import { Placement } from '@floating-ui/react-dom';
+import { Placement } from '@floating-ui/react';
+
 interface TooltipProps {
     content: ReactNode;
     children: ReactNode;
     wrapperClassName?: string;
+    tooltipClassName?: string;
     contentClassName?: string;
     dynamicWidth?: boolean;
     width?: number;
+    minWidth?: number;
     placement?: Placement;
     dataAutomationId?: string;
+    arrowColor?: string;
+    safeZone?: number;
+    zIndex?: number;
+    mainAxis?: boolean;
+    portalRoot?: Element;
+    isFloating?: boolean;
 }
 export declare const Tooltip: FC<TooltipProps>;
 export {};

package/dist/datePicker-412fb8e8.js

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

package/dist/datePicker.js

@@ -0,0 +1,32 @@
+import { D as t } from "./datePicker-412fb8e8.js";
+import { r as A } from "./datePicker-412fb8e8.js";
+import "react/jsx-runtime";
+import "react";
+import "react-datepicker/dist/es/index.js";
+import "./bind-06a7ff84.js";
+import "./fieldText-1749da7a.js";
+import "./clear-53660571.js";
+import "./openEye-950159cb.js";
+import "./baseIconButton-251479f7.js";
+import "./spinLoader-c4a53718.js";
+import "./maxValueDisplay-9be01a75.js";
+import "./fieldLabel.js";
+import "./dropdown-7d024c49.js";
+import "react-dom";
+import "@floating-ui/react-dom";
+import "downshift";
+import "rc-scrollbars";
+import "./keyCodes-f63c0e11.js";
+import "./dropdown-0260bb66.js";
+import "./adaptiveTagList.js";
+import "./button-97d9e587.js";
+import "./close-4d480ef7.js";
+import "./isEmpty-ccacb5ff.js";
+import "./checkbox-493fdc63.js";
+import "./calendarArrow-44c7e60e.js";
+import "react-datepicker";
+export {
+  t as DatePicker,
+  t as default,
+  A as registerDatePickerLocale
+};

package/dist/dropdown-0260bb66.js

@@ -0,0 +1,5 @@
+import * as e from "react";
+const o = (t) => /* @__PURE__ */ e.createElement("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...t }, /* @__PURE__ */ e.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" }));
+export {
+  o as S
+};