@triptease/design-system-mcp 1.2.4 → 1.2.6

package/dist/index.js

@@ -23302,7 +23302,7 @@ var StdioServerTransport = class {
 // package.json
 var package_default = {
   name: "@triptease/design-system-mcp",
-  version: "1.2.4",
+  version: "1.2.6",
   description: "MCP server for Triptease design system documentation",
   type: "module",
   main: "dist/index.js",
@@ -23323,7 +23323,7 @@ var package_default = {
     node: ">=18.0.0"
   },
   componentVersions: {
-    "@triptease/stylesheet": "2.1.3",
+    "@triptease/stylesheet": "2.1.4",
     "@triptease/tt-bar-chart": "1.1.3",
     "@triptease/tt-combobox": "5.7.4",
     "@triptease/tt-data-point": "1.1.1",
@@ -23339,7 +23339,7 @@ var package_default = {
     "@triptease/tt-tabs": "1.1.0"
   },
   dependencies: {
-    "@triptease/stylesheet": "2.1.3"
+    "@triptease/stylesheet": "2.1.5"
   },
   devDependencies: {
     "@modelcontextprotocol/sdk": "1.26.0",
@@ -24041,10 +24041,14 @@ var table_default = {
         "On small screens where columns cannot fit \u2014 consider alternative layouts"
       ],
       bestPractices: [
-        "Keep column names short \u2014 one or two words where possible. Do not use sentences or sub-headings; if a column name needs explaining, consider simplifying it.",
+        "Right-align numeric content (counts, percentages, currency). Left-align all other content. Column headers must match the alignment of their column.",
+        "Place action columns last.",
+        "If rows navigate to a resource or page, use the resource display name as the first column and link the text \u2014 not the entire row. Every value in the first column must be unique.",
+        "Keep column names short \u2014 one or two words where possible. Avoid sentences and sub-headings.",
         "Use a dash (\u2014) for missing or unknown values. Do not leave cells empty \u2014 an empty cell is ambiguous.",
         "Do not use 0 to represent missing data. Zero is a meaningful value \u2014 for example, a \xA30 budget indicates an intentional allocation of nothing, which is different from a budget that has not been set.",
-        "Do not use icons inside data cells. Tables are scanned by text; icons add visual noise without aiding comprehension. If a cell requires an icon to be understood, the text label or column header is not clear enough."
+        "Use secondary buttons for row actions.",
+        "Use icons within cells only inside action buttons, or to communicate status where a badge would be less clear. Always include an accessible label. Do not use icons in column headers."
       ],
       accessibility: [
         'Use th scope="col" on column headers to help screen readers associate cells with their headings',
@@ -24129,24 +24133,75 @@ var table_default = {
     examples: [
       {
         title: "Basic table",
+        description: "Numeric columns (counts, percentages, currency) are right-aligned. Text columns are left-aligned. Column headers match the alignment of their content.",
         code: `<table>
   <thead>
     <tr>
       <th scope="col">Property Name</th>
-      <th scope="col">Impressions</th>
-      <th scope="col">Revenue</th>
+      <th scope="col" style="text-align: right">Impressions</th>
+      <th scope="col" style="text-align: right">Revenue</th>
     </tr>
   </thead>
   <tbody>
     <tr>
       <td>Downtown Suites</td>
-      <td>12,450</td>
-      <td>$5,760.00</td>
+      <td style="text-align: right">12,450</td>
+      <td style="text-align: right">$5,760.00</td>
     </tr>
     <tr>
       <td>Oceanview Villas</td>
-      <td>9,875</td>
-      <td>$3,420.00</td>
+      <td style="text-align: right">9,875</td>
+      <td style="text-align: right">$3,420.00</td>
+    </tr>
+  </tbody>
+</table>`
+      },
+      {
+        title: "Table with actions",
+        description: "Place the actions column last. Use secondary buttons for row actions.",
+        code: `<table>
+  <thead>
+    <tr>
+      <th scope="col">Property Name</th>
+      <th scope="col" style="text-align: right">Revenue</th>
+      <th scope="col">Actions</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td>Downtown Suites</td>
+      <td style="text-align: right">$5,760.00</td>
+      <td><button data-theme="secondary">Edit</button></td>
+    </tr>
+    <tr>
+      <td>Oceanview Villas</td>
+      <td style="text-align: right">$3,420.00</td>
+      <td><button data-theme="secondary">Edit</button></td>
+    </tr>
+  </tbody>
+</table>`
+      },
+      {
+        title: "Table with linked rows",
+        description: "When rows navigate to a resource, link the first column text. Do not make the entire row a link.",
+        code: `<table>
+  <thead>
+    <tr>
+      <th scope="col">Property Name</th>
+      <th scope="col" style="text-align: right">Impressions</th>
+      <th scope="col" style="text-align: right">Revenue</th>
+    </tr>
+  </thead>
+  <tbody>
+    <tr>
+      <td><a href="/properties/1">Downtown Suites</a></td>
+      <td style="text-align: right">12,450</td>
+      <td style="text-align: right">$5,760.00</td>
+    </tr>
+    <tr>
+      <td><a href="/properties/2">Oceanview Villas</a></td>
+      <td style="text-align: right">9,875</td>
+      <td style="text-align: right">$3,420.00</td>
     </tr>
   </tbody>
 </table>`
@@ -24159,20 +24214,20 @@ var table_default = {
     <thead>
       <tr>
         <th scope="col" data-sort-key="name">Property Name</th>
-        <th scope="col" data-sort-key="impressions">Impressions</th>
-        <th scope="col" data-sort-key="revenue">Revenue</th>
+        <th scope="col" data-sort-key="impressions" style="text-align: right">Impressions</th>
+        <th scope="col" data-sort-key="revenue" style="text-align: right">Revenue</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <td>Downtown Suites</td>
-        <td>12,450</td>
-        <td>$5,760.00</td>
+        <td style="text-align: right">12,450</td>
+        <td style="text-align: right">$5,760.00</td>
       </tr>
       <tr>
         <td>Oceanview Villas</td>
-        <td>9,875</td>
-        <td>$3,420.00</td>
+        <td style="text-align: right">9,875</td>
+        <td style="text-align: right">$3,420.00</td>
       </tr>
     </tbody>
   </table>
@@ -24193,20 +24248,20 @@ var table_default = {
     <thead>
       <tr>
         <th scope="col">Property Name</th>
-        <th scope="col">Impressions</th>
-        <th scope="col">Revenue</th>
+        <th scope="col" style="text-align: right">Impressions</th>
+        <th scope="col" style="text-align: right">Revenue</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <td>Downtown Suites</td>
-        <td>12,450</td>
-        <td>$5,760.00</td>
+        <td style="text-align: right">12,450</td>
+        <td style="text-align: right">$5,760.00</td>
       </tr>
       <tr>
         <td>Oceanview Villas</td>
-        <td>9,875</td>
-        <td>$3,420.00</td>
+        <td style="text-align: right">9,875</td>
+        <td style="text-align: right">$3,420.00</td>
       </tr>
     </tbody>
   </table>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@triptease/design-system-mcp",
-  "version": "1.2.4",
+  "version": "1.2.6",
   "description": "MCP server for Triptease design system documentation",
   "type": "module",
   "main": "dist/index.js",
@@ -21,7 +21,7 @@
     "node": ">=18.0.0"
   },
   "componentVersions": {
-    "@triptease/stylesheet": "2.1.3",
+    "@triptease/stylesheet": "2.1.4",
     "@triptease/tt-bar-chart": "1.1.3",
     "@triptease/tt-combobox": "5.7.4",
     "@triptease/tt-data-point": "1.1.1",
@@ -37,7 +37,7 @@
     "@triptease/tt-tabs": "1.1.0"
   },
   "dependencies": {
-    "@triptease/stylesheet": "2.1.3"
+    "@triptease/stylesheet": "2.1.5"
   },
   "devDependencies": {
     "@modelcontextprotocol/sdk": "1.26.0",