@lism-css/mcp 0.11.0 → 0.13.0

package/dist/tools/get-props-system.js

@@ -1,61 +1,73 @@
 import { z } from 'zod';
-import { loadJSON } from '../lib/load-data.js';
-import { PropsSystemDataSchema } from '../lib/schemas.js';
+import { loadMarkdown } from '../lib/load-markdown.js';
+import { parsePropRows } from '../lib/markdown-utils.js';
 import { parsePropClassName } from '../lib/search.js';
-import { success, error, notFound, READ_ONLY_ANNOTATIONS } from '../lib/response.js';
-/** cssProperty フィールドからコア名を抽出（例: "--hl (CSS変数)" → "--hl"） */
+import { markdownResponse, error, notFound, READ_ONLY_ANNOTATIONS } from '../lib/response.js';
+/** cssProperty フィールドからコア名を抽出（"--hl 変数のみ" → "--hl"） */
 function normalizeCssProperty(raw) {
-    // "(class: is--container)" → "is--container"
-    const classMatch = raw.match(/\(class:\s*(.+?)\)/);
-    if (classMatch)
-        return classMatch[1].trim().toLowerCase();
-    // "--hl (CSS変数)" → "--hl"
     return raw
         .replace(/\s*\(.*\)$/, '')
+        .replace(/（[^）]*）$/, '')
         .trim()
         .toLowerCase();
 }
 export function registerGetPropsSystem(server) {
     server.registerTool('get_props_system', {
-        description: 'Get the lism-css Props system reference: how React/Astro props map to CSS classes and styles. Supports lookup by lism prop name (e.g. "p", "fz") OR by CSS property name (e.g. "padding", "font-size"). Use this for CSS-to-lism reverse lookup. Related: use convert_css for bulk CSS conversion, get_component to see how props are used in components.',
+        description: 'Get the lism-css Props system reference: how React/Astro props map to CSS classes and styles. Supports lookup by lism prop name (e.g. "p", "fz") OR by CSS property name (e.g. "padding", "font-size"). Omit the prop parameter to get the full reference.\n' +
+            'Use this when you need to find a specific prop mapping, understand the Property Class system, or check what CSS property a lism prop corresponds to.\n' +
+            'For bulk CSS-to-lism conversion, convert_css is more efficient. For component-specific documentation, use get_component.\n' +
+            'The response is pre-formatted Markdown. Output it verbatim. Do NOT summarize the prop tables.',
         inputSchema: {
             prop: z
                 .string()
                 .optional()
-                .describe('Prop name or CSS property name to look up. Accepts lism prop names (e.g. "p", "fz", "bgc") and standard CSS property names (e.g. "padding", "font-size", "background-color"). Omit to get the full system overview.'),
+                .describe('Prop name or CSS property name to look up. Accepts lism prop names (e.g. "p", "fz", "bgc") and standard CSS property names (e.g. "padding", "font-size", "background-color"). Omit to get the full reference.'),
         },
         annotations: READ_ONLY_ANNOTATIONS,
     }, ({ prop }) => {
         try {
-            const data = loadJSON('props-system.json', PropsSystemDataSchema);
+            const md = loadMarkdown('property-class.md');
+            // prop 未指定: 全文を返す
             if (!prop) {
-                return success(data);
+                return markdownResponse(md);
             }
             const queryLower = parsePropClassName(prop) ?? prop.toLowerCase();
-            const matched = [];
-            for (const cat of data.categories) {
-                const found = cat.props.filter((p) => {
-                    // Lism prop 名で一致
-                    if (p.prop.toLowerCase() === queryLower)
-                        return true;
-                    // CSS プロパティ名で一致（逆引き）
-                    const normalizedCss = normalizeCssProperty(p.cssProperty);
-                    if (normalizedCss === queryLower)
-                        return true;
-                    return false;
-                });
-                if (found.length > 0) {
-                    matched.push({ ...cat, props: found });
-                }
-            }
+            const rows = parsePropRows(md);
+            // 一致する行を探す
+            const matched = rows.filter((row) => {
+                if (row.prop.toLowerCase() === queryLower)
+                    return true;
+                const normalizedCss = normalizeCssProperty(row.cssProperty);
+                if (normalizedCss === queryLower)
+                    return true;
+                return false;
+            });
             if (matched.length === 0) {
-                const allProps = data.categories.flatMap((c) => c.props.map((p) => `${p.prop} (${p.cssProperty})`));
-                return notFound(`"${prop}" に一致する Prop が見つかりません。Lism prop 名 (例: "p", "fz") または CSS プロパティ名 (例: "padding", "font-size") で検索できます。`, { availableProps: allProps });
+                const availableProps = rows.map((r) => `${r.prop} (${r.cssProperty})`);
+                return notFound(`"${prop}" に一致する Prop が見つかりません。Lism prop 名 (例: "p", "fz") または CSS プロパティ名 (例: "padding", "font-size") で検索できます。`, { availableProps });
+            }
+            // 一致したセクション名のユニーク一覧を取得
+            const sections = [...new Set(matched.map((r) => r.sectionName))];
+            // property-class.md から対象セクションを抽出して結合
+            const lines = md.split('\n');
+            const resultParts = [`## 検索結果: "${prop}"\n`];
+            for (const sectionName of sections) {
+                // セクション内の一致する行だけを含む簡易 Markdown を生成
+                const sectionRows = matched.filter((r) => r.sectionName === sectionName);
+                const header = `### ${sectionName}\n`;
+                const tableHeader = '| Prop | CSS プロパティ | プリセット値クラス | BP クラス |\n|------|--------------|-------------|-----|';
+                // 対応する元テーブル行を探して取得
+                const tableRows = sectionRows.map((row) => {
+                    const pattern = new RegExp(`^\\|\\s*\`${row.prop.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&')}\`\\s*\\|`);
+                    const originalLine = lines.find((l) => pattern.test(l));
+                    return originalLine ?? `| \`${row.prop}\` | \`${row.cssProperty}\` | — | — |`;
+                });
+                resultParts.push(header + tableHeader + '\n' + tableRows.join('\n'));
             }
-            return success({ description: data.description, categories: matched });
+            return markdownResponse(resultParts.join('\n\n'));
         }
         catch (e) {
-            return error(`Failed to load props system data: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Ensure the server was installed correctly.`);
+            return error(`Failed to load props system data: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Run "pnpm build" in packages/mcp first.`);
         }
     });
 }

