@astryxdesign/cli 0.6.3-canary.db4e378 → 0.6.3-canary.db52d98

package/assets/templates/blocks/components/Table/TableFloatingBulkActionsTable.tsx

@@ -0,0 +1,139 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+'use client';
+
+import {useState} from 'react';
+import * as stylex from '@stylexjs/stylex';
+import {Button} from '@astryxdesign/core/Button';
+import {ScrollableArea} from '@astryxdesign/core/ScrollableArea';
+import {
+  Table,
+  TableSelectionToolbar,
+  useTableSelection,
+  useTableSelectionState,
+  proportional,
+} from '@astryxdesign/core/Table';
+import type {TableColumn} from '@astryxdesign/core/Table';
+import {
+  colorVars,
+  radiusVars,
+  shadowVars,
+  sizeVars,
+  spacingVars,
+} from '@astryxdesign/core/theme/tokens.stylex';
+
+interface User extends Record<string, unknown> {
+  id: string;
+  name: string;
+  email: string;
+  role: string;
+}
+
+const baseUsers: Array<Pick<User, 'name' | 'email' | 'role'>> = [
+  {name: 'Alice', email: 'alice@example.com', role: 'Engineer'},
+  {name: 'Bob', email: 'bob@example.com', role: 'Designer'},
+  {name: 'Charlie', email: 'charlie@example.com', role: 'Manager'},
+  {name: 'Diana', email: 'diana@example.com', role: 'Engineer'},
+  {name: 'Eve', email: 'eve@example.com', role: 'Admin'},
+];
+
+const users: User[] = Array.from({length: 40}, (_, index) => {
+  const user = baseUsers[index % baseUsers.length];
+  return {...user, id: String(index + 1), name: `${user.name} ${index + 1}`};
+});
+
+const columns: TableColumn<User>[] = [
+  {key: 'name', header: 'Name', width: proportional(1)},
+  {key: 'email', header: 'Email', width: proportional(1)},
+  {key: 'role', header: 'Role', width: proportional(1)},
+];
+
+const styles = stylex.create({
+  page: {
+    maxBlockSize: 640,
+    isolation: 'isolate',
+    scrollbarGutter: 'stable',
+  },
+  metrics: {
+    display: 'grid',
+    gridTemplateColumns: 'repeat(3, minmax(0, 1fr))',
+    gap: spacingVars['--spacing-3'],
+    marginBlockEnd: spacingVars['--spacing-6'],
+  },
+  metricCard: {
+    padding: spacingVars['--spacing-4'],
+    borderRadius: radiusVars['--radius-container'],
+    backgroundColor: colorVars['--color-background-muted'],
+  },
+  metricLabel: {
+    display: 'block',
+    color: colorVars['--color-text-secondary'],
+  },
+  metricValue: {
+    display: 'block',
+    marginBlockStart: spacingVars['--spacing-1'],
+    color: colorVars['--color-text-primary'],
+  },
+  tableRegion: {
+    '--table-bulk-actions-space': `calc(${sizeVars['--size-element-sm']} + ${spacingVars['--spacing-2']} + ${spacingVars['--spacing-2']} + ${spacingVars['--spacing-4']})`,
+    position: 'relative',
+    paddingBlockStart: 'var(--table-bulk-actions-space)',
+  },
+  toolbar: {
+    position: 'sticky',
+    insetBlockStart: `calc(var(--table-bulk-actions-space) + ${spacingVars['--spacing-4']})`,
+    transform: 'translateY(calc(0px - var(--table-bulk-actions-space)))',
+    marginBlockEnd: `calc(${spacingVars['--spacing-4']} - var(--table-bulk-actions-space))`,
+    zIndex: 1,
+    borderRadius: radiusVars['--radius-element'],
+    boxShadow: shadowVars['--shadow-med'],
+  },
+});
+
+export default function TableFloatingBulkActionsTable() {
+  const [selectedKeys, setSelectedKeys] = useState<Set<string>>(new Set());
+
+  const {selectionConfig, selectionState} = useTableSelectionState<User>({
+    data: users,
+    idKey: 'id',
+    selectedKeys,
+    setSelectedKeys,
+  });
+  const selectionPlugin = useTableSelection<User>(selectionConfig);
+
+  return (
+    <ScrollableArea
+      axis="block"
+      label="Bulk actions example"
+      overscroll="contain"
+      xstyle={styles.page}>
+      <div {...stylex.props(styles.metrics)}>
+        {[
+          ['Active users', '12,840'],
+          ['Selection rate', '18.4%'],
+          ['Pending reviews', '247'],
+        ].map(([label, value]) => (
+          <div key={label} {...stylex.props(styles.metricCard)}>
+            <span {...stylex.props(styles.metricLabel)}>{label}</span>
+            <strong {...stylex.props(styles.metricValue)}>{value}</strong>
+          </div>
+        ))}
+      </div>
+      <div {...stylex.props(styles.tableRegion)}>
+        <TableSelectionToolbar
+          selection={selectionState}
+          xstyle={styles.toolbar}
+          startContent={
+            <Button label="Approve" variant="ghost" onClick={() => {}} />
+          }
+        />
+        <Table
+          data={users}
+          columns={columns}
+          idKey="id"
+          plugins={{selection: selectionPlugin}}
+        />
+      </div>
+    </ScrollableArea>
+  );
+}

