(function () {
    // Adds Atlassian shapes
    Sidebar.prototype.addChartsPalette = function () {
        var s = 'html=1;shadow=0;dashed=0;shape=mxgraph.atlassian.';
        var s2 = 'html=1;shadow=0;dashed=0;fillColor=none;strokeColor=none;shape=mxgraph.bootstrap.rect;';
        var s3 = mxConstants.STYLE_STROKEWIDTH + '=1;shadow=0;dashed=0;align=center;html=1;' + mxConstants.STYLE_SHAPE + "=mxgraph.mockup.";
        var gn = 'mxgraph.charts';
        var dt = 'charts ';
        var sb = this;
        this.setCurrentSearchEntryLibrary('charts');

        const now = () => Date.now
        var fns = [
            this.addEntry('charts', mxUtils.bind(this, function () {
                const nodeId = `echarts__${ now() }`
                var cell = new mxCell(`<div style="color: red" id="${ nodeId }">${ now() }</div>`, new mxGeometry(0, 0, 160, 20), 'text;html=1;strokeColor=none;fillColor=none;align=center;verticalAlign=middle;whiteSpace=wrap;overflow=hidden;');
                cell.setVertex(true)
                return this.createVertexTemplateFromCells([cell], cell.geometry.width, cell.geometry.height, 'charts');
            })),
        ];

        this.addPalette('charts', '图表', false, mxUtils.bind(this, function (content) {
            for (var i = 0; i < fns.length; i++) {
                content.appendChild(fns[i](content));
            }
        }));

        this.setCurrentSearchEntryLibrary();
    };
})();