es-grid-template 0.0.7 → 0.0.13

package/lib/grid-component/type.d.ts

@@ -0,0 +1,225 @@
+import type { Key, ReactElement, ReactNode } from "react";
+import type React from "react";
+import type { IOperator } from "./hooks";
+import type { TypeFilter, TableProps as RcTableProps, TableColumnType as RcColumnType, EditType } from "rc-master-ui";
+import type { FilterOperator, TableRowSelection } from "rc-master-ui/es/table/interface";
+import type { ToolbarItem } from "rc-master-ui/es/toolbar";
+import type { ItemType } from "rc-master-ui/es/menu/interface";
+import type { FieldNames, FilterFunc } from "rc-select/es/Select";
+export type IColumnType = "number" | "time" | "date" | "week" | "month" | "file" | "quarter" | "year" | "datetime" | "string" | "boolean" | "checkbox" | "color" | null | undefined;
+export type AnyObject = Record<PropertyKey, any>;
+export type SelectMode = 'checkbox' | 'radio' | undefined;
+export type ITextAlign = 'center' | 'left' | 'right';
+export type ITemplateColumn = {
+    value: any;
+    column: any;
+    rowData: any;
+    field: number | string;
+    index: number;
+};
+export type ColumnSelectTable = {
+    field: string;
+    dataIndex: string;
+    type?: IColumnType;
+    headerText?: string;
+    fixedType?: 'left' | 'right' | undefined;
+    width?: number | undefined;
+    minWidth?: number;
+    maxWidth?: number;
+    visible?: boolean;
+    textAlign?: ITextAlign;
+    headerTextAlign?: ITextAlign;
+    template?: (props: ITemplateColumn) => ReactNode | ReactElement;
+    headerTemplate?: any;
+    ellipsis?: boolean | undefined;
+    format?: IFormat;
+    tooltipDescription?: string | ((rowData: any) => string | ReactNode);
+    showTooltip?: boolean;
+    showTooltipHeader?: boolean;
+};
+export type IEditSelectSettings = {
+    fieldKey?: string;
+    /**  get value form other field **/
+    fieldValue?: string;
+    /** get label form other field **/
+    fieldLabel?: string;
+    inputKey?: string;
+    filterKey?: string[];
+    selectMode?: SelectMode;
+    options: any[];
+    getPasteValue?: (value: any) => Record<string, any> | null;
+    validateOption?: (rowData: any, field: string) => any[];
+    defaultOptions?: any[];
+    defaultValue?: (value: any, rowData: any) => {
+        value: any;
+        label: string;
+        [key: string]: string;
+    } | null;
+    formatOptionLabel?: (option: any) => ReactNode | ReactElement;
+    loadOptions?: (search: string, callback: (newOptions: any[]) => void) => void;
+    isMulti?: boolean;
+    closeMenuOnSelect?: boolean;
+    menuWidth?: number;
+    menuHeight?: number;
+    columns?: ColumnSelectTable[];
+    toolbarItems?: ToolbarItem[];
+    toolbarClick?: (props: ToolbarClick) => void;
+    toolbarHeight?: number;
+    hideSelectedOptions?: boolean;
+    showItems?: number;
+    isLengthSelected?: boolean;
+    fieldNames?: FieldNames;
+    filterOption?: boolean | FilterFunc<any>;
+};
+export type ToolbarClick = {
+    item: any;
+    column: any;
+};
+export type ColumnType<RecordType> = Omit<RcColumnType<RecordType>, 'headerTemplate'> & {
+    field?: string;
+    type?: IColumnType;
+    isSummary?: boolean;
+    summaryTemplate?: (data: number, key: string) => ReactElement | ReactNode;
+    maxWidth?: string | number;
+    format?: IFormat;
+    allowFiltering?: boolean;
+    operator?: FilterOperator;
+    placeholder?: string;
+    showInColumnChoose?: boolean;
+    typeFilter?: TypeFilter;
+    headerText?: string;
+    template?: ReactNode | ReactElement | ((value: any, record: RecordType, index: number) => ReactNode | ReactElement);
+    showTooltip?: boolean;
+    tooltipDescription?: ReactNode | ReactElement | ((value: any, record: RecordType, index: number) => ReactNode | ReactElement);
+    headerTemplate?: React.ReactNode | React.ReactElement | ((column: ColumnType<RecordType>) => React.ReactNode | React.ReactElement);
+    children?: ColumnType<RecordType>[];
+};
+export type ColumnEditType<RecordType> = ColumnType<RecordType> & {
+    editType?: EditType | ((rowData?: any) => EditType);
+    template?: ReactNode | ReactElement | ((value: any, record: RecordType, index: number) => ReactNode | ReactElement);
+    disable?: boolean | ((rowData: any) => boolean);
+    isClearable?: boolean;
+    maxDate?: any;
+    minDate?: any;
+    maxTime?: any;
+    minTime?: any;
+    max?: number;
+    min?: number;
+    editSelectSettings?: IEditSelectSettings;
+};
+export type ColumnsType<RecordType = AnyObject> = ColumnType<RecordType>[];
+export type ColumnsEditType<RecordType = AnyObject> = ColumnEditType<RecordType>[];
+export type ColumnTable<RecordType = AnyObject> = ColumnEditType<RecordType> | ColumnType<RecordType>;
+export type ColumnsTable<RecordType = AnyObject> = (ColumnType<RecordType> | ColumnEditType<RecordType>)[];
+export interface TableProps<RecordType> extends Omit<RcTableProps<RecordType>, 'columns' | 'rowSelection' | 'loading' | 'dataSource'> {
+    editAble?: boolean;
+    dataSource: RecordType[];
+    columns: ColumnsTable<RecordType>;
+    height?: number;
+    format?: IFormat;
+    t?: any;
+    lang?: string;
+    contextMenuItems?: any[];
+    contextMenuHidden?: string[] | ((args?: Omit<ContextInfo<RecordType>, 'item' | 'event'>) => string[]);
+    contextMenuOpen?: (args: Omit<ContextInfo<RecordType>, 'item'>) => void;
+    contextMenuClick?: (args: ContextInfo<RecordType>) => void;
+    recordDoubleClick?: (args: RecordDoubleClickEventArgs<RecordType>) => void;
+    toolbarItems?: ToolbarItem[];
+    showColumnChoose?: boolean;
+    onFilter?: (query: {
+        field: string;
+        key: string;
+        operator: IOperator;
+        predicate: 'and' | 'or';
+        value: any;
+    }[]) => void;
+    onSorter?: (args: {
+        column: ColumnType<RecordType>;
+        columnKey: string;
+        field: string;
+        direction: 'Ascending' | 'Descending' | null;
+    }) => void;
+    selectionSettings?: SelectionSettings;
+    rowKey?: string;
+    rowSelection?: RowSelection<RecordType>;
+    rowSelected?: (args: {
+        type: string;
+        rowData: RecordType;
+        selected: RecordType | RecordType[];
+    }) => void;
+    dataSourceFilter?: SourceFilter[];
+    onFilterClick?: (column: ColumnType<RecordType>, callback: (key: string, data: any) => void) => void;
+    loading?: boolean;
+    allowResizing?: boolean;
+    onDataChange?: (data: RecordType[]) => void;
+}
+export interface TableEditProps<RecordType = AnyObject> extends Omit<TableProps<RecordType>, 'columns'> {
+    columns: ColumnsTable<RecordType>;
+    onCellPaste?: ICellPasteModel<RecordType>;
+    onCellChange?: (args: CellChangeArgs, handleCallback: (rowData: any, index: any, value?: any) => void) => void;
+}
+export type GridTableProps<RecordType = AnyObject> = TableProps<RecordType> | TableEditProps<RecordType>;
+export type CellChangeArgs = {
+    type: 'onPaste' | 'onChange' | 'onCellPaste';
+    value: any;
+    rowData: any;
+    rows: any[];
+    rowsData: any[];
+    indexRow: number;
+    rowId?: string;
+    field: string;
+    indexCol: any;
+    sumValue?: any[];
+};
+export type IOnPastedProps = {
+    data: any[];
+    pastedColumns: string[];
+    pasteData: any[];
+    type: 'onPaste' | 'onChange' | 'onCellPaste';
+};
+export interface ICellPasteModel<RecordType = AnyObject> {
+    onPasted?: (args: IOnPastedProps, handleCallback: (callbackData: any[]) => void) => void;
+    dataChange?: (data: RecordType[]) => void;
+    getCallbackData?: (props: any) => void;
+}
+export type SourceFilter = {
+    key: string;
+    data: any[];
+    loadOptions?: (search: string, callback: (newOptions: any[]) => void) => void;
+};
+export type RowSelection<RecordType> = Omit<TableRowSelection<RecordType>, 'type' | 'columnWidth' | 'hideSelectAll' | 'defaultSelectedRowKeys'>;
+export type SelectionSettings = {
+    mode?: 'checkbox' | 'radio';
+    type?: 'single' | 'multiple';
+    checkboxOnly?: boolean;
+    hideSelectAll?: boolean;
+    columnWidth?: number | string;
+    defaultSelectedRowKeys?: Key[];
+};
+export type RecordDoubleClickEventArgs<RecordType> = {
+    rowData: RecordType;
+    rowIndex: number | undefined;
+    e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
+};
+export type ContextInfo<RecordType> = {
+    rowInfo: {
+        rowData: RecordType | null;
+    };
+    event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>;
+    item: ItemType;
+};
+export type IFormat = {
+    thousandSeparator?: string;
+    decimalSeparator?: string;
+    decimalScale?: number | undefined;
+    allowNegative?: boolean;
+    prefix?: string | undefined;
+    suffix?: string | undefined;
+    fixedDecimalScale?: boolean;
+    dateFormat?: string;
+    datetimeFormat?: string;
+    timeFormat?: string;
+    weekFormat?: string;
+    monthFormat?: string;
+    yearFormat?: string;
+};

