Auto COMMIT for build : 7665

 commit by: a.hassani <hassani.ayoub@gmail.com>

 with message : add cardImage

DataTable/Cell.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import { TableColumnBase } from './types';
+export declare const CellBase: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    headCell?: boolean | undefined;
+    noPadding?: boolean | undefined;
+}>> & string;
+export type CellProps = Pick<TableColumnBase, 'button' | 'grow' | 'maxWidth' | 'minWidth' | 'width' | 'right' | 'center' | 'compact' | 'hide' | 'allowOverflow'>;
+export declare const CellExtended: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "headCell" | "noPadding"> & {
+    headCell?: boolean | undefined;
+    noPadding?: boolean | undefined;
+}, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, CellProps>> & string;

DataTable/Checkbox.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+interface CheckboxProps {
+    name: string;
+    component?: any;
+    componentOptions?: {
+        [key: string]: unknown;
+    };
+    indeterminate?: boolean;
+    checked?: boolean;
+    disabled?: boolean;
+    onClick?: (e: React.MouseEvent) => void;
+}
+declare function Checkbox({ name, component, componentOptions, indeterminate, checked, disabled, onClick, }: CheckboxProps): JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof Checkbox>;
+export default _default;

DataTable/ContextMenu.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { Direction } from './constants';
+import { ContextMessage } from './types';
+type ContextMenuProps = {
+    contextMessage: ContextMessage;
+    contextActions: React.ReactNode | React.ReactNode[];
+    contextComponent: React.ReactNode | null;
+    selectedCount: number;
+    direction: Direction;
+};
+declare function ContextMenu({ contextMessage, contextActions, contextComponent, selectedCount, direction, }: ContextMenuProps): JSX.Element;
+export default ContextMenu;

DataTable/DataTable.d.ts

@@ -0,0 +1,4 @@
+import { TableProps } from './types';
+declare function DataTable<T>(props: TableProps<T>): JSX.Element;
+declare const _default: typeof DataTable;
+export default _default;

DataTable/ExpanderButton.d.ts

@@ -0,0 +1,11 @@
+import { ExpandableIcon } from './types';
+type ExpanderButtonProps<T> = {
+    disabled?: boolean;
+    expanded?: boolean;
+    expandableIcon: ExpandableIcon;
+    id: string | number;
+    row: T;
+    onToggled?: (row: T) => void;
+};
+declare function ExpanderButton<T>({ disabled, expanded, expandableIcon, id, row, onToggled, }: ExpanderButtonProps<T>): JSX.Element;
+export default ExpanderButton;

DataTable/ExpanderRow.d.ts

@@ -0,0 +1,12 @@
+import { CSSObject } from 'styled-components';
+import { ComponentProps, ExpandableRowsComponent } from './types';
+type ExpanderRowProps<T> = {
+    data: T;
+    ExpanderComponent: ExpandableRowsComponent<T>;
+    extendedRowStyle: CSSObject;
+    extendedClassNames: string;
+    expanderComponentProps: ComponentProps;
+};
+declare function ExpanderRow<T>({ data, ExpanderComponent, expanderComponentProps, extendedRowStyle, extendedClassNames, }: ExpanderRowProps<T>): JSX.Element;
+declare const _default: typeof ExpanderRow;
+export default _default;

DataTable/NoDataWrapper.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const NoDataWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default NoDataWrapper;

DataTable/Pagination.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import { Direction } from './constants';
+import { PaginationOptions } from './types';
+interface PaginationProps {
+    rowsPerPage: number;
+    rowCount: number;
+    currentPage: number;
+    direction?: Direction;
+    paginationRowsPerPageOptions?: number[];
+    paginationIconLastPage?: React.ReactNode;
+    paginationIconFirstPage?: React.ReactNode;
+    paginationIconNext?: React.ReactNode;
+    paginationIconPrevious?: React.ReactNode;
+    paginationComponentOptions?: PaginationOptions;
+    onChangePage: (page: number) => void;
+    onChangeRowsPerPage: (numRows: number, currentPage: number) => void;
+}
+declare function Pagination({ rowsPerPage, rowCount, currentPage, direction, paginationRowsPerPageOptions, paginationIconLastPage, paginationIconFirstPage, paginationIconNext, paginationIconPrevious, paginationComponentOptions, onChangeRowsPerPage, onChangePage, }: PaginationProps): JSX.Element;
+export default Pagination;

DataTable/ProgressWrapper.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const ProgressWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default ProgressWrapper;

DataTable/ResponsiveWrapper.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare const ResponsiveWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    responsive: boolean;
+    fixedHeader?: boolean | undefined;
+    fixedHeaderScrollHeight?: string | undefined;
+}>> & string;
+export default ResponsiveWrapper;

DataTable/Select.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+type SelectProps = {
+    onChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
+    defaultValue: string | number;
+    children: React.ReactNode;
+};
+declare const Select: ({ defaultValue, onChange, ...rest }: SelectProps) => JSX.Element;
+export default Select;

DataTable/Table.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const TableStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    disabled?: boolean | undefined;
+}>> & string;
+export default TableStyle;

DataTable/TableBody.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Body: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default Body;

DataTable/TableCell.d.ts

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { TableColumn } from './types';
+interface CellProps<T> {
+    id: string;
+    dataTag: string | null;
+    column: TableColumn<T>;
+    row: T;
+    rowIndex: number;
+    isDragging: boolean;
+    onDragStart: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnd: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+}
+declare function Cell<T>({ id, column, row, rowIndex, dataTag, isDragging, onDragStart, onDragOver, onDragEnd, onDragEnter, onDragLeave, }: CellProps<T>): JSX.Element;
+declare const _default: typeof Cell;
+export default _default;

DataTable/TableCellCheckbox.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { RowState, SingleRowAction, ComponentProps } from './types';
+type TableCellCheckboxProps<T> = {
+    name: string;
+    keyField: string;
+    row: T;
+    rowCount: number;
+    selected: boolean;
+    selectableRowsComponent: 'input' | React.ReactNode;
+    selectableRowsComponentProps: ComponentProps;
+    selectableRowsSingle: boolean;
+    selectableRowDisabled: RowState<T>;
+    onSelectedRow: (action: SingleRowAction<T>) => void;
+};
+declare function TableCellCheckbox<T>({ name, keyField, row, rowCount, selected, selectableRowsComponent, selectableRowsComponentProps, selectableRowsSingle, selectableRowDisabled, onSelectedRow, }: TableCellCheckboxProps<T>): JSX.Element;
+export default TableCellCheckbox;

