noecosystem-design 0.1.1 → 0.1.3

package/README.md

@@ -10,9 +10,10 @@ registry metadata, reference apps, documentation, and verification contracts.
 # Give a coding agent the NOE source context.
 npm install noecosystem-design
 
-# The agent starts with these two files after installation:
+# The agent starts with these files after installation:
 cat node_modules/noecosystem-design/AGENTS.md
 cat node_modules/noecosystem-design/llms.txt
+cat node_modules/noecosystem-design/docs/design-system/gpt-agent-prompt.md
 
 # For a writable, verifiable workspace, use a repository checkout.
 git clone https://github.com/NOrchestration/noe-design-system.git
@@ -26,13 +27,11 @@ Read [`AGENTS.md`](AGENTS.md) before changing code. Use [`llms.txt`](llms.txt) a
 retrieval map, then read the affected package and component records. The canonical
 catalog is [`packages/registry/manifest.json`](packages/registry/manifest.json).
 
-Give an agent this task instruction after installation:
-
-> Read `node_modules/noecosystem-design/AGENTS.md` and `llms.txt` first. Find the
-> requested capability in `packages/registry/manifest.json`, reuse the documented
-> NOE pattern where appropriate, and report the files consulted plus executed
-> verification. Do not treat the package as a runtime import or the external registry
-> URL as deployed.
+For a GPT coding agent, copy
+[`docs/design-system/gpt-agent-prompt.md`](docs/design-system/gpt-agent-prompt.md),
+replace `<TARGET_REPOSITORY>` and `<DESCRIBE THE REQUESTED OUTCOME...>`, and send it
+as one task prompt. The template carries static NOE context once; put only the
+requested outcome, scope, and non-negotiable constraints in its `Task` section.
 
 ## What `noecosystem-design` is — and is not
 
@@ -87,4 +86,6 @@ packages/registry       Canonical component catalog and install metadata
 
 See [`docs/design-system/README.md`](docs/design-system/README.md) for the focused
 documentation index and [`docs/design-system/agent-guide.md`](docs/design-system/agent-guide.md)
-for the complete coding-agent workflow.
+for the coding-agent workflow. The ready-to-paste
+[`docs/design-system/gpt-agent-prompt.md`](docs/design-system/gpt-agent-prompt.md)
+is the recommended task wrapper for GPT.

package/apps/showcase/src/catalog/catalog-index.tsx