package/assets/templates/blocks/components/TimeInput/TimeInputConstrained.tsx

@@ -17,6 +17,7 @@ export default function TimeInputConstrained() {
         max={'22:00' as never}
         description="Evening seating: 5 PM – 10 PM"
         placeholder="Select reservation time"
+        presentation="adaptive-bottom-sheet"
         value={evening as never}
         onChange={setEvening as never}
         hasClear

package/assets/templates/themes/butter/butterTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'butter',
+  displayName: 'Butter',
+  description:
+    'Warm, creamy yellows with a friendly blue accent. Playful enough for consumer surfaces, soft enough to stay readable.',
+  maintained: false,
+};

package/assets/templates/themes/chocolate/chocolateTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'chocolate',
+  displayName: 'Chocolate',
+  description:
+    'Warm chocolate theme for Astryx — rich brown palette with Fraunces headings, Albert Sans body, and Lucide icons',
+  maintained: false,
+};

package/assets/templates/themes/gothic/gothicTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'gothic',
+  displayName: 'Gothic',
+  description:
+    'Deep blue-grays and a signature display serif. Dramatic and editorial, for surfaces that want to be remembered.',
+  maintained: false,
+};

package/assets/templates/themes/matcha/matchaTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'matcha',
+  displayName: 'Matcha',
+  description:
+    'Earthy greens with a calm, organic feel. Naturalistic and grounded, great for wellness or content-first apps.',
+  maintained: false,
+};

package/assets/templates/themes/neutral/neutralTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'neutral',
+  displayName: 'Neutral',
+  description:
+    'Restrained warm grays. Minimal and quiet, so the content stays the focus.',
+  maintained: true,
+};

package/assets/templates/themes/stone/stoneTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'stone',
+  displayName: 'Stone',
+  description:
+    'Warm stone and slate, earthy and understated, with just enough character to feel handcrafted.',
+  maintained: false,
+};

package/assets/templates/themes/y2k/y2kTheme.doc.mjs

@@ -0,0 +1,11 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/** @type {import('@astryxdesign/cli/authoring').ThemeDoc} */
+export default {
+  type: 'theme',
+  name: 'y2k',
+  displayName: 'Y2K',
+  description:
+    'Hot pinks, lime greens, and Poppins. Bubbly, playful, and unmistakably retro.',
+  maintained: false,
+};

package/authoring/codemod/codemod.doc.mjs

