5.0 Released Today!!!!!

[olifolkerd]

With the release of version 5.0 Tabulator has undergone a complete rebuild of the codebase.

As Tabulator has grown in complexity and size, so has its codebase, making it harder to maintain and test and very big to download. In this release all of these issues have been addressed.

This release also aims to make Tabulator more accessible to developers, opening up the code and making it easier for you to build your own modules for the table.

For a full rundown of the current updates, have a read through the Release Notes

This is a major update to the library and may include braking changes depending on your config, checkout the Upgrade Guide for full details.

I would like to thank the community for their patience while the has been being built out.

Happy Tabulating!

Oli :)

Developer Tools and Documentation

The primary focus of this release has been to make Tabulator easier to maintain, and to allow the community to make more changes and contributions to the library.

With this in mind there are several major updates worth noting:

Modular Setup

When you used to install Tabulator, you installed the full library with all of the modules. As tabulator has grown this has resulted in people needing to pull in a very large library even for a simple table.

For this reason in version 5.0 you now use ESM importing to import the Tabulator core library, and then only the modules you want to use with your project, keeping your codebase as lightweight as possible.

Don't worry, if you try to use and option that you haven't installed a module for, Tabulator will warn you in the console.

Full details of the new setup process can be found in the Setup Guide

Custom Modules

Modules are where Tabulator stores functionality that is outside of the core library, such as sorting, filtering, grouping etc.

As part of the rebuild these have been improved to make it easer for anyone to build their own module and add bespoke functionality to the table.

Checkout the Building Modules Documentation for more details on the new module system.

There are also several Example Step By Step Guides on how to build your own module

Renderers

The table rendering functionality has now been broken out into a series of different renders, that handle functions like Virtual DOM and classic render modes.

These are now simple to edit, and mean it is now possible for members of the community to create their own renderers if they want to add features or improve table efficiency.

Checkout the Renderers Documentation for more details

Events

Tabulator now has internal and external event buses instead of callbacks to allow for more flexibility in how and when you get notified about actions in the table

Checkout the Events documentation for more information

Developer Tools

There are now a number of built in tools to help in debugging your table setup, for full details checkout the Debug Documentation

Dependencies

All module dependencies have been updated to their latest versions.

Roadmap

Due to many factors (including a global pandemic) I have not had the time to get every feature I hoped to into this release.

To help keep the project going and help push forward community engagement I have chosen to narrow the focus of this release to rebuilding the codebase into a more modular and manageable design that sets solid foundations for future updates. There are many new features, especially for those looking to customise the library or contribute in future.

I have updated the roadmap to reflect this change, and will look to catch up on some of the module feature updates in the next few releases. Now that the massive 5.0 update is complete, there should once again be more regular updates with smaller new features

[mike-lischke]

That's great news Oli. I can't wait to try this new release out. Many thanks for your tireless effort to provide the community with such a precious tool!

[azharp]

Great news! Congrats!! Can't wait to try it out and upgrade to v5. Thanks a lot for the hard work.

[rootux]

Great news. Congrats. 💯

Was trying to run this example and didn't understand why I got errors :)
Then I saw it uses the @latest and it was updated 17 hours ago 😆

[olifolkerd]

I have just released a small patch update to address some small first day niggles, and updated the documentation to improve clarity in some areas.

Please raise an issue if you find any bugs and i will get them patched ASAP.

Cheers

Oli :)

[olifolkerd]

I have just released todays patch release with a few more fixes.

Keep the issues coming in, I will be trying to do a daily patch release each day this week to smooth out any niggles as people find them.

Cheers

Oli :)

[mike-lischke]

Now I only need an update of react-tabulator. Does @ngduc read here too :-)

[olifolkerd]

I have just released todays patch release with a few more fixes.

Keep the issues coming in, the detailed reports and example Code Pens are excellent!

Keep up the great work everyone!

Oli :)

[olifolkerd]

I have just released todays patch release with a few more fixes, it also fixes a regression that crept in yesterday and broke a few labels like pagination handles and group headers.

Cheers

Oli :)

[olifolkerd]

Hey All,

Another bumper patch release has just gone live!

Keep the feedback coming in!

Cheers

Oli :)

[RandomFractals]

I did not have a chance to look at the latest yet, but I really like Tabulator and I see others use it a lot in streamlit apps and other places.

I still plan to create a data viewer with it for vscode IDE. Here is the repo I created that should not conflict in branding, but should give a good indication what it's for, and I plan to use Tabular v5.0 for the display parts there. I will have more info in issues there in weeks to come ... https://github.com/RandomFractals/tabular-data-viewer

[mangkang]

