@astryxdesign/build 0.0.15 → 0.1.0-canary.3047a7c

package/README.md

@@ -100,7 +100,7 @@ module.exports = {
 
 ```js
 const nextConfig = {
-  transpilePackages: ['@astryxdesign/core', '@astryxdesign/theme-default'],
+  transpilePackages: ['@astryxdesign/core', '@astryxdesign/theme-neutral'],
   webpack: config => {
     // Resolve to source TypeScript instead of dist
     config.resolve.conditionNames = ['source', 'import', 'require', 'default'];
@@ -124,7 +124,7 @@ export default nextConfig;
 ```css
 @import './layers.css';
 @import '@astryxdesign/core/reset.css';
-@import '@astryxdesign/theme-default/theme.css';
+@import '@astryxdesign/theme-neutral/theme.css';
 
 @stylex;
 ```
@@ -144,12 +144,12 @@ export default nextConfig;
 ## Vite Setup
 
 ```ts
-import {xdsStylex} from '@astryxdesign/build/vite';
+import {astryxStylex} from '@astryxdesign/build/vite';
 import react from '@vitejs/plugin-react';
 
 export default defineConfig({
   plugins: [
-    ...xdsStylex({
+    ...astryxStylex({
       stylexOptions: {
         dev: process.env.NODE_ENV === 'development',
         runtimeInjection: false,
@@ -168,7 +168,7 @@ export default defineConfig({
     },
   },
   optimizeDeps: {
-    exclude: ['@astryxdesign/core', '@astryxdesign/theme-default'],
+    exclude: ['@astryxdesign/core', '@astryxdesign/theme-neutral'],
   },
 });
 ```

package/dist/vite.mjs

@@ -19,9 +19,9 @@ var LIGHTNINGCSS_TARGETS = {
   firefox: 120 << 16,
   safari: 17 << 16 | 5 << 8
 };
-function xdsStylex(options = {}) {
+function astryxStylex(options = {}) {
   if ("stylexOptions" in options && options.stylexOptions) {
-    return xdsStylexLegacy(options);
+    return astryxStylexLegacy(options);
   }
   const opts = options;
   const {
@@ -48,14 +48,14 @@ function xdsStylex(options = {}) {
     },
     ...stylexOverrides
   };
-  const xdsBabelPlugin = path.resolve(__dirname, "../src/babel.js");
+  const astryxBabelPlugin = path.resolve(__dirname, "../src/babel.js");
   const basePlugin = stylex.vite({
     ...stylexOptions,
     useCSSLayers: true,
     babelConfig: {
       plugins: [
         [
-          xdsBabelPlugin,
+          astryxBabelPlugin,
           {
             ...stylexOptions,
             libraryPrefix: stylexPrefix,
@@ -66,7 +66,7 @@ function xdsStylex(options = {}) {
     }
   });
   const layerOrderPlugin = {
-    name: "xds-css-layer-order",
+    name: "astryx-css-layer-order",
     transformIndexHtml() {
       return [
         {
@@ -78,7 +78,7 @@ function xdsStylex(options = {}) {
     }
   };
   const configPlugin = {
-    name: "xds-config",
+    name: "astryx-config",
     config() {
       let xdsPackages = ["@astryxdesign/core"];
       try {
@@ -106,7 +106,7 @@ function xdsStylex(options = {}) {
     }
   };
   const splitLayerPlugin = {
-    name: "xds-split-layers",
+    name: "astryx-split-layers",
     configureServer(server) {
       let stylexPlugin = null;
       return () => {
@@ -171,7 +171,7 @@ ${productCss}
   };
   return [configPlugin, layerOrderPlugin, basePlugin, splitLayerPlugin];
 }
-function xdsStylexLegacy(options) {
+function astryxStylexLegacy(options) {
   const {
     stylexOptions,
     libraryPattern = LIBRARY_PATTERN,
@@ -180,7 +180,7 @@ function xdsStylexLegacy(options) {
   } = options;
   const libraryLayer = layers.library ?? "astryx-base";
   const productLayer = layers.product ?? "product";
-  const xdsBabelPlugin = path.resolve(__dirname, "../src/babel.js");
+  const astryxBabelPlugin = path.resolve(__dirname, "../src/babel.js");
   const existingPlugins = stylexOptions.babelConfig?.plugins ?? [];
   const basePlugin = stylex.vite({
     ...stylexOptions,
@@ -189,7 +189,7 @@ function xdsStylexLegacy(options) {
       ...stylexOptions.babelConfig,
       plugins: [
         [
-          xdsBabelPlugin,
+          astryxBabelPlugin,
           {
             ...stylexOptions,
             libraryPrefix: stylexPrefix,
@@ -201,7 +201,7 @@ function xdsStylexLegacy(options) {
     }
   });
   const layerOrderPlugin = {
-    name: "xds-css-layer-order",
+    name: "astryx-css-layer-order",
     transformIndexHtml() {
       return [
         {
@@ -213,7 +213,7 @@ function xdsStylexLegacy(options) {
     }
   };
   const splitLayerPlugin = {
-    name: "xds-split-layers",
+    name: "astryx-split-layers",
     configureServer(server) {
       let stylexPlugin = null;
       return () => {
@@ -280,5 +280,5 @@ ${productCss}
 }
 export {
   LIGHTNINGCSS_TARGETS,
-  xdsStylex
+  astryxStylex
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@astryxdesign/build",
-  "version": "0.0.15",
+  "version": "0.1.0-canary.3047a7c",
   "description": "Build plugins for XDS source builds — babel, PostCSS, and Vite integrations",
   "author": "Meta Open Source",
   "license": "MIT",

package/src/babel.js

@@ -18,7 +18,7 @@ const LIBRARY_PATTERNS = [
   'node_modules/@astryxdesign/',
 ];
 
-module.exports = function xdsBabelPlugin(api, options) {
+module.exports = function astryxBabelPlugin(api, options) {
   const stylexPlugin = require('@stylexjs/babel-plugin');
 
   const {
@@ -100,7 +100,7 @@ module.exports = function xdsBabelPlugin(api, options) {
   }
 
   return {
-    name: 'xds-babel-plugin',
+    name: 'astryx-babel-plugin',
     visitor,
   };
 };

package/src/babel.test.mjs

@@ -13,7 +13,7 @@ import {createRequire} from 'node:module';
 
 const require = createRequire(import.meta.url);
 const babel = require('@babel/core');
-const xdsBabelPlugin = require('./babel.js');
+const astryxBabelPlugin = require('./babel.js');
 
 const SOURCE = `
 import * as stylex from '@stylexjs/stylex';
@@ -36,7 +36,7 @@ function transformLibraryFile(libraryPrefix) {
     configFile: false,
     plugins: [
       [
-        xdsBabelPlugin,
+        astryxBabelPlugin,
         {
           ...(libraryPrefix ? {libraryPrefix} : {}),
           unstable_moduleResolution: {type: 'commonJS', rootDir: process.cwd()},

package/src/next.js

@@ -22,10 +22,7 @@
 function withXDS(nextConfig = {}) {
   const xdsPackages = [
     '@astryxdesign/core',
-    '@astryxdesign/theme-default',
     '@astryxdesign/theme-neutral',
-    '@astryxdesign/theme-brutalist',
-    '@astryxdesign/theme-daily',
     '@astryxdesign/lab',
   ];
 

package/src/vite.test.ts

@@ -8,12 +8,12 @@
  */
 
 import {describe, it, expect} from 'vitest';
-import {xdsStylex} from './vite';
+import {astryxStylex} from './vite';
 
 /** Pull the injected `@layer ...;` order statement out of the plugin set. */
-function getLayerOrder(plugins: ReturnType<typeof xdsStylex>): string {
-  const layerPlugin = plugins.find(p => p.name === 'xds-css-layer-order');
-  expect(layerPlugin, 'xds-css-layer-order plugin should exist').toBeTruthy();
+function getLayerOrder(plugins: ReturnType<typeof astryxStylex>): string {
+  const layerPlugin = plugins.find(p => p.name === 'astryx-css-layer-order');
+  expect(layerPlugin, 'astryx-css-layer-order plugin should exist').toBeTruthy();
   const transform = (layerPlugin as any).transformIndexHtml;
   const tags =
     typeof transform === 'function' ? transform() : transform.handler();
@@ -22,24 +22,24 @@ function getLayerOrder(plugins: ReturnType<typeof xdsStylex>): string {
   return styleTag.children as string;
 }
 
-describe('xdsStylex layer order (modern API)', () => {
+describe('astryxStylex layer order (modern API)', () => {
   it('uses the astryx-* layer names (theme layer is astryx-theme)', () => {
-    const order = getLayerOrder(xdsStylex());
+    const order = getLayerOrder(astryxStylex());
     expect(order).toBe('@layer reset, astryx-base, astryx-theme, product;');
   });
 
   it('honors configured library and product layer names', () => {
     const order = getLayerOrder(
-      xdsStylex({layers: {library: 'custom-base', product: 'app'}}),
+      astryxStylex({layers: {library: 'custom-base', product: 'app'}}),
     );
     // The theme layer stays astryx-theme regardless of other layer config.
     expect(order).toBe('@layer reset, custom-base, astryx-theme, app;');
   });
 });
 
-describe('xdsStylex layer order (legacy API)', () => {
+describe('astryxStylex layer order (legacy API)', () => {
   it('uses the astryx-* layer names (theme layer is astryx-theme)', () => {
-    const order = getLayerOrder(xdsStylex({stylexOptions: {}}));
+    const order = getLayerOrder(astryxStylex({stylexOptions: {}}));
     expect(order).toBe('@layer reset, astryx-base, astryx-theme, product;');
   });
 });

package/src/vite.ts

@@ -24,9 +24,9 @@ export const LIGHTNINGCSS_TARGETS = {
 
 /**
  * Legacy options shape — kept for backward compatibility.
- * Prefer the zero-config form: xdsStylex()
+ * Prefer the zero-config form: astryxStylex()
  */
-export interface XDSVitePluginLegacyOptions {
+export interface AstryxVitePluginLegacyOptions {
   stylexOptions: Parameters<typeof stylex.vite>[0];
   libraryPattern?: string;
   /** StyleX atomic class-name prefix for Astryx library styles. @default 'astryx' */
@@ -37,7 +37,7 @@ export interface XDSVitePluginLegacyOptions {
   };
 }
 
-export interface XDSVitePluginOptions {
+export interface AstryxVitePluginOptions {
   /**
    * Whether to enable dev mode for StyleX.
    * @default process.env.NODE_ENV !== 'production'
@@ -99,7 +99,7 @@ export interface XDSVitePluginOptions {
  * Provides sensible defaults for StyleX compilation with Astryx.
  * Just spread into your plugins array:
  *
- *   plugins: [...xdsStylex(), react()]
+ *   plugins: [...astryxStylex(), react()]
  *
  * Handles:
  * - StyleX compilation with correct settings
@@ -109,15 +109,15 @@ export interface XDSVitePluginOptions {
  *
  * @param options — optional overrides
  */
-export function xdsStylex(
-  options: XDSVitePluginOptions | XDSVitePluginLegacyOptions = {},
+export function astryxStylex(
+  options: AstryxVitePluginOptions | AstryxVitePluginLegacyOptions = {},
 ): Plugin[] {
-  // Detect legacy API: xdsStylex({stylexOptions: {...}})
+  // Detect legacy API: astryxStylex({stylexOptions: {...}})
   if ('stylexOptions' in options && options.stylexOptions) {
-    return xdsStylexLegacy(options as XDSVitePluginLegacyOptions);
+    return astryxStylexLegacy(options as AstryxVitePluginLegacyOptions);
   }
 
-  const opts = options as XDSVitePluginOptions;
+  const opts = options as AstryxVitePluginOptions;
   const {
     dev = process.env.NODE_ENV !== 'production',
     rootDir = process.cwd(),
@@ -148,7 +148,7 @@ export function xdsStylex(
 
   // Inject our babel wrapper as a user plugin — it runs before the
   // unplugin's hardcoded StyleX instance and handles prefix routing.
-  const xdsBabelPlugin = path.resolve(__dirname, 'babel.js');
+  const astryxBabelPlugin = path.resolve(__dirname, 'babel.js');
 
   const basePlugin = stylex.vite({
     ...(stylexOptions as any),
@@ -156,7 +156,7 @@ export function xdsStylex(
     babelConfig: {
       plugins: [
         [
-          xdsBabelPlugin,
+          astryxBabelPlugin,
           {
             ...stylexOptions,
             libraryPrefix: stylexPrefix,
@@ -169,7 +169,7 @@ export function xdsStylex(
 
   // Layer order declaration plugin
   const layerOrderPlugin: Plugin = {
-    name: 'xds-css-layer-order',
+    name: 'astryx-css-layer-order',
     transformIndexHtml() {
       return [
         {
@@ -183,7 +183,7 @@ export function xdsStylex(
 
   // Config plugin — injects resolve.alias and optimizeDeps
   const configPlugin: Plugin = {
-    name: 'xds-config',
+    name: 'astryx-config',
     config(): UserConfig {
       // Discover all @astryxdesign/* packages to exclude from pre-bundling.
       // Astryx ships as source that must be compiled by StyleX — pre-bundling
@@ -221,7 +221,7 @@ export function xdsStylex(
 
   // Split-layer interceptor plugin (dev server only)
   const splitLayerPlugin: Plugin = {
-    name: 'xds-split-layers',
+    name: 'astryx-split-layers',
     configureServer(server) {
       let stylexPlugin: any = null;
 
@@ -299,10 +299,10 @@ export function xdsStylex(
 }
 
 /**
- * Legacy implementation — handles the old xdsStylex({stylexOptions: {...}}) API.
+ * Legacy implementation — handles the old astryxStylex({stylexOptions: {...}}) API.
  * Used by Storybook and other existing configs.
  */
-function xdsStylexLegacy(options: XDSVitePluginLegacyOptions): Plugin[] {
+function astryxStylexLegacy(options: AstryxVitePluginLegacyOptions): Plugin[] {
   const {
     stylexOptions,
     libraryPattern = LIBRARY_PATTERN,
@@ -313,7 +313,7 @@ function xdsStylexLegacy(options: XDSVitePluginLegacyOptions): Plugin[] {
   const libraryLayer = layers.library ?? 'astryx-base';
   const productLayer = layers.product ?? 'product';
 
-  const xdsBabelPlugin = path.resolve(__dirname, 'babel.js');
+  const astryxBabelPlugin = path.resolve(__dirname, 'babel.js');
   const existingPlugins = (stylexOptions as any).babelConfig?.plugins ?? [];
 
   const basePlugin = stylex.vite({
@@ -323,7 +323,7 @@ function xdsStylexLegacy(options: XDSVitePluginLegacyOptions): Plugin[] {
       ...(stylexOptions as any).babelConfig,
       plugins: [
         [
-          xdsBabelPlugin,
+          astryxBabelPlugin,
           {
             ...(stylexOptions as any),
             libraryPrefix: stylexPrefix,
@@ -336,7 +336,7 @@ function xdsStylexLegacy(options: XDSVitePluginLegacyOptions): Plugin[] {
   });
 
   const layerOrderPlugin: Plugin = {
-    name: 'xds-css-layer-order',
+    name: 'astryx-css-layer-order',
     transformIndexHtml() {
       return [
         {
@@ -349,7 +349,7 @@ function xdsStylexLegacy(options: XDSVitePluginLegacyOptions): Plugin[] {
   };
 
   const splitLayerPlugin: Plugin = {
-    name: 'xds-split-layers',
+    name: 'astryx-split-layers',
     configureServer(server) {
       let stylexPlugin: any = null;