DataTable/TableCellExpander.d.ts

@@ -0,0 +1,11 @@
+import { ExpandableIcon } from './types';
+type CellExpanderProps<T> = {
+    disabled: boolean;
+    expanded: boolean;
+    expandableIcon: ExpandableIcon;
+    id: string | number;
+    row: T;
+    onToggled: (row: T) => void;
+};
+declare function CellExpander<T>({ row, expanded, expandableIcon, id, onToggled, disabled, }: CellExpanderProps<T>): JSX.Element;
+export default CellExpander;

DataTable/TableCol.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import { TableColumn, SortAction, SortOrder } from './types';
+type TableColProps<T> = {
+    column: TableColumn<T>;
+    disabled: boolean;
+    draggingColumnId?: string | number;
+    sortIcon?: React.ReactNode;
+    pagination: boolean;
+    paginationServer: boolean;
+    persistSelectedOnSort: boolean;
+    selectedColumn: TableColumn<T>;
+    sortDirection: SortOrder;
+    sortServer: boolean;
+    selectableRowsVisibleOnly: boolean;
+    onSort: (action: SortAction<T>) => void;
+    onDragStart: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnd: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+};
+declare function TableCol<T>({ column, disabled, draggingColumnId, selectedColumn, sortDirection, sortIcon, sortServer, pagination, paginationServer, persistSelectedOnSort, selectableRowsVisibleOnly, onSort, onDragStart, onDragOver, onDragEnd, onDragEnter, onDragLeave, }: TableColProps<T>): JSX.Element | null;
+declare const _default: typeof TableCol;
+export default _default;

DataTable/TableColCheckbox.d.ts

@@ -0,0 +1,16 @@
+import * as React from 'react';
+import { AllRowsAction, RowState } from './types';
+interface ColumnCheckboxProps<T> {
+    headCell?: boolean;
+    selectableRowsComponent: 'input' | React.ReactNode;
+    selectableRowsComponentProps: Record<string, unknown>;
+    selectableRowDisabled: RowState<T>;
+    keyField: string;
+    mergeSelections: boolean;
+    rowData: T[];
+    selectedRows: T[];
+    allSelected: boolean;
+    onSelectAllRows: (action: AllRowsAction<T>) => void;
+}
+declare function ColumnCheckbox<T>({ headCell, rowData, keyField, allSelected, mergeSelections, selectedRows, selectableRowsComponent, selectableRowsComponentProps, selectableRowDisabled, onSelectAllRows, }: ColumnCheckboxProps<T>): JSX.Element;
+export default ColumnCheckbox;

DataTable/TableColExpander.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+declare const ColumnExpander: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "headCell" | "noPadding"> & {
+    headCell?: boolean | undefined;
+    noPadding?: boolean | undefined;
+}, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, never>> & string;
+export default ColumnExpander;

DataTable/TableHead.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+declare const Head: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    fixedHeader?: boolean | undefined;
+}>> & string;
+export default Head;

DataTable/TableHeadRow.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+declare const HeadRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    dense?: boolean | undefined;
+    disabled?: boolean | undefined;
+}>> & string;
+export default HeadRow;

DataTable/TableHeader.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { Direction } from './constants';
+import { ContextMessage } from './types';
+type HeaderProps = {
+    title?: string | React.ReactNode;
+    actions?: React.ReactNode | React.ReactNode[];
+    direction: Direction;
+    selectedCount: number;
+    showMenu?: boolean;
+    contextMessage: ContextMessage;
+    contextActions: React.ReactNode | React.ReactNode[];
+    contextComponent: React.ReactNode | null;
+};
+declare const Header: ({ title, actions, contextMessage, contextActions, contextComponent, selectedCount, direction, showMenu, }: HeaderProps) => JSX.Element;
+export default Header;

DataTable/TableRow.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { SingleRowAction, TableProps } from './types';
+type DProps<T> = Pick<TableProps<T>, 'columns' | 'conditionalRowStyles' | 'dense' | 'expandableIcon' | 'expandableRows' | 'expandableRowsComponent' | 'expandableRowsComponentProps' | 'expandableRowsHideExpander' | 'expandOnRowClicked' | 'expandOnRowDoubleClicked' | 'highlightOnHover' | 'expandableInheritConditionalStyles' | 'keyField' | 'onRowClicked' | 'onRowDoubleClicked' | 'onRowMouseEnter' | 'onRowMouseLeave' | 'onRowExpandToggled' | 'pointerOnHover' | 'selectableRowDisabled' | 'selectableRows' | 'selectableRowsComponent' | 'selectableRowsComponentProps' | 'selectableRowsHighlight' | 'selectableRowsSingle' | 'striped'>;
+interface TableRowProps<T> extends Required<DProps<T>> {
+    draggingColumnId: number | string;
+    defaultExpanded?: boolean;
+    defaultExpanderDisabled: boolean;
+    id: string | number;
+    onSelectedRow: (action: SingleRowAction<T>) => void;
+    pointerOnHover: boolean;
+    row: T;
+    rowCount: number;
+    rowIndex: number;
+    selected: boolean;
+    onDragStart: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnd: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+    onDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+}
+declare function Row<T>({ columns, conditionalRowStyles, defaultExpanded, defaultExpanderDisabled, dense, expandableIcon, expandableRows, expandableRowsComponent, expandableRowsComponentProps, expandableRowsHideExpander, expandOnRowClicked, expandOnRowDoubleClicked, highlightOnHover, id, expandableInheritConditionalStyles, keyField, onRowClicked, onRowDoubleClicked, onRowMouseEnter, onRowMouseLeave, onRowExpandToggled, onSelectedRow, pointerOnHover, row, rowCount, rowIndex, selectableRowDisabled, selectableRows, selectableRowsComponent, selectableRowsComponentProps, selectableRowsHighlight, selectableRowsSingle, selected, striped, draggingColumnId, onDragStart, onDragOver, onDragEnd, onDragEnter, onDragLeave, }: TableRowProps<T>): JSX.Element;
+export default Row;

DataTable/TableSubheader.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+type AlignItems = 'center' | 'left' | 'right';
+type SubheaderProps = {
+    align?: AlignItems;
+    wrapContent?: boolean;
+    children?: React.ReactNode;
+};
+declare const Subheader: ({ align, wrapContent, ...rest }: SubheaderProps) => JSX.Element;
+export default Subheader;

DataTable/TableWrapper.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Wrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export default Wrapper;

DataTable/constants.d.ts

