@oliasoft-open-source/react-ui-library 3.12.0-beta-11 → 3.12.0-beta-13

package/dist/components/table/cell/cell-types/cell-help-icon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { IHelpIconCell } from './cell-types.interface';
+export interface ICellHelpIconProps {
+    cell: IHelpIconCell;
+}
+export declare const CellHelpIcon: ({ cell }: ICellHelpIconProps) => React.JSX.Element | null;

package/dist/components/table/cell/cell-types/cell-library-icon.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ILibraryIconCell } from './cell-types.interface';
+export interface ICellLibraryIconProps {
+    cell: ILibraryIconCell;
+}
+export declare const CellLibraryIcon: ({ cell }: ICellLibraryIconProps) => React.JSX.Element | null;

package/dist/components/table/cell/cell-types/cell-types.interface.d.ts

@@ -0,0 +1,150 @@
+import React, { ReactNode } from 'react';
+import { TSliderMark } from '../../../slider/slider';
+export type StringNumberOrNode = string | number | ReactNode;
+export type TCellType = 'Static' | 'Icon' | 'Select' | 'Input' | 'NumberInput' | 'Popover' | 'CheckBox' | 'Actions' | 'Link' | 'Slider' | 'Unit';
+export interface IPopoverCell {
+    content: React.ReactNode;
+    fullWidth: boolean;
+    closeOnOutsideClick: boolean;
+    disabled: boolean;
+    value?: StringNumberOrNode;
+    type: TCellType;
+    error?: StringNumberOrNode;
+    warning?: StringNumberOrNode;
+    tooltip?: StringNumberOrNode;
+    maxTooltipWidth?: string | number;
+    hasSort?: boolean;
+}
+export interface IStaticCell {
+    value?: StringNumberOrNode;
+    type: TCellType;
+    colSpan?: number;
+    rowSpan?: number;
+    error?: StringNumberOrNode;
+    warning?: StringNumberOrNode;
+    tooltip?: StringNumberOrNode;
+    maxTooltipWidth?: string | number;
+    breakWord?: boolean;
+    libraryIcon?: {
+        onClick: () => void;
+        tooltip: StringNumberOrNode;
+    };
+    helpIcon?: {
+        onClick: () => void;
+        tooltip: StringNumberOrNode;
+    };
+    testId?: string;
+    hasSort?: boolean;
+    onSort?: (evt: React.MouseEvent<HTMLDivElement>) => void;
+}
+export interface ISelectCell {
+    type: TCellType;
+    name?: string;
+    value?: string | number;
+    onChange?: (ev: any) => void;
+    onCreate?: (ev: any) => void;
+    error?: StringNumberOrNode;
+    warning?: StringNumberOrNode;
+    disabled?: boolean;
+    placeholder?: string;
+    menu?: any;
+    options?: any;
+    native?: boolean;
+    clearable?: boolean;
+    searchable?: boolean;
+    deprecatedEventHandler?: boolean;
+    maxTooltipWidth?: string | number;
+    autoLayerWidth?: boolean;
+}
+export interface IHelpIconCell {
+    type: TCellType;
+    helpIcon?: {
+        onClick: () => void;
+        tooltip: StringNumberOrNode;
+    };
+}
+export interface ILibraryIconCell {
+    type: TCellType;
+    libraryIcon?: {
+        onClick: () => void;
+        tooltip: StringNumberOrNode;
+    };
+}
+export interface ICheckBoxCell {
+    label?: string;
+    checked: boolean;
+    type: TCellType;
+    onChange: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    disabled?: boolean;
+    colSpan?: number;
+    testId?: string;
+}
+export interface IIconCell {
+    type: TCellType;
+    icon: any;
+    tooltip?: StringNumberOrNode;
+}
+export interface IInputCell {
+    type: TCellType;
+    name?: string;
+    value?: string;
+    onChange?: (ev: React.ChangeEvent<HTMLInputElement>) => void;
+    placeholder?: string;
+    error?: string;
+    warning?: string;
+    disabled?: boolean;
+    maxTooltipWidth?: string | number;
+    tooltip?: StringNumberOrNode;
+}
+export interface ILinkCell {
+    value?: string | number;
+    type: TCellType;
+    disabled?: boolean;
+    onClick?: (evt: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void;
+    colSpan?: number;
+    testId?: string;
+    error?: StringNumberOrNode;
+    warning?: StringNumberOrNode;
+    tooltip?: StringNumberOrNode;
+    maxTooltipWidth?: string | number;
+}
+export interface INumberInputCell {
+    name?: string;
+    value?: string | number;
+    type: TCellType;
+    onChange?: (ev: any) => void;
+    placeholder?: string;
+    error?: string | boolean;
+    warning?: string | boolean;
+    disabled?: boolean;
+    tooltip?: StringNumberOrNode;
+    left?: boolean;
+    testId?: string;
+    validationCallback?: () => void;
+    allowEmpty?: boolean;
+}
+export interface ISliderCell {
+    type: TCellType;
+    label?: string;
+    value: number;
+    min: number;
+    max: number;
+    step?: number;
+    marks?: TSliderMark[];
+    onChange: (ev: any) => void;
+    showArrows?: boolean;
+    showTooltip?: boolean;
+    tooltipFormatter?: (value: any) => any;
+    disabled?: boolean;
+}
+export interface IActionCell {
+    type: TCellType;
+    actions: any;
+}
+export interface ISortCell {
+    type: TCellType;
+    hasSort?: boolean;
+    sort?: 'up' | 'down';
+    sortPriority?: number;
+}
+export type TCellShape = IPopoverCell | IStaticCell | ISelectCell | IHelpIconCell | ILibraryIconCell | ICheckBoxCell | IIconCell | IInputCell | ILinkCell | INumberInputCell | IActionCell | ISortCell | ISliderCell;

package/dist/components/table/cell/cell-types/check-box-cell.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ICheckBoxCell } from './cell-types.interface';
+interface ICheckBoxCellProps {
+    cell: ICheckBoxCell;
+    testId?: string;
+}
+export declare const CheckBoxCell: ({ cell, testId }: ICheckBoxCellProps) => React.JSX.Element;
+export {};

