@nysds/components 1.16.0-alpha4 → 1.16.0-alpha5

package/dist/packages/mcp-server/src/lib/cem-parser.d.ts

@@ -43,6 +43,11 @@ export interface CEMCssPart {
     name: string;
     description?: string;
 }
+export interface CEMExample {
+    title: string;
+    code: string;
+    lang?: string;
+}
 export interface CEMDeclaration {
     kind: "class";
     name: string;
@@ -59,6 +64,7 @@ export interface CEMDeclaration {
         name: string;
         package?: string;
     };
+    examples?: CEMExample[];
 }
 export interface CEMModule {
     kind: "javascript-module";

package/dist/packages/mcp-server/src/lib/format.d.ts

@@ -0,0 +1,21 @@
+/**
+ * Format Utilities
+ *
+ * Helpers for formatting MCP tool responses.
+ */
+/**
+ * JSON replacer that strips null and undefined values from objects.
+ * Use with JSON.stringify(obj, stripNulls, 2) for cleaner output.
+ */
+export declare function stripNulls(_key: string, value: unknown): unknown;
+/**
+ * Format an object as JSON, stripping null/undefined values and empty arrays.
+ */
+export declare function formatResponse(data: unknown): string;
+/**
+ * Create a text content response for MCP tools.
+ */
+export declare function textContent(data: unknown): {
+    type: "text";
+    text: string;
+};

package/dist/packages/mcp-server/src/tools/component-tools.d.ts

@@ -3,11 +3,9 @@
  *
  * MCP tools for working with NYSDS components.
  *
- * P0 Tools:
- * - list_components: List all NYSDS components with summaries
- * - get_component_docs: Full documentation for a specific component
- * - find_components: Search by name/description (fuzzy)
- * - get_usage_guide: Installation and usage patterns
+ * Tools:
+ * - find_components: Search or list all components
+ * - get_component: Full documentation for a specific component
  */
 import type { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
 export declare function registerComponentTools(server: McpServer): void;

package/dist/packages/mcp-server/src/tools/guide-tools.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Guide Tools
+ *
+ * Consolidated MCP tool for NYSDS guides and documentation.
+ * Loads guide content from data/guides/ markdown files.
+ */
+import type { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
+export declare function registerGuideTools(server: McpServer): void;

package/dist/packages/mcp-server/src/tools/token-tools.d.ts

@@ -4,12 +4,9 @@
  * MCP tools for working with NYSDS design tokens.
  *
  * Tools:
- * - get_design_tokens: Get tokens with filtering and options
+ * - get_tokens: Get tokens, categories, or themes
  * - find_tokens: Search tokens by CSS variable, value, or description
- * - list_themes: List all 8 agency themes
- * - get_token_value: Get detailed info for a specific token
- * - validate_token_usage: Validate token usage in context
- * - list_token_categories: List categories with token counts
+ * - get_token_info: Get detailed token info with optional context validation
  * - get_token_graph: Get token dependency graph
  */
 import type { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";

package/dist/packages/mcp-server/src/tools/utility-tools.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Utility Tools
+ *
+ * MCP tools for NYSDS utility classes.
+ */
+import type { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
+export declare function registerUtilityTools(server: McpServer): void;

package/dist/packages/mcp-server/src/tools/validation-tools.d.ts

@@ -3,9 +3,8 @@
  *
  * MCP tools for validating NYSDS component usage.
  *
- * P1 Tools:
+ * Tools:
  * - validate_component_api: Validate prop/attribute usage
- * - setup_framework: Framework-specific guides
  */
 import type { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
 export declare function registerValidationTools(server: McpServer): void;

package/dist/packages/nys-stepper/src/nys-step.d.ts

@@ -5,6 +5,41 @@ import { LitElement } from "lit";
  * Mark as `current` to indicate active progress point. Previous steps become clickable for navigation.
  * Set `href` for page-based navigation or listen to `nys-step-click` for SPA routing.
  *
+ * ## Step States
+ *
+ * Understanding the three step states is critical for proper stepper usage:
+ *
+ * - **`selected`** - Which step is currently being displayed/viewed. This controls which step's
+ *   content is shown. Defaults to `current` if not set. Cannot be set on a step after `current`.
+ *   Users can click previous steps to change `selected` without changing `current`.
+ *
+ * - **`current`** - The furthest step the user has reached. This is the progress boundary.
+ *   Update this as the user completes steps and advances. Steps after `current` are not navigable.
+ *   Only one step should have `current` at a time.
+ *
+ * - **`previous`** - Auto-applied by the stepper to all steps before `current`. Do not set manually.
+ *   Steps with `previous` are clickable and allow the user to navigate back.
+ *
+ * ## Common Patterns
+ *
+ * **Initial state:** Set `current` on the first step. `selected` will default to it.
+ * ```html
+ * <nys-step label="Step 1" current></nys-step>
+ * <nys-step label="Step 2"></nys-step>
+ * ```
+ *
+ * **User completed step 1, now on step 2:**
+ * ```html
+ * <nys-step label="Step 1"></nys-step>
+ * <nys-step label="Step 2" current></nys-step>
+ * ```
+ *
+ * **User went back to review step 1 (but progress is still at step 2):**
+ * ```html
+ * <nys-step label="Step 1" selected></nys-step>
+ * <nys-step label="Step 2" current></nys-step>
+ * ```
+ *
  * @summary Individual step for use within nys-stepper with navigation support.
  * @element nys-step
  *

package/dist/packages/nys-stepper/src/nys-stepper.d.ts

@@ -5,6 +5,7 @@ import "./nys-step";
  *
  * Add `nys-step` elements as children. Mark one step as `current` to indicate progress; previous steps become
  * navigable. Compact view on mobile expands to show all steps. Use `actions` slot for navigation buttons.
+ * Do not place the stepper inside a form element.
  *
  * @summary Multi-step progress indicator with navigation and mobile-friendly compact view.
  * @element nys-stepper
@@ -20,6 +21,43 @@ import "./nys-step";
  *   <nys-step label="Review"></nys-step>
  * </nys-stepper>
  * ```
+ *
+ * @example Grid layout with sidebar placement
+ * Use NYSDS grid utilities to position the stepper as a sidebar alongside form content.
+ * **Layout requirements:**
+ * - Wrap in `nys-grid-container` > `nys-grid-row`
+ * - Use mobile-first classes: `nys-grid-col-12` (stacks on mobile) plus `nys-desktop:nys-grid-col-*`
+ * - Columns must total 12 (e.g., 3+9 or 4+8)
+ * - Recommended: stepper 3-4 cols, content 8-9 cols
+ * ```html
+ * <div class="nys-grid-container">
+ *   <div class="nys-grid-row">
+ *     <nys-stepper label="Application" class="nys-grid-col-12 nys-desktop:nys-grid-col-3">
+ *       <nys-step label="Personal Info"></nys-step>
+ *       <nys-step label="Contact" current></nys-step>
+ *       <nys-step label="Review"></nys-step>
+ *     </nys-stepper>
+ *     <main class="nys-grid-col-12 nys-desktop:nys-grid-col-9" id="main-content">
+ *       <!-- Form content for current step -->
+ *       <nys-textinput label="Email" required></nys-textinput>
+ *       <nys-textinput label="Phone"></nys-textinput>
+ *     </main>
+ *   </div>
+ * </div>
+ * ```
+ *
+ * @example Navigation buttons in actions slot
+ * Add Previous/Next buttons using the actions slot. Wrap buttons in a `<div>`.
+ * ```html
+ * <nys-stepper label="Application">
+ *   <nys-step label="Step 1"></nys-step>
+ *   <nys-step label="Step 2" current></nys-step>
+ *   <nys-step label="Step 3"></nys-step>
+ *   <div slot="actions">
+ *     <nys-button label="Save and Exit" variant="outline" size="sm" fullWidth></nys-button>
+ *   </div>
+ * </nys-stepper>
+ * ```
  */
 export declare class NysStepper extends LitElement {
     static styles: import("lit").CSSResult;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nysds/components",
-  "version": "1.16.0-alpha4",
+  "version": "1.16.0-alpha5",
   "description": "New York State's design system and code component library.",
   "type": "module",
   "workspaces": [
@@ -34,7 +34,8 @@
     "tsc:packages": "tsc -b tsconfig.build.json",
     "build:packages": "npm run tsc:packages && turbo run build --filter='./packages/*' --log-order=grouped",
     "build:root": "cross-env NODE_ENV=production npm run build && cross-env NODE_ENV=production npm run build:umd",
-    "build:all": "npm run clean:dist && npm run lint && npm run lit-analyze || true && cross-env NODE_ENV=production npm run build:packages && npm run build:root && npm run cem && npm run mcp-server:build",
+    "build:all": "npm run clean:dist && npm run lint && npm run lit-analyze || true && cross-env NODE_ENV=production npm run build:packages && npm run build:root && npm run cem && npm run build:mcp",
+    "build:mcp": "npm run build -w @nysds/mcp-server",
     "build:link": "npm run build:all && npm link && cd packages/styles && npm link",
     "lint": "eslint --cache --cache-location node_modules/.cache/eslint && stylelint **/*.scss || true",
     "lint:fix": "eslint --fix && stylelint **/*.scss --fix",
@@ -85,6 +86,7 @@
     "@web/test-runner": "^0.20.2",
     "@web/test-runner-commands": "^0.9.0",
     "@web/test-runner-playwright": "^0.11.1",
+    "cem-plugin-examples": "github:its-hcd/cem-plugin-examples",
     "cross-env": "^10.1.0",
     "custom-element-react-wrappers": "^1.7.3",
     "custom-element-vs-code-integration": "^1.5.0",
@@ -97,6 +99,7 @@
     "lit": "^3.3.1",
     "lit-analyzer": "^2.0.3",
     "plop": "^4.0.4",
+    "prettier": "^3.8.1",
     "rollup-plugin-esbuild-minify": "^1.3.0",
     "rollup-plugin-minify-template-literals": "^1.1.7",
     "rollup-plugin-visualizer": "^6.0.5",