@mindfiredigital/ignix-lite-mcp 1.0.0 → 1.2.0

package/src/manifests/index.ts

@@ -0,0 +1,45 @@
+import { readFileSync } from 'fs'
+import path from 'path'
+import { fileURLToPath } from 'url'
+import type { Manifest } from '../types.js'
+import { getTokenCount } from '../utils/tokenizer.js'
+
+const __filename = fileURLToPath(import.meta.url)
+const __dirname = path.dirname(__filename)
+
+function loadManifest(file: string): Manifest {
+  const manifestPath = path.resolve(__dirname, 'manifests', file)
+  const manifest = JSON.parse(readFileSync(manifestPath, 'utf8')) as Manifest
+  manifest.tokens = getTokenCount(manifest.emmet)
+  return manifest
+}
+
+export const manifests: Record<string, Manifest> = {
+  accordion: loadManifest('accordion.json'),
+  alert: loadManifest('alert.json'),
+  avatar: loadManifest('avatar.json'),
+  badge: loadManifest('badge.json'),
+  breadcrumb: loadManifest('breadcrumb.json'),
+  button: loadManifest('button.json'),
+  card: loadManifest('card.json'),
+  checkbox: loadManifest('checkbox.json'),
+  codeblock: loadManifest('codeblock.json'),
+  combobox: loadManifest('combobox.json'),
+  dialog: loadManifest('dialog.json'),
+  divider: loadManifest('divider.json'),
+  dropdown: loadManifest('dropdown.json'),
+  form: loadManifest('form.json'),
+  grid: loadManifest('grid.json'),
+  input: loadManifest('input.json'),
+  meter: loadManifest('meter.json'),
+  navigation: loadManifest('navigation.json'),
+  progress: loadManifest('progress.json'),
+  radio: loadManifest('radio.json'),
+  select: loadManifest('select.json'),
+  skeleton: loadManifest('skeleton.json'),
+  tab: loadManifest('tab.json'),
+  table: loadManifest('table.json'),
+  textarea: loadManifest('textarea.json'),
+  toast: loadManifest('toast.json'),
+  tooltip: loadManifest('tooltip.json')
+}

package/src/manifests/input.json

@@ -0,0 +1,99 @@
+{
+  "component": "input",
+  "version": "2.0",
+  "description": "User input field. Must be wrapped inside <label> for accessibility.",
+
+  "element": "input",
+
+  "emmet": "label>{Label}+input[type=?]",
+
+  "props": {
+    "type": {
+      "type": "enum",
+      "values": [
+        "text",
+        "email",
+        "password",
+        "number",
+        "date",
+        "search",
+        "tel",
+        "url",
+        "file"
+      ],
+      "default": "text",
+      "native": true,
+      "agent_hint": "Choose correct input type based on data"
+    },
+
+    "placeholder": {
+      "type": "string",
+      "native": true,
+      "agent_hint": "Short hint shown inside input"
+    },
+
+    "required": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Marks field as mandatory"
+    },
+
+    "disabled": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Disables user interaction"
+    },
+
+    "aria-invalid": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Set true for validation errors"
+    },
+
+    "data-intent": {
+      "type": "enum",
+      "values": ["primary", "danger", "warning", "success", "neutral"],
+      "default": "neutral",
+      "native": false,
+      "agent_hint": "Controls border color (design intent)"
+    }
+  },
+
+  "states": ["disabled", "aria-invalid"],
+
+  "required_props": ["type"],
+
+  "required_wrapper": "label",
+
+  "forbidden_props": ["variant", "color", "appearance", "size", "class"],
+
+  "do": [
+    "Always wrap input inside <label>",
+    "Use correct type (email, number, etc.)",
+    "Use aria-invalid for error state"
+  ],
+
+  "dont": [
+    "Do not use class attribute",
+    "Do not use variant or color props",
+    "Do not place input outside label"
+  ],
+
+  "examples": [
+    {
+      "label": "Basic input",
+      "emmet": "label>{Name}+input[type=text]",
+      "html": "<label>Name <input type=\"text\" /></label>"
+    },
+    {
+      "label": "Email required",
+      "emmet": "label>{Email}+input[type=email required]",
+      "html": "<label>Email <input type=\"email\" required /></label>"
+    },
+    {
+      "label": "Invalid state",
+      "emmet": "label>{Email}+input[type=email aria-invalid=true]",
+      "html": "<label>Email <input type=\"email\" aria-invalid=\"true\" /></label>"
+    }
+  ]
+}