package/dist/tools/get-tokens.js

@@ -1,23 +1,18 @@
-import { z } from 'zod';
-import { loadJSON } from '../lib/load-data.js';
-import { TokenCategorySchema } from '../lib/schemas.js';
-import { success, error, READ_ONLY_ANNOTATIONS } from '../lib/response.js';
-const TOKEN_CATEGORIES = ['all', 'color', 'spacing', 'fontSize', 'shadow', 'radius', 'lineHeight', 'letterSpacing', 'fontFamily', 'zIndex'];
+import { loadMarkdown } from '../lib/load-markdown.js';
+import { markdownResponse, error, READ_ONLY_ANNOTATIONS } from '../lib/response.js';
 export function registerGetTokens(server) {
     server.registerTool('get_tokens', {
-        description: 'Get design tokens (colors, spacing, font sizes, shadows, etc.) used in lism-css. Use get_overview first to understand the framework, then use this tool to explore specific token categories.',
-        inputSchema: {
-            category: z.enum(TOKEN_CATEGORIES).default('all').describe('Token category to retrieve. Use "all" to get all categories.'),
-        },
+        description: 'Get design tokens (colors, spacing, font sizes, shadows, etc.) used in lism-css. Returns the full token reference including CSS variable names and available values.\n' +
+            'Use this when you need to check available token values, variable names, or design scales (e.g. "what spacing values exist?", "what are the font size tokens?").\n' +
+            'For prop-to-CSS mappings, get_props_system is more suitable. For CSS conversion, use convert_css. Call get_overview first if you have not yet.\n' +
+            'The response is pre-formatted Markdown. Output it verbatim. Do NOT summarize or omit token values.',
         annotations: READ_ONLY_ANNOTATIONS,
-    }, ({ category }) => {
+    }, () => {
         try {
-            const data = loadJSON('tokens.json', z.array(TokenCategorySchema));
-            const filtered = category === 'all' ? data : data.filter((c) => c.category === category);
-            return success({ tokens: filtered });
+            return markdownResponse(loadMarkdown('tokens.md'));
         }
         catch (e) {
-            return error(`Failed to load tokens data: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Ensure the server was installed correctly.`);
+            return error(`Failed to load tokens data: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Run "pnpm build" in packages/mcp first.`);
         }
     });
 }

package/dist/tools/search-docs.js

