@aesthetic/core
TypeScript icon, indicating that this package has built-in type declarations

0.11.1 • Public • Published

Aesthetic - Core API

Build Status npm version npm deps

Unifies a design system and a CSS-in-JS engine into a powerful framework agnostic API.

import { Aesthetic } from '@aesthetic/core';
import dayTheme from './design/system/dayTheme';
import nightTheme from './design/system/nightTheme';

const aesthetic = new Aesthetic({
	defaultUnit: 'px',
	deterministicClasses: false,
});

// Register a theme (provided by the design system)
aesthetic.registerDefaultTheme('day', dayTheme);

// Register a theme that has global styles
aesthetic.registerTheme('night', nightTheme, (css) => ({
	'@root': css.mixin('root', {
		backgroundColor: css.var('palette-neutral-bg-base'),
		height: '100%',
	}),
}));

// Create a component style sheet
const styleSheet = aesthetic.createStyleSheet((css) => ({
	button: {
		textAlign: 'center',
		display: 'inline-block',
		padding: css.var('spacing-df'),
	},
}));

// Render the style sheet into the document
const classNames = aesthetic.renderStyleSheet(styleSheet);

Though the core API is framework agnostic and can be used stand-alone, it's encouraged to use a framework integration package for better ergonomics.

Features

Supports all features provided by unified packages, while also providing...

  • Register, manage, and activate themes, powered by the design system.
  • Automatically activates a theme based on a users preferences (color scheme, contrast, etc).
  • Scopes active theme styles and CSS variables to the body to avoid global scope pollution.
  • Factories and renders component and theme style sheets.
  • Supports color scheme, contrast, and theme variants for style sheets.
  • Renders font faces, keyframes, and CSS imports.
  • Handles server-side rendering and client-side hydration.
  • Integrates with the React framework.

Requirements

  • IE 11+

Installation

yarn add @aesthetic/core

Documentation

https://aestheticsuite.dev

Package Sidebar

Install

npm i @aesthetic/core

Weekly Downloads

3

Version

0.11.1

License

MIT

Unpacked Size

123 kB

Total Files

27

Last publish

Collaborators

  • milesj