package/src/manifests/meter.json

@@ -0,0 +1,103 @@
+{
+  "component": "meter",
+
+  "version": "2.0",
+
+  "description": "Visualizes scalar measurements within a known range using the native HTML meter element.",
+
+  "element": "meter",
+
+  "emmet": "meter[value=70 min=0 max=100]",
+
+  "props": {
+    "value": {
+      "type": "number",
+      "required": true,
+      "native": true,
+      "agent_hint": "Current measured value."
+    },
+
+    "min": {
+      "type": "number",
+      "default": 0,
+      "native": true
+    },
+
+    "max": {
+      "type": "number",
+      "default": 1,
+      "native": true
+    },
+
+    "low": {
+      "type": "number",
+      "native": true,
+      "agent_hint": "Lower threshold value."
+    },
+
+    "high": {
+      "type": "number",
+      "native": true,
+      "agent_hint": "Upper threshold value."
+    },
+
+    "optimum": {
+      "type": "number",
+      "native": true,
+      "agent_hint": "Preferred or ideal value."
+    }
+  },
+
+  "states": ["low", "high", "optimum"],
+
+  "forbidden_props": [
+    "variant",
+    "intent",
+    "color",
+    "percentage",
+    "progress",
+    "class"
+  ],
+
+  "required_props": ["value"],
+
+  "required_slots": [],
+
+  "do": [
+    "Use value with min and max",
+    "Use low and high for thresholds",
+    "Use optimum for ideal value ranges"
+  ],
+
+  "dont": [
+    "Do not use class attribute",
+    "Do not use progress prop",
+    "Do not use variant or intent props"
+  ],
+
+  "examples": [
+    {
+      "label": "Storage usage",
+      "emmet": "meter[value=68 min=0 max=100 low=30 high=70 optimum=100]",
+      "html": "<meter value=\"68\" min=\"0\" max=\"100\" low=\"30\" high=\"70\" optimum=\"100\"></meter>"
+    },
+
+    {
+      "label": "Low state",
+      "emmet": "meter[value=20 min=0 max=100 low=30 high=70 optimum=100]",
+      "html": "<meter value=\"20\" min=\"0\" max=\"100\" low=\"30\" high=\"70\" optimum=\"100\"></meter>"
+    },
+
+    {
+      "label": "Medium state",
+      "emmet": "meter[value=50 min=0 max=100 low=30 high=70 optimum=100]",
+      "html": "<meter value=\"50\" min=\"0\" max=\"100\" low=\"30\" high=\"70\" optimum=\"100\"></meter>"
+    },
+
+    {
+      "label": "Optimal state",
+      "emmet": "meter[value=90 min=0 max=100 low=30 high=70 optimum=100]",
+      "html": "<meter value=\"90\" min=\"0\" max=\"100\" low=\"30\" high=\"70\" optimum=\"100\"></meter>"
+    }
+  ]
+}

package/src/manifests/navigation.json

@@ -0,0 +1,70 @@
+{
+  "component": "navigation",
+  "version": "2.0",
+  "description": "Semantic navigation component using native nav, ul, li and anchor elements with active state support.",
+
+  "element": "nav",
+
+  "emmet": "nav>ul>li*3>a",
+
+  "props": {
+    "aria-current": {
+      "type": "enum",
+      "values": ["page"],
+      "default": null,
+      "native": true,
+      "agent_hint": "Marks active navigation link."
+    },
+
+    "href": {
+      "type": "string",
+      "default": "#",
+      "native": true,
+      "agent_hint": "Navigation destination."
+    }
+  },
+
+  "states": ["default", "active", "focus"],
+
+  "forbidden_props": ["variant", "intent", "theme", "class", "size"],
+
+  "required_props": [],
+
+  "required_slots": [],
+
+  "methods": [],
+
+  "do": [
+    "Wrap links inside nav",
+    "Use ul and li structure",
+    "Apply aria-current=\"page\" to active link",
+    "Keep anchor href present"
+  ],
+
+  "dont": [
+    "Do not skip ul structure",
+    "Do not apply aria-current on multiple links",
+    "Do not use div instead of nav",
+    "Do not omit href"
+  ],
+
+  "examples": [
+    {
+      "label": "Default navigation",
+      "emmet": "nav>ul>li*3>a",
+      "html": "<nav><ul><li><a href=\"#\" aria-current=\"page\">Home</a></li><li><a href=\"#\">About</a></li><li><a href=\"#\">Contact</a></li></ul></nav>"
+    },
+
+    {
+      "label": "Extended navigation",
+      "emmet": "nav>ul>li*4>a",
+      "html": "<nav><ul><li><a href=\"#\" aria-current=\"page\">Dashboard</a></li><li><a href=\"#\">Projects</a></li><li><a href=\"#\">Settings</a></li><li><a href=\"#\">Profile</a></li></ul></nav>"
+    },
+
+    {
+      "label": "Active link",
+      "emmet": "a[aria-current=page]",
+      "html": "<a href=\"#\" aria-current=\"page\">Home</a>"
+    }
+  ]
+}