@@ -0,0 +1,16 @@
+export declare const STOP_PROP_TAG = "allowRowEvents";
+export declare enum Direction {
+    LTR = "ltr",
+    RTL = "rtl",
+    AUTO = "auto"
+}
+export declare enum Alignment {
+    LEFT = "left",
+    RIGHT = "right",
+    CENTER = "center"
+}
+export declare enum Media {
+    SM = "sm",
+    MD = "md",
+    LG = "lg"
+}

DataTable/defaultProps.d.ts

@@ -0,0 +1,94 @@
+import * as React from 'react';
+import { Alignment, Direction } from './constants';
+export declare const defaultProps: {
+    columns: never[];
+    data: never[];
+    title: string;
+    keyField: string;
+    selectableRows: boolean;
+    selectableRowsHighlight: boolean;
+    selectableRowsNoSelectAll: boolean;
+    selectableRowSelected: null;
+    selectableRowDisabled: null;
+    selectableRowsComponent: "input";
+    selectableRowsComponentProps: {};
+    selectableRowsVisibleOnly: boolean;
+    selectableRowsSingle: boolean;
+    clearSelectedRows: boolean;
+    expandableRows: boolean;
+    expandableRowDisabled: null;
+    expandableRowExpanded: null;
+    expandOnRowClicked: boolean;
+    expandableRowsHideExpander: boolean;
+    expandOnRowDoubleClicked: boolean;
+    expandableInheritConditionalStyles: boolean;
+    expandableRowsComponent: () => JSX.Element;
+    expandableIcon: {
+        collapsed: React.JSX.Element;
+        expanded: React.JSX.Element;
+    };
+    expandableRowsComponentProps: {};
+    progressPending: boolean;
+    progressComponent: React.JSX.Element;
+    persistTableHead: boolean;
+    sortIcon: null;
+    sortFunction: null;
+    sortServer: boolean;
+    striped: boolean;
+    highlightOnHover: boolean;
+    pointerOnHover: boolean;
+    noContextMenu: boolean;
+    contextMessage: {
+        singular: string;
+        plural: string;
+        message: string;
+    };
+    actions: null;
+    contextActions: null;
+    contextComponent: null;
+    defaultSortFieldId: null;
+    defaultSortAsc: boolean;
+    responsive: boolean;
+    noDataComponent: React.JSX.Element;
+    disabled: boolean;
+    noTableHead: boolean;
+    noHeader: boolean;
+    subHeader: boolean;
+    subHeaderAlign: Alignment;
+    subHeaderWrap: boolean;
+    subHeaderComponent: null;
+    fixedHeader: boolean;
+    fixedHeaderScrollHeight: string;
+    pagination: boolean;
+    paginationServer: boolean;
+    paginationServerOptions: {
+        persistSelectedOnSort: boolean;
+        persistSelectedOnPageChange: boolean;
+    };
+    paginationDefaultPage: number;
+    paginationResetDefaultPage: boolean;
+    paginationTotalRows: number;
+    paginationPerPage: number;
+    paginationRowsPerPageOptions: number[];
+    paginationComponent: null;
+    paginationComponentOptions: {};
+    paginationIconFirstPage: React.JSX.Element;
+    paginationIconLastPage: React.JSX.Element;
+    paginationIconNext: React.JSX.Element;
+    paginationIconPrevious: React.JSX.Element;
+    dense: boolean;
+    conditionalRowStyles: never[];
+    theme: "default";
+    customStyles: {};
+    direction: Direction;
+    onChangePage: () => null;
+    onChangeRowsPerPage: () => null;
+    onRowClicked: () => null;
+    onRowDoubleClicked: () => null;
+    onRowMouseEnter: () => null;
+    onRowMouseLeave: () => null;
+    onRowExpandToggled: () => null;
+    onSelectedRowsChange: () => null;
+    onSort: () => null;
+    onColumnOrderChange: () => null;
+};

DataTable/hooks/useColumns.d.ts

@@ -0,0 +1,15 @@
+import * as React from 'react';
+import { SortOrder, TableColumn } from '../types';
+type ColumnsHook<T> = {
+    tableColumns: TableColumn<T>[];
+    draggingColumnId: string;
+    handleDragStart: (e: React.DragEvent<HTMLDivElement>) => void;
+    handleDragEnter: (e: React.DragEvent<HTMLDivElement>) => void;
+    handleDragOver: (e: React.DragEvent<HTMLDivElement>) => void;
+    handleDragLeave: (e: React.DragEvent<HTMLDivElement>) => void;
+    handleDragEnd: (e: React.DragEvent<HTMLDivElement>) => void;
+    defaultSortDirection: SortOrder;
+    defaultSortColumn: TableColumn<T>;
+};
+declare function useColumns<T>(columns: TableColumn<T>[], onColumnOrderChange: (nextOrder: TableColumn<T>[]) => void, defaultSortFieldId: string | number | null | undefined, defaultSortAsc: boolean): ColumnsHook<T>;
+export default useColumns;

DataTable/hooks/useDidUpdateEffect.d.ts

@@ -0,0 +1,3 @@
+type Hook = (fn: () => void, inputs: unknown[]) => void;
+declare const useFirstUpdate: Hook;
+export default useFirstUpdate;

DataTable/hooks/useRTL.d.ts

@@ -0,0 +1,3 @@
+import { Direction } from '../constants';
+declare function useRTL(direction?: Direction): boolean;
+export default useRTL;

DataTable/hooks/useWindowSize.d.ts

@@ -0,0 +1,6 @@
+type Hook = () => {
+    width: number | undefined;
+    height: number | undefined;
+};
+declare const useWindowSize: Hook;
+export default useWindowSize;

DataTable/icons/Dropdown.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const DropdownIcon: React.FC;
+export default DropdownIcon;

DataTable/icons/ExpanderCollapsedIcon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const ExpanderCollapsedIcon: React.FC;
+export default ExpanderCollapsedIcon;

DataTable/icons/ExpanderExpandedIcon.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const ExpanderExpandedIcon: React.FC;
+export default ExpanderExpandedIcon;

DataTable/icons/FirstPage.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const FirstPage: React.FC;
+export default FirstPage;

DataTable/icons/LastPage.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const LastPage: React.FC;
+export default LastPage;

DataTable/icons/Left.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const Left: React.FC;
+export default Left;

DataTable/icons/NativeSortIcon.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { SortOrder } from "../types";
+interface NativeSortIconProps {
+    sortActive: boolean;
+    sortDirection: SortOrder;
+}
+declare const NativeSortIcon: React.FC<NativeSortIconProps>;
+export default NativeSortIcon;

