@master/css 2.0.0-beta.9 → 2.0.0-beta.91

package/README.md

@@ -1,118 +1,103 @@
-<br><br>
+<br>
 <div align="center">
 
 <p align="center">
-    <img src="https://raw.githubusercontent.com/master-co/package/document/images/logo-and-text.svg" alt="logo" width="142">
+    <a href="https://css.master.co">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/33840671/201701649-3bb7d698-abec-4d5f-ac30-ccc4d7bafcd4.svg">
+            <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/33840671/201703010-77bf2373-9899-40cc-98f5-30cf9b546941.svg">
+            <img alt="Master CSS" src="https://user-images.githubusercontent.com/33840671/201703010-77bf2373-9899-40cc-98f5-30cf9b546941.svg" width="100%">
+        </picture>
+    </a>
 </p>
+<p align="center"><!-- package.description -->A Virtual CSS language with enhanced syntax ~15KB<!----></p>
+
 <p align="center">
-    <b><!-- name -->CSS<!----></b>
+    <a aria-label="GitHub release (latest by date including pre-releases)" href="https://github.com/master-co/css/releases">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/github/v/release/master-co/css?include_prereleases&color=212022&label=&style=for-the-badge&logo=github&logoColor=fff">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/github/v/release/master-co/css?include_prereleases&color=f6f7f8&label=&style=for-the-badge&logo=github&logoColor=%23000">
+            <img alt="NPM Version" src="https://img.shields.io/github/v/release/master-co/css?include_prereleases&color=f6f7f8&label=&style=for-the-badge&logo=github">
+        </picture>
+    </a>
+    <a aria-label="NPM Package" href="https://www.npmjs.com/package/@master/css">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/npm/dm/@master/css?color=212022&label=%20&logo=npm&style=for-the-badge">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/npm/dm/@master/css?color=f6f7f8&label=%20&logo=npm&style=for-the-badge">
+            <img alt="NPM package ( download / month )" src="https://img.shields.io/npm/dm/@master/css?color=f6f7f8&label=%20&logo=npm&style=for-the-badge">
+        </picture>
+    </a>
+    <a aria-label="JSDelivr" href="https://www.jsdelivr.com/package/npm/@master/css">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/jsdelivr/npm/hm/@master/css?color=212022&label=%20&logo=jsdelivr&style=for-the-badge">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/jsdelivr/npm/hm/@master/css?color=f6f7f8&label=%20&logo=jsdelivr&style=for-the-badge">
+            <img alt="JSDelivr hits (npm scoped)" src="https://img.shields.io/jsdelivr/npm/hm/@master/css?color=f6f7f8&label=%20&logo=jsdelivr&style=for-the-badge">
+        </picture>
+    </a>
+    <a aria-label="Discord Community" href="https://discord.gg/sZNKpAAAw6">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/discord/917780624314613760?color=212022&label=%20&logo=discord&style=for-the-badge">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/discord/917780624314613760?color=f6f7f8&label=%20&logo=discord&style=for-the-badge">
+            <img alt="Discord online" src="https://img.shields.io/discord/917780624314613760?color=f6f7f8&label=%20&logo=discord&style=for-the-badge">
+        </picture>
+    </a>
+    <a aria-label="Follow @mastercorg" href="https://twitter.com/mastercorg">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/static/v1?label=%20&message=twitter&color=212022&logo=twitter&style=for-the-badge">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/static/v1?label=%20&message=twitter&color=f6f7f8&logo=twitter&style=for-the-badge">
+            <img alt="Follow @mastercorg" src="https://img.shields.io/static/v1?label=%20&message=twitter&color=f6f7f8&logo=twitter&style=for-the-badge">
+        </picture>
+    </a>
+    <a aria-label="Github Actions" href="https://github.com/1aron/repo/actions/workflows/release.yml">
+        <picture>
+            <source media="(prefers-color-scheme: dark)" srcset="https://img.shields.io/github/actions/workflow/status/master-co/css/release.yml?branch=beta&label=%20&message=twitter&color=212022&logo=githubactions&style=for-the-badge">
+            <source media="(prefers-color-scheme: light)" srcset="https://img.shields.io/github/actions/workflow/status/master-co/css/release.yml?branch=beta&label=%20&message=twitter&color=f6f7f8&logo=githubactions&style=for-the-badge&logoColor=%23000">
+            <img alt="Github release actions" src="https://img.shields.io/github/actions/workflow/status/master-co/css/release.yml?branch=beta&label=%20&message=twitter&color=f6f7f8&logo=githubactions&style=for-the-badge&logoColor=%23000">
+        </picture>
+    </a>
 </p>