package/src/manifests/progress.json

@@ -0,0 +1,88 @@
+{
+  "component": "progress",
+  "version": "2.0",
+  "description": "Displays task completion progress using the native HTML <progress> element.",
+
+  "element": "progress",
+
+  "emmet": "progress[value=? max=?]",
+
+  "props": {
+    "value": {
+      "type": "number",
+      "required": true,
+      "native": true,
+      "agent_hint": "Current progress amount."
+    },
+
+    "max": {
+      "type": "number",
+      "default": 1,
+      "native": true,
+      "agent_hint": "Maximum progress amount."
+    }
+  },
+
+  "states": ["empty", "partial", "complete"],
+
+  "forbidden_props": [
+    "variant",
+    "intent",
+    "appearance",
+    "percentage",
+    "color",
+    "colorScheme",
+    "meter",
+    "class"
+  ],
+
+  "required_props": ["value"],
+
+  "required_slots": [],
+
+  "do": [
+    "Use value='0' for empty progress",
+    "Use value between 0 and max for partial progress",
+    "Use value=max for completed progress",
+    "Always provide max when progress range is known"
+  ],
+
+  "dont": [
+    "Do not use class attribute",
+    "Do not use variant or intent props",
+    "Do not use percentage prop",
+    "Do not replace progress with meter element semantics"
+  ],
+
+  "examples": [
+    {
+      "label": "Default progress",
+      "emmet": "progress[value=72 max=100]",
+      "html": "<progress value=\"72\" max=\"100\"></progress>"
+    },
+
+    {
+      "label": "Empty progress",
+      "emmet": "progress[value=0 max=100]",
+      "html": "<progress value=\"0\" max=\"100\"></progress>"
+    },
+
+    {
+      "label": "Partial progress",
+      "emmet": "progress[value=50 max=100]",
+      "html": "<progress value=\"50\" max=\"100\"></progress>"
+    },
+
+    {
+      "label": "Completed progress",
+      "emmet": "progress[value=100 max=100]",
+      "html": "<progress value=\"100\" max=\"100\"></progress>"
+    },
+
+    {
+      "label": "Upload progress",
+      "emmet": "progress[value=72 max=100]",
+      "html": "<progress value=\"72\" max=\"100\"></progress>"
+    }
+  ]
+}

package/src/manifests/radio.json

@@ -0,0 +1,121 @@
+{
+  "component": "radio",
+  "version": "2.0",
+  "description": "Radio input for single selection. Must be wrapped inside a label element.",
+
+  "element": "input",
+
+  "emmet": "label[data-intent=? data-size=?]>(input[type=radio]+{Label})",
+
+  "props": {
+    "type": {
+      "type": "enum",
+      "values": ["radio"],
+      "default": "radio",
+      "native": true,
+      "agent_hint": "Always use type=radio"
+    },
+
+    "checked": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Marks radio as selected"
+    },
+
+    "disabled": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Disables radio"
+    },
+
+    "required": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Marks radio as required"
+    },
+
+    "name": {
+      "type": "string",
+      "native": true,
+      "agent_hint": "Used for grouping radios"
+    },
+
+    "value": {
+      "type": "string",
+      "native": true,
+      "agent_hint": "Submitted value in forms"
+    },
+
+    "data-intent": {
+      "type": "enum",
+      "values": ["success", "danger", "warning", "neutral"],
+      "default": "neutral",
+      "native": false,
+      "agent_hint": "Controls radio color"
+    },
+
+    "data-size": {
+      "type": "enum",
+      "values": ["sm", "md", "lg"],
+      "default": "md",
+      "native": false,
+      "agent_hint": "Controls radio size"
+    }
+  },
+
+  "states": ["checked", "disabled"],
+
+  "required_props": ["type"],
+
+  "required_wrapper": "label",
+
+  "forbidden_props": ["class", "variant", "color", "style", "onclick"],
+
+  "do": [
+    "Wrap radio inside label",
+    "Use checked for default state",
+    "Use same name for grouping radios",
+    "Use data-intent for styling",
+    "Use data-size for scaling"
+  ],
+
+  "dont": [
+    "Do not use class attribute",
+    "Do not use variant or color props",
+    "Do not use inline JS handlers",
+    "Do not place radio outside label"
+  ],
+
+  "examples": [
+    {
+      "label": "Basic radio",
+      "emmet": "label>(input[type=radio]+{JavaScript})",
+      "html": "<label><input type=\"radio\" />JavaScript</label>"
+    },
+    {
+      "label": "Checked radio",
+      "emmet": "label>(input[type=radio checked]+{Selected})",
+      "html": "<label><input type=\"radio\" checked />Selected</label>"
+    },
+    {
+      "label": "Disabled radio",
+      "emmet": "label>(input[type=radio disabled]+{Disabled})",
+      "html": "<label><input type=\"radio\" disabled />Disabled</label>"
+    },
+    {
+      "label": "Intent variant",
+      "emmet": "label[data-intent=success]>(input[type=radio checked]+{Success})",
+      "html": "<label data-intent=\"success\"><input type=\"radio\" checked />Success</label>"
+    },
+    {
+      "label": "Size variant",
+      "emmet": "label[data-size=lg]>(input[type=radio]+{Large})",
+      "html": "<label data-size=\"lg\"><input type=\"radio\" />Large</label>"
+    },
+    {
+      "label": "Radio group",
+      "emmet": "label>(input[type=radio name=group value=js]+{JavaScript})",
+      "html": "<label><input type=\"radio\" name=\"group\" value=\"js\" />JavaScript</label>"
+    }
+  ]
+}

