@progress/kendo-react-mcp/dist/index.js

Model Context Protocol for KendoReact

#!/usr/bin/env node
var D=Object.defineProperty;var b=(e,r,t)=>r in e?D(e,r,{enumerable:!0,configurable:!0,writable:!0,value:t}):e[r]=t;var m=(e,r,t)=>b(e,typeof r!="symbol"?r+"":r,t);import{McpServer as q}from"@modelcontextprotocol/sdk/server/mcp.js";import{StdioServerTransport as K}from"@modelcontextprotocol/sdk/server/stdio.js";import{z as x}from"zod";var f="Kendo UI for React",y="react",C=["ActionSheet","AIPrompt","Animation","AppBar","ArcGauge","AutoComplete","Avatar","Badge","Barcode","BottomNavigation","Breadcrumb","Button","ButtonGroup","Calendar","Card","Chart","ChartWizard","Chat","Checkbox","Chip","ChipList","ChunkProgressBar","CircularGauge","ColorGradient","ColorPalette","ColorPicker","ComboBox","ContextMenu","ConversationalUI","DataGrid","Grid","DataQuery","DateMath","DateInput","DatePicker","DateRangePicker","DateTimePicker","Dialog","Drag&Drop","Drawer","Drawing","DropDownButton","DropDownList","DropDownTree","Editor","Error","ExcelExport","ExpansionPanel","ExternalDropZone","FileSaver","FileManager","Filter","FlatColorPicker","FloatingActionButton","FloatingLabel","FontIcon","Form","Gantt","Gauge","General","GridLayout","Hint","InlineAIPrompt","Input","Label","LinearGauge","ListBox","ListView","Loader","Map","MaskedTextBox","Menu","MultiColumnComboBox","MultiSelect","MultiSelectTree","MultiViewCalendar","Notification","NumericTextBox","OrgChart","PageTemplates/BuildingBlocks","Pager","PanelBar","PDFProcessing","PDFViewer","PivotGrid","Popover","Popup","ProgressBar","QRCode","RadialGauge","RadioButton","RadioGroup","RangeSlider","Rating","Ripple","Sankey","Scheduler","ScrollView","Signature","Skeleton","Slider","Sortable","Sparkline","SpeechToTextButton","SplitButton","Splitter","Spreadsheet","StackLayout","Stepper","StockChart","SVGIcon","Switch","TabStrip","TaskBoard","TextArea","TextBox","TileLayout","Timeline","TimePicker","Toolbar","Tooltip","TreeList","TreeView","Typography","Upload","VSCodeExtension","Window"];import{dirname as L,join as B}from"path";import{fileURLToPath as N}from"url";import{loadLicense as R,decodeLicenseKey as P,decodeLicenseEvidence as U}from"@progress/kendo-licensing/utils";import a from"node:fs";import p from"node:path";import _ from"@grpc/proto-loader";import c from"@grpc/grpc-js";var g=class extends Error{constructor(e){super(e),this.name="LicenseError"}};async function F(){let e=R();if(!e.success)throw new g(e.message);return(await P(e.value)).licenses.find(async t=>!!(await U(t)).userId)||e.value}var h=!1,s=process.env.DEBUG_LOG_FILE,A=!!(s&&typeof s=="string");if(A){let e=p.resolve(s),r=p.dirname(e);if(r!=="."&&r!==process.cwd()&&!a.existsSync(r))try{a.mkdirSync(r,{recursive:!0})}catch(t){console.error("Error creating log directory:",t)}if(!a.existsSync(e))try{a.writeFileSync(e,"")}catch(t){console.error("Error creating log file:",t)}}else h=!1;h=A&&!!s&&a.existsSync(p.resolve(s));function i(...e){if(h&&s){let r=`${new Date().toISOString()}: ${e.join(" ")}
`,t=p.resolve(s);a.appendFile(t,r,o=>{o&&console.error("Error writing to log file:",o)})}}var d=(e=>(e[e.UNAUTHENTICATED=16]="UNAUTHENTICATED",e[e.RESOURCE_EXHAUSTED=8]="RESOURCE_EXHAUSTED",e[e.PERMISSION_DENIED=7]="PERMISSION_DENIED",e))(d||{}),I=class{constructor(e,r){m(this,"client");m(this,"isDev");this.contextApiUrl=e,this.protoPath=r;let t=_.loadSync(this.protoPath,{keepCase:!0,longs:String,enums:String,defaults:!0,oneofs:!0});this.isDev=this.contextApiUrl?.includes("localhost")||this.contextApiUrl?.includes("127.0.0.1"),i("Using ContextApi URl:",this.contextApiUrl);let o=c.loadPackageDefinition(t);this.client=new o.ContextQueryService(this.contextApiUrl||"contextapi.telerik.com:443",this.isDev?c.credentials.createInsecure():c.credentials.createSsl())}async query(e){let r=this.isDev?"fake_license":await F(),t=process.env.CONTEXTAPI_API_KEY,o=new c.Metadata;if(r&&typeof r=="string"){r=r.replace(/^\uFEFF/,"");try{o.add("x-license-key",r)}catch(n){return i("Error adding license key to metadata:",n),Promise.reject(new Error(`Failed to use license key: ${n.message}`))}}return t&&typeof t=="string"&&o.add("x-api-key",t),new Promise((n,u)=>{this.client.query(e,o,(l,k)=>{l?u(l):n(k)})})}};var M=B(L(N(import.meta.url)),"../proto/service.proto"),O=new I("contextapi.telerik.com:443",M);async function w(e){return O.query(e)}import V from"fs";import G from"path";import{fileURLToPath as $}from"url";var S=`
## DataGrid Deprecated Properties Awareness
For DataGrid component cases, avoid using deprecated properties and always use their modern replacements. The following properties are deprecated and should not be used:

Deprecated properties and their modern replacements:
- selectedField \u2192 use the select state property
- editField \u2192 use the edit state property
- expandedField \u2192 use the detailExpand state property
- onExpandChange \u2192 use onDetailExpandChange for detail-row expansion or onGroupExpandChange for group expansion
- cellRender \u2192 use the cells={{ data: CustomCell }} prop
- rowRender \u2192 use the rows={{ data: CustomRow }} prop
- filterCellRender \u2192 use the cells={{ filterCell: CustomCell }} prop
- headerCellRender \u2192 use the cells={{ headerCell: CustomHeaderCell }} prop
- column.cell \u2192 use the column.cells={{ data: CustomCell }} prop
- column.headerCell \u2192 use the column.cells={{ headerCell: CustomHeaderCell }} prop
- column.filterCell \u2192 use the column.cells={{ filterCell: CustomCell }} prop
- column.footerCell \u2192 use the column.cells={{ footerCell: CustomFooterCell }} prop

Additional modern updates:
- Input component in Column Menu Filter has been replaced with Textbox
- scrollable prop now defaults to virtual
- Virtual scrolling no longer applies height by default

Key points:
- Never suggest or use these deprecated properties in DataGrid examples
- Always provide modern alternatives when users ask about these properties
- Explain that these properties are deprecated and provide the specific modern replacement
- Focus on current DataGrid API patterns using state properties and cells/rows props

Example:
Deprecated: selectedField="isSelected" editField="inEdit"
Modern: Use select and edit state properties with proper configuration
`;var E=`
## Smart Grid (AI-Enhanced Grid) Implementation Guidelines
**CRITICAL: When users ask about ANY of these AI grid terms, ALWAYS provide GridToolbarAIAssistant implementation (not basic Grid):**

**Primary AI Grid Trigger Terms (case-insensitive):**
- smart grid, smartgrid, smart-grid, smart_grid, SMART GRID, SmArt GrId
- ai grid, aigrid, ai-grid, ai_grid, AI GRID, aI-griD, AIGrid  
- ai enhanced grid, ai-enhanced-grid, ai_enhanced_grid, AI Enhanced Grid
- ai powered grid, ai-powered-grid, ai_powered_grid, AI Powered Grid
- intelligent grid, intelligent-grid, intelligent_grid, Intelligent Grid
- grid with ai, grid-with-ai, grid_with_ai, Grid with AI
- grid ai assistant, gridaiassistant, grid-ai-assistant, Grid AI Assistant
- grid toolbar ai assistant, gridtoolbaraiassistant, GridToolbarAIAssistant
- grid assistant, gridassistant, grid-assistant, Grid Assistant

**Additional variations that should trigger AI Grid:**
- ai enhanced, ai powered, smart, intelligent + grid (any spacing/casing)
- grid + ai, grid + smart, grid + intelligent (any spacing/casing) 
- Any mention of GridToolbarAIAssistant component specifically

**Recognition Rule: If query contains ANY combination of AI/Smart/Intelligent + Grid terms, respond with complete GridToolbarAIAssistant setup.**

Example Smart Grid suggestions by domain:
- Financial: 'Sort by Amount descending', 'Show only failed transactions', 'Filter where currency is USD'
- Sales: 'Group by region', 'Show top performing products', 'Filter by date range'
- Inventory: 'Sort by stock level', 'Show out of stock items', 'Group by category'
- Always include: 'Clear sorting', 'Clear filtering', 'Clear grouping'

Basic Grid: <Grid data={data}><GridColumn field="name" /></Grid>
Smart Grid: Complete AI-enhanced setup with GridToolbarAIAssistant, proper callbacks, reset functionality, and contextual suggestions

Important Disclaimer:
Always include this disclaimer when providing Smart Grid examples:
"The demos in this article use a Telerik-hosted AI service for demonstration purposes only. For production applications, you should implement your own AI service that understands your specific domain, data, and business requirements."
`;var T=`
## Editor Tools Awareness
For Editor component cases, always use the proper EditorTools import structure and never define tools as strings. Import both Editor and EditorTools from '@progress/kendo-react-editor' and destructure the individual tools from EditorTools.

Required pattern:
\`\`\`jsx
import { Editor, EditorTools } from '@progress/kendo-react-editor';

const {
    Bold, Italic, Underline, Strikethrough,
    Subscript, Superscript, ForeColor, BackColor,
    CleanFormatting, AlignLeft, AlignCenter, AlignRight, AlignJustify,
    Indent, Outdent, OrderedList, UnorderedList,
    NumberedList, BulletedList, Undo, Redo,
    FontSize, FontName, FormatBlock, Link, Unlink,
    InsertImage, ViewHtml, InsertTable, InsertFile,
    SelectAll, Print, Pdf, TableProperties, TableCellProperties,
    AddRowBefore, AddRowAfter, AddColumnBefore, AddColumnAfter,
    DeleteRow, DeleteColumn, DeleteTable, MergeCells, SplitCell
} = EditorTools;
\`\`\`

Key points:
- Always import both Editor and EditorTools from '@progress/kendo-react-editor'
- Destructure individual tools from EditorTools object
- Use the destructured tool references directly in the tools array
- Never define tools as strings (e.g., 'bold', 'italic')
- Group related tools in sub-arrays for better organization

Example:
Correct: tools={[[Bold, Italic, Underline], [AlignLeft, AlignCenter]]}
Incorrect: tools={[['bold', 'italic', 'underline'], ['alignLeft', 'alignCenter']]}
`;var H=$(import.meta.url),J=G.dirname(H),j=G.resolve(J,"../package.json"),Y=JSON.parse(V.readFileSync(j,"utf-8")),v=new q({name:"kendo-and-kendo-resources",version:Y.version});v.tool("kendo_react_assistant",`Answers questions and retrieves documentation about Kendo UI for React. 
Use this tool when the user asks about Kendo UI for React features, specific components (e.g., Grid, Chart, Editor), implementation details, or general usage. 
Provide the exact user's question as the 'query'. If the question pertains to a specific Kendo UI for React component, 
specify its name in the 'component' parameter. This tool can be automatically triggered when the following phrases are detected in the user's input/prompt:
- 'kendo';
- '/kendo';
- '/kendoreact'
- '/ask_kendo';
- '/help_kendo';
- '@kendo';
- '@kendoreact';
- '@ask_kendo';
- '@help_kendo'.`,{query:x.string().describe("The query to search for."),component:x.enum(C).describe("The component to search for. If not specified, you can use General.")},async({query:e,component:r})=>{i("Calling tool: ",JSON.stringify({query:e,component:r})),r==="Grid"&&(r="DataGrid");try{let t=await w({query:e,component:r.toLocaleLowerCase(),lib_name:y,text_matches_count:3,code_matches_count:0,allowed_types:["documentation"]});i("Response from context API: ",JSON.stringify(t));let o=z(r.toLowerCase()),n=t.values.join(`

`),u=n.trim(),l=[{type:"text",text:n+(u?`

`+o:"")}];return i("Response from tool: ",JSON.stringify(l)),{content:l}}catch(t){throw i("Error calling context API: ",JSON.stringify(t)),t?.code===d.UNAUTHENTICATED?new Error(`Error: You are not authenticated. Message: ${t.message}.`):t?.code===d.RESOURCE_EXHAUSTED?new Error(`Error: You have exceeded the extension quota. Upgrade to subscription licensing in order to unlock full access. Message: ${t.message}.`):t?.code===d.PERMISSION_DENIED?new Error(`Error: You do not have permission to access this resource. Please verify that you have a valid ${f} license key.`):t instanceof g?(i("License error: ",t.message),t):new Error(`Error: An error occurred while calling the service. Please try again later.

Error Message: ${t.message}`)}});function z(e){let r=e==="datagrid"?S?.trim():"",t=e==="datagrid"?E?.trim():"",o=e==="editor"?T?.trim():"";return`
# Kendo UI for React Assistant Guidelines

## Documentation References
MUST use official Kendo UI for React documentation only.

Required Format:
- Domain: https://www.telerik.com/kendo-react-ui
- Use complete, functional URLs (no placeholders or slug syntax)

Examples:
Correct: https://www.telerik.com/kendo-react-ui/components/grid/
Incorrect: { slug overview } or /components/{component-name}/overview

## Styling & Theming
MUST verify existing theme configuration before adding new styles.

Requirements:
1. Check if Kendo UI themes are already configured
2. Only recommend theme additions when missing
3. Provide appropriate import methods

## Icon Implementation
MUST prioritize SVG icons over font icons.

Guidelines:
- Primary: SVG icons from @progress/kendo-svg-icons
- Fallback: Font icons with CSS: <link rel="stylesheet" href="https://unpkg.com/@progress/kendo-font-icons/dist/index.css" />

${r.length>0||t.length>0||o.length>0?`## Component-Specific Instructions

${r}

${t}

${o}`:""}
`}async function X(){let e=new K;i("Starting server... "),await v.connect(e)}X();