@astryxdesign/core 0.1.7 → 0.1.8-canary.c5fa19b

package/src/postinstall.test.mjs

@@ -0,0 +1,71 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file Guardrail tests for the @astryxdesign/core postinstall nudge (layer 1).
+ *
+ * The marker check mirrors the CLI's single source of truth (core can't import
+ * the CLI). Tests that it detects the marker across EVERY agent-doc location
+ * (incl. Hermes) + legacy markers, and that the nudge decision matrix is correct.
+ */
+
+import {describe, it, expect, beforeEach, afterEach} from 'vitest';
+import * as fs from 'node:fs';
+import * as os from 'node:os';
+import * as path from 'node:path';
+import {isAstryxInitialized, shouldNudge} from '../scripts/postinstall.mjs';
+
+const MARKER = '<!-- ASTRYX:START -->';
+
+let tmp;
+beforeEach(() => {
+  tmp = fs.mkdtempSync(path.join(os.tmpdir(), 'astryx-core-postinstall-'));
+});
+afterEach(() => {
+  fs.rmSync(tmp, {recursive: true, force: true});
+});
+function write(rel, body) {
+  const p = path.join(tmp, rel);
+  fs.mkdirSync(path.dirname(p), {recursive: true});
+  fs.writeFileSync(p, body);
+}
+
+describe('core postinstall — isAstryxInitialized (mirrors CLI contract)', () => {
+  it('is false in an empty project', () => {
+    expect(isAstryxInitialized(tmp)).toBe(false);
+  });
+
+  it.each(['AGENTS.md', 'CLAUDE.md', '.claude/CLAUDE.md', '.cursorrules', '.hermes.md', 'HERMES.md'])(
+    'detects the marker in %s',
+    file => {
+      write(file, `# doc\n${MARKER}\nbody`);
+      expect(isAstryxInitialized(tmp)).toBe(true);
+    },
+  );
+
+  it('detects the legacy XDS marker', () => {
+    write('AGENTS.md', '<!-- XDS:START -->');
+    expect(isAstryxInitialized(tmp)).toBe(true);
+  });
+});
+
+describe('core postinstall — shouldNudge', () => {
+  const DEP = '/proj/node_modules/@astryxdesign/core/scripts/postinstall.mjs';
+  const NPX = '/Users/x/.npm/_npx/a1/node_modules/@astryxdesign/core/scripts/postinstall.mjs';
+  const REPO = '/repo/packages/core/scripts/postinstall.mjs';
+
+  it('nudges for a real dependency install when not set up', () => {
+    expect(shouldNudge({scriptPath: DEP, npmCommand: 'install', isSetUp: false})).toBe(true);
+  });
+  it('quiet in the monorepo/source', () => {
+    expect(shouldNudge({scriptPath: REPO, npmCommand: 'install', isSetUp: false})).toBe(false);
+  });
+  it('quiet during npx transient install (_npx path)', () => {
+    expect(shouldNudge({scriptPath: NPX, npmCommand: 'install', isSetUp: false})).toBe(false);
+  });
+  it('quiet during npx (npm_command=exec)', () => {
+    expect(shouldNudge({scriptPath: DEP, npmCommand: 'exec', isSetUp: false})).toBe(false);
+  });
+  it('quiet once set up', () => {
+    expect(shouldNudge({scriptPath: DEP, npmCommand: 'install', isSetUp: true})).toBe(false);
+  });
+});

package/src/theme/Theme.doc.mjs