@@ -261,9 +261,7 @@ export const catalogEntries: readonly CatalogEntry[] = [
     preview: ({ t }) => (
       <div style={{ display: 'grid', gap: '0.5rem', fontSize: '0.875rem' }}>
         <AutoDirectionText>{t('catalog.preview.bidi.autoText')}</AutoDirectionText>
-        <BidiText>
-          PR #482 {t('catalog.preview.bidi.related')}
-        </BidiText>
+        <BidiText>PR #482 {t('catalog.preview.bidi.related')}</BidiText>
         <TechnicalValue>a1b2c3d4 · mcp://fs/read</TechnicalValue>
         <span dir="ltr" style={{ fontFamily: 'var(--font-sf-pro, var(--noe-font-family-sans))' }}>
           <LocalizedNumber value={128942.5} locale="en" /> ·{' '}
@@ -491,7 +489,9 @@ export const catalogEntries: readonly CatalogEntry[] = [
     package: '@noe/ui',
     registryItem: null,
     preview: () => (
-      <div style={{ display: 'flex', flexDirection: 'column', gap: '0.75rem', alignItems: 'center' }}>
+      <div
+        style={{ display: 'flex', flexDirection: 'column', gap: '0.75rem', alignItems: 'center' }}
+      >
         <Card style={{ maxWidth: '20rem', width: '100%' }}>
           <CardHeader>
             <CardTitle>Syncing</CardTitle>
@@ -1646,7 +1646,7 @@ export const catalogEntries: readonly CatalogEntry[] = [
     description: 'Marketing header navigation with brand, links and actions.',
     package: '@noe/ui',
     registryItem: 'marketing-header',
-      preview: () => (
+    preview: () => (
       <MarketingHeader
         brand={<span>NOE</span>}
         links={

package/apps/showcase/src/catalog/catalog-shell.tsx

@@ -96,7 +96,9 @@ export function CatalogShell({ initialEntries = catalogEntries }: CatalogShellPr
       try {
         return (
           typeof document !== 'undefined' &&
-          (document as unknown as { fonts?: { check: (s: string) => boolean } }).fonts?.check(fontSpec) === true
+          (document as unknown as { fonts?: { check: (s: string) => boolean } }).fonts?.check(
+            fontSpec,
+          ) === true
         );
       } catch {
         return false;
@@ -109,7 +111,10 @@ export function CatalogShell({ initialEntries = catalogEntries }: CatalogShellPr
       markReady();
       return;
     }
-    const hasLoad = typeof document !== 'undefined' && typeof (document as unknown as { fonts?: { load: (s: string) => Promise<unknown> } }).fonts?.load === 'function';
+    const hasLoad =
+      typeof document !== 'undefined' &&
+      typeof (document as unknown as { fonts?: { load: (s: string) => Promise<unknown> } }).fonts
+        ?.load === 'function';
     if (hasLoad) {
       let timedOut = false;
       const timeoutId = setTimeout(() => {

package/apps/storybook/stories/catalog/calendar.stories.tsx

@@ -22,7 +22,9 @@ export const Jalali: Story = {
 };
 export const JalaliLeapDay: Story = {
   args: { calendar: 'persian', locale: 'fa-IR', value: new Date('2025-03-20T00:00:00Z') },
-  render: () => <Calendar calendar="persian" locale="fa-IR" value={new Date('2025-03-20T00:00:00Z')} />,
+  render: () => (
+    <Calendar calendar="persian" locale="fa-IR" value={new Date('2025-03-20T00:00:00Z')} />
+  ),
 };
 export const WithMinMax: Story = {
   args: {

package/apps/storybook/stories/catalog/date-picker.stories.tsx

@@ -17,7 +17,11 @@ export const RTL: Story = {
   ),
 };
 export const WithMinMax: Story = {
-  args: { min: new Date('2025-03-10T00:00:00Z'), max: new Date('2025-03-20T00:00:00Z'), value: new Date('2025-03-15T00:00:00Z') },
+  args: {
+    min: new Date('2025-03-10T00:00:00Z'),
+    max: new Date('2025-03-20T00:00:00Z'),
+    value: new Date('2025-03-15T00:00:00Z'),
+  },
 };
 export const Jalali: Story = {
   args: { calendar: 'persian', locale: 'fa-IR', value: new Date('2025-03-20T00:00:00Z') },

package/docs/design-system/README.md

@@ -11,6 +11,7 @@ The documentation describes the implementation in this repository and marks exte
 - `i18n.md`, `rtl.md`: locale, direction and bidi architecture.
 - `accessibility.md`: WCAG-oriented requirements.
 - `testing.md`, `visual-qa.md`: test and evidence strategy.
+- `gpt-agent-prompt.md`: ready-to-paste GPT task wrapper with outcome, autonomy, output, and stop rules.
 - `registry.md`, `mcp.md`, `agent-guide.md`: coding-agent discovery and package/registry boundaries.
 - `ci-cd.md`, `security.md`: automation and governance.
 - `contributing.md`: change workflow.

package/docs/design-system/agent-guide.md

@@ -1,5 +1,13 @@
 # Coding-agent guide
 
+## Start a GPT task
+
+Copy [`gpt-agent-prompt.md`](gpt-agent-prompt.md), replace its target repository and
+`Task` placeholder, and send it as one prompt. Put the requested outcome, scope, and
+non-negotiable constraints in `Task`; do not re-paste this guide or `AGENTS.md`.
+The prompt already defines the agent's success criteria, autonomy boundary, response
+format, and stop rules.
+
 ## Scope and distribution
 
 `noecosystem-design` is an npm-distributed source snapshot for discovery, review, and
@@ -18,27 +26,19 @@ The first-party `@noe` registry has local generation and consumer-test evidence.
 documented external endpoint must be treated as unavailable until deployment and
 official-MCP installation evidence exist; see `registry.md` and ADR 0007.
 
-## Required intake
-
-1. Read `README.md`, `AGENTS.md`, and the relevant focused document from `llms.txt`.
-2. Search `packages/registry/manifest.json` by capability, alias, and component name.
-3. Read the candidate item's `useWhen`, `doNotUseWhen`, `alternatives`, dependency,
-   accessibility, and internationalization fields before opening implementation files.
-4. Inspect the owning `packages/<package>/src` source and its Storybook story.
-5. If no capability fits, follow the component lookup order in `AGENTS.md` and record
-   why reuse was not appropriate.
-
-## Implementation protocol
-
-1. Prefer an existing NOE component or product pattern; never create a competing
-   primitive for Button, Dialog, DataTable, ToolCall, or Approval.
-2. Use semantic tokens, logical CSS properties, and the canonical i18n layer. Keep
-   unpredictable prose `dir=auto`; isolate URLs, IDs, code, paths, and commands LTR.
-3. Preserve semantic DOM order. Pass direction explicitly to portals; do not use
-   global `row-reverse` or global icon mirroring as an RTL fix.
-4. Keep ordinary tool output progressively disclosed and do not expose raw tool JSON
-   by default.
-5. Update source, stories, component tests, registry metadata, and docs together.
+## Retrieval and implementation
+
+Read `README.md`, `AGENTS.md`, and the focused documentation selected by `llms.txt`.
+Search `packages/registry/manifest.json` by capability, alias, and component name.
+For a candidate, read its `useWhen`, `doNotUseWhen`, `alternatives`, dependency,
+accessibility, and internationalization contracts before inspecting its source and
+Storybook story. If nothing fits, use the component lookup order in `AGENTS.md` and
+record the reason reuse was unsuitable.
+
+`AGENTS.md` defines the implementation constraints: reuse canonical components;
+preserve semantic tokens, i18n, RTL/bidi, portal direction, and progressive disclosure;
+and update the relevant source, stories, tests, registry metadata, and documentation
+together. Do not duplicate those instructions in a task prompt.
 
 ## Evidence before completion
 

package/docs/design-system/gpt-agent-prompt.md

@@ -0,0 +1,56 @@
+# GPT implementation prompt
+
+Use this after `npm install noecosystem-design`. Replace the values in angle
+brackets, then send the complete prompt to the coding agent. Keep the static
+context below intact; put task-specific details only in `Task`.
+
+```text
+Role
+You are the NOE design-system implementation agent working in <TARGET_REPOSITORY>.
+Use the installed noecosystem-design package as a read-only source of design-system
+context.
+
+Task
+<DESCRIBE THE REQUESTED OUTCOME, SCOPE, AND ANY NON-NEGOTIABLE CONSTRAINTS>
+
+Success criteria
+- The requested outcome works in the target repository.
+- Reuse the relevant NOE capability or established product pattern before creating
+  new UI.
+- Preserve every applicable NOE contract, including tokens, i18n, RTL/bidi,
+  accessibility, stories, tests, registry metadata, and documentation.
+- Run checks that are proportionate to the change and report only results actually
+  observed.
+
+Context
+1. Read node_modules/noecosystem-design/AGENTS.md and llms.txt first.
+2. Search node_modules/noecosystem-design/packages/registry/manifest.json for the
+   requested capability. Read the matching record and focused documentation before
+   implementation files.
+3. AGENTS.md is the authoritative static constraint set. Follow it without restating
+   it in the response.
+
+Constraints
+- noecosystem-design is a source snapshot, not a runtime dependency. Do not import
+  from it; use a writable repository checkout for implementation work.
+- Do not present the public @noe registry as deployed or installable without direct
+  deployment evidence.
+- Do safe local investigation, edits, and validation autonomously. Ask before an
+  external write, destructive action, purchase, credential change, or material scope
+  expansion.
+
+Response
+Lead with the outcome. Then give:
+- Changed: only the material files or behavior changed.
+- Evidence: commands run and their observed results.
+- Blockers or risks: only if they materially affect completion.
+
+Stop rules
+Ask one focused question only when a material decision cannot be safely inferred.
+Otherwise, finish when the success criteria are met. If evidence is unavailable,
+state the exact gap instead of implying completion.
+```
+
+The prompt intentionally states the goal, constraints, autonomy boundary, expected
+output, and stop conditions once. Do not append a second copy of `AGENTS.md`; direct
+the agent to the installed file instead.

package/docs/design-system/inventory.md

@@ -386,4 +386,3 @@ Total catalog entries: **129** · registry items: **67**
 - `fab`: Mobile-only floating action button anchored to the logical end edge above the bottom navigation, with safe-area padding and required accessible label.
 - `mobile-screen`: Single-column mobile page scaffold composing an app bar, scrollable content region, optional floating action button and bottom navigation.
 - `bottom-navigation`: Mobile-only bottom tab bar with current-page state, badges, icon slots and safe-area padding; hidden from the medium breakpoint upward.
-

package/llms.txt

@@ -15,18 +15,21 @@
 
 ## Retrieval order
 
-1. `README.md` — package scope, start path, commands, and distribution boundaries.
-2. `AGENTS.md` — mandatory design-system constraints and definition of done.
-3. `packages/registry/manifest.json` — capability search, ownership, use/do-not-use
+1. `docs/design-system/gpt-agent-prompt.md` — ready-to-paste task wrapper for GPT;
+   replace only its target repository and task fields.
+2. `README.md` — package scope, start path, commands, and distribution boundaries.
+3. `AGENTS.md` — mandatory design-system constraints and definition of done.
+4. `packages/registry/manifest.json` — capability search, ownership, use/do-not-use
    rules, accessibility, i18n, dependencies, and story references.
-4. `packages/registry/r/<item>.json` — installable-item metadata and source closure.
-5. The owning package source under `packages/` and its Storybook story under
+5. `packages/registry/r/<item>.json` — installable-item metadata and source closure.
+6. The owning package source under `packages/` and its Storybook story under
    `apps/storybook/stories/`.
 
 ## Focused documentation
 
 - Architecture and package boundaries: `docs/design-system/architecture.md`
-- Agent workflow: `docs/design-system/agent-guide.md`
+- GPT task wrapper: `docs/design-system/gpt-agent-prompt.md`
+- Agent workflow and retrieval: `docs/design-system/agent-guide.md`
 - Components and catalog terms: `docs/design-system/components.md`
 - Tokens and foundations: `docs/design-system/foundations.md`, `docs/design-system/tokens.md`
 - Locale, RTL, and bidi: `docs/design-system/i18n.md`, `docs/design-system/rtl.md`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "noecosystem-design",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "private": false,
   "description": "Agent-readable NOE design-system source, registry metadata, and verification contracts.",
   "keywords": [
@@ -94,7 +94,7 @@
     "format": "biome format --write .",
     "format:check": "biome format .",
     "gen:inventory": "node scripts/generate-inventory.mjs",
-    "gen:manifest": "node scripts/generate-manifest.mjs",
+    "gen:manifest": "node scripts/generate-manifest.mjs && biome format --write packages/registry/manifest.json packages/registry/component-audit.json packages/registry/search-index.json packages/registry/registry.json packages/registry/catalog-index.json packages/registry/docs-index.json",
     "validate:manifest": "node scripts/validate-manifest.mjs",
     "lint": "biome lint .",
     "typecheck": "tsc -p tsconfig.json --pretty false",

package/packages/ai-ui/src/activity-feed.tsx

@@ -1,4 +1,3 @@
-
 import type * as React from 'react';
 import { cn } from '@noe/ui/lib/cn';
 
@@ -57,4 +56,4 @@ export function ActivityFeed({ label, items, className, ...props }: ActivityFeed
       ))}
     </ol>
   );
-}
+}

package/packages/ai-ui/src/agent-composer.tsx

@@ -51,4 +51,4 @@ export function AgentComposer({
       </div>
     </form>
   );
-}
+}

package/packages/ai-ui/src/agent-message.tsx

@@ -47,4 +47,4 @@ export function AgentMessage({
       </AutoDirectionText>
     </article>
   );
-}
+}

package/packages/ai-ui/src/agent-plan.tsx

@@ -66,4 +66,4 @@ export function AgentPlan({
       </ol>
     </section>
   );
-}
+}

package/packages/ai-ui/src/agent-workspace.tsx

@@ -1,4 +1,3 @@
-
 import type * as React from 'react';
 import { cn } from '@noe/ui/lib/cn';
 
@@ -60,4 +59,4 @@ export function AgentWorkspace({
       ) : null}
     </section>
   );
-}
+}

package/packages/ai-ui/src/approval-request.tsx

@@ -90,4 +90,4 @@ export function ApprovalRequest({
       </footer>
     </section>
   );
-}
+}

package/packages/ai-ui/src/run-inspector.tsx

@@ -51,4 +51,4 @@ export function RunInspector({
       {children}
     </aside>
   );
-}
+}

package/packages/ai-ui/src/tool-call.tsx

@@ -68,4 +68,4 @@ export function ToolCall({
       </div>
     </details>
   );
-}
+}

package/packages/data-ui/src/activity-gauge.tsx

@@ -35,4 +35,4 @@ export function ActivityGauge({ className, ...props }: React.ComponentProps<'div
       </table>
     </div>
   );
-}
+}

