/******************************************************************************
     Copyright:: 2022- IBM, Inc

    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.
 *****************************************************************************/
type PseudoClass = ":hover" | ":active" | ":focus" | ":focus-visible" | ":focus-within";
export declare class CSSUtil {
    static selectorMatchesElem(element: Element, selector: string): boolean;
    /**
     * Returns the style computed for this element
     * @param elem
     */
    static getComputedStyle(elem: HTMLElement, pseudoElt?: PseudoClass): CSSStyleDeclaration;
    /**
     * Parse and cache all stylesheet rules at the document level
     * Returns an array of parsed rule objects with selector and style information
     */
    private static getParsedStylesheetRules;
    /**
     * Private helper method to fill style maps from a CSSStyleDeclaration
     * Handles CSS property priorities and the "all" shorthand property
     */
    private static fillStyle;
    /**
     * Private helper method that consolidates the logic for getting defined styles
     * Used by both getDefinedStyles and getDefinedStylesMultiple
     */
    private static getDefinedStylesInternal;
    /**
     * Returns the style defined for this element for multiple pseudo-classes in a single pass
     *
     * This is more efficient than calling getDefinedStyles multiple times as it only
     * iterates through stylesheets once.
     *
     * @param {HTMLElement} elem
     * @param {string[]} props Properties for which we are looking for (allows us to skip elem matching unnecessarily)
     * @param {string[]} pseudoClasses - Array of pseudo-classes to retrieve. Use "" for default (no pseudo-class).
     * @returns {Object} Object mapping each pseudo-class to its defined styles
     */
    static getDefinedStylesMultiple(elem: HTMLElement, props: string[] | null, pseudoClasses: string[]): {};
    /**
     * Returns the style defined for this element
     *
     * This differs from the computed style in that the computed style will return
     * styles defined by the user agent. This will only return styles defined by the
     * application
     * if rotation transform is used, the computed style returns the resolved matrix
     *  while the defined style return the transform function(s)
     * for example, for 'transform: rotate(2.5deg);', the computed style returns 'matrix(-0.0436194, 0.999048, -0.999048, -0.0436194, 0, 0)'
     *  and the defined style returns 'rotate(2.5deg)'
     *
     * change the type of the parameter pseudoClass from PseudoClass to string to include both pseudo classes (e.g., :focus, :checked)
     * and pseudo elements (e.g., ::before, ::after).
     *
     * @param {HTMLElement} elem
     * @param {string[]} props Properties for which we are looking for (allows us to skip elem matching unnecessarily)
     * @param {string} [pseudoClass] If specified, will return values that are different
     * than when the pseudoClass does not match.
     */
    static getDefinedStyles(elem: HTMLElement, props: string[], pseudoClass?: string): any;
    /**
     * Returns the media query defined for the document
     * Get media orientation transforms from stylesheets with caching
     * Returns transform/rotate properties for elements within media queries
     *
     * @param {Document} doc
     */
    static getMediaOrientationTransform(doc: Document): any;
    /**
     * convert given rotation transform functions to the degree transformed.
     * If multiple functions are given, then the functions are applied linearly in the order.
     *   rotation_transform function example:  rotate(45deg), rotate(2turn), rotate(2rad), rotate3d(1, 1, 1, 45deg),
     *        rotate(2rad) rotate3d(1, 1, 1, 45deg)
     * @param rotation_transform
     */
    static getRotationDegree(rotation_transform: any): number;
    /**
     * Convert CSS style string values to pixels.
     *
     * @param value style value in string, such as 3rem, 230px etc.
     * @param target element.
     * @return value in pixels
     */
    static getPixelsFromStyle(value: any, elem: any): any;
    /**
     * Convert absolute CSS numerical values to pixels.
     *
     * @param unitValue in string
     * @param target element.
     * @return value in pixels
     */
    static convertValue2Pixels(unit: any, unitValue: any, elem: any): any;
    static isMaterialIconFont(elem: HTMLElement): boolean;
    static getWeightNumber(styleVal: any): any;
    static getFontInPixels(styleVal: any, elem: any): any;
    static getCSSStyle(element: any): any;
    /**
     * an "inline" CSS display property tells the element to fit itself on the same line. An 'inline' element's width and height are ignored.
     * some element has default inline property, such as <span>, <a>
     * most formatting elements inherent inline property, such as <em>, <strong>, <i>, <small>
     * other inline elements: <abbr> <acronym> <b> <bdo> <big> <br> <cite> <code> <dfn> <em> <i> <input> <kbd> <label>
     * <map> <object> <output> <q> <samp> <script> <select> <small> <span> <strong> <sub> <sup> <textarea> <time> <tt> <var>
     * an "inline-block" element still place element in the same line without breaking the line, but the element's width and height are applied.
     * inline-block elements: img, button, select, meter, progress, marguee, also in Chrome: textarea, input
     * A block-level element always starts on a new line, and the browsers automatically add some space (a margin) before and after the element.
     * block-level elements: <address> <article> <aside> <blockquote> <canvas> <dd> <div> <dl> <dt> <fieldset> <figcaption> <figure> <footer> <form>
     * <h1>-<h6> <header> <hr> <li> <main> <nav> <noscript> <ol> <p> <pre> <section> <table> <tfoot> <ul> <video>
     *
     * return: if it's inline element and { inline: true | false, text: true | false, violation: null | {node} }
     */
    static getInlineStatus(element: any): {
        inline: boolean;
        text: boolean;
        violation: any;
    };
    /**
     * a target is en element that accept a pointer action (click or touch)
     * a target is a browser default if it's a native widget (no user defined role) without user style
     */
    static isTargetBrowserDefault(element: any): boolean;
    static containsCKJ(text: string): boolean;
    /**
     * Return the ancestor with the given style properties.
     * Searches up the DOM tree to find an ancestor that has ALL specified style properties
     * with values matching the criteria.
     *
     * @param {element} elem - The element to start the node walk on to find parent node
     * @param {Object} styleProps - The style properties and values of the parent to search for.
     *         such as {"overflow":['auto', 'scroll'], "overflow-x":['auto', 'scroll']}
     *          or {"overflow":['*'], "overflow-x":['*']}, The '*' for any value to check the existence of the style prop.
     * @param {Array} excludedValues - style values that should be ignored.
     * @return {Element|null} - An ancestor element that has all the specified style properties, or null if none found
     * @memberOf CSSUtil
     */
    static getAncestorWithStyles(elem: any, styleProps: any, excludedValues?: any[]): any;
    /**
     * return an array [value, Unit] from a value-unit combo string
     * @param valueUnitCombo, such as 20px, 2rem
     * @returns
     */
    static getValueUnitPair(valueUnitCombo: any): any[];
}
export {};