@@ -1,12 +1,33 @@
 import { z } from 'zod';
 import { loadJSON } from '../lib/load-data.js';
-import { DocsEntrySchema, ComponentInfoSchema, PropsSystemDataSchema } from '../lib/schemas.js';
-import { buildAliasMap, buildCssPropertyMap, searchDocs } from '../lib/search.js';
+import { loadMarkdown } from '../lib/load-markdown.js';
+import { DocsEntrySchema } from '../lib/schemas.js';
+import { parsePropRows } from '../lib/markdown-utils.js';
+import { searchDocs } from '../lib/search.js';
 import { success, error, READ_ONLY_ANNOTATIONS } from '../lib/response.js';
-const DOC_CATEGORIES = ['all', 'core-components', 'modules', 'props', 'ui', 'guide'];
+const DOC_CATEGORIES = ['all', 'core-components', 'primitives', 'property-class', 'ui', 'guide'];
+/**
+ * property-class.md のテーブルから CSSプロパティ名 → Lism prop名 のマップを構築する。
+ * search.ts の buildCssPropertyMap と同じインターフェースを返す。
+ */
+function buildCssPropertyMapFromMarkdown(md) {
+    const map = new Map();
+    for (const row of parsePropRows(md)) {
+        const normalized = row.cssProperty.toLowerCase();
+        if (normalized.startsWith('(class:'))
+            continue;
+        const existing = map.get(normalized) ?? [];
+        existing.push(row.prop.toLowerCase());
+        map.set(normalized, existing);
+    }
+    return map;
+}
 export function registerSearchDocs(server) {
     server.registerTool('search_docs', {
-        description: "Search lism-css documentation by keyword. Returns matching pages with relevance scores. Supports CSS property names (e.g. 'font-size', 'padding') which are automatically expanded to corresponding lism prop names. Use this when other tools don't return the information you need, or to discover available components and features.",
+        description: "Search lism-css documentation by keyword. Returns matching pages with relevance scores. Supports CSS property names (e.g. 'font-size', 'padding') which are automatically expanded to corresponding lism prop names.\n" +
+            'Use this when you cannot find information with other tools, or to discover available components, features, and guides by keyword.\n' +
+            'Do NOT use this as your first step — prefer get_component for a known component, get_props_system for a known prop, or get_guide for a specific topic. This is a fallback search tool.\n' +
+            'Returns JSON with search results including page URLs and relevance scores.',
         inputSchema: {
             query: z.string().describe('Search query (keywords separated by spaces). CSS property names like "font-size" are also accepted.'),
             category: z.enum(DOC_CATEGORIES).default('all').describe('Filter by documentation category.'),
@@ -16,15 +37,12 @@ export function registerSearchDocs(server) {
     }, ({ query, category, limit }) => {
         try {
             const entries = loadJSON('docs-index.json', z.array(DocsEntrySchema));
-            const components = loadJSON('components.json', z.array(ComponentInfoSchema));
-            const propsData = loadJSON('props-system.json', PropsSystemDataSchema);
-            const aliasMap = buildAliasMap(components);
-            const cssPropertyMap = buildCssPropertyMap(propsData.categories);
-            const results = searchDocs(entries, query, { category, limit, aliasMap, cssPropertyMap });
+            const cssPropertyMap = buildCssPropertyMapFromMarkdown(loadMarkdown('property-class.md'));
+            const results = searchDocs(entries, query, { category, limit, cssPropertyMap });
             return success({ query, results });
         }
         catch (e) {
-            return error(`Failed to search docs: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Ensure the server was installed correctly.`);
+            return error(`Failed to search docs: ${e instanceof Error ? e.message : String(e)}. The data files may not be built yet. Run "pnpm build" in packages/mcp first.`);
         }
     });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lism-css/mcp",
-  "version": "0.11.0",
+  "version": "0.13.0",
   "description": "MCP server for lism-css documentation and API reference.",
   "type": "module",
   "bin": {
@@ -23,7 +23,7 @@
   "license": "MIT",
   "scripts": {
     "format": "prettier --write . --ignore-path ../../.prettierignore",
-    "build": "tsc -p tsconfig.build.json && cp src/data/*.json dist/data/",
+    "build": "tsc -p tsconfig.build.json && cp src/data/docs-index.json dist/data/ && rm -rf dist/data/guides && cp -r ../../.claude/skills/lism-css-guide dist/data/guides",
     "dev": "tsc --watch",
     "test": "vitest run"
   }