package/packages/data-ui/src/chart-frame.tsx

@@ -38,4 +38,4 @@ export function ChartFrame({
       </div>
     </figure>
   );
-}
+}

package/packages/data-ui/src/chart.tsx

@@ -1,4 +1,3 @@
-
 import type * as React from 'react';
 import { cn } from '@noe/ui/lib/cn';
 
@@ -128,4 +127,4 @@ export function Chart({
       </div>
     </div>
   );
-}
+}

package/packages/data-ui/src/dashboard-shell.tsx

@@ -1,4 +1,3 @@
-
 import type * as React from 'react';
 import { cn } from '@noe/ui/lib/cn';
 
@@ -53,4 +52,4 @@ export function DashboardShell({
       {pagination ? <div data-slot="dashboard-shell-pagination">{pagination}</div> : null}
     </section>
   );
-}
+}

package/packages/data-ui/src/data-table.tsx

@@ -96,4 +96,4 @@ export function DataTable<Row extends { id: string }>({
       </table>
     </section>
   );
-}
+}

package/packages/data-ui/src/filter-bar.tsx

@@ -1,4 +1,3 @@
-
 import type * as React from 'react';
 import { cn } from '@noe/ui/lib/cn';
 
@@ -25,4 +24,4 @@ export function FilterBar({ label, search, filters, action, className, ...props
       {action ? <div className="ms-auto flex items-center gap-2">{action}</div> : null}
     </search>
   );
-}
+}

