@triptease/design-system-mcp 1.0.15 → 1.0.17
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +13 -0
- package/dist/package.json +2 -2
- package/dist/src/manifests/components/entries/banner.d.ts +1 -1
- package/dist/src/manifests/components/entries/banner.js +1 -1
- package/dist/src/manifests/components/entries/banner.js.map +1 -1
- package/package.json +2 -2
- package/src/manifests/components/entries/banner.ts +1 -1
- package/src/resources/components/list.test.ts +2 -2
- package/src/tools/getComponentDocs/__snapshots__/handler.test.ts.snap +1 -1
- package/src/tools/getSetupGuide/__snapshots__/handler.test.ts.snap +1 -1
- package/src/tools/listComponents/__snapshots__/handler.test.ts.snap +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,18 @@
|
|
|
1
1
|
# @triptease/design-system-mcp
|
|
2
2
|
|
|
3
|
+
## 1.0.17
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- Fix incorrect banner key in mcp component manifest
|
|
8
|
+
|
|
9
|
+
## 1.0.16
|
|
10
|
+
|
|
11
|
+
### Patch Changes
|
|
12
|
+
|
|
13
|
+
- Updated dependencies
|
|
14
|
+
- @triptease/stylesheet@1.4.6
|
|
15
|
+
|
|
3
16
|
## 1.0.15
|
|
4
17
|
|
|
5
18
|
### Patch Changes
|
package/dist/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@triptease/design-system-mcp",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.17",
|
|
4
4
|
"description": "MCP server for Triptease design system documentation",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/src/index.js",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"@modelcontextprotocol/sdk": "^1.26.0",
|
|
22
|
-
"@triptease/stylesheet": "1.4.
|
|
22
|
+
"@triptease/stylesheet": "1.4.6",
|
|
23
23
|
"@triptease/tt-bar-chart": "1.0.7",
|
|
24
24
|
"@triptease/tt-combobox": "5.6.6",
|
|
25
25
|
"@triptease/tt-data-point": "1.0.1",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"banner.js","sourceRoot":"","sources":["../../../../../src/manifests/components/entries/banner.ts"],"names":[],"mappings":"AAEA,eAAe;IACb,
|
|
1
|
+
{"version":3,"file":"banner.js","sourceRoot":"","sources":["../../../../../src/manifests/components/entries/banner.ts"],"names":[],"mappings":"AAEA,eAAe;IACb,MAAM,EAAE;QACN,IAAI,EAAE,QAAQ;QACd,WAAW,EAAE,4FAA4F;QACzG,OAAO,EAAE,KAAK;QACd,aAAa,EAAE;YACb,SAAS,EAAE;gBACT,sEAAsE;gBACtE,gEAAgE;aACjE;YACD,KAAK,EAAE;gBACL,4FAA4F;gBAC5F,iDAAiD;gBACjD,uHAAuH;gBACvH,4JAA4J;aAC7J;SACF;QACD,cAAc,EAAE;YACd,YAAY,EAAE;gBACZ,IAAI,EAAE,MAAM;gBACZ,MAAM,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC;gBAC5B,WAAW,EAAE,+CAA+C;aAC7D;SACF;QACD,QAAQ,EAAE;YACR;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE;;;WAGH;aACJ;YACD;gBACE,KAAK,EAAE,YAAY;gBACnB,IAAI,EAAE;;;;WAIH;aACJ;YACD;gBACE,KAAK,EAAE,aAAa;gBACpB,IAAI,EAAE;;;;;;WAMH;aACJ;YACD;gBACE,KAAK,EAAE,SAAS;gBAChB,IAAI,EAAE;;;WAGH;aACJ;YACD;gBACE,KAAK,EAAE,OAAO;gBACd,IAAI,EAAE;;;WAGH;aACJ;SACF;KACF;CAC0B,CAAC","sourcesContent":["import { ComponentManifest } from '@/manifests/components/types.js';\n\nexport default {\n banner: {\n name: 'Banner',\n description: 'Banners prominently display information to users and sometimes prompt them to take action.',\n element: 'div',\n usageGuidance: {\n whenToUse: [\n \"To display information that requires the users' immediate attention.\",\n 'To capture the users attention and prompt them to take action.',\n ],\n avoid: [\n \"To display non-important information that does not require the users' immediate attention.\",\n 'To advertise new features, services or updates.',\n 'To display form validation errors (place an error message beneath, or as close as is possible to, the input instead).',\n \"To display lengthy information (consider a dialog or put the information on a separate page and use a banner to draw the users' attention to it instead).'\",\n ],\n },\n dataAttributes: {\n 'data-theme': {\n type: 'enum',\n values: ['alert', 'warning'],\n description: 'Shows info variant when data-theme is not set',\n },\n },\n examples: [\n {\n title: 'Basic usage',\n code: `\n <div class=\"banner\">\n <p class=\"banner--body\">Content inside banner</p>\n </div>`,\n },\n {\n title: 'With title',\n code: `\n <div class=\"banner\">\n <p class=\"banner--title\">Banner title</p>\n <p class=\"banner--body\">Content inside banner</p>\n </div>`,\n },\n {\n title: 'With Action',\n code: `\n <div class=\"banner\">\n <p class=\"banner--body\">Content inside banner</p>\n <button class=\"banner--action small\" data-theme=\"tertiary\">\n Action\n </button>\n </div>`,\n },\n {\n title: 'Warning',\n code: `\n <div class=\"banner\" data-theme=\"warning\">\n <p class=\"banner--body\">Content inside banner</p>\n </div>`,\n },\n {\n title: 'Alert',\n code: `\n <div class=\"banner\" data-theme=\"alert\">\n <p class=\"banner--body\">Content inside banner</p>\n </div>`,\n },\n ],\n },\n} satisfies ComponentManifest;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@triptease/design-system-mcp",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.17",
|
|
4
4
|
"description": "MCP server for Triptease design system documentation",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/src/index.js",
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
},
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"@modelcontextprotocol/sdk": "^1.26.0",
|
|
22
|
-
"@triptease/stylesheet": "1.4.
|
|
22
|
+
"@triptease/stylesheet": "1.4.6",
|
|
23
23
|
"@triptease/tt-bar-chart": "1.0.7",
|
|
24
24
|
"@triptease/tt-combobox": "5.6.6",
|
|
25
25
|
"@triptease/tt-data-point": "1.0.1",
|
|
@@ -11,11 +11,11 @@ describe('listComponents resource', () => {
|
|
|
11
11
|
expect(result.contents[0].mimeType).toBe('application/json');
|
|
12
12
|
});
|
|
13
13
|
|
|
14
|
-
it('should return all
|
|
14
|
+
it('should return all 20 components', async () => {
|
|
15
15
|
const result = await listComponents();
|
|
16
16
|
const data = JSON.parse(result.contents[0].text);
|
|
17
17
|
|
|
18
|
-
expect(data.components).toHaveLength(
|
|
18
|
+
expect(data.components).toHaveLength(20);
|
|
19
19
|
});
|
|
20
20
|
|
|
21
21
|
it('should include component key, name, description, and element', async () => {
|
|
@@ -4,7 +4,7 @@ exports[`getComponentDocs handler > should return not found if the provided comp
|
|
|
4
4
|
{
|
|
5
5
|
"content": [
|
|
6
6
|
{
|
|
7
|
-
"text": "{"error":"Component 'foo' not found","available":["button","textinput","numberinput","textarea","select","checkbox","radio","toggle","badge","card","table","typography","dialog","combobox","date-picker","date-range-picker","bar-chart","line-chart","statistic"]}",
|
|
7
|
+
"text": "{"error":"Component 'foo' not found","available":["button","textinput","numberinput","textarea","select","checkbox","radio","toggle","badge","card","table","typography","dialog","combobox","date-picker","date-range-picker","bar-chart","line-chart","statistic","banner"]}",
|
|
8
8
|
"type": "text",
|
|
9
9
|
},
|
|
10
10
|
],
|
|
@@ -15,7 +15,7 @@ exports[`getSetupGuide handler > should return all setup guides if no type is gi
|
|
|
15
15
|
{
|
|
16
16
|
"content": [
|
|
17
17
|
{
|
|
18
|
-
"text": "{"message":"Multiple setup options available. Choose based on user preference or project requirements.","options":[{"type":"npm","name":"NPM Stylesheet Setup","description":"Setup instructions for using the stylesheet package via npm.","guide":{"name":"NPM Stylesheet Setup","description":"Setup instructions for using the stylesheet package via npm.","steps":[{"title":"Install the stylesheet package","description":"Choose your package manager:","code":"# NPM\\nnpm install @triptease/stylesheet\\n\\n# Yarn\\nyarn add @triptease/stylesheet\\n\\n# Bun\\nbun add @triptease/stylesheet","language":"bash"},{"title":"Import the stylesheet","description":"Add this import to your application entry point:","code":"import '@triptease/stylesheet';","language":"typescript"}],"notes":["Current version: @triptease/stylesheet@1.4.
|
|
18
|
+
"text": "{"message":"Multiple setup options available. Choose based on user preference or project requirements.","options":[{"type":"npm","name":"NPM Stylesheet Setup","description":"Setup instructions for using the stylesheet package via npm.","guide":{"name":"NPM Stylesheet Setup","description":"Setup instructions for using the stylesheet package via npm.","steps":[{"title":"Install the stylesheet package","description":"Choose your package manager:","code":"# NPM\\nnpm install @triptease/stylesheet\\n\\n# Yarn\\nyarn add @triptease/stylesheet\\n\\n# Bun\\nbun add @triptease/stylesheet","language":"bash"},{"title":"Import the stylesheet","description":"Add this import to your application entry point:","code":"import '@triptease/stylesheet';","language":"typescript"}],"notes":["Current version: @triptease/stylesheet@1.4.6"]}},{"type":"cdn","name":"CDN Stylesheet Setup","description":"Setup instructions for using the stylesheet via CDN.","guide":{"name":"CDN Stylesheet Setup","description":"Setup instructions for using the stylesheet via CDN.","steps":[{"title":"Add stylesheet link to HTML","description":"Include this in the <head> of your HTML document:","code":"<head>\\n <!-- Specific version (recommended) -->\\n <link rel=\\"stylesheet\\" href=\\"https://cdn.design-system.triptease.io/1.4.6/triptease.css\\">\\n\\n <!-- Or, latest version (dangerous - breaking changes may occur) -->\\n <link rel=\\"stylesheet\\" href=\\"https://cdn.design-system.triptease.io/triptease.css\\">\\n</head>","language":"html"}]}}]}",
|
|
19
19
|
"type": "text",
|
|
20
20
|
},
|
|
21
21
|
],
|
|
@@ -4,7 +4,7 @@ exports[`listComponents tool > should list all components within the manifest 1`
|
|
|
4
4
|
{
|
|
5
5
|
"content": [
|
|
6
6
|
{
|
|
7
|
-
"text": "{"components":[{"key":"button","name":"Button","description":"Interactive button component with multiple themes and states","element":"button"},{"key":"textinput","name":"Text Input","description":"Text input field for single-line text entry with automatic validation styling","element":"input"},{"key":"numberinput","name":"Number Input","description":"Number input field with browser-provided increment/decrement controls","element":"input[type='number']"},{"key":"textarea","name":"Textarea","description":"Multi-line text input field","element":"textarea"},{"key":"select","name":"Select Input","description":"Dropdown list for selecting a single option","element":"select"},{"key":"checkbox","name":"Checkbox","description":"Checkbox input for multiple selections","element":"input[type='checkbox']"},{"key":"radio","name":"Radio","description":"Radio button for selecting exactly one option from mutually exclusive choices","element":"input[type='radio']"},{"key":"toggle","name":"Toggle","description":"Toggle switch for binary on/off states with immediate effect","element":"input[type='checkbox'][data-theme='toggle']"},{"key":"badge","name":"
|
|
7
|
+
"text": "{"components":[{"key":"button","name":"Button","description":"Interactive button component with multiple themes and states","element":"button"},{"key":"textinput","name":"Text Input","description":"Text input field for single-line text entry with automatic validation styling","element":"input"},{"key":"numberinput","name":"Number Input","description":"Number input field with browser-provided increment/decrement controls","element":"input[type='number']"},{"key":"textarea","name":"Textarea","description":"Multi-line text input field","element":"textarea"},{"key":"select","name":"Select Input","description":"Dropdown list for selecting a single option","element":"select"},{"key":"checkbox","name":"Checkbox","description":"Checkbox input for multiple selections","element":"input[type='checkbox']"},{"key":"radio","name":"Radio","description":"Radio button for selecting exactly one option from mutually exclusive choices","element":"input[type='radio']"},{"key":"toggle","name":"Toggle","description":"Toggle switch for binary on/off states with immediate effect","element":"input[type='checkbox'][data-theme='toggle']"},{"key":"badge","name":"Badge","description":"Status indicator or label badge for highlighting small pieces of information","element":"span"},{"key":"card","name":"Card","description":"Container component that groups related content and actions in a visually distinct area","element":"div"},{"key":"table","name":"Table","description":"Organize and display data in rows and columns","element":"table"},{"key":"typography","name":"Typography","description":"Text styling using semantic HTML elements and utility classes","element":"h1-h4, p, strong, a"},{"key":"dialog","name":"Dialog - Web Component","description":"Dialog component that displays content in a layer above the page","element":"tt-dialog"},{"key":"combobox","name":"Combobox","description":"Searchable dropdown that combines a text input with a list, available as both React component and Web Component","element":"Combobox (React) / tt-combobox (Web Component)"},{"key":"date-picker","name":"Date Picker","description":"Date picker for selecting a single date, available as both React component and Web Component","element":"DatePicker (React) / tt-date-picker (Web Component)"},{"key":"date-range-picker","name":"Date Range Picker","description":"Date range picker for selecting start and end dates, available as both React component and Web Component","element":"DateRangePicker (React) / tt-date-range-picker (Web Component)"},{"key":"bar-chart","name":"Bar Chart - Web Component","description":"Bar chart for comparing values across categories","element":"tt-bar-chart"},{"key":"line-chart","name":"Line Chart - Web Component","description":"Line chart for visualizing trends over continuous data","element":"tt-line-chart"},{"key":"statistic","name":"Statistic","description":"A consistent, structured layout for displaying a statistic or a few statistics.","element":"div"},{"key":"banner","name":"Banner","description":"Banners prominently display information to users and sometimes prompt them to take action.","element":"div"}]}",
|
|
8
8
|
"type": "text",
|
|
9
9
|
},
|
|
10
10
|
],
|