DataTable/icons/Right.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const Right: React.FC;
+export default Right;

DataTable/media.d.ts

@@ -0,0 +1,10 @@
+import { CSSObject } from "styled-components";
+export declare const SMALL = 599;
+export declare const MEDIUM = 959;
+export declare const LARGE = 1280;
+export declare const media: {
+    sm: (literals: TemplateStringsArray, ...args: CSSObject[]) => FlattenSimpleInterpolation;
+    md: (literals: TemplateStringsArray, ...args: CSSObject[]) => FlattenSimpleInterpolation;
+    lg: (literals: TemplateStringsArray, ...args: CSSObject[]) => FlattenSimpleInterpolation;
+    custom: (value: number) => (literals: TemplateStringsArray, ...args: CSSObject[]) => FlattenSimpleInterpolation;
+};

DataTable/styles.d.ts

@@ -0,0 +1,3 @@
+import { TableStyles, Theme, Themes } from './types';
+export declare const defaultStyles: (theme: Theme) => TableStyles;
+export declare const createStyles: (customStyles?: TableStyles, themeName?: string, inherit?: Themes) => TableStyles;

DataTable/tableReducer.d.ts

@@ -0,0 +1,2 @@
+import { Action, TableState } from './types';
+export declare function tableReducer<T>(state: TableState<T>, action: Action<T>): TableState<T>;

DataTable/themes.d.ts

@@ -0,0 +1,7 @@
+import { Theme, Themes } from './types';
+type ThemeMapping = {
+    [propertyName: string]: Theme;
+};
+export declare const defaultThemes: ThemeMapping;
+export declare function createTheme<T>(name?: string, customTheme?: T, inherit?: Themes): Theme;
+export {};

DataTable/types.d.ts

