CCSS Compiler

1.1.3 verified Fri May 01 auth: no javascript maintenance

Compiles GSS-flavored Constraint Cascading Style Sheets (CCSS) rules into an AST for consumption by the GSS engine. Current stable version is 1.1.3, with irregular releases. It supports parent context (`^`) and global scope (`$`) selectors, variable hoisting, and addresses cross-browser issues. Key differentiator: part of the Grid Style Sheets (GSS) ecosystem for constraint-based layout, as opposed to traditional CSS.

Common errors

error Cannot find module 'ccss-compiler' ↓

cause Package not installed or import path incorrect.

fix

Run 'npm install ccss-compiler --save' and ensure your environment resolves Node modules.

error TypeError: ccssCompiler.parse is not a function ↓

cause CommonJS incorrectly used as import default.

fix

Correct import: const { parse } = require('ccss-compiler') or import { parse } from 'ccss-compiler'.

error Unexpected token: ':' Expected: a rule declaration ↓

cause CCSS syntax error; missing @constraint or incorrect selector.

fix

Ensure CCSS input follows GSS CCSS syntax: e.g., @constraint Name { ... } with proper selectors.

Warnings

breaking AST structure changed significantly in v1.1.2, breaking consumers that relied on previous AST format. ↓

fix Update code that processes parsed AST to match new structure; refer to engine repository for details.

gotcha CommonJS require('ccss-compiler') returns the default export object, not the named exports directly. ↓

fix Use import syntax or destructure from the default export: const { parse, compile } = require('ccss-compiler').

gotcha Export is an object with methods, not a function. Cannot call require('ccss-compiler')(...). ↓

fix Use require('ccss-compiler').compile(...) or destructure.

deprecated No new releases since v1.1.3; the project may be in maintenance mode. ↓

fix Consider alternative constraint-based libraries or contribute to the GSS ecosystem.

Install

npm install ccss-compiler

yarn add ccss-compiler

pnpm add ccss-compiler

Imports

parse
wrong
```
const parse = require('ccss-compiler')
```
correct
```
import { parse } from 'ccss-compiler'
```
CommonJS require does not work as default export; use named import in ESM environments.

compile

wrong

import compile from 'ccss-compiler'

correct

import { compile } from 'ccss-compiler'

compile is a named export, not default.

default
wrong
```
const { default } = require('ccss-compiler')
```
correct
```
import ccssCompiler from 'ccss-compiler'
```
Default export is an object containing parse, compile, etc. For CommonJS, use require('ccss-compiler') to get the default object.

Quickstart

Demonstrates parsing CCSS text into an AST and then compiling it using the library.

import { parse, compile } from 'ccss-compiler';

const ccss = `
  @constraint MyConstraint {
    $this: ^.parent;
    width: == 100;
  }
`;

const ast = parse(ccss);
console.log(JSON.stringify(ast, null, 2));

const result = compile(ccss);
console.log(result);