@eirikk/svelte-masonry-layout/action.js

Svelte wrapper for [masonry-layout](https://masonry.desandro.com/)

import Masonry from 'masonry-layout';
import equal from 'lodash.isequal';
import { getMasonryOptionsFromParameters } from './util';
const defaultParams = {
    itemSelector: '.grid-item',
    alwaysReloadAndLayoutOnUpdate: true,
    initLayout: false
};
const masonry = ((node, parameters) => {
    const params = { ...defaultParams, ...parameters };
    let options = getMasonryOptionsFromParameters(params);
    function initialize(parameters) {
        const options = getMasonryOptionsFromParameters(parameters);
        const masonry = new Masonry(node, options);
        if (parameters.onInitialized) {
            masonry.once?.('layoutComplete', (items) => {
                return parameters.onInitialized?.(masonry, items);
            });
        }
        masonry.layout?.();
        if (parameters.onLayoutComplete) {
            masonry.on?.('layoutComplete', parameters.onLayoutComplete);
        }
        const observer = new MutationObserver(() => {
            if (parameters.alwaysReloadAndLayoutOnUpdate) {
                instance.reloadItems?.();
                instance.layout?.();
            }
            parameters.onUpdate?.(instance);
        });
        observer.observe(node, { childList: true });
        return [masonry, observer];
    }
    let [instance, observer] = initialize(params);
    return {
        update(newParameters) {
            const newParams = { ...defaultParams, ...newParameters };
            const newOptions = getMasonryOptionsFromParameters(newParams);
            const optionsChanged = !equal(options, newOptions);
            if (optionsChanged) {
                options = newOptions;
                instance.destroy?.();
                observer.disconnect();
                [instance, observer] = initialize(newParams);
            }
        },
        destroy() {
            observer.disconnect();
            instance.destroy?.();
        }
    };
});
export default masonry;