@@ -0,0 +1,343 @@
+/// <reference types="react" />
+import { Alignment, Direction, Media } from './constants';
+import { CSSObject } from 'styled-components';
+export declare enum SortOrder {
+    ASC = "asc",
+    DESC = "desc"
+}
+export type Primitive = string | number | boolean | bigint;
+export type ColumnSortFunction<T> = (a: T, b: T) => number;
+export type ExpandRowToggled<T> = (expanded: boolean, row: T) => void;
+export type Format<T> = (row: T, rowIndex: number) => React.ReactNode;
+export type RowState<T> = ((row: T) => boolean) | null;
+export type Selector<T> = (row: T, rowIndex?: number) => Primitive;
+export type SortFunction<T> = (rows: T[], field: Selector<T>, sortDirection: SortOrder) => T[];
+export type TableRow = Record<string, unknown>;
+export type ComponentProps = Record<string, unknown>;
+export type ExpanderComponentProps<T> = {
+    data: T;
+};
+export type ExpandableRowsComponent<T> = React.ComponentType<ExpanderComponentProps<T>>;
+export type PaginationChangePage = (page: number, totalRows: number) => void;
+export type PaginationChangeRowsPerPage = (currentRowsPerPage: number, currentPage: number) => void;
+export type PaginationComponentProps = {
+    rowsPerPage: number;
+    rowCount: number;
+    currentPage: number;
+    onChangePage: PaginationChangePage;
+    onChangeRowsPerPage: PaginationChangeRowsPerPage;
+};
+export type PaginationComponent = React.ComponentType<PaginationComponentProps>;
+export type TableProps<T> = {
+    actions?: React.ReactNode | React.ReactNode[];
+    className?: string;
+    clearSelectedRows?: boolean;
+    columns: TableColumn<T>[];
+    conditionalRowStyles?: ConditionalStyles<T>[];
+    contextActions?: React.ReactNode | React.ReactNode[];
+    contextComponent?: React.ReactNode;
+    contextMessage?: ContextMessage;
+    customStyles?: TableStyles;
+    data: T[];
+    defaultSortAsc?: boolean;
+    defaultSortFieldId?: string | number | null | undefined;
+    dense?: boolean;
+    direction?: Direction;
+    disabled?: boolean;
+    expandableIcon?: ExpandableIcon;
+    expandableInheritConditionalStyles?: boolean;
+    expandableRowDisabled?: RowState<T>;
+    expandableRowExpanded?: RowState<T>;
+    expandableRows?: boolean;
+    expandableRowsComponent?: ExpandableRowsComponent<T>;
+    expandableRowsComponentProps?: ComponentProps;
+    expandableRowsHideExpander?: boolean;
+    expandOnRowClicked?: boolean;
+    expandOnRowDoubleClicked?: boolean;
+    fixedHeader?: boolean;
+    fixedHeaderScrollHeight?: string;
+    highlightOnHover?: boolean;
+    keyField?: string;
+    noContextMenu?: boolean;
+    noDataComponent?: React.ReactNode;
+    noHeader?: boolean;
+    noTableHead?: boolean;
+    onChangePage?: PaginationChangePage;
+    onChangeRowsPerPage?: PaginationChangeRowsPerPage;
+    onRowClicked?: (row: T, e: React.MouseEvent) => void;
+    onRowDoubleClicked?: (row: T, e: React.MouseEvent) => void;
+    onRowMouseEnter?: (row: T, e: React.MouseEvent) => void;
+    onRowMouseLeave?: (row: T, e: React.MouseEvent) => void;
+    onRowExpandToggled?: ExpandRowToggled<T>;
+    onSelectedRowsChange?: (selected: {
+        allSelected: boolean;
+        selectedCount: number;
+        selectedRows: T[];
+    }) => void;
+    onSort?: (selectedColumn: TableColumn<T>, sortDirection: SortOrder, sortedRows: T[]) => void;
+    onColumnOrderChange?: (nextOrder: TableColumn<T>[]) => void;
+    pagination?: boolean;
+    paginationComponent?: PaginationComponent;
+    paginationComponentOptions?: PaginationOptions;
+    paginationDefaultPage?: number;
+    paginationIconFirstPage?: React.ReactNode;
+    paginationIconLastPage?: React.ReactNode;
+    paginationIconNext?: React.ReactNode;
+    paginationIconPrevious?: React.ReactNode;
+    paginationPerPage?: number;
+    paginationResetDefaultPage?: boolean;
+    paginationRowsPerPageOptions?: number[];
+    paginationServer?: boolean;
+    paginationServerOptions?: PaginationServerOptions;
+    paginationTotalRows?: number;
+    persistTableHead?: boolean;
+    pointerOnHover?: boolean;
+    progressComponent?: React.ReactNode;
+    progressPending?: boolean;
+    responsive?: boolean;
+    selectableRowDisabled?: RowState<T>;
+    selectableRows?: boolean;
+    selectableRowsComponent?: 'input' | React.ReactNode;
+    selectableRowsComponentProps?: ComponentProps;
+    selectableRowSelected?: RowState<T>;
+    selectableRowsHighlight?: boolean;
+    selectableRowsNoSelectAll?: boolean;
+    selectableRowsVisibleOnly?: boolean;
+    selectableRowsSingle?: boolean;
+    sortFunction?: SortFunction<T> | null;
+    sortIcon?: React.ReactNode;
+    sortServer?: boolean;
+    striped?: boolean;
+    style?: CSSObject;
+    subHeader?: React.ReactNode | React.ReactNode[];
+    subHeaderAlign?: Alignment;
+    subHeaderComponent?: React.ReactNode | React.ReactNode[];
+    subHeaderWrap?: boolean;
+    theme?: Themes;
+    /**
+     *  Shows and displays a header with a title
+     *  */
+    title?: string | React.ReactNode;
+};
+export type TableColumnBase = {
+    allowOverflow?: boolean;
+    button?: boolean;
+    center?: boolean;
+    compact?: boolean;
+    reorder?: boolean;
+    grow?: number;
+    hide?: number | ((value: number) => CSSObject) | Media;
+    id?: string | number;
+    ignoreRowClick?: boolean;
+    maxWidth?: string;
+    minWidth?: string;
+    name?: string | number | React.ReactNode;
+    omit?: boolean;
+    right?: boolean;
+    sortable?: boolean;
+    style?: CSSObject;
+    width?: string;
+    wrap?: boolean;
+};
+export interface TableColumn<T> extends TableColumnBase {
+    name?: string | number | React.ReactNode;
+    sortField?: string;
+    cell?: (row: T, rowIndex: number, column: TableColumn<T>, id: string | number) => React.ReactNode;
+    conditionalCellStyles?: ConditionalStyles<T>[];
+    format?: Format<T> | undefined;
+    selector?: Selector<T>;
+    sortFunction?: ColumnSortFunction<T>;
+}
+export interface ConditionalStyles<T> {
+    when: (row: T) => boolean;
+    style?: CSSObject | ((row: T) => CSSObject);
+    classNames?: string[];
+}
+export interface TableStyles {
+    table?: {
+        style: CSSObject;
+    };
+    tableWrapper?: {
+        style: CSSObject;
+    };
+    responsiveWrapper?: {
+        style: CSSObject;
+    };
+    header?: {
+        style: CSSObject;
+    };
+    subHeader?: {
+        style: CSSObject;
+    };
+    head?: {
+        style: CSSObject;
+    };
+    headRow?: {
+        style?: CSSObject;
+        denseStyle?: CSSObject;
+    };
+    headCells?: {
+        style?: CSSObject;
+        draggingStyle?: CSSObject;
+    };
+    contextMenu?: {
+        style?: CSSObject;
+        activeStyle?: CSSObject;
+    };
+    cells?: {
+        style: CSSObject;
+        draggingStyle?: CSSObject;
+    };
+    rows?: {
+        style?: CSSObject;
+        selectedHighlightStyle?: CSSObject;
+        denseStyle?: CSSObject;
+        highlightOnHoverStyle?: CSSObject;
+        stripedStyle?: CSSObject;
+    };
+    expanderRow?: {
+        style: CSSObject;
+    };
+    expanderCell?: {
+        style: CSSObject;
+    };
+    expanderButton?: {
+        style: CSSObject;
+    };
+    pagination?: {
+        style?: CSSObject;
+        pageButtonsStyle?: CSSObject;
+    };
+    noData?: {
+        style: CSSObject;
+    };
+    progress?: {
+        style: CSSObject;
+    };
+}
+export interface PaginationOptions {
+    noRowsPerPage?: boolean;
+    rowsPerPageText?: string;
+    rangeSeparatorText?: string;
+    selectAllRowsItem?: boolean;
+    selectAllRowsItemText?: string;
+}
+export interface PaginationServerOptions {
+    persistSelectedOnSort?: boolean;
+    persistSelectedOnPageChange?: boolean;
+}
+export interface ExpandableIcon {
+    collapsed: React.ReactNode;
+    expanded: React.ReactNode;
+}
+export interface ContextMessage {
+    singular: string;
+    plural: string;
+    message?: string;
+}
+export type TableState<T> = {
+    allSelected: boolean;
+    contextMessage: ContextMessage;
+    selectedCount: number;
+    selectedRows: T[];
+    selectedColumn: TableColumn<T>;
+    sortDirection: SortOrder;
+    currentPage: number;
+    rowsPerPage: number;
+    selectedRowsFlag: boolean;
+    toggleOnSelectedRowsChange: boolean;
+};
+type ThemeText = {
+    primary: string;
+    secondary: string;
+    disabled: string;
+};
+type ThemeBackground = {
+    default: string;
+};
+type ThemeContext = {
+    background: string;
+    text: string;
+};
+type ThemeDivider = {
+    default: string;
+};
+type ThemeButton = {
+    default: string;
+    focus: string;
+    hover: string;
+    disabled: string;
+};
+type ThemeSelected = {
+    default: string;
+    text: string;
+};
+type ThemeHighlightOnHover = {
+    default: string;
+    text: string;
+};
+type ThemeStriped = {
+    default: string;
+    text: string;
+};
+export type Themes = string;
+export interface Theme {
+    text: ThemeText;
+    background: ThemeBackground;
+    context: ThemeContext;
+    divider: ThemeDivider;
+    button: ThemeButton;
+    selected: ThemeSelected;
+    highlightOnHover: ThemeHighlightOnHover;
+    striped: ThemeStriped;
+}
+export interface AllRowsAction<T> {
+    type: 'SELECT_ALL_ROWS';
+    keyField: string;
+    rows: T[];
+    rowCount: number;
+    mergeSelections: boolean;
+}
+export interface SingleRowAction<T> {
+    type: 'SELECT_SINGLE_ROW';
+    keyField: string;
+    row: T;
+    isSelected: boolean;
+    rowCount: number;
+    singleSelect: boolean;
+}
+export interface MultiRowAction<T> {
+    type: 'SELECT_MULTIPLE_ROWS';
+    keyField: string;
+    selectedRows: T[];
+    totalRows: number;
+    mergeSelections: boolean;
+}
+export interface SortAction<T> {
+    type: 'SORT_CHANGE';
+    sortDirection: SortOrder;
+    selectedColumn: TableColumn<T>;
+    clearSelectedOnSort: boolean;
+}
+export interface PaginationPageAction {
+    type: 'CHANGE_PAGE';
+    page: number;
+    paginationServer: boolean;
+    visibleOnly: boolean;
+    persistSelectedOnPageChange: boolean;
+}
+export interface PaginationRowsPerPageAction {
+    type: 'CHANGE_ROWS_PER_PAGE';
+    rowsPerPage: number;
+    page: number;
+}
+export interface ClearSelectedRowsAction {
+    type: 'CLEAR_SELECTED_ROWS';
+    selectedRowsFlag: boolean;
+}
+export interface ColumnsAction<T> {
+    type: 'UPDATE_COLUMNS';
+    cols: TableColumn<T>[];
+}
+export type Action<T> = AllRowsAction<T> | SingleRowAction<T> | MultiRowAction<T> | SortAction<T> | PaginationPageAction | PaginationRowsPerPageAction | ClearSelectedRowsAction;
+export {};

