@nativescript/core/accessibility/accessibility-css-helper.js

import { Application } from '../application';
import { AccessibilityServiceEnabledObservable } from './accessibility-service';
import { FontScaleCategory, getCurrentFontScale, getFontScaleCategory, VALID_FONT_SCALES } from './font-scale';
// CSS-classes
const fontScaleExtraSmallCategoryClass = `a11y-fontscale-xs`;
const fontScaleMediumCategoryClass = `a11y-fontscale-m`;
const fontScaleExtraLargeCategoryClass = `a11y-fontscale-xl`;
const fontScaleCategoryClasses = [fontScaleExtraSmallCategoryClass, fontScaleMediumCategoryClass, fontScaleExtraLargeCategoryClass];
const a11yServiceEnabledClass = `a11y-service-enabled`;
const a11yServiceDisabledClass = `a11y-service-disabled`;
const a11yServiceClasses = [a11yServiceEnabledClass, a11yServiceDisabledClass];
let accessibilityServiceObservable;
let fontScaleCssClasses;
let currentFontScaleClass = '';
let currentFontScaleCategory = '';
let currentA11YServiceClass = '';
function ensureClasses() {
    if (accessibilityServiceObservable) {
        return;
    }
    fontScaleCssClasses = new Map(VALID_FONT_SCALES.map((fs) => [fs, `a11y-fontscale-${Number(fs * 100).toFixed(0)}`]));
    accessibilityServiceObservable = new AccessibilityServiceEnabledObservable();
}
function applyRootCssClass(cssClasses, newCssClass) {
    const rootView = Application.getRootView();
    if (!rootView) {
        return;
    }
    Application.applyCssClass(rootView, cssClasses, newCssClass);
    const rootModalViews = rootView._getRootModalViews();
    rootModalViews.forEach((rootModalView) => Application.applyCssClass(rootModalView, cssClasses, newCssClass));
}
function applyFontScaleToRootViews() {
    const rootView = Application.getRootView();
    if (!rootView) {
        return;
    }
    const fontScale = getCurrentFontScale();
    rootView.style.fontScaleInternal = fontScale;
    const rootModalViews = rootView._getRootModalViews();
    rootModalViews.forEach((rootModalView) => (rootModalView.style.fontScaleInternal = fontScale));
}
export function initAccessibilityCssHelper() {
    ensureClasses();
    Application.on(Application.fontScaleChangedEvent, () => {
        updateCurrentHelperClasses();
        applyFontScaleToRootViews();
    });
    accessibilityServiceObservable.on(AccessibilityServiceEnabledObservable.propertyChangeEvent, updateCurrentHelperClasses);
}
/**
 * Update the helper CSS-classes.
 * Return true is any changes.
 */
function updateCurrentHelperClasses() {
    const fontScale = getCurrentFontScale();
    const fontScaleCategory = getFontScaleCategory();
    const oldFontScaleClass = currentFontScaleClass;
    if (fontScaleCssClasses.has(fontScale)) {
        currentFontScaleClass = fontScaleCssClasses.get(fontScale);
    }
    else {
        currentFontScaleClass = fontScaleCssClasses.get(1);
    }
    if (oldFontScaleClass !== currentFontScaleClass) {
        applyRootCssClass([...fontScaleCssClasses.values()], currentFontScaleClass);
    }
    const oldActiveFontScaleCategory = currentFontScaleCategory;
    switch (fontScaleCategory) {
        case FontScaleCategory.ExtraSmall: {
            currentFontScaleCategory = fontScaleExtraSmallCategoryClass;
            break;
        }
        case FontScaleCategory.Medium: {
            currentFontScaleCategory = fontScaleMediumCategoryClass;
            break;
        }
        case FontScaleCategory.ExtraLarge: {
            currentFontScaleCategory = fontScaleExtraLargeCategoryClass;
            break;
        }
        default: {
            currentFontScaleCategory = fontScaleMediumCategoryClass;
            break;
        }
    }
    if (oldActiveFontScaleCategory !== currentFontScaleCategory) {
        applyRootCssClass(fontScaleCategoryClasses, currentFontScaleCategory);
    }
    const oldA11YStatusClass = currentA11YServiceClass;
    if (accessibilityServiceObservable.accessibilityServiceEnabled) {
        currentA11YServiceClass = a11yServiceEnabledClass;
    }
    else {
        currentA11YServiceClass = a11yServiceDisabledClass;
    }
    if (oldA11YStatusClass !== currentA11YServiceClass) {
        applyRootCssClass(a11yServiceClasses, currentA11YServiceClass);
    }
}
//# sourceMappingURL=accessibility-css-helper.js.map