package/packages/data-ui/src/metric-card.tsx

@@ -40,4 +40,4 @@ export function MetricCard({
       ) : null}
     </article>
   );
-}
+}

package/packages/data-ui/src/pagination.tsx

@@ -1,5 +1,3 @@
-
-
 import type * as React from 'react';
 import { ChevronIcon } from '@noe/icons';
 import { Button } from '@noe/ui/button';
@@ -64,4 +62,4 @@ export function Pagination({
       </Button>
     </nav>
   );
-}
+}

package/packages/data-ui/src/pie-chart.tsx

@@ -35,4 +35,4 @@ export function PieChart({ className, ...props }: React.ComponentProps<'div'>) {
       </table>
     </div>
   );
-}
+}

package/packages/data-ui/src/radar-chart.tsx

@@ -35,4 +35,4 @@ export function RadarChart({ className, ...props }: React.ComponentProps<'div'>)
       </table>
     </div>
   );
-}
+}

package/packages/design-tokens/src/palette.ts

@@ -5,14 +5,14 @@
  * from this registry to avoid hard-coded duplication.
  */
 
-export const PALETTES = ["graphite"] as const;
+export const PALETTES = ['graphite'] as const;
 
 export type Palette = (typeof PALETTES)[number];
 
-export const DEFAULT_PALETTE: Palette = "graphite";
+export const DEFAULT_PALETTE: Palette = 'graphite';
 