Hi,
Thanks for releasing V5. I am running into an issue with 2 lines of optional chaining code while trying to incorporate the library into a React project. This is similar to the build error from bundlephobia (https://bundlephobia.com/package/tabulator-tables). Is it possible to rewrite the 2 lines to ensure maximum compatibility (i am willing to create PR if needed) ?

Thanks.

./node_modules/tabulator-tables/dist/js/tabulator_esm.js 6146:93
Module parse failed: Unexpected token (6146:93)
File was processed with these loaders:

• ./node_modules/babel-loader/lib/index.js
  You may need an additional loader to handle the result of these loaders.
  | function progress(cell, onRendered, success, cancel, editorParams) {
  | var element = cell.getElement(),

  max = typeof editorParams.max === "undefined" ? element.getElementsByTagName("div")[0]?.getAttribute("max") || 100 : editorParams.max,

| min = typeof editorParams.min === "undefined" ? element.getElementsByTagName("div")[0]?.getAttribute("min") || 0 : editorParams.min,

[destradafilm]

I am also seeing the error that @mangkang is referring to in a Vue project

ERROR in ./node_modules/tabulator-tables/dist/js/tabulator_esm.js 6428:90
Module parse failed: Unexpected token (6428:90)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| 	min = typeof editorParams.min === "undefined" ? ( element.getElementsByTagName("div")[0]?.getAttribute("min") || 0) : editorParams.min,
| 	percent = (max - min) / 100,
> 	value = cell.getValue() || 0,
| 	handle = document.createElement("div"),
| 	bar = document.createElement("div"),
ℹ ｢wdm｣: Failed to compile.

[Pl4n3]

Hello,

I'm just testing 4.9 to 5.0 migration and it seems, that sort persistence doesnt work anymore:
http://tabulator.info/examples/5.0#persistence: change sort, reload, sort is reset
http://tabulator.info/examples/4.9#persistence: change sort, reload, sort stays changed

Another minor thing: http://tabulator.info/docs/5.0/persist contains 'persistentLayout:true', thats probably deprecated. :)

Greetings!

[destradafilm]

Hi, Thanks for releasing V5. I am running into an issue with 2 lines of optional chaining code while trying to incorporate the library into a React project. This is similar to the build error from bundlephobia (https://bundlephobia.com/package/tabulator-tables). Is it possible to rewrite the 2 lines to ensure maximum compatibility (i am willing to create PR if needed) ?

Thanks.

./node_modules/tabulator-tables/dist/js/tabulator_esm.js 6146:93 Module parse failed: Unexpected token (6146:93) File was processed with these loaders:

• ./node_modules/babel-loader/lib/index.js
  You may need an additional loader to handle the result of these loaders.
  | function progress(cell, onRendered, success, cancel, editorParams) {
  | var element = cell.getElement(),

  max = typeof editorParams.max === "undefined" ? element.getElementsByTagName("div")[0]?.getAttribute("max") || 100 : editorParams.max,

| min = typeof editorParams.min === "undefined" ? element.getElementsByTagName("div")[0]?.getAttribute("min") || 0 : editorParams.min,

@mangkang did you every find a workaround for this?

[mangkang]

@destradafilm Not without modifying the source code. See mangkang@b7c22d1.

I am currently using the CDN script version until Oli fixes this and the other issue with import.

@mangkang did you every find a workaround for this?

[olifolkerd]

Which version of node are you building on. This error suggests you are using an old version of node or an old version of Babel that does not understand the newer JavaScript syntax. You may need to update node or your build tools.

I am successfully building this on node 14 without any issues.

[ngduc]

@olifolkerd
I'm using node 15.5.0

[olifolkerd]

If you are on node 15 I would suggest checking your build tools, Babel specifically.

I'm not saying there isn't an issue. But I have successfully built this in numerous projects since its release which suggests it is more related to the environment that is trying to build it.

Optional property chaining is perfectly valid modern JavaScript so there must be something in the environment that is being used that is blocking it.

[destradafilm]

If you are on node 15 I would suggest checking your build tools, Babel specifically.

I'm not saying there isn't an issue. But I have successfully built this in numerous projects since its release which suggests it is more related to the environment that is trying to build it.

Optional property chaining is perfectly valid modern JavaScript so there must be something in the environment that is being used that is blocking it.

I'm on node v14.17.6, It looks like it might be a webpack version compatability. I think it will possibly work with Webpack 5
webpack/webpack#10227

But, It's not easy for me to upgrade to Webpack 5 right now as I'm on a big project and it will take some work to migrate so I was hoping there would be a fix for this one liner and I can work on Tabulator 5

@olifolkerd the bug I'm seeing is on a project that is on Vue but I'm importing the library and using it in my component the vanilla JS way

[grosscol]

I'm working with a Vue 3.0 project, and have run into the same issue.
Relevant versions: node 16.13, webpack 4.46, babel-loader 8.2.2. Vue-cli dictates the webpack and babel-loader version.

I went into node_modules/tabulator-tables/dist/js and renamed the _esm.js files to .jsm. This allowed the webpack build to complete, but doesn't get you to a running tabulator-table.

My guess is that the babel-loader isn't recognizing the files as ecma script modules and that renaming them with a .jsm extension provides the clue the loader needs to sort that out. It leads to another issue at runtime:

Uncaught TypeError: tabulator_tables__WEBPACK_IMPORTED_MODULE_3__.TabulatorFull is not a constructor

Going to see if vue-cli 5 with webpack 5 solves this issue.

[blounsbury-usbr]

Super noob to web development. I have an angular project and am trying to use Tabulator. The import of Tabulator works just fine, but I'm getting errors on trying to import FormatModule/EditModule or anything else (tabulator-tables has no exported member FormatModule). I'm sure it's something super simple I'm not doing as I don't know what I'm doing.

[mike-lischke]

Upgrade the @types/tabulator-tables module. I updated it yesterday to 5.0.1 and it contains now all the required exports.

[blounsbury-usbr]

@mike-lischke Hmm ... npm isn't picking up 5.0.1. How do I upgrade? I tried, npm install @types/tabulator-tables and npm install @types/tabulator-tables@5.0.1 and received this error:

[mike-lischke]

Strange. It was on npmjs.com already yesterday: https://www.npmjs.com/package/@types/tabulator-tables

[blounsbury-usbr]

Tried again. All working! Thanks!

[RandomFractals]

It's great! I put together this simple Observable JS notebook for those wanting to try it with some public data files:

https://observablehq.com/@randomfractals/tabular-data-viewer

[olifolkerd]

Hey @RandomFractals,

If you want to show of a cool project you have been working on, try submitting it to the Tabulator Ideas Repo

[olifolkerd]

Hi Everyone,

I have just released patch version 5.0.8 with a load of fixes for the bugs that have been raised.

Thanks for bearing with me the last month while i've been a bit quite, lots of things going on at home the last couple of months and i currently have covid (boooooo)

I will aim to get another patch release out in the next couple of weeks to clear through some more of the 5.0 upgrade niggles.

Cheers

Oli :)

[RandomFractals]

Hi @olifolkerd ,

I hope you are recovering and enjoying some time off.

Re:

If you want to show of a cool project you have been working on, try submitting it to the Tabulator Ideas Repo

The tool I've been working on is more than just a Tabulator idea. You can actually install and use it in vscode now for tabular data views.

I'll add it to the tabulator ideas repo later. Meanwhile, here is the link and a quick preview: https://marketplace.visualstudio.com/items?itemName=RandomFractalsInc.tabular-data-viewer

Merry Christmas! 🎄

[olifolkerd]

Hi Everyone,

I have just released patch version 5.0.9 with a load of fixes for the bugs that have been raised.

Cheers

Oli :)

[olifolkerd]

Hi Everyone,

I have just released patch version 5.0.10 with a load of fixes for the bugs that have been raised.

Cheers

Oli :)

[olifolkerd]

Hey Everyone,

It looks like most of the core upgrade niggles have been resolved now (fingers crossed)

So this is just a quick update to let you know i have started work on the 5.1 branch which should include a range of new features drawn directly from the feature requests in the issues list.

Im hoping to have 5.1 released by the end of Jan, and will fix some outstanding bugs in the release too.

Roadmap

Im putting a hold on the Trello Roadmap for a few months, as it was a bit misleading with the proposed deadlines slipping, so for the next few releases i will be looking to the feature requests on this repo to guide my development, so if you are looking for a new feature, dont forget to raise a Feature Request.

Once ive had a chance to catch up with things i will reinstate the roadmap to give some visibility to the future development path.

Contributing

Im also looking for devs out there to contribute to the project with PR's. Over the next couple of days i will be marking several issues with a "Help Needed" flag, if you fancy contributing to Tabulator, then why not start with one of those first.

If you would like to add a whole feature or module then please do, all i ask is that you follow the Contribution Guidelines and make sure you create an issue to discuss the feature with the community first before you submit your PR, remember that for a new feature to be included in the library it needs to be broadly useful to many users, not just help with a niche edge case.

Cheers

Oli :)

[mike-lischke]

/me is eagerly waiting for a way to determine if a row is expanded. Hope this is on the roadmap too!

[olifolkerd]

@mike-lischke if you want to see a feature you need to create a feature request so I can track it. I'm afraid I can't take feature requests from this general issue

Cheers

Oli :)

[mike-lischke]

Does this count: #3228 ;-)

[olifolkerd]

Perfect 👍