@terrazzo/plugin-css 0.0.5 → 0.0.6

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Drew Powers
+Copyright (c) 2024 Drew Powers
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

package/README.md

@@ -1,5 +1,37 @@
 # ⛋ @terrazzo/plugin-css
 
-CSS codegen plugin for @terrazzo/cli. Generate CSS using DTCG tokens.
+Generate CSS from DTCG tokens.
 
-[View Documentation](https://terrazzo.app/docs/integrations/css)
+## Setup
+
+Requires [Node.js 18 or later](https://nodejs.org). With that installed, run:
+
+```sh
+npm i -D @terrazzo/cli @terrazzo/plugin-css
+```
+
+Add a `terrazzo.config.js` to the root of your project with:
+
+```ts
+import { defineConfig } from "@terrazzo/cli";
+import css from "@terrazzo/plugin-css";
+
+export default defineConfig({
+  outDir: "./tokens/",
+  plugins: [
+    css({
+      fileName: "tokens.css",
+    }),
+  ],
+});
+```
+
+Lastly, run:
+
+```sh
+npx tz build
+```
+
+And you’ll see a `./tokens/tokens.css` file generated in your project.
+
+[Full Documentation](https://terrazzo.app/docs/integrations/css)

package/dist/build.js

@@ -61,9 +61,6 @@ export default function buildFormat({ getTransforms, exclude, modeSelectors }) {
         const selectorRec2020Rule = { selectors, nestedQuery: REC2020_MQ, declarations: {} };
         rules.push(selectorRule, selectorP3Rule, selectorRec2020Rule);
         for (const token of selectorTokens) {
-            if (token.token.aliasOf) {
-                continue;
-            }
             const localID = token.localID ?? token.token.id;
             // single-value token
             if (token.type === 'SINGLE_VALUE') {

package/dist/build.js.map

@@ -1 +1 @@
-{"version":3,"file":"build.js","sourceRoot":"","sources":["../src/build.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"build.js","sourceRoot":"","sources":["../src/build.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,EAAuC,UAAU,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAEtF,MAAM,KAAK,GAAG,0BAA0B,CAAC;AACzC,MAAM,UAAU,GAAG,+BAA+B,CAAC;AAQnD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAAE,aAAa,EAAE,OAAO,EAAE,aAAa,EAAsB;IAC/F,MAAM,KAAK,GAAc,EAAE,CAAC;IAE5B,QAAQ;IACR,MAAM,UAAU,GAAG,aAAa,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;IACnE,IAAI,UAAU,CAAC,MAAM,EAAE,CAAC;QACtB,MAAM,QAAQ,GAAY,EAAE,SAAS,EAAE,CAAC,OAAO,CAAC,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QACrE,2EAA2E;QAC3E,4EAA4E;QAC5E,4EAA4E;QAC5E,4EAA4E;QAC5E,oEAAoE;QACpE,wCAAwC;QACxC,MAAM,MAAM,GAAY,EAAE,SAAS,EAAE,CAAC,OAAO,CAAC,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QACvF,MAAM,WAAW,GAAY,EAAE,SAAS,EAAE,CAAC,OAAO,CAAC,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QACjG,KAAK,CAAC,IAAI,CAAC,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC;QAE1C,KAAK,MAAM,KAAK,IAAI,UAAU,EAAE,CAAC;YAC/B,IAAI,YAAY,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,OAAO,IAAI,EAAE,CAAC,EAAE,CAAC;gBAChD,SAAS;YACX,CAAC;YACD,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YAChD,qBAAqB;YACrB,IAAI,KAAK,CAAC,IAAI,KAAK,cAAc,EAAE,CAAC;gBAClC,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;YAC/C,CAAC;YACD,uCAAuC;iBAClC,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBACnE,QAAQ,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,IAAK,CAAC;gBACnD,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;oBACxC,MAAM,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,EAAG,CAAC;oBAC/C,WAAW,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,OAAQ,CAAC;gBAC3D,CAAC;YACH,CAAC;YACD,oBAAoB;iBACf,IAAI,KAAK,CAAC,IAAI,KAAK,aAAa,EAAE,CAAC;gBACtC,MAAM,SAAS,GAAG,iBAAiB,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;gBAC3E,IAAI,SAAS,EAAE,CAAC;oBACd,QAAQ,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,SAAS,CAAC;gBACrE,CAAC;gBACD,KAAK,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;oBACxD,QAAQ,CAAC,YAAY,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC;gBACpF,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,sEAAsE;IACtE,KAAK,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,aAAa,IAAI,EAAE,EAAE,CAAC;QAC9D,IAAI,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC;YACtB,SAAS;QACX,CAAC;QACD,MAAM,cAAc,GAAG,aAAa,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;QAC1E,IAAI,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC;YAC3B,SAAS;QACX,CAAC;QAED,MAAM,YAAY,GAAY,EAAE,SAAS,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QAC9D,MAAM,cAAc,GAAY,EAAE,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QACpF,MAAM,mBAAmB,GAAY,EAAE,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,EAAE,CAAC;QAC9F,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,cAAc,EAAE,mBAAmB,CAAC,CAAC;QAE9D,KAAK,MAAM,KAAK,IAAI,cAAc,EAAE,CAAC;YACnC,MAAM,OAAO,GAAG,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;YAChD,qBAAqB;YACrB,IAAI,KAAK,CAAC,IAAI,KAAK,cAAc,EAAE,CAAC;gBAClC,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC;YACnD,CAAC;YACD,uCAAuC;iBAClC,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,IAAI,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,CAAC;gBACnE,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,IAAK,CAAC;gBACvD,IAAI,KAAK,CAAC,KAAK,CAAC,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC;oBACxC,cAAc,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,EAAG,CAAC;oBACvD,mBAAmB,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,OAAQ,CAAC;gBACnE,CAAC;YACH,CAAC;YACD,oBAAoB;iBACf,CAAC;gBACJ,MAAM,SAAS,GAAG,iBAAiB,CAAC,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;gBAC3E,IAAI,SAAS,EAAE,CAAC;oBACd,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,GAAG,SAAS,CAAC;gBACjD,CAAC;gBACD,KAAK,MAAM,CAAC,IAAI,EAAE,QAAQ,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;oBAC3D,YAAY,CAAC,YAAY,CAAC,GAAG,OAAO,IAAI,IAAI,EAAE,CAAC,GAAG,QAAQ,CAAC;gBAC7D,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO,UAAU,CAAC,KAAK,CAAC,CAAC;AAC3B,CAAC"}

package/dist/index.js

@@ -22,10 +22,10 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+import { validateCustomTransform } from '@terrazzo/token-tools';
 import { makeCSSVar, transformCSSValue } from '@terrazzo/token-tools/css';
-import { FILE_PREFIX, FORMAT_ID } from './lib.js';
 import buildFormat from './build.js';
-import { validateCustomTransform } from '@terrazzo/token-tools';
+import { FILE_PREFIX, FORMAT_ID } from './lib.js';
 export * from './build.js';
 export * from './lib.js';
 export default function cssPlugin({ filename = './index.css', exclude, variableName, modeSelectors, transform: customTransform, } = {}) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,WAAW,EAAE,SAAS,EAAyB,MAAM,UAAU,CAAC;AACzE,OAAO,WAAW,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AAEzB,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,QAAQ,GAAG,aAAa,EACxB,OAAO,EACP,YAAY,EACZ,aAAa,EACb,SAAS,EAAE,eAAe,MACN,EAAE;IACtB,MAAM,aAAa,GAAG,CAAC,EAAU,EAAE,EAAE,CAAC,YAAY,EAAE,CAAC,EAAE,CAAC,IAAI,UAAU,CAAC,EAAE,CAAC,CAAC;IAC3E,MAAM,cAAc,GAAG,CAAC,EAAU,EAAE,EAAE,CAAC,OAAO,aAAa,CAAC,EAAE,CAAC,GAAG,CAAC;IAEnE,OAAO;QACL,IAAI,EAAE,sBAAsB;QAC5B,KAAK,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE;YACrD,mDAAmD;YACnD,MAAM,SAAS,GAAG,aAAa,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;YAC3E,IAAI,SAAS,CAAC,MAAM,EAAE,CAAC;gBACrB,OAAO;YACT,CAAC;YAED,KAAK,MAAM,EAAE,IAAI,MAAM,EAAE,CAAC;gBACxB,MAAM,KAAK,GAAG,MAAM,CAAC,EAAE,CAAE,CAAC;gBAC1B,MAAM,OAAO,GAAG,aAAa,CAAC,EAAE,CAAC,CAAC;gBAClC,KAAK,MAAM,IAAI,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC;oBAC9B,IAAI,eAAe,EAAE,CAAC;wBACpB,MAAM,KAAK,GAAG,eAAe,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;wBAC3C,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;4BAC1C,uBAAuB,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC;4BACvD,YAAY,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;4BAC9D,SAAS;wBACX,CAAC;oBACH,CAAC;oBAED,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC;oBAC5E,IAAI,gBAAgB,KAAK,SAAS,EAAE,CAAC;wBACnC,YAAY,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,CAAC,CAAC;oBAClF,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;QACD,KAAK,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,UAAU,EAAE;YACvC,MAAM,MAAM,GAAa,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;YAC3C,MAAM,CAAC,IAAI,CACT,WAAW,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,EACtD,IAAI,CACL,CAAC;YACF,UAAU,CAAC,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1C,CAAC;KACF,CAAC;AACJ,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,WAAW,MAAM,YAAY,CAAC;AACrC,OAAO,EAAE,WAAW,EAAE,SAAS,EAAyB,MAAM,UAAU,CAAC;AAEzE,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AAEzB,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,QAAQ,GAAG,aAAa,EACxB,OAAO,EACP,YAAY,EACZ,aAAa,EACb,SAAS,EAAE,eAAe,MACN,EAAE;IACtB,MAAM,aAAa,GAAG,CAAC,EAAU,EAAE,EAAE,CAAC,YAAY,EAAE,CAAC,EAAE,CAAC,IAAI,UAAU,CAAC,EAAE,CAAC,CAAC;IAC3E,MAAM,cAAc,GAAG,CAAC,EAAU,EAAE,EAAE,CAAC,OAAO,aAAa,CAAC,EAAE,CAAC,GAAG,CAAC;IAEnE,OAAO;QACL,IAAI,EAAE,sBAAsB;QAC5B,KAAK,CAAC,SAAS,CAAC,EAAE,MAAM,EAAE,aAAa,EAAE,YAAY,EAAE;YACrD,mDAAmD;YACnD,MAAM,SAAS,GAAG,aAAa,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC,CAAC;YAC3E,IAAI,SAAS,CAAC,MAAM,EAAE,CAAC;gBACrB,OAAO;YACT,CAAC;YAED,KAAK,MAAM,EAAE,IAAI,MAAM,EAAE,CAAC;gBACxB,MAAM,KAAK,GAAG,MAAM,CAAC,EAAE,CAAE,CAAC;gBAC1B,MAAM,OAAO,GAAG,aAAa,CAAC,EAAE,CAAC,CAAC;gBAClC,KAAK,MAAM,IAAI,IAAI,KAAK,CAAC,IAAI,EAAE,CAAC;oBAC9B,IAAI,eAAe,EAAE,CAAC;wBACpB,MAAM,KAAK,GAAG,eAAe,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;wBAC3C,IAAI,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,IAAI,EAAE,CAAC;4BAC1C,uBAAuB,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,CAAC,CAAC;4BACvD,YAAY,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;4BAC9D,SAAS;wBACX,CAAC;oBACH,CAAC;oBAED,MAAM,gBAAgB,GAAG,iBAAiB,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,cAAc,EAAE,CAAC,CAAC;oBAC5E,IAAI,gBAAgB,KAAK,SAAS,EAAE,CAAC;wBACnC,YAAY,CAAC,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,CAAC,CAAC;oBAClF,CAAC;gBACH,CAAC;YACH,CAAC;QACH,CAAC;QACD,KAAK,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,UAAU,EAAE;YACvC,MAAM,MAAM,GAAa,CAAC,WAAW,EAAE,EAAE,CAAC,CAAC;YAC3C,MAAM,CAAC,IAAI,CACT,WAAW,CAAC,EAAE,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC,EACtD,IAAI,CACL,CAAC;YACF,UAAU,CAAC,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;QAC1C,CAAC;KACF,CAAC;AACJ,CAAC"}

package/package.json

@@ -1,38 +1,36 @@
 {
   "name": "@terrazzo/plugin-css",
+  "version": "0.0.6",
   "description": "Generate CSS from your design tokens schema (requires @terrazzo/cli)",
-  "version": "0.0.5",
+  "type": "module",
   "author": {
     "name": "Drew Powers",
     "email": "drew@pow.rs"
   },
   "keywords": [
     "design tokens",
-    "design tokens community group",
-    "design tokens format module",
     "design system",
     "dtcg",
-    "w3c design tokens",
+    "w3c",
     "css"
   ],
-  "license": "MIT",
-  "type": "module",
   "main": "./dist/index.js",
+  "homepage": "https://terrazzoapp.com/docs/cli/integrations/css",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/terrazzoapp/terrazzo.git",
+    "directory": "./packages/plugin-css/"
+  },
+  "license": "MIT",
   "peerDependencies": {
     "@terrazzo/cli": "*"
   },
   "dependencies": {
-    "@types/culori": "^2.1.0",
-    "@types/mime": "^3.0.4",
-    "culori": "^3.3.0",
-    "mime": "^3.0.0",
-    "svgo": "^3.3.2",
-    "@terrazzo/parser": "^0.0.7",
-    "@terrazzo/token-tools": "^0.0.3"
+    "@terrazzo/parser": "^0.0.10",
+    "@terrazzo/token-tools": "^0.0.4"
   },
   "devDependencies": {
-    "yaml": "^2.4.3",
-    "@terrazzo/cli": "^0.0.7"
+    "@terrazzo/cli": "^0.0.10"
   },
   "scripts": {
     "build": "pnpm run build:clean && pnpm run build:ts && pnpm run build:license",

package/src/build.ts

@@ -1,108 +0,0 @@
-import type { BuildHookOptions } from '@terrazzo/parser';
-import { isTokenMatch } from '@terrazzo/token-tools';
-import { generateShorthand } from '@terrazzo/token-tools/css';
-import { type CSSPluginOptions, type CSSRule, printRules, FORMAT_ID } from './lib.js';
-
-const P3_MQ = '@media (color-gamut: p3)';
-const REC2020_MQ = '@media (color-gamut: rec2020)';
-
-export interface BuildFormatOptions {
-  exclude: CSSPluginOptions['exclude'];
-  getTransforms: BuildHookOptions['getTransforms'];
-  modeSelectors: CSSPluginOptions['modeSelectors'];
-}
-
-export default function buildFormat({ getTransforms, exclude, modeSelectors }: BuildFormatOptions): string {
-  const rules: CSSRule[] = [];
-
-  // :root
-  const rootTokens = getTransforms({ format: FORMAT_ID, mode: '.' });
-  if (rootTokens.length) {
-    const rootRule: CSSRule = { selectors: [':root'], declarations: {} };
-    // note: "nestedQuery" was designed specifically for higher-gamut colors to
-    // apply color-gamut media queries to existing selectors (i.e. keep the same
-    // targets, and apply another nested layer of media query filtering based on
-    // hardware). Because of how CSS works they need to get built out into their
-    // own selectors that have different structures depending on whether
-    // `selectors` has a media query or not.
-    const p3Rule: CSSRule = { selectors: [':root'], nestedQuery: P3_MQ, declarations: {} };
-    const rec2020Rule: CSSRule = { selectors: [':root'], nestedQuery: REC2020_MQ, declarations: {} };
-    rules.push(rootRule, p3Rule, rec2020Rule);
-
-    for (const token of rootTokens) {
-      if (isTokenMatch(token.token.id, exclude ?? [])) {
-        continue;
-      }
-      const localID = token.localID ?? token.token.id;
-      // single-value token
-      if (token.type === 'SINGLE_VALUE') {
-        rootRule.declarations[localID] = token.value;
-      }
-      // multi-value token (wide gamut color)
-      else if (token.value.srgb && token.value.p3 && token.value.rec2020) {
-        rootRule.declarations[localID] = token.value.srgb!;
-        if (token.value.p3 !== token.value.srgb) {
-          p3Rule.declarations[localID] = token.value.p3!;
-          rec2020Rule.declarations[localID] = token.value.rec2020!;
-        }
-      }
-      // multi-value token
-      else if (token.type === 'MULTI_VALUE') {
-        const shorthand = generateShorthand({ $type: token.token.$type, localID });
-        if (shorthand) {
-          rootRule.declarations[token.localID ?? token.token.id] = shorthand;
-        }
-        for (const [name, value] of Object.entries(token.value)) {
-          rootRule.declarations[name === '.' ? localID : [localID, name].join('-')] = value;
-        }
-      }
-    }
-  }
-
-  // modeSelectors (note: without these, modes won’t get written to CSS)
-  for (const { selectors, tokens, mode } of modeSelectors ?? []) {
-    if (!selectors.length) {
-      continue;
-    }
-    const selectorTokens = getTransforms({ format: 'css', id: tokens, mode });
-    if (!selectorTokens.length) {
-      continue;
-    }
-
-    const selectorRule: CSSRule = { selectors, declarations: {} };
-    const selectorP3Rule: CSSRule = { selectors, nestedQuery: P3_MQ, declarations: {} };
-    const selectorRec2020Rule: CSSRule = { selectors, nestedQuery: REC2020_MQ, declarations: {} };
-    rules.push(selectorRule, selectorP3Rule, selectorRec2020Rule);
-
-    for (const token of selectorTokens) {
-      if (token.token.aliasOf) {
-        continue;
-      }
-      const localID = token.localID ?? token.token.id;
-      // single-value token
-      if (token.type === 'SINGLE_VALUE') {
-        selectorRule.declarations[localID] = token.value;
-      }
-      // multi-value token (wide gamut color)
-      else if (token.value.srgb && token.value.p3 && token.value.rec2020) {
-        selectorRule.declarations[localID] = token.value.srgb!;
-        if (token.value.p3 !== token.value.srgb) {
-          selectorP3Rule.declarations[localID] = token.value.p3!;
-          selectorRec2020Rule.declarations[localID] = token.value.rec2020!;
-        }
-      }
-      // multi-value token
-      else {
-        const shorthand = generateShorthand({ $type: token.token.$type, localID });
-        if (shorthand) {
-          selectorRule.declarations[localID] = shorthand;
-        }
-        for (const [name, subvalue] of Object.entries(token.value)) {
-          selectorRule.declarations[`${localID}-${name}`] = subvalue;
-        }
-      }
-    }
-  }
-
-  return printRules(rules);
-}

package/src/index.ts

@@ -1,58 +0,0 @@
-import type { Plugin } from '@terrazzo/parser';
-import { makeCSSVar, transformCSSValue } from '@terrazzo/token-tools/css';
-import { FILE_PREFIX, FORMAT_ID, type CSSPluginOptions } from './lib.js';
-import buildFormat from './build.js';
-import { validateCustomTransform } from '@terrazzo/token-tools';
-
-export * from './build.js';
-export * from './lib.js';
-
-export default function cssPlugin({
-  filename = './index.css',
-  exclude,
-  variableName,
-  modeSelectors,
-  transform: customTransform,
-}: CSSPluginOptions = {}): Plugin {
-  const transformName = (id: string) => variableName?.(id) || makeCSSVar(id);
-  const transformAlias = (id: string) => `var(${transformName(id)})`;
-
-  return {
-    name: '@terrazzo/plugin-css',
-    async transform({ tokens, getTransforms, setTransform }) {
-      // skip work if another .css plugin has already run
-      const cssTokens = getTransforms({ format: FORMAT_ID, id: '*', mode: '*' });
-      if (cssTokens.length) {
-        return;
-      }
-
-      for (const id in tokens) {
-        const token = tokens[id]!;
-        const localID = transformName(id);
-        for (const mode in token.mode) {
-          if (customTransform) {
-            const value = customTransform(token, mode);
-            if (value !== undefined && value !== null) {
-              validateCustomTransform(value, { $type: token.$type });
-              setTransform(id, { format: FORMAT_ID, localID, value, mode });
-              continue;
-            }
-          }
-
-          const transformedValue = transformCSSValue(token, { mode, transformAlias });
-          if (transformedValue !== undefined) {
-            setTransform(id, { format: FORMAT_ID, localID, value: transformedValue, mode });
-          }
-        }
-      }
-    },
-    async build({ getTransforms, outputFile }) {
-      const output: string[] = [FILE_PREFIX, ''];
-      output.push(
-        buildFormat({ exclude, getTransforms, modeSelectors }),
-        '\n', // EOF newline
-      );
-      outputFile(filename, output.join('\n'));
-    },
-  };
-}

package/src/lib.ts

@@ -1,110 +0,0 @@
-import type { TokenNormalized, TokenTransformed } from '@terrazzo/parser';
-
-export const FORMAT_ID = 'css';
-
-export const FILE_PREFIX = `/* -------------------------------------------
- *  Autogenerated by ⛋ Terrazzo. DO NOT EDIT!
- * ------------------------------------------- */`;
-
-export interface CSSPluginOptions {
-  /** Where to output CSS */
-  filename?: string;
-  /** Glob patterns to exclude tokens from output */
-  exclude?: string[];
-  /** Define mode selectors as media queries or CSS classes */
-  modeSelectors?: ModeSelector[];
-  /** Control the final CSS variable name */
-  variableName?: (name: string) => string;
-  /** Override certain token values */
-  transform?: (token: TokenNormalized, mode: string) => TokenTransformed['value'];
-}
-
-export interface ModeSelector {
-  /** The name of the mode to match */
-  mode: string;
-  /** (optional) Provide token IDs to match. Globs are allowed (e.g: `["color.*", "shadow.dark"]`) */
-  tokens?: string[];
-  /** Provide CSS selectors to generate. (e.g.: `["@media (prefers-color-scheme: dark)", "[data-color-theme='dark']"]` ) */
-  selectors: string[];
-}
-
-// note: this is NOT an adequate replacement for a CSS AST; this just performs
-// basic deduplication and allows some limited parsing/reformatting before
-// flattening to a CSS string.
-export interface CSSRule {
-  selectors: string[];
-  nestedQuery?: string;
-  declarations: Record<string, string>;
-}
-
-/** Convert CSSRules into a formatted, indented CSS string */
-export function printRules(rules: CSSRule[]): string {
-  const output: string[] = [];
-  for (const rule of rules) {
-    if (!rule.selectors.length || !Object.keys(rule.declarations).length) {
-      continue;
-    }
-
-    const mqSelectors: string[] = [];
-    const joinableSelectors: string[] = [];
-    for (const s of rule.selectors) {
-      (s.startsWith('@') ? mqSelectors : joinableSelectors).push(s);
-    }
-    // @media-query selectors get pushed individually
-    for (const s of mqSelectors) {
-      output.push(_printRule({ ...rule, selectors: [s] }));
-    }
-    // all other selectors get joined as one
-    if (joinableSelectors.length) {
-      output.push(_printRule({ ...rule, selectors: joinableSelectors }));
-    }
-  }
-  return output.join('\n\n');
-}
-
-function _printRule(rule: CSSRule): string {
-  const output: string[] = [];
-  const isMediaQuery = rule.selectors.some((s) => s.startsWith('@'));
-  let indent = '';
-
-  // if both levels are media queries, preserve order
-  if (rule.nestedQuery && isMediaQuery) {
-    output.push(`${indent}${rule.selectors.join(`,\n${indent}`)} {`);
-    indent += '  ';
-    output.push(`${indent}${rule.nestedQuery} {`);
-  }
-  // otherwise if nested query exists but parens aren’t media queries, reverse order (media queries on top)
-  else if (rule.nestedQuery && !isMediaQuery) {
-    output.push(`${indent}${rule.nestedQuery} {`);
-    indent += '  ';
-    output.push(`${indent}${rule.selectors.join(`,\n${indent}`)} {`);
-  }
-  // if no media queries, just print selectors
-  else {
-    output.push(`${indent}${rule.selectors.join(`,\n${indent}`)} {`);
-  }
-  indent += '  ';
-
-  // note: this is ONLY dependent on whether the top level is a media query (ignores nestedQuery)
-  if (isMediaQuery) {
-    output.push(`${indent}:root {`);
-    indent += '  ';
-  }
-
-  for (const [k, v] of Object.entries(rule.declarations)) {
-    output.push(`${indent}${k}: ${v};`);
-  }
-
-  // base closing brackets on indent level
-  while (indent !== '') {
-    indent = indent.substring(0, indent.length - 2);
-    output.push(`${indent}}`);
-  }
-
-  return output.join('\n');
-}
-
-export interface GetRuleOptions {
-  /** Combine a selector with parent selectors (e.g. if adding a @media-query within another selector list) */
-  parentSelectors?: string[];
-}