-export const PALETTE_STORAGE_KEY = "noecosystem-palette";
-export const PALETTE_COOKIE_KEY = "noecosystem-palette";
+export const PALETTE_STORAGE_KEY = 'noecosystem-palette';
+export const PALETTE_COOKIE_KEY = 'noecosystem-palette';
 
 export function isPalette(value: unknown): value is Palette {
   return (PALETTES as readonly string[]).includes(value as string);

package/packages/design-tokens/src/tokens.css

@@ -225,12 +225,6 @@
   }
 }
 
-/* Palette: Graphite is the only approved palette. Extendable via [data-noe-palette="..."] overrides. */
-:root,
-[data-noe-palette="graphite"] {
-  /* No overrides — graphite uses the default semantic tokens above. */
-}
-
 /* Component tokens: stable customization seams. */
 :root {
   --noe-component-button-height: var(--noe-control-height-md);

package/packages/registry/catalog-index.json

@@ -1,5 +1,5 @@
 {
-  "generatedAt": "2026-08-28T08:46:14.843Z",
+  "generatedAt": "2026-08-29T07:21:18.551Z",
   "items": [
     {
       "id": "bidi-text",

package/packages/registry/component-audit.json

@@ -1,6 +1,6 @@
 {
   "$schema": "https://noecosystem.com/schema/component-audit.json",
-  "generatedNote": "Canonical NOE public-component inventory. status=available requires a public export, a Storybook story at storyId, and (where distributable) a registry entry. Do not mark an item available without all three. (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json)",
+  "generatedNote": "Canonical NOE public-component inventory. status=available requires a public export, a Storybook story at storyId, and (where distributable) a registry entry. Do not mark an item available without all three. (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json) (derived from manifest.json)",
   "items": [
     {
       "id": "bidi-text",