NativeScript utility to toggle a global css class. For example this would be useful to a manual dark/light mode toggle.

toggleGlobalClass.util.ts

import { Application, CSSUtils } from '@nativescript/core';

function toggleGlobalClass(className: string) {
  const rootView = Application.getRootView();
  const enabled = rootView.cssClasses.has(className);

  if (enabled) {
    CSSUtils.removeSystemCssClass(className);
    rootView.cssClasses.delete(className);
    // also remove from all modals
    rootView._getRootModalViews().forEach(view => {
      view.cssClasses.delete(className);
      view._onCssStateChange();
    });
  } else {
    CSSUtils.pushToSystemCssClasses(className);
    rootView.cssClasses.add(className);
    // also add to all modals
    rootView._getRootModalViews().forEach(view => {
      view.cssClasses.add(className);
      view._onCssStateChange();
    });
  }
  rootView._onCssStateChange();
}