-<p align="center"><!-- package.description -->A Virtual CSS language with enhanced syntax. ~13KB<!----></p>
-
-[![MIT License](https://flat.badgen.net/github/license/master-co/css?color=yellow)](https://github.com/master-co/css/blob/main/LICENSE)
-[![Latest Release](https://flat.badgen.net/npm/v/@master/css?icon=npm&label&color=yellow)](https://www.npmjs.com/package/@master/css)
-[![Bundle Size](https://flat.badgen.net/bundlephobia/minzip/@master/css?icon=packagephobia&label&color=yellow)](https://bundlephobia.com/package/@master/css 'gzip bundle size (including dependencies)')
-[![Package Size](https://flat.badgen.net/badgesize/brotli/https://cdn.jsdelivr.net/npm/@master/css?icon=jsdelivr&label&color=yellow)](https://unpkg.com/@master/css 'brotli package size (without dependencies)')
-[![Documentation](https://flat.badgen.net/badge/icon/Documentation?icon=awesome&label&color=yellow)](https://css.master.co)
-[![Github](https://flat.badgen.net/badge/icon/master-co%2Fcss?icon=github&label&color=yellow)](https://github.com/master-co/css)
-[![Discord](https://flat.badgen.net/badge/icon/discord?icon=discord&label&color=yellow)](https://discord.gg/sZNKpAAAw6)
-[![CI](https://flat.badgen.net/github/status/master-co/css/main/ci/circleci?icon=circleci)](https://circleci.com/gh/master-co/workflows/css/tree/main)
 
 </div>
 
-![image](https://raw.githubusercontent.com/master-co/css-language-service/alpha/images/cover.jpg)
-
-- Visit [css.master.co](https://css.master.co) for full documentation.
-- Browse our [discussion community](https://github.com/master-co/css/discussions).
-- Join our [discord channel](https://discord.gg/sZNKpAAAw6).
-- Follow our [twitter](https://twitter.com/mastercorg).
-
-##### On this page
-
-- [Features](#features)
-- [Why Master CSS](#why-master-css)
-- [Quick Start](#quick-start)
-- [Developer Tools](#developer-tools)
-- [Inspiration](#inspiration)
-- [Related](#related)
-
-# Features
-Let's have a quick overview of the **groundbreaking features** of Master CSS:
-
-- 🔥 A whole new **CSS language** instead of utilities/libraries.
-- 🔓 Write CSS properties, functions, selectors and even media queries directly in `class="..."`.
-- 🧠 Automatically generate corresponding CSS rules based on class names.
-- 💖 With enhanced CSS syntax, you can **build UIs with less code**.
-- ⚡️ Directly use **performant JIT in production**. **~13KB**
-- 🧬 [An enhanced and structured CSS syntax](https://docs.master.co/css/syntax-tutorial) for class names.
-- 🌈 [A forerunner to syntax highlighting](https://docs.master.co/css/why-master-css#a-forerunner-to-syntax-highlighting) for class names.
-- ✨ [Hybrid Rendering](https://docs.master.co/css/hybrid-rendering) that allows you to **pre-generate CSS from HTML on the server side**, and then continue to **use JIT on the client side**.
-- ✨ [Group Styles](https://docs.master.co/css/syntax-tutorial#group-styles) that allows you to extract the same selectors and media query styles and make it short.
-- ✨ [Reactive Styles](https://docs.master.co/css/syntax-tutorial#style-an-element-based-on-target-state) that allows you to style an element based on parent/sibling state.
-
-To learn more, check out the [documentation](https://docs.master.co/css/why-master-css).
-
-# [Why Master CSS](https://docs.master.co/css/why-master-css)
-A brief introduction starts by giving you an understanding of **markup-driven CSS**.
-
-😐 Traditional
-```html
-<style>
-    .home-section {
-        background-color: blue;
-        padding: 2rem;
-        text-align: center;
-    }
-
-    .home-section:hover {
-        background-color: red;
-    }
-
-    @media (min-width: 1024px) {
-        .home-section {
-            padding: 3rem;
-        }
-    }
-</style>
-
-<section class="home-section">...</section>
-```
-🤩 Now, refactor it with a whole new CSS language to make it easier. ↓ 86% code
-```html
-<section class="bg:blue bg:red:hover p:32 p:48@md text:center">...</section>
-```
-To learn more, check out the [Why Master CSS](https://docs.master.co/css/why-master-css) documentation.
-
-# Quick Start
-This is a quick start guide, check out the [full setup guide](https://docs.master.co/css/setup) to integrate with your build tools and frameworks.
-
-```shell
-npm install @master/css
-```
-```js
-import '@master/css';
-```
-or use a CDN
-```html
-<script src="https://cdn.master.co/css"></script>
-```
-Now, start styling HTML with Master CSS. 🎉
-```html
-<h1 class="font:40 font:heavy italic m:50 text:center">Hello World</h1>
-```
-To learn more, check out the [Syntax tutorial](https://docs.master.co/css/syntax-tutorial) documentation.
-
-# Developer Tools
-- [Master CSS Language Service](https://marketplace.visualstudio.com/items?itemName=masterco.master-css-language-service) - A Visual Studio Code extension for Master CSS. Provides code-completion and syntax highlighting.
-
-# Inspiration
-Some of our core concepts and designs are inspired by these giants.
-- __Language__ - Master is a language, but it was originally inspired by [ACSS](https://acss.io/)'s concept of atomic classes.
-- __Virtual CSS__ - Difference algorithms, virtual models, etc. are inspired by  [Virtual DOM](https://reactjs.org/docs/faq-internals.html).
-
-# Related
-- [@master/css.react](https://github.com/master-co/css.react) - React hooks for Master CSS
-- [@master/css-compiler](https://github.com/master-co/css-compiler) - Compile Master CSS ahead of time with zero-configuration integration with build tools
-- [@master/normal.css](https://github.com/master-co/normal.css) - Normalize browser's styles. ~1KB
-- [@master/keyframes.css](https://github.com/master-co/keyframes.css) - Simple and useful CSS keyframes. ~0.4KB
-- [@master/style-element.react](https://github.com/master-co/style-element.react) - Quickly create styled React elements with conditional class names. ~800B
+## Documentation
+Visit [css.master.co](https://css.master.co) to view the full documentation
+
+## Getting Started
+Check out the [guides](https://css.master.co/docs/guides) to get started with Master CSS
+
+## Ecosystem
+We've built various integrations and tools around Master CSS:
+
+##### Build Tools
+
+- [Vite Plugin](https://github.com/master-co/css/tree/beta/packages/vite) - A vite plugin for integrating Master CSS AOT compilation
+- [Webpack Plugin](https://github.com/master-co/css/tree/beta/packages/webpack) - A webpack plugin for integrating Master CSS AOT compilation
+- [Compiler](https://github.com/master-co/css/tree/beta/packages/compiler) - The ahead-of-time compiler of Master CSS
+
+##### Frameworks
+- [React](https://github.com/master-co/css/tree/beta/packages/react) - React hooks for Master CSS
+- [Style Element](https://github.com/master-co/style-element) <sub><sup>React, Vue, ...</sup></sub> - Create reusable style elements using class names in one-linear.
+
+##### Native Plugins
+
+- [Normal CSS](https://github.com/master-co/css/tree/beta/packages/normal.css) - Normalize the browser's styles
+- [Keyframes CSS](https://github.com/master-co/css/tree/beta/packages/keyframes.css) - Simple and useful CSS keyframes
+
+##### Extensions
+- [Language Service](https://github.com/master-co/css/tree/beta/packages/language-service) <sub><sup>Visual Studio Code</sup></sub> - Includes code completion, syntax highlighting, CSS hover preview, and inline color decorators
+
+## Community
+The Master CSS community can be found here:
+
+- [Discuss on GitHub](https://github.com/master-co/css/discussions) - Ask questions, voice ideas, and do any other discussion
+- [Join our Discord Server](https://discord.com/invite/sZNKpAAAw6) - Casually chat with other people using the language <sup><sub>✓ 中文</sub></sup>
+
+<sub>Our [《 Code of Conduct 》](https://github.com/master-co/css/blob/main/CODE_OF_CONDUCT.md) applies to all Master CSS community channels.</sub>
+
+## Contributing
+Please see our [CONTRIBUTING.md](https://github.com/master-co/css/blob/beta/.github/CONTRIBUTING.md) for workflow.
+
+## Inspiration
+Some of the core concepts and designs are inspired by these giants.
+- The concept of enhanced syntax is inspired by [SASS](https://sass-lang.com/) and [TypeScript](https://www.typescriptlang.org/)
+- The concept of Virtual CSS is inspired by the [Virtual DOM](https://reactjs.org/docs/faq-internals.html)

package/dist/apis/render-from-html.d.ts

@@ -1,3 +1,3 @@
-import MasterCSS from '../css';
+import type { Config } from '../config';
 import '../polyfills/css-escape';
-export default function renderFromHTML(html: string, css?: MasterCSS): string;
+export default function renderFromHTML(html: string, config?: Config): string;

package/dist/apis/render-into-html.d.ts

@@ -1,3 +1,3 @@
-import MasterCSS from '../css';
+import type { Config } from '../config';
 import '../polyfills/css-escape';
-export default function renderIntoHTML(html: string, css?: MasterCSS): string;
+export default function renderIntoHTML(html: string, config?: Config): string;

package/dist/apis/render.d.ts

@@ -1,3 +1,3 @@
-import MasterCSS from '../css';
+import type { Config } from '../config';
 import '../polyfills/css-escape';
-export default function render(classes: string[], css?: MasterCSS): string;
+export default function render(classes: string[], config?: Config): string;

package/dist/config/breakpoints.d.ts

@@ -1,4 +1,4 @@
-declare const defaultBreakpoints: {
+declare const breakpoints: {
     '3xs': number;
     '2xs': number;
     xs: number;
@@ -10,4 +10,4 @@ declare const defaultBreakpoints: {
     '3xl': number;
     '4xl': number;
 };
-export default defaultBreakpoints;
+export default breakpoints;

package/dist/config/colors.d.ts

@@ -1,4 +1,4 @@
-declare const defaultColors: {
+declare const colors: {
     slate: any;
     gray: any;
     brown: any;
@@ -22,4 +22,4 @@ declare const defaultColors: {
     black: string;
     white: string;
 };
-export default defaultColors;
+export default colors;

package/dist/config/index.d.ts

@@ -1,22 +1,44 @@
-import MasterCSSRule from '../rule';
-import MasterCSS from '../css';
-declare const defaultConfig: MasterCSSConfig;
-export default defaultConfig;
-export interface MasterCSSConfig {
-    classes?: Record<string, string>;
-    colors?: Record<string, string | Record<string, string>>;
-    breakpoints?: Record<string, number>;
-    mediaQueries?: Record<string, string>;
-    selectors?: Record<string, string | string[]>;
-    semantics?: Record<string, string | Record<string, string | number>>;
-    values?: Record<string, Record<string, string | number>>;
-    Rules?: typeof MasterCSSRule[];
+import Rules from './rules';
+import Rule from '../rule';
+declare const config: Config;
+export default config;
+type Classes = {
+    [key: string]: string | Classes;
+};
+type Colors = {
+    [key: string]: string | Colors;
+};
+type Breakpoints = {
+    [key: string]: number | Breakpoints;
+};
+type MediaQueries = {
+    [key: string]: string | MediaQueries;
+};
+type Selectors = {
+    [key: string]: string | string[] | Selectors;
+};
+type Semantics = {
+    [key: string]: string | number | Record<string, string | number | Semantics>;
+};
+type Values = {
+    [key: string]: string | number | Values;
+};
+export interface Config {
+    classes?: Classes;
+    colors?: Colors;
+    breakpoints?: Breakpoints;
+    mediaQueries?: MediaQueries;
+    selectors?: Selectors;
+    semantics?: Semantics;
+    values?: {
+        [id in typeof Rules[number]['id']]?: Values;
+    } & Values;
+    Rules?: typeof Rule[];
     themes?: Record<string, {
-        classes?: Record<string, string>;
-        colors?: Record<string, string | Record<string, string>>;
+        classes?: Classes;
+        colors?: Colors;
     }> | string[];
     rootSize?: number;
-    validateRule?: (rule: MasterCSSRule, css?: MasterCSS) => boolean;
     scheme?: {
         preference?: string;
         storage?: {

package/dist/config/root-size.d.ts

@@ -1,2 +1,2 @@
-declare const defaultRootSize = 16;
-export default defaultRootSize;
+declare const rootSize = 16;
+export default rootSize;

package/dist/config/rules.d.ts

@@ -1,3 +1,199 @@
 import FontWeight from '../rules/font-weight';
-declare const DefaultRules: (typeof FontWeight)[];
-export default DefaultRules;
+import FontFamily from '../rules/font-family';
+import FontSize from '../rules/font-size';
+import Spacing from '../rules/spacing';
+import Width from '../rules/width';
+import Height from '../rules/height';
+import MinWidth from '../rules/min-width';
+import MinHeight from '../rules/min-height';
+import LetterSpacing from '../rules/letter-spacing';
+import FontSmoothing from '../rules/font-smoothing';
+import FontStyle from '../rules/font-style';
+import FontVariantNumeric from '../rules/font-variant-numeric';
+import FontFeatureSettings from '../rules/font-feature-settings';
+import LineHeight from '../rules/line-height';
+import ObjectFit from '../rules/object-fit';
+import ObjectPosition from '../rules/object-position';
+import TextAlign from '../rules/text-align';
+import TextDecoration from '../rules/text-decoration';
+import TextTransform from '../rules/text-transform';
+import VerticalAlign from '../rules/vertical-align';
+import Lines from '../rules/lines';
+import TransformOrigin from '../rules/transform-origin';
+import TransformStyle from '../rules/transform-style';
+import TransformBox from '../rules/transform-box';
+import Transform from '../rules/transform';
+import Transition from '../rules/transition';
+import TransitionDelay from '../rules/transition-delay';
+import TransitionDuration from '../rules/transition-duration';
+import TransitionProperty from '../rules/transition-property';
+import TransitionTimingFunction from '../rules/transition-timing-function';
+import MaxHeight from '../rules/max-height';
+import MaxWidth from '../rules/max-width';
+import Display from '../rules/display';
+import BoxSizing from '../rules/box-sizing';
+import Opacity from '../rules/opacity';
+import Visibility from '../rules/visibility';
+import Clear from '../rules/clear';
+import Float from '../rules/float';
+import Isolation from '../rules/isolation';
+import Overflow from '../rules/overflow';
+import OverscrollBehavior from '../rules/overscroll-behavior';
+import ZIndex from '../rules/z-index';
+import AnimationDelay from '../rules/animation-delay';
+import AnimationDirection from '../rules/animation-direction';
+import AnimationFillMode from '../rules/animation-fill-mode';
+import AnimationIterationCount from '../rules/animation-iteration-count';
+import AnimationName from '../rules/animation-name';
+import AnimationPlayState from '../rules/animation-play-state';
+import AnimationTimingFunction from '../rules/animation-timing-function';
+import Animation from '../rules/animation';
+import BorderColor from '../rules/border-color';
+import BorderRadius from '../rules/border-radius';
+import BorderStyle from '../rules/border-style';
+import BorderWidth from '../rules/border-width';
+import Border from '../rules/border';
+import BackgroundAttachment from '../rules/background-attachment';
+import BackgroundBlendMode from '../rules/background-blend-mode';
+import BackgroundClip from '../rules/background-clip';
+import BackgroundColor from '../rules/background-color';
+import BackgroundOrigin from '../rules/background-origin';
+import BackgroundPosition from '../rules/background-position';
+import BackgroundRepeat from '../rules/background-repeat';
+import BackgroundSize from '../rules/background-size';
+import BackgroundImage from '../rules/background-image';
+import Background from '../rules/background';
+import MixBlendMode from '../rules/mix-blend-mode';
+import Position from '../rules/position';
+import BackdropFilter from '../rules/backdrop-filter';
+import Fill from '../rules/fill';
+import Stroke from '../rules/stroke';
+import StrokeWidth from '../rules/stroke-width';
+import Filter from '../rules/filter';
+import Cursor from '../rules/cursor';
+import PointerEvents from '../rules/pointer-events';
+import Resize from '../rules/resize';
+import TouchAction from '../rules/touch-action';
+import UserDrag from '../rules/user-drag';
+import UserSelect from '../rules/user-select';
+import BoxShadow from '../rules/box-shadow';
+import TextShadow from '../rules/text-shadow';
+import TextSize from '../rules/text-size';
+import WordBreak from '../rules/word-break';
+import GridColumns from '../rules/grid-columns';
+import GridRows from '../rules/grid-rows';
+import Gap from '../rules/gap';
+import WordSpacing from '../rules/word-spacing';
+import Variable from '../rules/variable';
+import AspectRatio from '../rules/aspect-ratio';
+import BoxDecorationBreak from '../rules/box-decoration-break';
+import BreakAfter from '../rules/break-after';
+import BreakBefore from '../rules/break-before';
+import BreakInside from '../rules/break-inside';
+import FlexShrink from '../rules/flex-shrink';
+import FlexDirection from '../rules/flex-direction';
+import FlexGrow from '../rules/flex-grow';
+import FlexWrap from '../rules/flex-wrap';
+import FlexBasis from '../rules/flex-basis';
+import Flex from '../rules/flex';
+import Order from '../rules/order';
+import GridColumn from '../rules/grid-column';
+import ColumnSpan from '../rules/column-span';
+import GridRow from '../rules/grid-row';
+import Color from '../rules/color';
+import AlignContent from '../rules/align-content';
+import AlignItems from '../rules/align-items';
+import AlignSelf from '../rules/align-self';
+import GridAutoColumns from '../rules/grid-auto-columns';
+import GridAutoFlow from '../rules/grid-auto-flow';
+import GridAutoRows from '../rules/grid-auto-rows';
+import JustifyContent from '../rules/justify-content';
+import JustifyItems from '../rules/justify-items';
+import JustifySelf from '../rules/justify-self';
+import PlaceContent from '../rules/place-content';
+import PlaceItems from '../rules/place-items';
+import PlaceSelf from '../rules/place-self';
+import Padding from '../rules/padding';
+import Margin from '../rules/margin';
+import TextOverflow from '../rules/text-overflow';
+import ListStylePosition from '../rules/list-style-position';
+import ListStyleType from '../rules/list-style-type';
+import ListStyle from '../rules/list-style';
+import TextDecorationColor from '../rules/text-decoration-color';
+import TextDecorationStyle from '../rules/text-decoration-style';
+import TextDecorationThickness from '../rules/text-decoration-thickness';
+import TextIndent from '../rules/text-indent';
+import Content from '../rules/content';
+import OutlineColor from '../rules/outline-color';
+import OutlineOffset from '../rules/outline-offset';
+import OutlineStyle from '../rules/outline-style';
+import OutlineWidth from '../rules/outline-width';
+import Outline from '../rules/outline';
+import BorderCollapse from '../rules/border-collapse';
+import BorderSpacing from '../rules/border-spacing';
+import TableLayout from '../rules/table-layout';
+import AccentColor from '../rules/accent-color';
+import Appearance from '../rules/appearance';
+import CaretColor from '../rules/caret-color';
+import ScrollBehavior from '../rules/scroll-behavior';
+import ScrollMargin from '../rules/scroll-margin';
+import ScrollPadding from '../rules/scroll-padding';
+import ScrollSnapAlign from '../rules/scroll-snap-align';
+import ScrollSnapStop from '../rules/scroll-snap-stop';
+import ScrollSnapType from '../rules/scroll-snap-type';
+import WillChange from '../rules/will-change';
+import TextUnderlineOffset from '../rules/text-underline-offset';
+import Inset from '../rules/inset';
+import Columns from '../rules/columns';
+import WhiteSpace from '../rules/white-space';
+import TextOrientation from '../rules/text-orientation';
+import WritingMode from '../rules/writing-mode';
+import Contain from '../rules/contain';
+import AnimationDuration from '../rules/animation-duration';
+import TextRendering from '../rules/text-rendering';
+import Direction from '../rules/direction';
+import TextDecorationLine from '../rules/text-decoration-line';
+import GridColumnStart from '../rules/grid-column-start';
+import ListStyleImage from '../rules/list-style-image';
+import ShapeOutside from '../rules/shape-outside';
+import ShapeMargin from '../rules/shape-margin';
+import ShapeImageThreshold from '../rules/shape-image-threshold';
+import ClipPath from '../rules/clip-path';
+import Grid from '../rules/grid';
+import Font from '../rules/font';
+import Quotes from '../rules/quotes';
+import GridTemplate from '../rules/grid-template';
+import GridRowStart from '../rules/grid-row-start';
+import GridTemplateAreas from '../rules/grid-template-areas';
+import GridTemplateColumns from '../rules/grid-template-columns';
+import GridTemplateRows from '../rules/grid-template-rows';
+import GridArea from '../rules/grid-area';
+import GridColumnEnd from '../rules/grid-column-end';
+import GridRowEnd from '../rules/grid-row-end';
+import MaskImage from '../rules/mask-image';
+import TextFillColor from '../rules/text-fill-color';
+import TextStroke from '../rules/text-stroke';
+import TextStrokeWidth from '../rules/text-stroke-width';
+import TextStrokeColor from '../rules/text-stroke-color';
+import StrokeDasharray from '../rules/stroke-dasharray';
+import StrokeDashoffset from '../rules/stroke-dashoffset';
+import X from '../rules/x';
+import Y from '../rules/y';
+import Cx from '../rules/cx';
+import Cy from '../rules/cy';
+import Rx from '../rules/rx';
+import Ry from '../rules/ry';
+import BorderImageOutset from '../rules/border-image-outset';
+import BorderImageRepeat from '../rules/border-image-repeat';
+import BorderImageSlice from '../rules/border-image-slice';
+import BorderImageSource from '../rules/border-image-source';
+import BorderImageWidth from '../rules/border-image-width';
+import BorderImage from '../rules/border-image';
+import Group from '../rules/group';
+import CounterIncrement from '../rules/counter-increment';
+import counterReset from '../rules/counter-reset';
+import WH from '../rules/wh';
+import MinWH from '../rules/min-wh';
+import MaxWH from '../rules/max-wh';
+declare const Rules: (typeof FontWeight | typeof FontFamily | typeof FontSize | typeof Spacing | typeof Width | typeof Height | typeof MinWidth | typeof MinHeight | typeof LetterSpacing | typeof FontSmoothing | typeof FontStyle | typeof FontVariantNumeric | typeof FontFeatureSettings | typeof LineHeight | typeof ObjectFit | typeof ObjectPosition | typeof TextAlign | typeof TextDecoration | typeof TextTransform | typeof VerticalAlign | typeof Lines | typeof TransformOrigin | typeof TransformStyle | typeof TransformBox | typeof Transform | typeof Transition | typeof TransitionDelay | typeof TransitionDuration | typeof TransitionProperty | typeof TransitionTimingFunction | typeof MaxHeight | typeof MaxWidth | typeof Display | typeof BoxSizing | typeof Opacity | typeof Visibility | typeof Clear | typeof Float | typeof Isolation | typeof Overflow | typeof OverscrollBehavior | typeof ZIndex | typeof AnimationDelay | typeof AnimationDirection | typeof AnimationFillMode | typeof AnimationIterationCount | typeof AnimationName | typeof AnimationPlayState | typeof AnimationTimingFunction | typeof Animation | typeof BorderColor | typeof BorderRadius | typeof BorderStyle | typeof BorderWidth | typeof Border | typeof BackgroundAttachment | typeof BackgroundBlendMode | typeof BackgroundClip | typeof BackgroundColor | typeof BackgroundOrigin | typeof BackgroundPosition | typeof BackgroundRepeat | typeof BackgroundSize | typeof BackgroundImage | typeof Background | typeof MixBlendMode | typeof Position | typeof BackdropFilter | typeof Fill | typeof Stroke | typeof StrokeWidth | typeof Filter | typeof Cursor | typeof PointerEvents | typeof Resize | typeof TouchAction | typeof UserDrag | typeof UserSelect | typeof BoxShadow | typeof TextShadow | typeof TextSize | typeof WordBreak | typeof GridColumns | typeof GridRows | typeof Gap | typeof WordSpacing | typeof Variable | typeof AspectRatio | typeof BoxDecorationBreak | typeof BreakAfter | typeof BreakBefore | typeof BreakInside | typeof FlexShrink | typeof FlexDirection | typeof FlexGrow | typeof FlexWrap | typeof FlexBasis | typeof Flex | typeof Order | typeof GridColumn | typeof ColumnSpan | typeof GridRow | typeof Color | typeof AlignContent | typeof AlignItems | typeof AlignSelf | typeof GridAutoColumns | typeof GridAutoFlow | typeof GridAutoRows | typeof JustifyContent | typeof JustifyItems | typeof JustifySelf | typeof PlaceContent | typeof PlaceItems | typeof PlaceSelf | typeof Padding | typeof Margin | typeof TextOverflow | typeof ListStylePosition | typeof ListStyleType | typeof ListStyle | typeof TextDecorationColor | typeof TextDecorationStyle | typeof TextDecorationThickness | typeof TextIndent | typeof Content | typeof OutlineColor | typeof OutlineOffset | typeof OutlineStyle | typeof OutlineWidth | typeof Outline | typeof BorderCollapse | typeof BorderSpacing | typeof TableLayout | typeof AccentColor | typeof Appearance | typeof CaretColor | typeof ScrollBehavior | typeof ScrollMargin | typeof ScrollPadding | typeof ScrollSnapAlign | typeof ScrollSnapStop | typeof ScrollSnapType | typeof WillChange | typeof TextUnderlineOffset | typeof Inset | typeof Columns | typeof WhiteSpace | typeof TextOrientation | typeof WritingMode | typeof Contain | typeof AnimationDuration | typeof TextRendering | typeof Direction | typeof TextDecorationLine | typeof GridColumnStart | typeof ListStyleImage | typeof ShapeOutside | typeof ShapeMargin | typeof ShapeImageThreshold | typeof ClipPath | typeof Grid | typeof Font | typeof Quotes | typeof GridTemplate | typeof GridRowStart | typeof GridTemplateAreas | typeof GridTemplateColumns | typeof GridTemplateRows | typeof GridArea | typeof GridColumnEnd | typeof GridRowEnd | typeof MaskImage | typeof TextFillColor | typeof TextStroke | typeof TextStrokeWidth | typeof TextStrokeColor | typeof StrokeDasharray | typeof StrokeDashoffset | typeof X | typeof Y | typeof Cx | typeof Cy | typeof Rx | typeof Ry | typeof BorderImageOutset | typeof BorderImageRepeat | typeof BorderImageSlice | typeof BorderImageSource | typeof BorderImageWidth | typeof BorderImage | typeof Group | typeof CounterIncrement | typeof counterReset | typeof WH | typeof MinWH | typeof MaxWH)[];
+export default Rules;

package/dist/config/scheme.d.ts

@@ -1,8 +1,7 @@
-declare const defaultScheme: {
-    preference: string;
+declare const scheme: {
     storage: {
         sync: boolean;
         key: string;
     };
 };
-export default defaultScheme;
+export default scheme;

package/dist/config/selectors.d.ts

@@ -1,4 +1,4 @@
-declare const defaultSelectors: {
+declare const selectors: {
     '::scrollbar': string;
     '::scrollbar-button': string;
     '::scrollbar-thumb': string;
@@ -16,4 +16,4 @@ declare const defaultSelectors: {
     ':odd': string;
     ':nth(': string;
 };
-export default defaultSelectors;
+export default selectors;

package/dist/config/semantics.d.ts

@@ -1,4 +1,4 @@
-declare const defaultSemantics: {
+declare const semantics: {
     square: string;
     video: string;
     rounded: string;
@@ -79,4 +79,4 @@ declare const defaultSemantics: {
         overflow: string;
     };
 };
-export default defaultSemantics;
+export default semantics;

package/dist/config/themes.d.ts

@@ -1,2 +1,2 @@
-declare const defaultThemes: string[];
-export default defaultThemes;
+declare const themes: string[];
+export default themes;

package/dist/config/values.d.ts

@@ -1,4 +1,4 @@
-declare const defaultValues: {
+declare const values: {
     BackgroundClip: {
         content: string;
         border: string;
@@ -123,4 +123,4 @@ declare const defaultValues: {
         min: string;
     };
 };
-export default defaultValues;
+export default values;

package/dist/constants/start-symbol.d.ts

@@ -1,5 +1,6 @@
 export declare const START_SYMBOL: {
     '(': string;
     '\'': string;
+    '"': string;
     '{': string;
 };