package/dist/components/table/cell/cell-types/icon-cell.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { IIconCell } from './cell-types.interface';
+export interface IIconCellProps {
+    cell: IIconCell;
+}
+export declare const IconCell: ({ cell }: IIconCellProps) => React.JSX.Element;

package/dist/components/table/cell/cell-types/input-cell.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { IInputCell } from './cell-types.interface';
+import { Align } from "../../../../common-enum";
+export interface IInputCellProps {
+    cell: IInputCell;
+    columnAlignment?: Align.LEFT | Align.RIGHT;
+    testId?: string;
+}
+export declare const InputCell: ({ cell, columnAlignment, testId, }: IInputCellProps) => React.JSX.Element;

package/dist/components/table/cell/cell-types/link-cell.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ILinkCell } from './cell-types.interface';
+interface ILinkCellProps {
+    cell: ILinkCell;
+    testId?: string;
+}
+export declare const LinkCell: ({ cell, testId }: ILinkCellProps) => React.JSX.Element;
+export {};

package/dist/components/table/cell/cell-types/number-input-cell.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { INumberInputCell } from './cell-types.interface';
+interface INumberInputCellProps {
+    cell: INumberInputCell;
+    testId?: string;
+}
+export declare const NumberInputCell: ({ cell, testId, }: INumberInputCellProps) => React.JSX.Element;
+export {};

package/dist/components/table/cell/cell-types/popover-cell.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { IPopoverCell } from './cell-types.interface';
+export interface IPopoverCellProps {
+    cell: IPopoverCell;
+    testId?: string;
+}
+export declare const PopoverCell: ({ cell, testId }: IPopoverCellProps) => React.JSX.Element;

package/dist/components/table/cell/cell-types/select-cell.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ISelectCell } from './cell-types.interface';
+import { Align } from "../../../../common-enum";
+export interface ISelectCellProps {
+    cell: ISelectCell;
+    columnAlignment?: Align.LEFT | Align.RIGHT;
+    testId?: string;
+}
+export declare const SelectCell: ({ cell, columnAlignment, testId, }: ISelectCellProps) => React.JSX.Element;

package/dist/components/table/cell/cell-types/slider-cell.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { ISliderCell } from './cell-types.interface';
+type ISliderCellProps = {
+    cell: ISliderCell;
+};
+export declare const SliderCell: ({ cell }: ISliderCellProps) => React.JSX.Element;
+export {};

