This library provides a set of utilities extending the csstype
package to help you write typed CSS in TypeScript.
Currently, there's basic support for the following W3C standards:
css-conditional-3
): Editor's Draft, CRSmediaqueries-5
): Editor's Draft, WDnpm install @neoncitylights/typed-css-utils
Auto-generated API documentation is available.
Note: The public API below is an excerpt and shows the main symbols that a developer is likely to use.
fn
: # cssSupports(property, value): boolean • source, docsfn
: # matchMediaFeature(mediaFeature, value): MediaQueryList • source, docsT
: # cssSupports.CSSProperty • source, docsT
: # cssSupports.CSSPropertyValue • source, docsT
: # matchMedia.MqFeature • source, docsT
: # matchMedia.MqFeatureValue • source, docsI
: # matchMedia.MediaQueries • source, docsUsing TypeScript, you can receive type intelliSense, which provides autocomplete suggestions for:
csstype
)prefers-color-scheme
, aspect-ratio
)import { matchMediaFeature, cssSupports } from '@neoncitylights/typed-css-utils';
// equivalent to window.matchMedia('(prefers-color-scheme: dark)');
const userPrefersDark: MediaQueryList = matchMediaFeature('prefers-color-scheme', 'dark');
// TypeScript support, which provides strongly typed CSS property
// names and values using the `csstype` package
const supportsGrid: boolean = cssSupports('display', 'grid');
const supportsFlex: boolean = cssSupports('display', 'flex');
This library is licensed under the MIT License.
Generated using TypeDoc