DataTable/util.d.ts

@@ -0,0 +1,29 @@
+/// <reference types="react" />
+import { CSSObject } from 'styled-components';
+import { ConditionalStyles, TableColumn, Format, Selector, SortOrder, SortFunction } from './types';
+export declare function prop<T, K extends keyof T>(obj: T, key: K): T[K];
+export declare function isEmpty(field?: string | number | undefined): boolean;
+export declare function sort<T>(rows: T[], selector: Selector<T> | string | null | undefined, direction: SortOrder, sortFn?: SortFunction<T> | null): T[];
+export declare function parseSelector<T extends Record<string, any>>(row: T, selector: string): T;
+export declare function getProperty<T>(row: T, selector: Selector<T> | string | undefined | null | unknown, // unknown allows us to throw an error for JS code
+format: Format<T> | undefined | null, rowIndex: number): React.ReactNode;
+export declare function insertItem<T>(array: T[] | undefined, item: T, index?: number): T[];
+export declare function removeItem<T>(array: T[] | undefined, item: T, keyField?: string): T[];
+export declare function decorateColumns<T>(columns: TableColumn<T>[]): TableColumn<T>[];
+export declare function getSortDirection(ascDirection?: boolean | undefined): SortOrder;
+export declare function handleFunctionProps(object: {
+    [key: string]: unknown;
+}, ...args: unknown[]): {
+    [key: string]: unknown;
+};
+export declare function getNumberOfPages(rowCount: number, rowsPerPage: number): number;
+export declare function recalculatePage(prevPage: number, nextPage: number): number;
+export declare const noop: () => null;
+export declare function getConditionalStyle<T>(row: T, conditionalRowStyles?: ConditionalStyles<T>[], baseClassNames?: string[]): {
+    style: CSSObject;
+    classNames: string;
+};
+export declare function isRowSelected<T>(row: T, selectedRows?: T[], keyField?: string): boolean;
+export declare function isOdd(num: number): boolean;
+export declare function findColumnIndexById<T>(columns: TableColumn<T>[], id: string | undefined): number;
+export declare function equalizeId(a: string | number | undefined, b: string | number | undefined): boolean;

README.md

@@ -0,0 +1,15 @@
+# @d3v4pp/ui
+A light react components library with a lot of components, fun to use
+
+
+## Install
+### current version
+```
+npm install --save @d3v4pp/ui
+```
+### dev version 
+```
+npm install --save git+https://cvs.d3v4pp.fr/D3V4PP/ui.git
+```
+## Documentation & Examples
+[Documentation & Examples](https://ui.d3v4pp.fr)

cmps/badge/Badge.d.ts

@@ -0,0 +1,6 @@
+import * as React from "react";
+export interface BadgeProps extends React.HTMLAttributes<HTMLSpanElement> {
+}
+export declare class Badge extends React.Component<BadgeProps> {
+    render(): React.JSX.Element;
+}

cmps/button/Button.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+export interface ButtonProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    duration: number;
+}
+export declare class Button extends React.Component<ButtonProps> {
+    el: HTMLAnchorElement | null;
+    ripple: HTMLElement;
+    defaultProps: {
+        duration: number;
+    };
+    /**
+     * Initialisation of the wave effect after the component did mount
+     */
+    componentDidMount(): void;
+    triggerEffect(e: any): void;
+    isWindow(obj: any): boolean;
+    getWindow(elem: any): any;
+    offset(): {
+        top: number;
+        left: number;
+    };
+    showEffect(e: any): false | undefined;
+    convertStyle(obj: Object): string;
+    hideEffect(): void;
+    render(): React.JSX.Element;
+}

cmps/card/Card.d.ts

@@ -0,0 +1,28 @@
+import * as React from "react";
+export interface CardProps extends React.HtmlHTMLAttributes<HTMLDivElement> {
+}
+export declare class Card extends React.Component<CardProps> {
+    render(): React.JSX.Element;
+}
+export interface CardContentProps extends React.HtmlHTMLAttributes<HTMLDivElement> {
+}
+export declare class CardContent extends React.Component<CardContentProps> {
+    render(): React.JSX.Element;
+}
+export interface CardImageProps extends React.HtmlHTMLAttributes<HTMLDivElement> {
+    src: string | undefined;
+    imageTitle?: string | undefined;
+}
+export declare class CardImage extends React.Component<CardImageProps> {
+    render(): React.JSX.Element;
+}
+export interface CardTitleProps extends React.HtmlHTMLAttributes<HTMLSpanElement> {
+}
+export declare class CardTitle extends React.Component<CardTitleProps> {
+    render(): React.JSX.Element;
+}
+export interface CardActionProps extends React.HtmlHTMLAttributes<HTMLDivElement> {
+}
+export declare class CardAction extends React.Component<CardActionProps> {
+    render(): React.JSX.Element;
+}

cmps/chip/Chip.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface DividerProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Chip extends React.Component<DividerProps> {
+    render(): React.JSX.Element;
+}
+export default Chip;

cmps/collapsible/Collapsible.d.ts

