Migration Guide to 1.x
Major Change List
controls/plugins (extensions)... read below for more info
@deprecated Code (removed)
Grid Menu / Column Picker
onColumnsChanged
removedcolumns
property from Column Picker options, rename tovisibleColumns
instead.onColumnsChanged
removedcolumns
property from Grid Menu options, rename tovisibleColumns
instead.
Tree Data
removed
findItemInHierarchicalStructure()
method, usefindItemInTreeStructure
instead.
Changes
SlickGrid Controls/Plugins (Extensions)
Every SlickGrid controls/plugins were rewritten and moved into Slickgrid-Universal (prior to this new release, we were using them directly from SlickGrid repo and we had Extension bridges/wrappers in Slickgrid-Universal but that is now thing of the past since their entire code exist in Slickgrid-Universal), they were also rewritten as plain vanilla JS (basically there's no more jQuery code with exception of Draggable Grouping which still require jQueryUI). It's also much easier to maintain (we no longer have to wait for the SlickGrid project to release a version) and we can also modify and add extra features, styling, etc...
Because of all the rewriting, it makes sense to rename the method getSlickgridAddonInstance
to getExtensionInstanceByName
and it now returns the instance directly and as a bonus it now also automatically infers the correct return instance class as well.
Here's an example of the code change that you need to do
Grid Menu customItems
renamed to commandItems
Replace all custom...
properties to command...
properties to align with all other menu plugins (CellMenu, ContextMenu, GridMenu, HeaderMenu are all using commands)
replace
customItems
bycommandItems
replace
customTitle
bycommandTitle
replace
customTitleKey
bycommandTitleKey
Images are removed in favor of CSS classes
Another change possible the full plugin rewrite, all images related code were removed in favor of CSS classes only (that already existed and was always favored).
removed
deleteIconImage
, just usedeleteIconCssClass
instead.removed
groupIconImage
, just usegroupIconCssClass
instead.removed
buttonImage
, just usebuttonCssClass
instead.removed
iconImage
, just useiconCssClass
insteadremoved
image
, just usecssClass
instead
What if you still want images?
If you really want to use image, you can still work around that the new limitation by adding a CSS class similar to this: background-image: url(images/my-image.gif);
CSS/SASS Styling Changes
All SASS variables were renamed to add the $slick-...
prefix
the prefix is to avoid conflicts with other frameworks (CSS variables were already including this prefix, so no changes there)
there is only 1 small exception with
$primary-color
(to avoid too many styling changes) but even then there's also a new variable$slick-primary-color
Simplify CSS
To simplify and merge all menu styling together (now doable since all controls/plugins now exists in the lib source code), all the following CSS class names got changed with what is shown below
rename
title
toslick-menu-title
(to avoid other framework conflicts)rename
slick-cell-menu-command-list
toslick-menu-command-list
rename
slick-cell-menu-option-list
toslick-menu-option-list
rename
slick-cell-menu-item
toslick-menu-item
rename
slick-cell-menu-content
toslick-menu-content
rename
slick-context-menu-command-list
toslick-menu-command-list
rename
slick-context-menu-option-list
toslick-menu-option-list
rename
slick-context-menu-item
toslick-menu-item
rename
slick-context-menu-content
toslick-menu-content
rename
slick-header-menu-item
toslick-menu-item
rename
slick-header-menu-content
toslick-menu-content
rename
slick-grid-menu-item
toslick-menu-item
rename
slick-grid-menu-content
toslick-menu-content
rename
slick-grid-menu-command-list
toslick-menu-command-list
rename
slick-grid-menu-option-list
toslick-menu-option-list
rename
slick-grid-menu-list
toslick-column-picker-list
rename
slick-columnpicker
toslick-column-picker
rename
slick-columnpicker-list
toslick-column-picker-list
remove or rename
slick-gridmenu-list
toslick-column-picker-list
we merge the Column Picker & Grid Menu column picker classes, read the note below
NOTE: for simplification, it also means that all SASS/CSS variables got merged as well (e.g.: $slick-cell-menu-item-disabled-color
got merged to a common $slick-menu-item-disabled-color
), another change was to merge all the Grid Menu column picker & Column Picker variables with same styling (e.g.: $slick-grid-menu-checkbox-icon-checked
is now $slick-column-picker-checkbox-icon-checked
for both extensions)
Last updated