refactor(motion): drop the exported easing preset

CSS Forge ships no other preset constants. The README shows the two
curves written out in a motion config instead.

Refs #83

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Author: Hebilicious

.changeset/issue-83-motion.md

@@ -7,4 +7,3 @@ Add a `motion` module for transition durations and easing curves.
 - `motion.duration.<group>.value` and `motion.easing.<group>.value` emit `--motion-duration-<group>-<name>` and `--motion-easing-<group>-<name>`, referenced from primitives as `motion.duration.<group>.<name>` and `motion.easing.<group>.<name>`.
 - A duration must be a non-negative number with `ms` or `s`, and an easing a CSS keyword, `cubic-bezier()` with x1 and x2 in [0, 1], `steps()` or `linear()`. Anything else fails generation with the token's path.
 - A duration over 300ms warns (`motion-long-duration`), or over 500ms in a group with `settings.long: true` for modals and drawers. `ease-in` and ease-in shaped `cubic-bezier()` curves warn (`motion-ease-in`). Both go through `getDiagnostics` and the CLI's `cssforge: warning:` output.
-- `uiEasings` exports the two recommended curves, `out` and `inOut`, to spread into an easing group. Nothing is added unless a config spreads it.

README.md

@@ -1697,10 +1697,9 @@ holds its tokens under `value`, emitted as `--motion-duration-<group>-<name>` an
 
 Anything else fails the build with the token's configuration path.
 
-`uiEasings`, exported from `@hebilicious/cssforge`, holds the two curves recommended for UI motion: `out`,
-`cubic-bezier(0.23, 1, 0.32, 1)`, for things entering or reacting, and `inOut`,
-`cubic-bezier(0.77, 0, 0.175, 1)`, for things moving on screen. Spread it into an easing
-group; nothing is added unless you do.
+Two curves work well for UI motion: an ease-out, `cubic-bezier(0.23, 1, 0.32, 1)`, for things
+entering or reacting, and an ease-in-out, `cubic-bezier(0.77, 0, 0.175, 1)`, for things moving
+on screen.
 
 <!-- md:generate defineConfig
 export default defineConfig({
@@ -1710,7 +1709,12 @@ export default defineConfig({
       overlay: { value: { drawer: "400ms" }, settings: { long: true } },
     },
     easing: {
-      ui: { value: { ...uiEasings } },
+      ui: {
+        value: {
+          out: "cubic-bezier(0.23, 1, 0.32, 1)",
+          inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+        },
+      },
     },
   },
 });
@@ -1724,7 +1728,12 @@ export default defineConfig({
       overlay: { value: { drawer: "400ms" }, settings: { long: true } },
     },
     easing: {
-      ui: { value: { ...uiEasings } },
+      ui: {
+        value: {
+          out: "cubic-bezier(0.23, 1, 0.32, 1)",
+          inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+        },
+      },
     },
   },
 });

packages/cssforge/README.md

@@ -1697,10 +1697,9 @@ holds its tokens under `value`, emitted as `--motion-duration-<group>-<name>` an
 
 Anything else fails the build with the token's configuration path.
 
-`uiEasings`, exported from `@hebilicious/cssforge`, holds the two curves recommended for UI motion: `out`,
-`cubic-bezier(0.23, 1, 0.32, 1)`, for things entering or reacting, and `inOut`,
-`cubic-bezier(0.77, 0, 0.175, 1)`, for things moving on screen. Spread it into an easing
-group; nothing is added unless you do.
+Two curves work well for UI motion: an ease-out, `cubic-bezier(0.23, 1, 0.32, 1)`, for things
+entering or reacting, and an ease-in-out, `cubic-bezier(0.77, 0, 0.175, 1)`, for things moving
+on screen.
 
 <!-- md:generate defineConfig
 export default defineConfig({
@@ -1710,7 +1709,12 @@ export default defineConfig({
       overlay: { value: { drawer: "400ms" }, settings: { long: true } },
     },
     easing: {
-      ui: { value: { ...uiEasings } },
+      ui: {
+        value: {
+          out: "cubic-bezier(0.23, 1, 0.32, 1)",
+          inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+        },
+      },
     },
   },
 });
