@vizzuality/layer-manager-react/dist/layer.js

## Installation ```sh # with Yarn yarn add @vizzuality/layer-manager-react

"use strict";
var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
/* eslint-disable react/default-props-match-prop-types */
const react_1 = require("react");
const es6_1 = __importDefault(require("fast-deep-equal/es6"));
// @ts-ignore
const js_deep_equals_1 = require("js-deep-equals");
const layer_manager_utils_1 = require("@vizzuality/layer-manager-utils");
class Layer extends react_1.PureComponent {
    constructor() {
        super(...arguments);
        this.add = () => {
            const _a = this.props, { layerManager, onAfterAdd } = _a, props = __rest(_a, ["layerManager", "onAfterAdd"]);
            const { source, render, params, sqlParams, } = props;
            const sourceParsed = source.parse === false
                ? source
                : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(source), params, sqlParams));
            const renderParsed = (render === null || render === void 0 ? void 0 : render.parse) === false
                ? render
                : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(render), params, sqlParams));
            layerManager.add(Object.assign(Object.assign({}, props), { source: sourceParsed, render: renderParsed }), {}, onAfterAdd || Layer.defaultProps.onAfterAdd);
        };
        this.update = (changedProps) => {
            const { layerManager, id } = this.props;
            layerManager.update(id, changedProps);
        };
        this.remove = () => {
            const { layerManager, id, onAfterRemove } = this.props;
            layerManager.remove(id, (layerModel) => {
                if (onAfterRemove)
                    onAfterRemove(layerModel);
            });
        };
    }
    componentDidMount() {
        this.add();
    }
    componentDidUpdate(prevProps) {
        const { source: prevSource, render: prevRender, params: prevParams, sqlParams: prevSqlParams, opacity: prevOpacity, visibility: prevVisibility, zIndex: prevZIndex, deck: prevDeck, } = prevProps;
        const { type, source, render, params, sqlParams, opacity, visibility, zIndex, deck, } = this.props;
        // Check that source has changed
        const prevSourceParsed = (prevSource === null || prevSource === void 0 ? void 0 : prevSource.parse) === false
            ? prevSource
            : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(prevSource), prevParams, prevSqlParams));
        const sourceParsed = source.parse === false
            ? source
            : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(source), params, sqlParams));
        // Check that render has changed
        const prevRenderParsed = (prevRender === null || prevRender === void 0 ? void 0 : prevRender.parse) === false
            ? prevRender
            : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(prevRender), prevParams, prevSqlParams));
        const renderParsed = (render === null || render === void 0 ? void 0 : render.parse) === false
            ? render
            : JSON.parse((0, layer_manager_utils_1.replace)(JSON.stringify(render), params, sqlParams));
        // TODO: don't add and remove if provider is geojson
        if (sourceParsed && !(0, es6_1.default)(sourceParsed, prevSourceParsed)) {
            const { type: sourceType, data } = sourceParsed;
            const t = sourceType || type;
            if (t === 'raster' || t === 'vector' || (t === 'geojson' && typeof data === 'string')) {
                this.remove();
                this.add();
                // prevent updating layer
                return;
            }
        }
        if (renderParsed && !(0, es6_1.default)(renderParsed, prevRenderParsed)) {
            const { layers = [] } = renderParsed;
            const { layers: prevLayers = [] } = prevRenderParsed;
            if (layers.length !== prevLayers.length) {
                this.remove();
                this.add();
                // Prevent updating layer
                return;
            }
        }
        const changedProps = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, (opacity !== prevOpacity && {
            opacity,
        })), (visibility !== prevVisibility && {
            visibility,
        })), (zIndex !== prevZIndex && {
            zIndex,
        })), (!(0, es6_1.default)(sourceParsed, prevRenderParsed) && {
            source: sourceParsed,
        })), (!(0, es6_1.default)(renderParsed, prevRenderParsed) && {
            render: renderParsed,
        })), (!(0, js_deep_equals_1.compare)(deck, prevDeck) && {
            deck,
        }));
        if (!(0, layer_manager_utils_1.isEmpty)(changedProps)) {
            this.update(changedProps);
        }
    }
    componentWillUnmount() {
        this.remove();
    }
    render() {
        return null;
    }
}
// eslint-disable-next-line react/static-property-placement
Layer.defaultProps = {
    params: undefined,
    sqlParams: undefined,
    opacity: 1,
    visibility: true,
    zIndex: undefined,
    source: {},
    render: {},
    deck: [],
    onAfterAdd: () => null,
};
exports.default = Layer;
//# sourceMappingURL=layer.js.map