import { ReactiveController, ReactiveControllerHost } from 'lit'; import { SbbElementInternalsMixinType } from '../mixins.ts'; export declare const SbbMediaQueryForcedColors = "(forced-colors: active)"; export declare const SbbMediaQueryDarkMode = "(prefers-color-scheme: dark)"; export declare const SbbMediaQueryHover = "(any-hover: hover)"; export declare const SbbMediaQueryPointerCoarse = "(pointer: coarse)"; export declare const SbbMediaQueryBreakpointZeroAndAbove: string; export declare const SbbMediaQueryBreakpointSmallAndAbove: string; export declare const SbbMediaQueryBreakpointLargeAndAbove: string; export declare const SbbMediaQueryBreakpointUltraAndAbove: string; export declare const SbbMediaQueryBreakpointSmallAndBelow: string; export declare const SbbMediaQueryBreakpointLargeAndBelow: string; /** * A callback, which is invoked when the associated media query match * status changes. */ export type SbbMediaMatcherHandler = (matches: boolean) => void; /** * This controller allows listening to media query changes. * * @example * new SbbMediaMatcherController(this, { * [SbbForcedColorsQuery]: (matches) => doSomething(matches), * }) */ export declare class SbbMediaMatcherController implements ReactiveController { private _queries; constructor(host: ReactiveControllerHost, _queries: Record); /** * Returns whether the given query matches. Returns null with SSR. * @param query The query to check against. * @returns Whether the query matches or null with SSR. */ matches(query: string): boolean | null; hostConnected(): void; hostDisconnected(): void; } /** * A specialized version of the SbbMediaMatcherController, which * takes the color-scheme CSS property into account when determining * the dark mode state and updates a :state(dark) on the host. * * @example * new SbbDarkModeController(this, (isDarkMode) => doSomething(isDarkMode)); */ export declare class SbbDarkModeController extends SbbMediaMatcherController { private _host; /** The current mode based on the class attribute of the element. */ private static _currentMode; /** MutationObserver that observes the "class" attribute of the element. */ private static readonly _observer; private static readonly _observerConfig; private readonly _onChangeWithStateUpdater; constructor(_host: ReactiveControllerHost & HTMLElement & SbbElementInternalsMixinType, onChange: SbbMediaMatcherHandler); private static _readLightDarkClass; /** * Requests an update of the dark mode state. This is needed when the color-scheme * CSS property changes, as the media query does not pick this up automatically. */ static requestUpdate(): void; hostConnected(): void; hostDisconnected(): void; matches(): boolean; } //# sourceMappingURL=media-matchers-controller.d.ts.map