package/lib/grid-component/useContext.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import type { IFormat } from "./type";
+import type { SubmitHandler } from "react-hook-form";
+export interface IContext {
+    searchValue?: any;
+    setSearchValue?: any;
+    open?: boolean;
+    setOpen?: any;
+    rowKey: string;
+    onSave?: any;
+    form?: any;
+    format?: IFormat;
+    control?: any;
+    trigger?: any;
+    handleSubmit?: any;
+    onSubmit?: SubmitHandler<any>;
+    getValues?: any;
+    handleCellChange?: ({ key, record, type }: ContextCellChange) => void;
+}
+export type ContextCellChange = {
+    key: string;
+    record: any;
+    newState?: any;
+    prevState?: any;
+    type: 'enter' | 'blur' | 'outClick';
+};
+export declare const TableContext: import("react").Context<IContext>;

package/lib/grid-component/useContext.js

@@ -0,0 +1,10 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TableContext = void 0;
+var _react = require("react");
+const TableContext = exports.TableContext = /*#__PURE__*/(0, _react.createContext)({
+  rowKey: 'id'
+});

package/lib/index.d.ts

@@ -1,2 +1 @@
-import GridTable from './GridTable';
-export default GridTable;
+export { default as GridTable } from './grid-component';

package/lib/index.js

@@ -4,6 +4,10 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
-var _GridTable = _interopRequireDefault(require("./GridTable"));
-var _default = exports.default = _GridTable.default;
+Object.defineProperty(exports, "GridTable", {
+  enumerable: true,
+  get: function () {
+    return _gridComponent.default;
+  }
+});
+var _gridComponent = _interopRequireDefault(require("./grid-component"));