A module to lay out a group of elements in an autocolumns-style (i.e., masonry) grid.
npm install --save @squarespace/layout-autocolumns;
const Autocolumns = ;const grid = rootNodeconfig;
If you prefer to handle transpiling and polyfilling on your own, you can import ES6 from Mercury:
Alternately, Autocolumns specifies a
module property in
package.json that points to the uncompiled
src/index.js, so you may be able to simply import
@squarespace/layout-autocolumns if you're using one of the following bundlers:
Node- Wrapper around the whole grid (required)
Object- Config object
String- Class name of the elements to be placed (required)
String- Class name of the parent wrapper around each image
Number- Space between each item (in pixels; default
Number- Smallest number of columns the modules will create (default
Number- Largest number of columns the module will create (default
Number- Minimum width for each column (in pixels; default
Function- Callback function run after each child is loaded
Boolean- Set to
truefor the module to handle image loading (default
Lays out the grid with existing parameters. Can also pass new parameters when called.
Function to call after resize event. Calls
Resets styles on all children.
Resets styles on wrapper and all children and removes the module classes.