package/dist/components/table/cell/cell-types/sort-cell.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ISortCell } from "./cell-types.interface";
+export interface ISortProps {
+    cell: ISortCell;
+}
+export declare const Sort: ({ cell }: ISortProps) => React.JSX.Element | null;

package/dist/components/table/cell/cell-types/static-cell.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { IStaticCell } from './cell-types.interface';
+export interface IStaticCellProps {
+    cell: IStaticCell;
+    isHeader?: boolean;
+    testId?: string;
+}
+export declare const StaticCell: ({ cell, isHeader, testId, }: IStaticCellProps) => React.JSX.Element;

package/dist/components/table/cell/cell-wrapper.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { Align } from "../../../common-enum";
+export interface ICellWrapperProps {
+    cell: any;
+    isHeader: boolean;
+    columnAlignment: Align.LEFT | Align.RIGHT;
+    testId?: string;
+}
+export declare const CellWrapper: ({ cell, isHeader, columnAlignment, testId, }: ICellWrapperProps) => React.JSX.Element | null;

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

@@ -0,0 +1,13 @@
+import React from "react";
+import { TCellShape } from "./cell-types/cell-types.interface";
+import { Align } from "../../../common-enum";
+export interface ICellProps {
+    cell?: TCellShape | any;
+    isHeader: boolean;
+    columnHeaderAlignment?: string;
+    columnAlignment?: Align.LEFT | Align.RIGHT;
+    width?: string | number;
+    snapshot?: any;
+    testId?: string;
+}
+export declare const Cell: ({ cell, isHeader, columnHeaderAlignment, columnAlignment, width: columnWidthProp, snapshot, testId, }: ICellProps) => React.JSX.Element;

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

@@ -0,0 +1,22 @@
+import React from 'react';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Editable: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Disabled: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Colspan: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const ColspanWithWidths: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const CellWidths: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const CellStyleProp: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Rowspan: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Checkboxes: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Icons: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Links: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Actions: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Menus: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const JSXContent: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const StaticCellTooltips: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const WordbreakLongContent: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Popover: () => React.JSX.Element;
+export declare const SinglePopoverAtOnce: () => React.JSX.Element;
+export declare const OverflowingCells: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const TestScrolling: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;

package/dist/components/table/cell/input-cell-wrapper.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import { Align } from "../../../common-enum";
+export interface IInputCellWrapperProps {
+    cell: any;
+    columnAlignment: Align.LEFT | Align.RIGHT;
+    testId?: string;
+}
+export declare const InputCellWrapper: ({ cell, columnAlignment, testId, }: IInputCellWrapperProps) => React.JSX.Element;

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

@@ -0,0 +1,9 @@
+export declare enum CellType {
+    INPUT = "Input",
+    NUMBER_INPUT = "NumberInput",
+    SELECT = "Select",
+    POPOVER = "Popover",
+    SLIDER = "Slider",
+    CHECKBOX = "CheckBox",
+    ACTIONS = "Actions"
+}

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

@@ -0,0 +1,10 @@
+import React, { ReactNode } from 'react';
+import { IPagination } from '../../pagination/pagination';
+import { IAction } from '../../actions/actions.interface';
+export interface IFooterProps {
+    colSpan?: number;
+    pagination: IPagination;
+    actions?: IAction[];
+    content?: ReactNode;
+}
+export declare const Footer: ({ colSpan, pagination, actions, content, }: IFooterProps) => React.JSX.Element | null;

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

@@ -0,0 +1,3 @@
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const Footer: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;

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

@@ -0,0 +1,22 @@
+interface IAlignmentProps {
+    bodyAlignment?: string;
+    headerAlignment?: string;
+    isHeader: boolean;
+}
+/**
+ * getCellAlignment - returns string or class name
+ * @param {IAlignmentProps} alignment - body cell alignment
+ * @param {Record<string, string>} styles - styles object
+ * @param {boolean} isGetText - get text for example ('left', 'right' or 'center') or class name. Default value false.
+ * @returns {string|null}
+ */
+export declare const getCellAlignment: (alignment?: IAlignmentProps, styles?: Record<string, string>, isGetText?: boolean) => string | null;
+/**
+ * Returns alignments or empty array
+ * @param {Array<string | string[]>} alignments can be array of arrays or array of strings
+ * @param {boolean} isHeader
+ * @param {number} rowIndex
+ * @returns {Array<string>}
+ */
+export declare const getHeaderAlignment: (alignments?: Array<string | string[]>, isHeader?: boolean, rowIndex?: number) => string[];
+export {};

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

