@atlaskit/primitives/dist/types/xcss/xcss.d.ts

Primitives are token-backed low-level building blocks.

import type { CSSPropertiesWithMultiValues, SerializedStyles } from '@emotion/serialize';
import type * as CSS from 'csstype';
import type { MediaQuery } from '../responsive/types';
import type { TokenisedProps } from './tokenised-props';
import { uniqueSymbol } from './unique-symbol';
type AllMedia = MediaQuery | '@media screen and (forced-colors: active), screen and (-ms-high-contrast: active)' | '@media (prefers-color-scheme: dark)' | '@media (prefers-color-scheme: light)' | '@media (prefers-reduced-motion: reduce)';
type CSSMediaQueries = {
    [MQ in AllMedia]?: Omit<SafeCSSObject, AllMedia>;
};
type ChainedCSSPseudos = ':visited:active' | ':visited:hover' | ':active:visited' | ':hover::before' | ':focus::before' | ':hover::after' | ':focus-visible::before' | ':focus-visible::after' | ':focus:not(:focus-visible)';
type CSSPseudos = {
    [Pseudo in CSS.Pseudos | ChainedCSSPseudos]?: Omit<SafeCSSObject, CSS.Pseudos | AllMedia>;
};
type AtRulesWithoutMedia = Exclude<CSS.AtRules, '@media'>;
type CSSAtRules = {
    [AtRule in AtRulesWithoutMedia as `${AtRule}${string}`]?: Omit<SafeCSSObject, AtRulesWithoutMedia>;
};
type SafeCSSObject = CSSPseudos & CSSAtRules & TokenisedProps & CSSMediaQueries & Omit<CSSPropertiesWithMultiValues, keyof TokenisedProps>;
export type XCSS = ReturnType<typeof xcss>;
/**
 * ### xcss
 *
 * `xcss` is a safer, tokens-first approach to CSS-in-JS. It allows token-backed values for
 * CSS application.
 *
 * ```tsx
 * const styles = xcss({
 *   padding: 'space.100'
 * })
 * ```
 *
 * @deprecated Use `@atlaskit/css` with `@atlaskit/primitives/compiled` instead.
 * {@link https://hello.atlassian.net/wiki/spaces/DST/pages/4992259434/Guidance+Migrating+to+atlaskit+css+from+xcss Internal documentation for migration; no external access}
 */
export declare function xcss(style: SafeCSSObject): {
    readonly [uniqueSymbol]: SerializedStyles;
};
export {};