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

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-cde99de3.js

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

package/dist/datePicker.js

@@ -0,0 +1,32 @@
+import { D as t } from "./datePicker-cde99de3.js";
+import { r as A } from "./datePicker-cde99de3.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
+};