diff --git a/types/tabulator-tables/index.d.ts b/types/tabulator-tables/index.d.ts index c610875e6e..705edc79af 100644 --- a/types/tabulator-tables/index.d.ts +++ b/types/tabulator-tables/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for tabulator-tables 4.3 +// Type definitions for tabulator-tables 4.4 // Project: http://tabulator.info // Definitions by: Josh Harris // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped @@ -486,6 +486,9 @@ declare namespace Tabulator { rowSelected?: RowChangedCallback; /** The rowDeselected event is triggered when a row is deselected, either by the user or programatically. */ rowDeselected?: RowChangedCallback; + + /** Allows you to specifcy the behaviour when the user tabs from the last editable cell on the last row of the table */ + tabEndNewRow?: boolean | JSONRecord | ((row: RowComponent) => any); } interface OptionsColumns { @@ -604,6 +607,12 @@ declare namespace Tabulator { /**If you don't want to show a particular column in the print table you can set the print property in its column definition object to false */ print?: boolean; + + /** The headerSort option can now be set in the table options to affect all columns as well as in column definitions. */ + headerSort?: boolean; + + /** The headerSortTristate option can now be set in the table options to affect all columns as well as in column definitions.*/ + headerSortTristate?: boolean; } interface OptionsCell { @@ -700,6 +709,9 @@ declare namespace Tabulator { /** The dataSorted callback is triggered after the table dataset is sorted. */ dataSorted?: (sorters: Sorter[], rows: RowComponent[]) => void; + + /** Setting the invalidOptionWarnings option to false will disable console warning messages for invalid properties in the table constructor and column definition object */ + invalidOptionWarnings?: boolean; } type DownloadType = 'csv' | 'json' | 'xlsx' | 'pdf'; @@ -886,7 +898,7 @@ You can pass an optional additional property with sorter, sorterParams that shou bRow: RowComponent, column: ColumnComponent, dir: SortDirection, - sorterParams: {} + sorterParams: {}, ) => number); /** If you want to dynamically generate the sorterParams at the time the sort is called you can pass a function into the property that should return the params object. */ sorterParams?: ColumnDefinitionSorterParams | ColumnSorterParamLookupFunction; @@ -1037,6 +1049,9 @@ You can pass an optional additional property with sorter, sorterParams that shou /** Show/Hide a particular column in the HTML output*/ htmlOutput?: boolean; + + /**If you don't want to show a particular column in the clipboard output you can set the clipboard property in its column definition object to false */ + clipboard?: boolean; } interface CellCallbacks { @@ -1092,7 +1107,7 @@ You can pass an optional additional property with sorter, sorterParams that shou data: any, type: 'data' | 'edit', mutatorParams: any, - cell?: CellComponent + cell?: CellComponent, ) => any; type CustomMutatorParams = {} | ((value: any, data: any, type: 'data' | 'edit', cell?: CellComponent) => any); type CustomAccessor = ( @@ -1100,7 +1115,7 @@ You can pass an optional additional property with sorter, sorterParams that shou data: any, type: 'data' | 'download' | 'clipboard', AccessorParams: any, - column?: ColumnComponent + column?: ColumnComponent, ) => any; type CustomAccessorParams = | {} @@ -1133,6 +1148,7 @@ You can pass an optional additional property with sorter, sorterParams that shou | 'buttonCross' | 'rownum' | 'handle' + | 'rowSelection' | ((cell: CellComponent, formatterParams: {}, onRendered: EmptyCallback) => string | HTMLElement); type FormatterParams = | MoneyParams @@ -1161,7 +1177,7 @@ You can pass an optional additional property with sorter, sorterParams that shou onRendered: EmptyCallback, success: ValueVoidCallback, cancel: ValueVoidCallback, - editorParams: {} + editorParams: {}, ) => HTMLElement | false); type EditorParams = @@ -1239,26 +1255,34 @@ You can pass an optional additional property with sorter, sorterParams that shou stars?: number; } - interface NumberParams { + interface SharedEditorParams { + elementAttributes?: JSONRecord; + } + + interface NumberParams extends SharedEditorParams { // range,number min?: number; max?: number; step?: number; } - interface InputParams { + interface InputParams extends SharedEditorParams { /**Changes input type to 'search' and shows an 'X' clear button to clear the cell value easily */ search?: boolean; } - interface CheckboxParams { + interface CheckboxParams extends SharedEditorParams { // tick tristate?: boolean; indeterminateValue?: string; } - interface SelectParams { - values: true | string[] | JSONRecord | SelectParamsGroup[]; + interface SharedSelectAutoCompleteEditorParams { + defaultValue?: string; + } + + interface SelectParams extends SharedEditorParams, SharedSelectAutoCompleteEditorParams { + values: true | string[] | JSONRecord | SelectParamsGroup[] | string; listItemFormatter?: (value: string, text: string) => string; } @@ -1272,8 +1296,8 @@ You can pass an optional additional property with sorter, sorterParams that shou value: string | number | boolean; } - interface AutoCompleteParams { - values: true | string[] | JSONRecord; + interface AutoCompleteParams extends SharedEditorParams, SharedSelectAutoCompleteEditorParams { + values: true | string[] | JSONRecord | string; listItemFormatter?: (value: string, text: string) => string; searchFunc?: (term: string, values: string[]) => string[]; allowEmpty?: boolean; @@ -1437,6 +1461,9 @@ You can pass an optional additional property with sorter, sorterParams that shou /** The getKey function returns the unique key that is shared between all rows in this group. */ getKey: () => any; + /** Returns the string of the field that all rows in this group have been grouped by. (if a function is used to group the rows rather than a field, this function will return false) */ + getField: () => string; + /** The getRows function returns an array of RowComponent objects, one for each row in the group */ getRows: () => RowComponent[]; @@ -1473,6 +1500,10 @@ You can pass an optional additional property with sorter, sorterParams that shou getNextColumn: () => ColumnComponent | false; /** The getPrevColumn function returns the Column Component for the previous visible column in the table, if there is no previous column it will return a value of false. */ getPrevColumn: () => ColumnComponent | false; + + /**You can move a column component next to another column using the move function */ + move: (toColumn: ColumnLookup, after: boolean) => void; + /** The getVisibility function returns a boolean to show if the column is visible, a value of true means it is visible.*/ getVisibility: () => boolean; /** The show function shows the column if it is hidden.*/ @@ -1562,7 +1593,7 @@ declare class Tabulator { | Tabulator.DownloadType | ((columns: Tabulator.ColumnDefinition[], data: any, options: any, setFileContents: any) => any), fileName: string, - params?: Tabulator.DownloadOptions + params?: Tabulator.DownloadOptions, ) => void; /** If you want to open the generated file in a new browser tab rather than downloading it straight away, you can use the downloadToTab function. This is particularly useful with the PDF downloader, as it allows you to preview the resulting PDF in a new browser ta */ @@ -1627,7 +1658,7 @@ declare class Tabulator { addData: ( data?: Array<{}>, addToTop?: boolean, - positionTarget?: Tabulator.RowLookup + positionTarget?: Tabulator.RowLookup, ) => Promise; /** If the data you are passng to the table contains a mix of existing rows to be updated and new rows to be added then you can call the updateOrAddData function. This will check each row object provided and update the existing row if available, or else create a new row with the data. */ @@ -1671,7 +1702,7 @@ declare class Tabulator { scrollToRow: ( row: Tabulator.RowLookup, position?: Tabulator.ScrollToRowPostition, - ifVisible?: boolean + ifVisible?: boolean, ) => Promise; /** If you want to programmatically move a row to a new position you can use the moveRow function. @@ -1722,10 +1753,14 @@ declare class Tabulator { addColumn: ( definition: Tabulator.ColumnDefinition, insertRightOfTarget?: boolean, - positionTarget?: Tabulator.ColumnLookup + positionTarget?: Tabulator.ColumnLookup, ) => void; /** To permanently remove a column from the table deleteColumn function. This function takes any of the standard column component look up options as its first parameter */ deleteColumn: (column: Tabulator.ColumnLookup) => void; + + /**Programmatically move a column to a new position */ + moveColumn: (fromColumn: Tabulator.ColumnLookup, toColumn: Tabulator.ColumnLookup, after: boolean) => void; + /** If you want to trigger an animated scroll to a column then you can use the scrollToColumn function. The first argument should be any of the standard column component look up options for the column you want to scroll to. The second argument is optional, and is used to set the position of the column, it should be a string with a value of either left, middle or right, if omitted it will be set to the value of the scrollToColumnPosition option which has a default value of left. @@ -1735,7 +1770,7 @@ declare class Tabulator { scrollToColumn: ( column: Tabulator.ColumnLookup, position?: Tabulator.ScrollToColumnPosition, - ifVisible?: boolean + ifVisible?: boolean, ) => Promise; /** You can also set the language at any point after the table has loaded using the setLocale function, which takes the same range of values as the locale setup option mentioned above. */ setLocale: (locale: string | boolean) => void; @@ -1765,7 +1800,7 @@ declare class Tabulator { setFilter: ( p1: string | Tabulator.Filter[] | any[] | ((data: any, filterParams: any) => boolean), p2?: Tabulator.FilterType | {}, - value?: any + value?: any, ) => void; /** If you want to add another filter to the existing filters then you can call the addFilter function: */ addFilter: Tabulator.FilterFunction; @@ -1836,13 +1871,13 @@ declare class Tabulator { ** Note: If you use the setGroupStartOpen or setGroupHeader before you have set any groups on the table, the table will not update until the setGroupBy function is called. */ setGroupStartOpen: ( - values: boolean | ((value: any, count: number, data: any, group: Tabulator.GroupComponent) => boolean) + values: boolean | ((value: any, count: number, data: any, group: Tabulator.GroupComponent) => boolean), ) => void; /** You can use the setGroupHeader function to change the header generation function for each group. This function has one argument and takes the same values as passed to the groupHeader setup option. */ setGroupHeader: ( values: | ((value: any, count: number, data: any, group: Tabulator.GroupComponent) => string) - | Array<(value: any, count: number, data: any) => string> + | Array<(value: any, count: number, data: any) => string>, ) => void; /** You can use the getGroups function to retrieve an array of all the first level Group Components in the table. */ getGroups: () => Tabulator.GroupComponent[]; diff --git a/types/tabulator-tables/tabulator-tables-tests.ts b/types/tabulator-tables/tabulator-tables-tests.ts index a278f84be9..6d105bc8de 100644 --- a/types/tabulator-tables/tabulator-tables-tests.ts +++ b/types/tabulator-tables/tabulator-tables-tests.ts @@ -17,7 +17,7 @@ table.setFilter( // filterParams - params object passed to the filter return data.name === 'bob' && data.height < filterParams.height; // must return a boolean, true if it passes the filter. }, - { height: 3 } + { height: 3 }, ); table.setFilter('age', 'in', ['steve', 'bob', 'jim']); table.setFilter([ @@ -478,3 +478,44 @@ table.download('pdf', 'data.pdf', { table.download('xlsx', 'AllData.xlsx'); table.download('csv', 'data.csv', { bom: true }); table.download('csv', 'data.csv', { delimiter: '.' }); + +// 4.4 updates +table.moveColumn('name', 'age', true); + +let column = {} as Tabulator.ColumnComponent; +column.move('age', true); + +colDef.editorParams = { + elementAttributes: { + '+style': 'background-color:#f00;', + maxlength: '10', + }, +}; + +colDef.editorParams = { + values: ['red', 'green', 'blue'], + defaultValue: 'green', +}; + +colDef.editorParams = { + values: 'color', + defaultValue: 'green', +}; + +colDef.clipboard = false; + +let group = {} as Tabulator.GroupComponent; +let field = group.getField(); + +options.tabEndNewRow = true; +options.tabEndNewRow = { name: 'steve', age: 62 }; +options.tabEndNewRow = row => { + return { name: 'steve', age: 62 }; +}; + +options.headerSort = false; +options.headerSortTristate = true; + +colDef.formatter = 'rowSelection'; + +options.invalidOptionWarnings = false;