import { MaybeThunk, MaybeArray, Falsy, Directive, CSSRules, CSSAtKeyframes, CSSProperties, Context } from 'twind'; export * from 'twind'; /** * [[include:src/css/README.md]] * * @packageDocumentation * @module twind/css */ interface CSSFactory { (strings: TemplateStringsArray, ...interpolations: readonly MaybeThunk>[]): Directive; (tokens: MaybeThunk>): Directive; (...tokens: readonly MaybeThunk[]): Directive; } declare const css: CSSFactory; /** * * ```js * const bounce = keyframes({ * 'from, 20%, 53%, 80%, to': { * transform: 'translate3d(0,0,0)', * }, * '40%, 43%': { * transform: 'translate3d(0, -30px, 0)', * }, * '70%': { * transform: 'translate3d(0, -15px, 0)', * }, * '90%': { * transform: 'translate3d(0, -4px, 0)', * } * }) * * css({ * animation: `${bounce} 1s ease infinite`, * }) * ``` * @param waypoints */ declare const keyframes: CSSFactory; /** * * ```js * const bounce = animation('1s ease infinite', { * 'from, 20%, 53%, 80%, to': { * transform: 'translate3d(0,0,0)', * }, * '40%, 43%': { * transform: 'translate3d(0, -30px, 0)', * }, * '70%': { * transform: 'translate3d(0, -15px, 0)', * }, * '90%': { * transform: 'translate3d(0, -4px, 0)', * } * }) * ``` */ interface Animation { (value: string | CSSRules | ((context: Context) => string)): CSSFactory; (value: string | CSSRules | ((context: Context) => string), waypoints: CSSAtKeyframes | Directive): Directive; } declare const animation: Animation; interface Screen { (size: string): Directive; (size: string, css: Directive | MaybeArray): Directive; } declare const screen: Screen; export { Animation, CSSFactory, Screen, animation, css, keyframes, screen }; //# sourceMappingURL=css.d.ts.map