gd-bs/build/components/tooltipGroup/index.js

Bootstrap JavaScript, TypeScript and Web Components library.

import { Base } from "../base";
import { Tooltip, } from "../tooltip";
import { HTML } from "./templates";
/**
 * Tooltip Group
 * @property props - The tooltip group properties.
 */
class _TooltipGroup extends Base {
    // Constructor
    constructor(props, template = HTML, btnTemplate) {
        super(template, props);
        this._tooltips = null;
        // Configure the tooltip group
        this.configure(btnTemplate);
        // Configure the parent
        this.configureParent();
    }
    // Configure the tooltip group
    configure(btnTemplate) {
        // Set the attributes
        this.props.id ? this.el.id = this.props.id : null;
        this.props.label ? this.el.setAttribute("aria-label", this.props.label) : null;
        // Set the class names
        this.el.classList.add(this.props.isVertical ? "btn-group-vertical" : "btn-group");
        this.props.isLarge ? this.el.classList.add("btn-group-lg") : null;
        this.props.isSmall ? this.el.classList.add("btn-group-sm") : null;
        // Render the tooltips
        this.renderTooltips(btnTemplate);
    }
    // Render the tooltips
    renderTooltips(btnTemplate) {
        // Clear the tooltips
        this._tooltips = [];
        // Parse the tooltips
        let tooltips = this.props.tooltips || [];
        for (let i = 0; i < tooltips.length; i++) {
            // Render the tooltip
            this.renderTooltip(tooltips[i], btnTemplate);
        }
    }
    // Renders a tooltip
    renderTooltip(props, btnTemplate) {
        // Set the properties
        props.options = props.options || this.props.tooltipOptions;
        props.placement = props.placement || this.props.tooltipPlacement;
        props.type = props.type || this.props.tooltipType;
        // See if the button props exists
        if (props.btnProps) {
            // Set the button type
            props.btnProps.type = props.btnProps.type || this.props.buttonType;
        }
        // Create the tooltip
        let tooltip = Tooltip(props, btnTemplate);
        this._tooltips.push(tooltip);
        // Append the tooltip to the group
        this.el.appendChild(tooltip.el);
    }
    /**
     * Public Interface
     */
    // Adds a button to the group
    add(props, tooltipTemplate) {
        // Render the tooltip
        this.renderTooltip(props);
    }
    // Reference to the tooltips
    get tooltips() { return this._tooltips; }
}
export const TooltipGroup = (props, template, tooltipTemplate) => { return new _TooltipGroup(props, template, tooltipTemplate); };