public render()

in src/UXClient/Components/EllipsisMenu/EllipsisMenu.ts [57:111]
49 lines of code
4 McCabe index (conditional complexity)

    public render (menuItems, options: any = {}) {
        this.menuIsVisible = false;
        this.chartOptions.setOptions(options);

        this.containerElement = d3.select(this.renderTarget).classed("tsi-ellipsisMenuContainer", true);
        this.setMenuItems(menuItems);
        d3.select(this.renderTarget).selectAll("*").remove();
        super.themify(this.containerElement, this.chartOptions.theme);

        let self = this;
        this.buttonElement = d3.select(this.renderTarget).insert("button")
            .attr("class", "tsi-ellipsisButton")
            .attr("aria-label", this.getString("Show ellipsis menu"))
            .attr("role", "menu")
            .attr("title", this.getString("Show ellipsis menu"))
            .attr("type", "button")
            .on("click", function () {
                d3.select(this).attr("aria-label", !self.menuIsVisible ? self.getString("Show ellipsis menu") : self.getString("Hide ellipsis menu"))
                               .attr("title", !self.menuIsVisible ? self.getString("Show ellipsis menu") : self.getString("Hide ellipsis menu"));
                self.setMenuVisibility(!self.menuIsVisible);
                if(self.menuIsVisible) {
                    self.focusOnMenuItem(0);
                }
            });
        
        this.menuElement = d3.select(this.renderTarget).insert("div")
            .attr("class", "tsi-ellipsisMenu");

        this.menuElement.selectAll(".tsi-ellipsisMenuItem").data(this.menuItems)
            .enter()
            .append("button")
            .classed("tsi-ellipsisMenuItem", true)
            .attr("aria-label", d => d.label)
            .attr("type", "button")
            .attr("role", "menuitem")
            .on('keydown', (d, i) => {this.menuItemKeyHandler(d, i)})
            .on("click", (d: any) => {
                d.action();
            })
            .each(function () {
                d3.select(this)
                    .append("div")
                    .attr("class", (d: any) => "tsi-ellipsisMenuIcon " + self.createIconPath(d.iconClass, self.chartOptions.theme));

                d3.select(this)
                    .append("div")
                    .classed("tsi-ellipsisMenuLabel", true)
                    .text((d: any) => d.label);
                    
                d3.select(this)
                    .append("div")
                    .classed("tsi-ellipsisMenuDescription", true)
                    .style("display", "none");
            });
    }