@@ -0,0 +1,27 @@
+import * as React from "react";
+export interface CollapsibleProps extends React.HTMLProps<HTMLUListElement> {
+}
+export declare class Collapsible extends React.Component<CollapsibleProps> {
+    render(): React.JSX.Element;
+}
+export interface CollapsBodyProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class CollapsBody extends React.Component<CollapsBodyProps> {
+    el: HTMLDivElement | null;
+    render(): React.JSX.Element;
+}
+export interface CollapsTriggerProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class CollapsTrigger extends React.Component<CollapsTriggerProps> {
+    state: {
+        isOpen: boolean;
+    };
+    el: HTMLDivElement | null;
+    componentDidMount(): void;
+    showHideBody(e: React.MouseEvent<HTMLDivElement>): void;
+    collapse(e: React.MouseEvent<HTMLDivElement>): void;
+    findCollapsible(): HTMLUListElement;
+    expand(e: React.MouseEvent<HTMLDivElement>): void;
+    isOpen(): boolean;
+    render(): React.JSX.Element;
+}

cmps/collections/Collection.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+export interface CollectionProps extends React.HTMLProps<HTMLUListElement> {
+}
+export declare class Collection extends React.Component<CollectionProps> {
+    private el;
+    render(): React.JSX.Element;
+}
+export interface CollectionItemProps extends React.HTMLProps<HTMLLIElement> {
+}
+export declare class CollectionItem extends React.Component<CollectionItemProps> {
+    private el;
+    render(): React.JSX.Element;
+}

cmps/forms/Field.d.ts

@@ -0,0 +1,41 @@
+import * as React from 'react';
+export interface FieldProps extends React.HTMLProps<HTMLInputElement> {
+    vtype?: string;
+    vtypeMsg?: string;
+    onEnterKey?: Function;
+}
+export interface FieldRef extends HTMLInputElement {
+    isValid: () => Boolean;
+}
+export declare class Field extends React.Component<FieldProps> {
+    id: string;
+    el: FieldRef | null | undefined;
+    label: HTMLLabelElement | null | undefined;
+    state: {
+        labelClassName: string;
+        focusCount: number;
+        errmsg: string;
+    };
+    constructor(props: FieldProps);
+    getDefaults(): {
+        placeholder: string;
+        id: number;
+        className: string;
+        label: string;
+        type: string;
+        icon: string;
+    };
+    getValue(): string | null | undefined;
+    setValue(val: string): void;
+    isValid(): Boolean;
+    onBlur(e: React.FocusEvent<HTMLInputElement>): void;
+    onFocus(e: React.FocusEvent<HTMLInputElement>): void;
+    validate(blure?: boolean): Boolean;
+    makeInValid(): void;
+    makeValid(): void;
+    componentDidMount(): void;
+    onKeyUp(e?: React.KeyboardEvent<HTMLInputElement>): void;
+    uuidv4(): any;
+    getErrorView(): React.JSX.Element | undefined;
+    render(): React.JSX.Element;
+}

cmps/forms/Textarea.d.ts

@@ -0,0 +1,38 @@
+import * as React from "react";
+import * as PropTypes from "prop-types";
+export type TextareaProps = React.HTMLProps<HTMLTextAreaElement> & {
+    /** Called whenever the textarea resizes */
+    onResize?: (e: Event) => void;
+    /** Minimum number of visible rows */
+    rows?: React.HTMLProps<HTMLTextAreaElement>["rows"];
+    /** Maximum number of visible rows */
+    maxRows?: number;
+    /** Initialize `autosize` asynchronously.
+     * Enable it if you are using StyledComponents
+     * This is forced to true when `maxRows` is set.
+     */
+    async?: boolean;
+};
+export type State = {
+    lineHeight: number | null;
+};
+export type DefaultProps = {
+    rows: number;
+    async: boolean;
+};
+export declare class Textarea extends React.Component<TextareaProps, State> {
+    textarea: HTMLTextAreaElement | null;
+    currentValue: TextareaProps["value"];
+    static defaultProps: DefaultProps;
+    static propTypes: {
+        [key in keyof TextareaProps]: PropTypes.Requireable<any>;
+    };
+    state: State;
+    onResize: (e: Event) => void;
+    componentDidUpdate(): void;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    onChange: (e: React.SyntheticEvent<HTMLTextAreaElement>) => void;
+    updateLineHeight: () => void;
+    render(): React.JSX.Element;
+}

cmps/forms/line-height.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Calculate the `line-height` of a given node
+ * @param {HTMLElement} node Element to calculate line height of. Must be in the DOM.
+ * @returns {Number} `line-height` of the element in pixels
+ */
+export default function lineHeight(node: HTMLElement): number;

cmps/icons/Icon.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+export interface IconProps extends React.HTMLProps<HTMLSpanElement> {
+}
+export declare class Icon extends React.Component<IconProps> {
+    render(): React.JSX.Element;
+}

cmps/layouts/Layouts.d.ts

@@ -0,0 +1,37 @@
+import * as React from 'react';
+export interface ColProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Col extends React.Component<ColProps> {
+    el: HTMLDivElement | null;
+    render(): React.JSX.Element;
+}
+export interface RowProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Row extends React.Component<RowProps> {
+    el: HTMLDivElement | null;
+    render(): React.JSX.Element;
+}
+export interface ParallaxProps extends React.HTMLProps<HTMLImageElement> {
+}
+export declare class Parallax extends React.Component<ParallaxProps> {
+    render(): React.JSX.Element;
+}
+export interface DividerProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Divider extends React.Component<DividerProps> {
+    render(): React.JSX.Element;
+}
+export interface OverlayProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Overlay extends React.Component<OverlayProps> {
+    state: {
+        visible: boolean;
+    };
+    el: HTMLDivElement | null;
+    show(): void;
+    open(): void;
+    isVisible(): boolean;
+    hide(): void;
+    close(): void;
+    render(): React.JSX.Element | null;
+}

cmps/modal/Modal.d.ts

@@ -0,0 +1,28 @@
+import * as React from 'react';
+export interface ModalProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Modal extends React.Component<ModalProps> {
+    state: {
+        isOpen: boolean;
+    };
+    open(): void;
+    close(): void;
+    show(): void;
+    hide(): void;
+    render(): React.JSX.Element | null;
+}
+export interface ModalContentProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class ModalContent extends React.Component<ModalContentProps> {
+    render(): React.JSX.Element;
+}
+export interface ModalFooterProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class ModalFooter extends React.Component<ModalFooterProps> {
+    render(): React.JSX.Element;
+}
+export interface ModalHeaderProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class ModalHeader extends React.Component<ModalHeaderProps> {
+    render(): React.JSX.Element;
+}