@@ -0,0 +1 @@
+export {};

package/dist/components/table/row/expanded-content-row.d.ts

@@ -0,0 +1,7 @@
+import React, { ReactNode } from 'react';
+export interface IExpandedContentRowProps {
+    colSpan: number;
+    children: ReactNode;
+    flush?: boolean;
+}
+export declare const ExpandedContentRow: ({ colSpan, children, flush, }: IExpandedContentRowProps) => React.JSX.Element;

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

@@ -0,0 +1,37 @@
+import React, { ReactNode } from 'react';
+import { ICellProps } from '../cell/cell';
+interface IOnRowClickFunction {
+    (): any;
+    noStyle?: boolean;
+}
+export interface IRowProps {
+    row: {
+        active?: boolean;
+        cells: ICellProps['cell'][];
+        noDrag?: boolean;
+        onRowClick?: IOnRowClickFunction;
+        onRowFocus?: IOnRowClickFunction;
+        onRowMouseEnter?: IOnRowClickFunction;
+        onRowMouseLeave?: IOnRowClickFunction;
+        expandedContent?: {
+            content: ReactNode;
+            flush?: boolean;
+        };
+        actions?: any[];
+    };
+    rowIndex: number;
+    isHeader?: boolean;
+    columnCount: number;
+    colSpan: number;
+    columnHeaderAlignments?: string[] | string[][];
+    columnAlignment?: string[];
+    hasRowActions: boolean;
+    draggableTable?: boolean;
+    snapshot?: any;
+    provided?: any;
+    width?: string | number;
+    columnWidths?: string[];
+    testId?: string;
+}
+export declare const Row: ({ row, rowIndex, isHeader, columnCount, colSpan, columnHeaderAlignments, columnAlignment, hasRowActions, draggableTable, snapshot, provided, width, columnWidths, testId, }: IRowProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,9 @@
+import { StoryFn } from '@storybook/react';
+declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
+export default _default;
+export declare const ActiveRow: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const RowFocusEvent: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const NotStriped: import("@storybook/types").AnnotatedStoryFn<import("@storybook/react/dist/types-0a347bb9").R, any>;
+export declare const Expandable: StoryFn<any>;
+export declare const DragAndDrop: StoryFn<any>;
+export declare const OnRowEnter: StoryFn<any>;

package/dist/components/table/table-scroll-wrapper.d.ts

@@ -0,0 +1,13 @@
+import React, { ReactNode } from 'react';
+interface ITableProps {
+    rows: any[];
+    infiniteScroll?: boolean;
+}
+export interface ITableScrollWrapperProps {
+    table: ITableProps;
+    children: (props: {
+        visibleRows: number;
+    }) => ReactNode;
+}
+export declare const TableScrollWrapper: ({ table, children, }: ITableScrollWrapperProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,34 @@
+import React, { ReactNode } from "react";
+import { IFooterProps } from "./footer/footer";
+import { TRowsType } from "./table.viewdata";
+import { Align } from "../../common-enum";
+interface ITableProps {
+    onListReorder?: (obj: {
+        from: number;
+        to: number;
+    }) => void;
+    table: {
+        name?: string | number | ReactNode;
+        actionsRight?: boolean;
+        fixedWidth?: string | number;
+        maxHeight?: string | number;
+        columnWidths?: string[];
+        className?: string;
+        columnHeaderAlignments?: Array<Align>;
+        columnAlignment?: Array<Align>;
+        infiniteScroll?: boolean;
+        headers?: any[];
+        rows?: TRowsType;
+        footer?: IFooterProps;
+        draggable?: boolean;
+        bordered?: boolean;
+        striped?: boolean;
+        testId?: string;
+        onAddRow?: any;
+        defaultEmptyRow?: any;
+        stickyHeaders?: string | boolean;
+        actions?: any;
+    };
+}
+export declare const Table: (props: ITableProps) => React.JSX.Element;
+export {};