@@ -39,12 +39,12 @@ export const docs = {
   },
   usage: {
     description:
-      'Wraps a subtree with a specific Astryx theme. For static production themes, use `npx astryx theme build` and import the generated CSS plus built theme object for first-paint and SSR performance. Use runtime `defineTheme()` when themes are dynamic or for prototyping.\n\n`defineTheme` accepts a `tokens` object whose keys are CSS custom property names (always prefixed with `--`). Common token names include `--color-accent`, `--color-background-surface`, `--color-background-body`, `--color-text-primary`, `--color-text-secondary`, `--radius-container`, `--spacing-1` through `--spacing-6`. Values can be a string (same for light/dark) or a `[light, dark]` tuple.\n\nExample:\n```ts\nimport {defineTheme} from \'@astryxdesign/core/theme\';\nconst myTheme = defineTheme({\n  name: \'ocean\',\n  tokens: {\n    \'--color-accent\': [\'#0077B6\', \'#48CAE4\'],\n    \'--color-background-surface\': [\'#F0F8FF\', \'#0A1628\'],\n    \'--color-text-primary\': [\'#0A1317\', \'#FFFFFF\'],\n    \'--radius-container\': \'16px\',\n  },\n});\n```',
+      'Wraps a subtree with a specific Astryx theme. For static production themes, use `astryx theme build` and import the generated CSS plus built theme object for first-paint and SSR performance. Use runtime `defineTheme()` when themes are dynamic or for prototyping.\n\n`defineTheme` accepts a `tokens` object whose keys are CSS custom property names (always prefixed with `--`). Common token names include `--color-accent`, `--color-background-surface`, `--color-background-body`, `--color-text-primary`, `--color-text-secondary`, `--radius-container`, `--spacing-1` through `--spacing-6`. Values can be a string (same for light/dark) or a `[light, dark]` tuple.\n\nExample:\n```ts\nimport {defineTheme} from \'@astryxdesign/core/theme\';\nconst myTheme = defineTheme({\n  name: \'ocean\',\n  tokens: {\n    \'--color-accent\': [\'#0077B6\', \'#48CAE4\'],\n    \'--color-background-surface\': [\'#F0F8FF\', \'#0A1628\'],\n    \'--color-text-primary\': [\'#0A1317\', \'#FFFFFF\'],\n    \'--radius-container\': \'16px\',\n  },\n});\n```',
     bestPractices: [
       {
         guidance: true,
         description:
-          'Build app themes that are known ahead of time with `npx astryx theme build`, then import the generated CSS and built theme object.',
+          'Build app themes that are known ahead of time with `astryx theme build`, then import the generated CSS and built theme object.',
       },
       {
         guidance: true,
@@ -90,12 +90,12 @@ export const docs = {
 export const docsDense = {
   usage: {
     description:
-      'Wraps subtree w/ specific Astryx theme. For static production themes, use `npx astryx theme build` + generated CSS + built theme object for first-paint/SSR performance. Use runtime `defineTheme()` for dynamic themes or prototyping. Token names always start with `--` (e.g. `--color-accent`, `--color-background-surface`).',
+      'Wraps subtree w/ specific Astryx theme. For static production themes, use `astryx theme build` + generated CSS + built theme object for first-paint/SSR performance. Use runtime `defineTheme()` for dynamic themes or prototyping. Token names always start with `--` (e.g. `--color-accent`, `--color-background-surface`).',
     bestPractices: [
       {
         guidance: true,
         description:
-          'Build app themes known ahead of time w/ `npx astryx theme build`; import generated CSS + built theme object.',
+          'Build app themes known ahead of time w/ `astryx theme build`; import generated CSS + built theme object.',
       },
       {
         guidance: true,

package/src/theme/Theme.tsx

@@ -127,7 +127,7 @@ function useThemeStyleInjection(theme: DefinedTheme): void {
           `For better performance, use the pre-built theme:\n\n` +
           `  import {${theme.name}Theme} from '@astryxdesign/theme-${theme.name}/built';\n` +
           `  import '@astryxdesign/theme-${theme.name}/theme.css';\n\n` +
-          `For custom themes, run \`npx astryx theme build <file>\` to generate ` +
+          `For custom themes, run \`npx @astryxdesign/cli theme build <file>\` to generate ` +
           `the built artifacts.`,
       );
     }

package/src/theme/defineTheme.ts

@@ -5,7 +5,7 @@
  *
  * Two distribution modes:
  * - Unbuilt: Theme generates CSS and injects a <style> tag at runtime
- * - Built: `npx astryx theme build` pre-compiles to a CSS file; Theme just
+ * - Built: `astryx theme build` pre-compiles to a CSS file; Theme just
  *   sets the data-astryx-theme attribute
  *
  * Token values can be:

package/src/theme/hct.ts

@@ -114,10 +114,6 @@ export function toneToY(tone: number): number {
   return labFInv((tone + 16) / 116);
 }
 
-export function yToTone(y: number): number {
-  return 116 * labF(y) - 16;
-}
-
 // =============================================================================
 // Hex <-> RGB
 // =============================================================================

package/dist/TreeList/treeListItem.markers.stylex.d.ts

@@ -1,16 +0,0 @@
-/**
- * @file treeListItem.markers.stylex.ts
- * @input Uses StyleX defineMarker
- * @output Exports treeItemScope marker
- * @position Scoped marker; consumed by TreeListItem.tsx
- *
- * SYNC: When modified, update /packages/core/src/TreeList/TreeListItem.tsx
- */
-import * as stylex from '@stylexjs/stylex';
-/**
- * Scoped marker placed on each treeitem row (`<li role="treeitem">`).
- * Binds the row's `:focus-visible` outline to its OWN treeitem, so focusing
- * a parent treeitem does not leak the focus ring onto descendant rows.
- */
-export declare const treeItemScope: ReturnType<typeof stylex.defineMarker>;
-//# sourceMappingURL=treeListItem.markers.stylex.d.ts.map

package/dist/TreeList/treeListItem.markers.stylex.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"treeListItem.markers.stylex.d.ts","sourceRoot":"","sources":["../../src/TreeList/treeListItem.markers.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;GAOG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAE3C;;;;GAIG;AACH,eAAO,MAAM,aAAa,EAAE,UAAU,CAAC,OAAO,MAAM,CAAC,YAAY,CAC1C,CAAC"}

package/dist/TreeList/treeListItem.markers.stylex.js

@@ -1,22 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-/**
- * @file treeListItem.markers.stylex.ts
- * @input Uses StyleX defineMarker
- * @output Exports treeItemScope marker
- * @position Scoped marker; consumed by TreeListItem.tsx
- *
- * SYNC: When modified, update /packages/core/src/TreeList/TreeListItem.tsx
- */
-
-import * as stylex from '@stylexjs/stylex';
-
-/**
- * Scoped marker placed on each treeitem row (`<li role="treeitem">`).
- * Binds the row's `:focus-visible` outline to its OWN treeitem, so focusing
- * a parent treeitem does not leak the focus ring onto descendant rows.
- */
-export const treeItemScope = {
-  x1g2q90y: "x1g2q90y",
-  $$css: true
-};

package/src/TreeList/treeListItem.markers.stylex.ts

@@ -1,20 +0,0 @@
-// Copyright (c) Meta Platforms, Inc. and affiliates.
-
-/**
- * @file treeListItem.markers.stylex.ts
- * @input Uses StyleX defineMarker
- * @output Exports treeItemScope marker
- * @position Scoped marker; consumed by TreeListItem.tsx
- *
- * SYNC: When modified, update /packages/core/src/TreeList/TreeListItem.tsx
- */
-
-import * as stylex from '@stylexjs/stylex';
-
-/**
- * Scoped marker placed on each treeitem row (`<li role="treeitem">`).
- * Binds the row's `:focus-visible` outline to its OWN treeitem, so focusing
- * a parent treeitem does not leak the focus ring onto descendant rows.
- */
-export const treeItemScope: ReturnType<typeof stylex.defineMarker> =
-  stylex.defineMarker();