@@ -1724,7 +1728,12 @@ export default defineConfig({
       overlay: { value: { drawer: "400ms" }, settings: { long: true } },
     },
     easing: {
-      ui: { value: { ...uiEasings } },
+      ui: {
+        value: {
+          out: "cubic-bezier(0.23, 1, 0.32, 1)",
+          inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
+        },
+      },
     },
   },
 });

packages/cssforge/scripts/update-readme.ts

@@ -48,7 +48,7 @@ function wrapSource(tsSource: string): string {
 		tsSource,
 	);
 	const srcModUrl = pathToFileURL(join(PACKAGE_ROOT, "src", "mod.ts")).href;
-	const importLine = `import { defineConfig, uiEasings } from "${srcModUrl}";\n`;
+	const importLine = `import { defineConfig } from "${srcModUrl}";\n`;
 
 	let normalized = tsSource.trim();
 	if (!hasDefaultExport) {

packages/cssforge/src/mod.ts

@@ -13,7 +13,7 @@ import { generateCSS, generateStyleDictionaryJSON, getDiagnostics } from "./gene
 import { InvalidNameError } from "./helpers.ts";
 import { loadConfig } from "./loader.ts";
 import { processColors } from "./modules/colors.ts";
-import { processMotion, uiEasings } from "./modules/motion.ts";
+import { processMotion } from "./modules/motion.ts";
 import { processPrimitives } from "./modules/primitive.ts";
 import { processSpacing } from "./modules/spacing.ts";
 import { processTypography } from "./modules/typography.ts";
@@ -72,15 +72,6 @@ export {
 	 * @returns The diagnostics, in module order.
 	 */
 	getDiagnostics,
-	/**
-	 * The two easing curves recommended for UI motion, to spread into an
-	 * easing group's `value`. They are not added unless a config spreads them.
-	 * @example
-	 * ```ts
-	 * defineConfig({ motion: { easing: { ui: { value: { ...uiEasings } } } } });
-	 * ```
-	 */
-	uiEasings,
 	/**
 	 * Thrown when a configuration name cannot produce a valid CSS custom property
 	 * name or reference. Catch it with `instanceof` to handle a name validation

packages/cssforge/src/modules/motion.ts

@@ -37,19 +37,6 @@ export interface MotionConfig {
 	};
 }
 
-/**
- * The two easing curves recommended for UI motion, to spread into an
- * easing group's `value`. They are not added unless a config spreads them.
- * @example
- * ```ts
- * defineConfig({ motion: { easing: { ui: { value: { ...uiEasings } } } } });
- * ```
- */
-export const uiEasings = Object.freeze({
-	out: "cubic-bezier(0.23, 1, 0.32, 1)",
-	inOut: "cubic-bezier(0.77, 0, 0.175, 1)",
-} as const);
-
 const MAX_UI_DURATION_MS = 300;
 const MAX_LONG_DURATION_MS = 500;
 
@@ -223,7 +210,7 @@ const formatMs = (ms: number) => `${Number(ms.toFixed(3))}ms`;
  *     ui: { value: { press: "120ms", dropdown: "200ms" } },
  *     overlay: { value: { modal: "400ms" }, settings: { long: true } },
  *   },
- *   easing: { ui: { value: { ...uiEasings } } },
+ *   easing: { ui: { value: { out: "cubic-bezier(0.23, 1, 0.32, 1)" } } },
  * });
  * ```
  */
@@ -300,7 +287,7 @@ export function processMotion(motion: MotionConfig): Output {
 		(value, path) => {
 			const points = readEasing(value, path);
 			if (!points || !isEaseInShaped(points)) return undefined;
-			return `Motion easing ${path} is ease-in shaped: it starts slow and ends fast, which reads as lag on UI. Use an ease-out curve such as ${uiEasings.out}, or ${uiEasings.inOut} for movement on screen.`;
+			return `Motion easing ${path} is ease-in shaped: it starts slow and ends fast, which reads as lag on UI. Use an ease-out curve such as cubic-bezier(0.23, 1, 0.32, 1), or an ease-in-out curve such as cubic-bezier(0.77, 0, 0.175, 1) for movement on screen.`;
 		},
 	);
 

packages/cssforge/tests/motion.test.ts

@@ -5,7 +5,6 @@ import {
 	generateStyleDictionaryJSON,
 	getDiagnostics,
 	processMotion,
-	uiEasings,
 } from "../src/mod.ts";
 import { assert, assertEquals, assertThrows, Deno } from "./vitest-compat.ts";
 
@@ -359,22 +358,3 @@ Deno.test("motion - ease-out, ease-in-out and linear curves do not warn", () =>
 		assertEquals(getDiagnostics(easing(value)), [], value);
 	}
 });
-
-Deno.test("motion - uiEasings is a preset spread into an easing group", () => {
-	assertEquals(
-		{ ...uiEasings },
-		{ out: "cubic-bezier(0.23, 1, 0.32, 1)", inOut: "cubic-bezier(0.77, 0, 0.175, 1)" },
-	);
-
-	const config = motion({ easing: { ui: { value: { ...uiEasings } } } });
-	const css = generateCSS(config);
-	assert(css.includes("--motion-easing-ui-out: cubic-bezier(0.23, 1, 0.32, 1);"), css);
-	assert(css.includes("--motion-easing-ui-inOut: cubic-bezier(0.77, 0, 0.175, 1);"), css);
-	assertEquals(getDiagnostics(config), []);
-});
-
-Deno.test("motion - the preset is not injected without an easing group", () => {
-	const css = generateCSS(duration("120ms"));
-	assert(!css.includes("--motion-easing"), css);
-	assert(!css.includes("cubic-bezier"), css);
-});

skills/cssforge/references/source-schema-map.md

@@ -87,8 +87,6 @@ color output settings.
 - Warnings: `motion-long-duration` per duration over the threshold and `motion-ease-in` per
   `ease-in` or ease-in shaped `cubic-bezier()` (slope at the start below 1 and at the end
   above 1), with the token path as `path`.
-- `uiEasings` (`out`, `inOut`) is an exported preset to spread into an easing group's
-  `value`; nothing is added unless spread.
 
 ## Derived colors
 
@@ -116,7 +114,7 @@ color output settings.
 
 ## Exposed API entrypoint
 
-- `packages/cssforge/src/mod.ts` exports `defineConfig`, `generateCSS`, `getDiagnostics`, `uiEasings`, the processing helpers,
+- `packages/cssforge/src/mod.ts` exports `defineConfig`, `generateCSS`, `getDiagnostics`, the processing helpers,
   and the config and token types (`CSSForgeConfig`, `MotionConfig`, `MotionDurationSettings`, `ColorFormatConfig`, `ColorMix`, `HexFormatOutputs`,
   `RgbFormatOutputs`, `ColorSettings`, `ColorThemesSettings`, `LightDarkSettings`,
   `LightDarkColorScheme`, `ColorFormat`, `HexColorValues`, `RgbColorValues`,

skills/cssforge/references/token-patterns.md

@@ -31,8 +31,7 @@ All patterns below are derived from README configuration examples.
 ## Motion
 
 - Durations under `motion.duration.<group>.value` in `ms` or `s`; easings under
-  `motion.easing.<group>.value`. Spread `uiEasings` into an easing group for the two
-  recommended curves.
+  `motion.easing.<group>.value`.
 - Durations over 300ms warn unless the group sets `settings.long` (modals, drawers: 500ms).
   `ease-in` and ease-in shaped `cubic-bezier()` curves warn.