package/src/manifests/select.json

@@ -0,0 +1,109 @@
+{
+  "component": "select",
+  "version": "2.0",
+  "description": "Provides accessible dropdown selection using the native HTML select element with semantic intent variants.",
+
+  "element": "select",
+
+  "emmet": "select[data-intent=primary]>option{Option}",
+
+  "props": {
+    "data-intent": {
+      "type": "enum",
+      "values": ["primary", "danger", "warning", "success", "neutral"],
+      "default": "neutral",
+      "native": false,
+      "agent_hint": "Use danger for destructive selections, success for positive states, primary for main forms."
+    },
+
+    "disabled": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Disable user interaction."
+    },
+
+    "required": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Marks field as required."
+    },
+
+    "aria-invalid": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Use for validation error state."
+    },
+
+    "multiple": {
+      "type": "boolean",
+      "native": true,
+      "agent_hint": "Enable multiple selection."
+    },
+
+    "name": {
+      "type": "string",
+      "native": true
+    }
+  },
+
+  "states": ["disabled", "invalid", "required", "multiple"],
+
+  "forbidden_props": [
+    "variant",
+    "color",
+    "appearance",
+    "colorScheme",
+    "size",
+    "isDisabled",
+    "class"
+  ],
+
+  "required_props": [],
+  "required_slots": [],
+
+  "do": [
+    "Use data-intent='primary' for default form flows",
+    "Use aria-invalid='true' for validation errors",
+    "Use disabled for unavailable selections",
+    "Use multiple for multi-select lists"
+  ],
+
+  "dont": [
+    "Do not use class attribute",
+    "Do not use variant props",
+    "Do not use color props",
+    "Do not use isDisabled"
+  ],
+
+  "examples": [
+    {
+      "label": "Default select",
+      "emmet": "select[data-intent=neutral]>option{India}",
+      "html": "<select data-intent=\"neutral\"><option>India</option></select>"
+    },
+
+    {
+      "label": "Primary select",
+      "emmet": "select[data-intent=primary]>option{India}",
+      "html": "<select data-intent=\"primary\"><option>India</option></select>"
+    },
+
+    {
+      "label": "Disabled select",
+      "emmet": "select[data-intent=neutral disabled]>option{Disabled}",
+      "html": "<select data-intent=\"neutral\" disabled><option>Disabled</option></select>"
+    },
+
+    {
+      "label": "Invalid select",
+      "emmet": "select[data-intent=neutral aria-invalid=true]>option{Error}",
+      "html": "<select data-intent=\"neutral\" aria-invalid=\"true\"><option>Error</option></select>"
+    },
+
+    {
+      "label": "Multiple select",
+      "emmet": "select[data-intent=neutral multiple]>option{India}+option{USA}",
+      "html": "<select data-intent=\"neutral\" multiple><option>India</option><option>USA</option></select>"
+    }
+  ]
+}