@clay-design-system/tokens 0.14.1 → 0.15.0

package/MIGRATION.md

@@ -0,0 +1,25 @@
+# Migrating `@clay-design-system/tokens` (Phase 2 release)
+
+This release adds a CommonJS entry. Nothing is removed, so ESM consumers change nothing.
+
+## New: `require()` and `import` conditions
+
+`.` and `./mq` now have nested `import` and `require` conditions, each with its own `types` (`.d.ts` for ESM, `.d.cts` for CJS):
+
+```js
+const { mq, breakpoints } = require('@clay-design-system/tokens/mq')   // dist/mq.cjs
+const tokens = require('@clay-design-system/tokens')                    // dist/index.cjs
+```
+
+The CJS and ESM builds expose the same 1,142 constants with the same values. The tokens package has no dependencies, so `require()`
+works on any supported Node version.
+
+## Fixed: type declarations
+
+`dist/index.d.ts` now declares all 1,142 constants (ten long-valued shadow and font-family constants were missing) and no longer
+declares a `tokens` export that never existed at runtime. If you imported `tokens` as a type, import the constants you need instead.
+
+## Unchanged, and one new subpath
+
+`./css` (`dist/tokens.css`), `./css-resolved` and `./stylelint-plugin/*` (ESM files loaded by stylelint's config). `./package.json` is a new exported subpath.
+Packed size grew from 0.05 MB to 0.07 MB for the CJS twins and declarations.

package/README.md

@@ -65,8 +65,8 @@ src/
 
 - `dist/tokens.css` (`@clay-design-system/tokens/css`) — every tier as CSS custom properties on `:root`; aliases stay `var()` so changes cascade
 - `dist/tokens.resolved.css` (`@clay-design-system/tokens/css-resolved`) — the same with literal values
-- `dist/tokens.js` + `.d.ts` (`@clay-design-system/tokens`) — JS constants (used by `@clay-design-system/email`)
-- `dist/mq.js` (`@clay-design-system/tokens/mq`) — `mq` / `breakpoints` media-query helpers
+- `dist/tokens.js` + `.d.ts` (`@clay-design-system/tokens`) — JS constants (used by `@clay-design-system/email`); `dist/index.cjs` + `.d.cts` for `require()`
+- `dist/mq.js` / `mq.cjs` (`@clay-design-system/tokens/mq`) — `mq` / `breakpoints` media-query helpers, ESM and CJS
 - `dist/TOKEN_REFERENCE.md` — a generated listing of every token
 
 ## Usage

package/dist/index.cjs

@@ -0,0 +1,2 @@
+'use strict';
+module.exports = require('./tokens.cjs');

package/dist/index.d.cts

@@ -0,0 +1 @@
+export * from './tokens.cjs';

package/dist/index.d.ts

@@ -1,2 +1 @@
-export declare const tokens: Record<string, string | number>;
 export * from './tokens.js';

package/dist/mq.cjs

@@ -0,0 +1,20 @@
+'use strict';
+// Auto-generated by @clay-design-system/tokens build from src/semantic/breakpoints.json — do not edit.
+const breakpoints = {
+  mobile: 0,
+  largeMobile: 480,
+  tablet: 768,
+  laptop: 992,
+  smallDesktop: 1024,
+  desktop: 1280,
+};
+
+const mq = {
+  largeMobile:  '@media (min-width: 480px)',
+  tablet:       '@media (min-width: 768px)',
+  laptop:       '@media (min-width: 992px)',
+  smallDesktop: '@media (min-width: 1024px)',
+  desktop:      '@media (min-width: 1280px)',
+};
+
+module.exports = { breakpoints, mq };

package/dist/mq.d.cts

@@ -0,0 +1,17 @@
+// Auto-generated by @clay-design-system/tokens build from src/semantic/breakpoints.json — do not edit.
+export declare const breakpoints: {
+  mobile: 0;
+  largeMobile: 480;
+  tablet: 768;
+  laptop: 992;
+  smallDesktop: 1024;
+  desktop: 1280;
+};
+
+export declare const mq: {
+  largeMobile: string;
+  tablet: string;
+  laptop: string;
+  smallDesktop: string;
+  desktop: string;
+};