@@ -12,7 +12,7 @@ export const doc = {
   type: 'schema',
   name: 'codemod',
   displayName: 'Astryx Codemod',
-  namespace: 'cli',
+  namespace: 'authoring',
   description:
     'A codemod module the CLI runs during `astryx upgrade`. Default-export a ' +
     "plain object with a `type` discriminant: 'code' rewrites source files, " +

package/authoring/codemod/type.ts

@@ -128,7 +128,19 @@ export interface CodemodEntry {
 /** The result of running a single codemod over one or more files. */
 export interface CodemodRunResult {
   filesChanged: number;
+  /** Existing owned files changed or previewed by this codemod. */
+  changedFiles: string[];
+  /** Files actually written; empty during a dry run. */
   writtenFiles: string[];
+  /** Existing files that require the change but are protected. */
+  protectedFiles: Array<{
+    file: string;
+    codemod: string;
+    reason: string;
+    declaration: string;
+    generated: boolean;
+    command?: string;
+  }>;
   errors: Array<{file: string; codemod: string; error: string}>;
 }
 

package/authoring/config/config.doc.mjs

@@ -11,7 +11,7 @@ export const doc = {
   type: 'schema',
   name: 'config',
   displayName: 'Astryx Config',
-  namespace: 'cli',
+  namespace: 'authoring',
   description:
     'The optional astryx.config.* file at your project root. Declares which ' +
     'integrations to load, where to route issue links, post-codemod hooks, local ' +

package/authoring/debug/debug.doc.d.mts

@@ -0,0 +1,11 @@
+// @generated by scripts/sync-api-types.mjs from the JSDoc in authoring/**/*.mjs.
+// DO NOT EDIT — run `pnpm sync:api-types` to regenerate.
+
+/**
+ * @file SchemaDoc for DebugEvent, the record of one CLI run.
+ * @input The DebugEvent type beside it (`type.ts`), which `parse.mjs` reads.
+ * @output The `debug-event` section of `astryx docs authoring`.
+ * @position packages/cli/authoring/debug — schema documentation
+ */
+/** @type {import('@astryxdesign/cli/authoring').SchemaDoc} */
+export const doc: import("@astryxdesign/cli/authoring").SchemaDoc;

package/authoring/debug/debug.doc.mjs

@@ -0,0 +1,182 @@
+// Copyright (c) Meta Platforms, Inc. and affiliates.
+
+/**
+ * @file SchemaDoc for DebugEvent, the record of one CLI run.
+ * @input The DebugEvent type beside it (`type.ts`), which `parse.mjs` reads.
+ * @output The `debug-event` section of `astryx docs authoring`.
+ * @position packages/cli/authoring/debug — schema documentation
+ */
+
+/** @type {import('@astryxdesign/cli/authoring').SchemaDoc} */
+export const doc = {
+  type: 'schema',
+  name: 'debug-event',
+  displayName: 'DebugEvent',
+  namespace: 'authoring',
+  description:
+    'One recorded CLI run: what a `debug` handler receives, whether it is set in astryx.config or exported by an integration manifest. There is exactly one event per run, and every field is present by the time a handler sees it.',
+  appliesTo: 'The argument of a `debug` handler',
+  fields: [
+    {
+      name: 'schemaVersion',
+      type: 'DebugSchemaVersion',
+      description:
+        'Version of the recorded shape: 1, 2, or 3. A field that changes meaning gets a new version, so switch on this.',
+      required: true,
+    },
+    {
+      name: 'id',
+      type: 'string',
+      description: 'Unique per run. Deduplicate on it.',
+      required: true,
+    },
+    {
+      name: 'startedAt',
+      type: 'string',
+      description: 'When the run started, as ISO 8601.',
+      required: true,
+    },
+    {
+      name: 'endedAt',
+      type: 'string',
+      description: 'When the run ended, as ISO 8601.',
+      required: true,
+    },
+    {
+      name: 'durationMs',
+      type: 'number',
+      description: 'How long the run took, in milliseconds.',
+      required: true,
+    },
+    {
+      name: 'command',
+      type: 'string',
+      description:
+        'The full command name. Empty when astryx ran without a command.',
+      required: true,
+      example: "'theme build'",
+    },
+    {
+      name: 'commandPath',
+      type: 'string[]',
+      description: 'The command name split into segments.',
+      required: true,
+      example: "['theme', 'build']",
+    },
+    {
+      name: 'argv',
+      type: 'string[]',
+      description: 'The arguments after the binary, scrubbed.',
+      required: true,
+    },
+    {
+      name: 'args',
+      type: 'Record<string, unknown>',
+      description: 'Positional arguments, keyed by their declared names.',
+      required: true,
+    },
+    {
+      name: 'options',
+      type: 'Record<string, unknown>',
+      description: 'The command options, as the CLI resolved them.',
+      required: true,
+    },
+    {
+      name: 'optionSources',
+      type: 'Record<string, DebugOptionSource>',
+      description:
+        "Where each option value came from: 'cli', 'default', 'env', 'config', or 'implied'. The keys match `options`.",
+      required: true,
+    },
+    {
+      name: 'globalOptions',
+      type: 'Record<string, unknown>',
+      description: 'The root flags, such as --json, --detail, and --lang.',
+      required: true,
+    },
+    {
+      name: 'outcome',
+      type: 'DebugOutcome',
+      description:
+        "How the run ended: 'ok', 'error', 'parse-error', 'fatal', 'rejected', or 'incomplete'.",
+      required: true,
+    },
+    {
+      name: 'exitCode',
+      type: 'number',
+      description:
+        'The process exit code. When a signal ended the run, 128 plus the signal number.',
+      required: true,
+    },
+    {
+      name: 'signal',
+      type: 'string',
+      description:
+        "The signal that ended the run, such as 'SIGINT'. Null otherwise.",
+      required: true,
+    },
+    {
+      name: 'error',
+      type: 'DebugEventError',
+      description:
+        'The failure: `name`, `message`, `code`, and `stack`. Branch on `code`, never on `message`. Null when nothing failed.',
+      required: true,
+    },
+    {
+      name: 'output',
+      type: 'DebugEventOutput',
+      description:
+        'What the run answered with: JSON mode, the envelope types, the result count and kind, and the stdout and stderr it printed, scrubbed and cut at the capture limit.',
+      required: true,
+    },
+    {
+      name: 'env',
+      type: 'DebugEventEnv',
+      description:
+        'Runtime facts: the CLI and Node versions, platform, CI, package manager, and whether a person, an AI agent, or automation ran the command. It never holds a hostname, a user name, or a raw session ID.',
+      required: true,
+    },
+    {
+      name: 'project',
+      type: 'DebugEventProject',
+      description:
+        'The project the command ran in, as flags and counts. It never holds package names.',
+      required: true,
+    },
+    {
+      name: 'redacted',
+      type: 'boolean',
+      description:
+        'Whether the values in the record were scrubbed. It is true on every event a handler receives. When it is false, treat the log as sensitive.',
+      required: true,
+    },
+  ],
+  examples: [
+    {
+      label: 'Keep a local log of the runs that failed',
+      code:
+        "import {appendFileSync} from 'node:fs';\n\n" +
+        'export default {\n' +
+        '  debug: event => {\n' +
+        "    if (event.outcome !== 'ok') {\n" +
+        "      appendFileSync('failed-runs.ndjson', JSON.stringify(event) + '\\n');\n" +
+        '    }\n' +
+        '  },\n' +
+        '};',
+    },
+  ],
+  notes: [
+    {
+      type: 'prose',
+      text: 'The shape only grows: fields are added, never removed or given a new meaning. When a meaning must change, `schemaVersion` gets a new value. In version 3, a null `output.resultKind` means the run never reached an answer, so do not count it together with a version 1 or 2 null.',
+    },
+    {
+      type: 'prose',
+      text: 'The handler runs synchronously as the process exits, so a promise it returns is never awaited. It gets a copy of the event, and anything it throws is ignored.',
+    },
+    {
+      type: 'prose',
+      text: 'Import DebugEventOutput, DebugEventEnv, DebugEventProject, and DebugEventError from @astryxdesign/cli/authoring for the fields of `output`, `env`, `project`, and `error`.',
+    },
+  ],
+};

package/authoring/debug/parse.d.mts

@@ -52,8 +52,8 @@ declare const eventSchema: z.ZodObject<{
     }>>;
     globalOptions: z.ZodRecord<z.ZodString, z.ZodUnknown>;
     outcome: z.ZodEnum<{
-        ok: "ok";
         error: "error";
+        ok: "ok";
         "parse-error": "parse-error";
         fatal: "fatal";
         rejected: "rejected";
@@ -79,8 +79,8 @@ declare const eventSchema: z.ZodObject<{
             component: "component";
             command: "command";
             hook: "hook";
-            doc: "doc";
             template: "template";
+            doc: "doc";
             integration: "integration";
             migration: "migration";
             mixed: "mixed";
@@ -106,10 +106,10 @@ declare const eventSchema: z.ZodObject<{
         agentSessionIdHash: z.ZodDefault<z.ZodNullable<z.ZodString>>;
         agentSessionIdSource: z.ZodDefault<z.ZodNullable<z.ZodString>>;
         invocationSource: z.ZodDefault<z.ZodEnum<{
+            unknown: "unknown";
             human: "human";
             ai: "ai";
             automation: "automation";
-            unknown: "unknown";
         }>>;
         oneOff: z.ZodBoolean;
         packageManager: z.ZodNullable<z.ZodString>;