@adaptabletools/adaptable/src/agGrid/AgGridThemeAdapter.js

Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements

import { DARK_THEME, LIGHT_THEME } from '../Utilities/Constants/GeneralConstants';
export class AgGridThemeAdapter {
    constructor(_adaptableInstance) {
        this._adaptableInstance = _adaptableInstance;
    }
    destroy() { }
    get logger() {
        return this._adaptableInstance.logger;
    }
    get api() {
        return this._adaptableInstance.api;
    }
    setAgGridThemeMode(themeMode) {
        this.agGridThemeMode = themeMode;
    }
    getAgGridThemeMode() {
        return this.agGridThemeMode;
    }
    applyAgGridThemeOnAdaptableThemeChange(adaptableTheme, variantTheme, agGridContainer, themesToRemove) {
        if (this.agGridThemeMode === 'legacy') {
            this.legacy_applyAgGridThemeOnAdaptableThemeChange(adaptableTheme, variantTheme, agGridContainer, themesToRemove);
        }
        const themeName = adaptableTheme.Name;
        const isSystemTheme = this.api.themeApi.internalApi.isSystemTheme(themeName);
        if (adaptableTheme && (isSystemTheme || variantTheme)) {
            if ((variantTheme || themeName) === LIGHT_THEME) {
                document.body.dataset.agThemeMode = adaptableTheme.AgThemeMode ?? 'light';
            }
            if ((variantTheme || themeName) === DARK_THEME) {
                document.body.dataset.agThemeMode = adaptableTheme.AgThemeMode ?? 'dark';
            }
        }
    }
    getAgGridContainerElement() {
        return this._adaptableInstance.getAgGridContainerElement();
    }
    legacy_applyAgGridThemeOnAdaptableThemeChange(adaptableTheme, variantTheme, agGridContainer, themesToRemove) {
        const themeName = adaptableTheme.Name;
        const isSystemTheme = this.api.themeApi.internalApi.isSystemTheme(themeName);
        const getAgGridLightThemeName = () => this.getAgGridLightThemeName();
        const getAgGridDarkThemeName = () => getAgGridLightThemeName() + '-dark';
        if (adaptableTheme && (isSystemTheme || variantTheme)) {
            if ((variantTheme || themeName) === LIGHT_THEME) {
                adaptableTheme.AgGridClassName =
                    adaptableTheme.AgGridClassName || getAgGridLightThemeName();
            }
            if ((variantTheme || themeName) === DARK_THEME) {
                adaptableTheme.AgGridClassName = adaptableTheme.AgGridClassName || getAgGridDarkThemeName();
            }
        }
        if (!adaptableTheme.AgGridClassName) {
            // default AG Grid to its light theme
            adaptableTheme.AgGridClassName = getAgGridLightThemeName();
        }
        if (agGridContainer != null) {
            if (themesToRemove.length) {
                themesToRemove.forEach((theme) => {
                    if (theme.AgGridClassName) {
                        agGridContainer.classList.remove(theme.AgGridClassName);
                    }
                });
            }
            // also remove all AG Grid theme class names
            const agGridClassNamesToRemove = [];
            agGridContainer.classList.forEach((x) => {
                if (x && x.indexOf('ag-theme-') === 0) {
                    agGridClassNamesToRemove.push(x);
                }
            });
            agGridClassNamesToRemove.forEach((x) => agGridContainer.classList.remove(x));
            if (adaptableTheme && adaptableTheme.AgGridClassName) {
                agGridContainer.classList.add(adaptableTheme.AgGridClassName);
            }
        }
    }
    getAgGridCurrentThemeClassNames() {
        if (this.agGridThemeMode === 'legacy') {
            this.legacy_getAgGridCurrentThemeClassNames();
        }
        const currentAgGridTheme = this._adaptableInstance.agGridAdapter.getGridOption('theme');
        if (currentAgGridTheme === 'legacy') {
            return this.legacy_getAgGridCurrentThemeClassNames();
        }
        // @ts-ignore no other way than to use internals
        const currentAgGridTheme__cssClassCache = currentAgGridTheme?._cssClassCache;
        return currentAgGridTheme__cssClassCache ?? '';
    }
    getAgGridLightThemeName() {
        const container = this.getAgGridContainerElement();
        if (container && container.classList) {
            // we detect the ag theme class
            const classList = container.classList;
            for (let i = 0, len = classList.length; i < len; i++) {
                const cls = classList[i];
                if (cls.indexOf('ag-theme-') === 0) {
                    // even if dark theme is included, we compute the light theme name out of it
                    return cls.replace('-dark', '');
                }
            }
        }
        else {
            this.logger.warn('No AgGrid container found, defaulting to ag-theme-balham for the light theme');
        }
        this.logger.warn('No ag-theme- class found on the grid container, defaulting to ag-theme-balham');
        // fallback to the default light theme
        return 'ag-theme-balham';
    }
    legacy_getAgGridCurrentThemeClassNames() {
        const container = this.getAgGridContainerElement();
        if (container && container.classList) {
            // we detect the ag theme class
            const classList = container.classList;
            for (let i = 0, len = classList.length; i < len; i++) {
                const cls = classList[i];
                if (cls.indexOf('ag-theme-') === 0) {
                    return cls;
                }
            }
        }
        return this.getAgGridLightThemeName();
    }
}