cmps/navigation/NavBar.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+export interface NavBarProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class NavBar extends React.Component<NavBarProps> {
+    render(): React.JSX.Element;
+}
+export interface NavBarGroupProps extends React.HTMLProps<HTMLUListElement> {
+}
+export declare class NavBarGroup extends React.Component<NavBarGroupProps> {
+    render(): React.JSX.Element;
+}
+export interface NavBarItemProps extends React.HTMLProps<HTMLLIElement> {
+}
+export declare class NavBarItem extends React.Component<NavBarItemProps> {
+    render(): React.JSX.Element;
+}
+export interface NavBarBrandProps extends React.HTMLProps<HTMLAnchorElement> {
+    fragment?: JSX.ElementType;
+}
+export declare class NavBarBrand extends React.Component<NavBarBrandProps> {
+    render(): any;
+}

cmps/navigation/Navigation.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+export interface NavigationRoutes {
+    element: any;
+}
+export interface NavigationProps {
+    logo: string;
+    routes: Array<NavigationRoutes>;
+}
+export declare class Navigation extends React.Component<NavigationProps> {
+    private navbar;
+    private sidenav;
+    constructor(props: NavigationProps);
+    componentDidMount(): void;
+    render(): React.JSX.Element;
+}

cmps/navigation/SideNav.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+export interface SideNavProps extends React.HTMLProps<HTMLUListElement> {
+}
+export declare class SideNav extends React.Component<SideNavProps> {
+    state: {
+        open: boolean;
+    };
+    open(): void;
+    toggle(): void;
+    hide(): void;
+    render(): React.JSX.Element;
+}
+export interface SideNavUserProps extends React.HTMLProps<HTMLLIElement> {
+    readonly src: string;
+    readonly bg_src: string;
+    readonly username: string;
+    readonly email: string;
+}
+export declare class SideNavUser extends React.Component<SideNavUserProps> {
+    render(): React.JSX.Element;
+}
+export interface SideNavElProps extends React.HTMLProps<HTMLLIElement> {
+}
+export declare class SideNavEl extends React.Component<SideNavElProps> {
+    render(): React.JSX.Element;
+}

cmps/progress/Progress.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+export interface ProgressProps extends React.HTMLProps<HTMLDivElement> {
+}
+export declare class Progress extends React.Component<ProgressProps> {
+    render(): React.JSX.Element;
+}
+export interface PreloaderProps extends React.HTMLAttributes<HTMLDivElement> {
+    readonly size?: string;
+    readonly color?: string;
+}
+export declare class Preloader extends React.Component<PreloaderProps> {
+    render(): React.JSX.Element;
+}

index.d.ts

@@ -0,0 +1,23 @@
+import "./sass/d3v4pp.scss";
+export { TextareaProps, Textarea } from "./cmps/forms/Textarea";
+export { Field, FieldRef, FieldProps } from "./cmps/forms/Field";
+export { Collection, CollectionProps, CollectionItemProps, CollectionItem } from "./cmps/collections/Collection";
+export { Button } from "./cmps/button/Button";
+export { Badge } from "./cmps/badge/Badge";
+export { Chip } from "./cmps/chip/Chip";
+export { Icon } from "./cmps/icons/Icon";
+export { Row, Col, Overlay, Divider, Parallax } from "./cmps/layouts/Layouts";
+export { CollapsTrigger, Collapsible, CollapsBody } from "./cmps/collapsible/Collapsible";
+export { Card, CardContent, CardTitle, CardAction } from "./cmps/card/Card";
+export { NavBar, NavBarGroup, NavBarItem, NavBarBrand } from "./cmps/navigation/NavBar";
+export { Navigation } from "./cmps/navigation/Navigation";
+export { SideNav, SideNavEl, SideNavUser } from "./cmps/navigation/SideNav";
+export { Progress, Preloader } from "./cmps/progress/Progress";
+export { Modal, ModalContent, ModalFooter, ModalHeader } from "./cmps/modal/Modal";
+export { Login, LoginProps } from "./ux";
+import DataTable from './DataTable/DataTable';
+export { defaultThemes, createTheme } from './DataTable/themes';
+export * from './DataTable/constants';
+export type { TableProps, TableProps as IDataTableProps, // this is for backwards compat with v6
+TableColumn, TableRow, TableStyles, Theme, Themes, ConditionalStyles, ExpanderComponentProps, PaginationComponentProps, PaginationOptions, PaginationServerOptions, ContextMessage, SortOrder, SortFunction, Selector, } from './DataTable/types';
+export default DataTable;

package.json

@@ -0,0 +1,38 @@
+{
+    "name": "@d3v4pp/ui",
+    "version": "0.0.2",
+    "description": "a set of react ui components",
+    "main": "index.js",
+    "repository": {
+        "type": "git",
+        "url": "https://cvs.d3v4pp.fr/D3V4PP/ui.git"
+    },
+    "author": {
+        "name": "Ayoub Hassani <D3v4pp>",
+        "email": "ayoub@d3v4pp.fr",
+        "url": "https://d3v4pp.fr/"
+    },
+    "funding": "https://paypal.me/SupportTheDoc",
+    "homepage": "https://cvs.d3v4pp.fr/D3V4PP/ui/src/master/README.md",
+    "bugs": {
+        "url": "https://cvs.d3v4pp.fr/D3V4PP/ui/issues",
+        "email": "ayoub@d3v4pp.fr"
+    },
+    "license": "d3v4pp",
+    "keywords": [
+        "react",
+        "react-component"
+    ],
+    "dependencies": {
+        "@emotion/react": "^11.10.0",
+        "@syncfusion/ej2-icons": "^24.2.3",
+        "autosize": "^4.0.2",
+        "computed-style": "^0.3.0",
+        "memoize-one": "^6.0.0",
+        "prop-types": "^15.8.1",
+        "react": "^18.2.0",
+        "react-dom": "^18.2.0",
+        "react-router-dom": "^6.22.1",
+        "styled-components": "^6.0.0-rc.1"
+    }
+}

ux/auth/Login.d.ts

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import { EventHandler } from "react";
+export interface LoginProps {
+    checkUrl?: string;
+    loginUrl?: string;
+    className?: string;
+    onLoginError?: EventHandler<any>;
+    onLogin?: EventHandler<any>;
+}
+export declare class Login extends React.Component<LoginProps> {
+    el: HTMLDivElement | null;
+    state: any;
+    private emailF;
+    private passwordF;
+    constructor(props: LoginProps);
+    next(): void;
+    login(): void;
+    getLoginView(): React.JSX.Element | null;
+    getPasswordView(): React.JSX.Element | null;
+    render(): React.JSX.Element;
+}

ux/index.d.ts

@@ -0,0 +1 @@
+export { Login, LoginProps } from "./auth/Login";