@fewangsit/wangsvue-gsts 2.0.0-alpha.13 → 2.0.0-alpha.14

package/assets/scanner.worker-Bk2e5hSA.js.map

@@ -1 +1 @@
-{"version":3,"file":"scanner.worker-Bk2e5hSA.js","sources":["../../../library/components/buttonscan/workers/scanner.worker.ts"],"sourcesContent":["interface ConnectionOption {\n  onopen: (ws: WebSocket, connectionState: ConnectionState) => void;\n  onmessage: (event: MessageEvent) => void;\n  onerror: (error: Event) => void;\n  timeout?: number;\n}\n\ninterface WorkerMessage {\n  command: string;\n  sessionId: string;\n  scanCommand?: string;\n  userId?: string;\n  companyCode?: string;\n  serialNumber?: string;\n  jenisDevice?: string;\n}\n\ntype ConnectionState = 'established' | 'reused';\n\nlet socket: WebSocket | null = null;\nlet timeoutId: NodeJS.Timeout | null = null; // Stores timeout ID for idle socket connection\nlet currentUserId: string | undefined;\nlet currentCompanyCode: string | undefined;\nlet sessionId: string = ''; // The unique session ID for the current connection\n\nself.onmessage = (event): void => {\n  const message: WorkerMessage = event.data;\n  currentCompanyCode = message.companyCode;\n\n  switch (message.command) {\n    case 'sync':\n      sync(message);\n      break;\n    case 'connect':\n      connect(message);\n      break;\n    case 'scan':\n      scan(message);\n      break;\n    case 'stopscan':\n      stopScan(message);\n      break;\n    default:\n      break;\n  }\n};\n\n/**\n * Opens a WebSocket connection if not already open.\n * If the connection is open, the `onopen` callback is immediately called.\n * @returns {WebSocket} The WebSocket instance.\n */\nconst openConnection = (opt: ConnectionOption): void => {\n  let connectionState: ConnectionState = 'established';\n  if (socket && socket.readyState === WebSocket.OPEN) {\n    // If the socket is already open, immediately call the onopen callback\n    connectionState = 'reused';\n    opt.onopen(socket, connectionState);\n    resetTimeOut(opt.timeout);\n  } else {\n    // If the socket is not open or undefined, create a new connection\n    socket = new WebSocket(`${import.meta.env.VITE_APP_READER_API}`);\n  }\n\n  // Handle successful connection\n  socket.onopen = (): void => {\n    sessionId =\n      Math.random().toString(36).substring(2, 15) +\n      Math.random().toString(36).substring(2, 15); // Generate a random session ID\n\n    connectionState = 'established';\n\n    if (socket) opt.onopen(socket, connectionState); // Execute the onopen callback once the connection is established\n    resetTimeOut(opt.timeout);\n  };\n\n  socket.onmessage = (event): void => {\n    opt.onmessage(event);\n    resetTimeOut(opt.timeout);\n  };\n\n  socket.onerror = (error): void => {\n    console.error('🚀 ~ Scanner Worker: openConnection ~ error:', error);\n    opt.onerror(error);\n    socket?.close();\n    socket = null;\n    if (timeoutId) clearTimeout(timeoutId);\n  };\n};\n\nconst handleSocketTimeout = (): void => {\n  stopScan({ userId: currentUserId });\n  currentUserId = undefined;\n  if (socket) socket.close();\n  socket = null;\n  if (timeoutId) clearTimeout(timeoutId);\n  console.info('Socket connection has been closed!');\n};\n\nconst resetTimeOut = (timeout = 0): void => {\n  if (timeout) {\n    // Adding this conditional to disable timout, may be sometimes it need to be enable, simpli remove the condition\n    if (timeoutId) clearTimeout(timeoutId);\n    timeoutId = setTimeout(handleSocketTimeout, timeout); // Timed out after 3 Minutes\n  }\n};\n\nconst sync = ({ userId }: WorkerMessage): void => {\n  currentUserId = userId;\n\n  openConnection({\n    onopen: (ws: WebSocket): void => {\n      ws.send(\n        JSON.stringify({\n          data: {\n            command: 'connect',\n            userId,\n            sessionId,\n            companyCode: currentCompanyCode,\n            source: 'app',\n          },\n          event: 'reader',\n        }),\n      );\n    },\n\n    onmessage: (event): void => {\n      postMessage({ status: 'synced', ...JSON.parse(event.data) });\n    },\n\n    onerror: (error): void => {\n      postMessage({ status: 'sync_error', error });\n    },\n  });\n};\n\nconst connect = ({ userId }: WorkerMessage): void => {\n  currentUserId = userId;\n\n  openConnection({\n    onopen: (ws: WebSocket, state): void => {\n      if (state === 'established') {\n        ws.send(\n          JSON.stringify({\n            data: {\n              command: 'connect',\n              userId,\n              source: 'app',\n              sessionId,\n              companyCode: currentCompanyCode,\n            },\n            event: 'reader',\n          }),\n        );\n      } else {\n        postMessage({\n          status: 'connection_reused',\n        });\n      }\n    },\n\n    onmessage: (event): void => {\n      postMessage({\n        status: 'connection_established',\n        ...JSON.parse(event.data),\n      });\n    },\n\n    onerror: (error): void => {\n      postMessage({ status: 'error_connecting', error });\n    },\n  });\n};\n\nconst scan = ({\n  scanCommand,\n  userId,\n  serialNumber,\n  jenisDevice,\n}: WorkerMessage): void => {\n  currentUserId = userId;\n\n  openConnection({\n    onopen: (ws: WebSocket): void => {\n      ws.send(\n        JSON.stringify({\n          data: {\n            command: scanCommand,\n            userId,\n            sessionId,\n            companyCode: currentCompanyCode,\n            source: 'app',\n            serialNumber,\n            jenisDevice,\n          },\n          event: 'reader',\n        }),\n      );\n\n      postMessage({ status: 'scan_started' });\n    },\n\n    onmessage: (event): void => {\n      postMessage({ status: 'scanned', ...JSON.parse(event.data) });\n    },\n\n    onerror: (error): void => {\n      postMessage({ status: 'scan_error', error });\n    },\n  });\n};\n\n/**\n * Single Scan:\n * - Stop Scan will be invoked on socket timeout\n *\n * Bulk Scan:\n * - Stop Scan will also be invoked on stopScan by user interaction\n */\nconst stopScan = ({ userId }: Partial<WorkerMessage>): void => {\n  if (socket && socket.readyState === WebSocket.OPEN) {\n    socket.send(\n      JSON.stringify({\n        data: {\n          command: 'stopscan',\n          userId,\n          source: 'app',\n          sessionId,\n          companyCode: currentCompanyCode,\n        },\n        event: 'reader',\n      }),\n    );\n\n    postMessage({ status: 'scan_stopped' });\n    console.info('Scan Process Stopped!');\n  }\n};\n"],"names":["socket","timeoutId","currentUserId","currentCompanyCode","sessionId","event","message","sync","connect","scan","stopScan","openConnection","opt","connectionState","resetTimeOut","error","handleSocketTimeout","timeout","userId","ws","state","scanCommand","serialNumber","jenisDevice"],"mappings":"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"}
+{"version":3,"file":"scanner.worker-Bk2e5hSA.js","sources":["../../../library/components/buttonscan/workers/scanner.worker.ts"],"sourcesContent":["interface ConnectionOption {\r\n  onopen: (ws: WebSocket, connectionState: ConnectionState) => void;\r\n  onmessage: (event: MessageEvent) => void;\r\n  onerror: (error: Event) => void;\r\n  timeout?: number;\r\n}\r\n\r\ninterface WorkerMessage {\r\n  command: string;\r\n  sessionId: string;\r\n  scanCommand?: string;\r\n  userId?: string;\r\n  companyCode?: string;\r\n  serialNumber?: string;\r\n  jenisDevice?: string;\r\n}\r\n\r\ntype ConnectionState = 'established' | 'reused';\r\n\r\nlet socket: WebSocket | null = null;\r\nlet timeoutId: NodeJS.Timeout | null = null; // Stores timeout ID for idle socket connection\r\nlet currentUserId: string | undefined;\r\nlet currentCompanyCode: string | undefined;\r\nlet sessionId: string = ''; // The unique session ID for the current connection\r\n\r\nself.onmessage = (event): void => {\r\n  const message: WorkerMessage = event.data;\r\n  currentCompanyCode = message.companyCode;\r\n\r\n  switch (message.command) {\r\n    case 'sync':\r\n      sync(message);\r\n      break;\r\n    case 'connect':\r\n      connect(message);\r\n      break;\r\n    case 'scan':\r\n      scan(message);\r\n      break;\r\n    case 'stopscan':\r\n      stopScan(message);\r\n      break;\r\n    default:\r\n      break;\r\n  }\r\n};\r\n\r\n/**\r\n * Opens a WebSocket connection if not already open.\r\n * If the connection is open, the `onopen` callback is immediately called.\r\n * @returns {WebSocket} The WebSocket instance.\r\n */\r\nconst openConnection = (opt: ConnectionOption): void => {\r\n  let connectionState: ConnectionState = 'established';\r\n  if (socket && socket.readyState === WebSocket.OPEN) {\r\n    // If the socket is already open, immediately call the onopen callback\r\n    connectionState = 'reused';\r\n    opt.onopen(socket, connectionState);\r\n    resetTimeOut(opt.timeout);\r\n  } else {\r\n    // If the socket is not open or undefined, create a new connection\r\n    socket = new WebSocket(`${import.meta.env.VITE_APP_READER_API}`);\r\n  }\r\n\r\n  // Handle successful connection\r\n  socket.onopen = (): void => {\r\n    sessionId =\r\n      Math.random().toString(36).substring(2, 15) +\r\n      Math.random().toString(36).substring(2, 15); // Generate a random session ID\r\n\r\n    connectionState = 'established';\r\n\r\n    if (socket) opt.onopen(socket, connectionState); // Execute the onopen callback once the connection is established\r\n    resetTimeOut(opt.timeout);\r\n  };\r\n\r\n  socket.onmessage = (event): void => {\r\n    opt.onmessage(event);\r\n    resetTimeOut(opt.timeout);\r\n  };\r\n\r\n  socket.onerror = (error): void => {\r\n    console.error('🚀 ~ Scanner Worker: openConnection ~ error:', error);\r\n    opt.onerror(error);\r\n    socket?.close();\r\n    socket = null;\r\n    if (timeoutId) clearTimeout(timeoutId);\r\n  };\r\n};\r\n\r\nconst handleSocketTimeout = (): void => {\r\n  stopScan({ userId: currentUserId });\r\n  currentUserId = undefined;\r\n  if (socket) socket.close();\r\n  socket = null;\r\n  if (timeoutId) clearTimeout(timeoutId);\r\n  console.info('Socket connection has been closed!');\r\n};\r\n\r\nconst resetTimeOut = (timeout = 0): void => {\r\n  if (timeout) {\r\n    // Adding this conditional to disable timout, may be sometimes it need to be enable, simpli remove the condition\r\n    if (timeoutId) clearTimeout(timeoutId);\r\n    timeoutId = setTimeout(handleSocketTimeout, timeout); // Timed out after 3 Minutes\r\n  }\r\n};\r\n\r\nconst sync = ({ userId }: WorkerMessage): void => {\r\n  currentUserId = userId;\r\n\r\n  openConnection({\r\n    onopen: (ws: WebSocket): void => {\r\n      ws.send(\r\n        JSON.stringify({\r\n          data: {\r\n            command: 'connect',\r\n            userId,\r\n            sessionId,\r\n            companyCode: currentCompanyCode,\r\n            source: 'app',\r\n          },\r\n          event: 'reader',\r\n        }),\r\n      );\r\n    },\r\n\r\n    onmessage: (event): void => {\r\n      postMessage({ status: 'synced', ...JSON.parse(event.data) });\r\n    },\r\n\r\n    onerror: (error): void => {\r\n      postMessage({ status: 'sync_error', error });\r\n    },\r\n  });\r\n};\r\n\r\nconst connect = ({ userId }: WorkerMessage): void => {\r\n  currentUserId = userId;\r\n\r\n  openConnection({\r\n    onopen: (ws: WebSocket, state): void => {\r\n      if (state === 'established') {\r\n        ws.send(\r\n          JSON.stringify({\r\n            data: {\r\n              command: 'connect',\r\n              userId,\r\n              source: 'app',\r\n              sessionId,\r\n              companyCode: currentCompanyCode,\r\n            },\r\n            event: 'reader',\r\n          }),\r\n        );\r\n      } else {\r\n        postMessage({\r\n          status: 'connection_reused',\r\n        });\r\n      }\r\n    },\r\n\r\n    onmessage: (event): void => {\r\n      postMessage({\r\n        status: 'connection_established',\r\n        ...JSON.parse(event.data),\r\n      });\r\n    },\r\n\r\n    onerror: (error): void => {\r\n      postMessage({ status: 'error_connecting', error });\r\n    },\r\n  });\r\n};\r\n\r\nconst scan = ({\r\n  scanCommand,\r\n  userId,\r\n  serialNumber,\r\n  jenisDevice,\r\n}: WorkerMessage): void => {\r\n  currentUserId = userId;\r\n\r\n  openConnection({\r\n    onopen: (ws: WebSocket): void => {\r\n      ws.send(\r\n        JSON.stringify({\r\n          data: {\r\n            command: scanCommand,\r\n            userId,\r\n            sessionId,\r\n            companyCode: currentCompanyCode,\r\n            source: 'app',\r\n            serialNumber,\r\n            jenisDevice,\r\n          },\r\n          event: 'reader',\r\n        }),\r\n      );\r\n\r\n      postMessage({ status: 'scan_started' });\r\n    },\r\n\r\n    onmessage: (event): void => {\r\n      postMessage({ status: 'scanned', ...JSON.parse(event.data) });\r\n    },\r\n\r\n    onerror: (error): void => {\r\n      postMessage({ status: 'scan_error', error });\r\n    },\r\n  });\r\n};\r\n\r\n/**\r\n * Single Scan:\r\n * - Stop Scan will be invoked on socket timeout\r\n *\r\n * Bulk Scan:\r\n * - Stop Scan will also be invoked on stopScan by user interaction\r\n */\r\nconst stopScan = ({ userId }: Partial<WorkerMessage>): void => {\r\n  if (socket && socket.readyState === WebSocket.OPEN) {\r\n    socket.send(\r\n      JSON.stringify({\r\n        data: {\r\n          command: 'stopscan',\r\n          userId,\r\n          source: 'app',\r\n          sessionId,\r\n          companyCode: currentCompanyCode,\r\n        },\r\n        event: 'reader',\r\n      }),\r\n    );\r\n\r\n    postMessage({ status: 'scan_stopped' });\r\n    console.info('Scan Process Stopped!');\r\n  }\r\n};\r\n"],"names":["socket","timeoutId","currentUserId","currentCompanyCode","sessionId","event","message","sync","connect","scan","stopScan","openConnection","opt","connectionState","resetTimeOut","error","handleSocketTimeout","timeout","userId","ws","state","scanCommand","serialNumber","jenisDevice"],"mappings":"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"}

package/icon/index.d.ts

@@ -5,7 +5,8 @@ export type WangsIconseverities =
   | 'warning'
   | 'primary'
   | 'success'
-  | 'secondary';
+  | 'secondary'
+  | 'info';
 
 /**
  * List of all available icons.

package/mcp/components.json

@@ -1,6 +1,6 @@
 {
   "metadata": {
-    "generatedAt": "2026-04-25T07:35:10.050Z",
+    "generatedAt": "2026-04-25T07:37:48.093Z",
     "version": "1.0.0",
     "totalComponents": 68,
     "packagePath": "../../packages/globalsettings-tagsamurai"
@@ -1915,39 +1915,31 @@
       "responsive": false
     },
     {
-      "id": "inputotp",
-      "name": "Inputotp",
-      "description": "Inputotp component",
-      "category": "input",
+      "id": "inputotp-fallback",
+      "name": "inputotp",
+      "description": "inputotp component (fallback metadata due to parsing error)",
+      "category": "utility",
       "tags": [
-        "input",
-        "form"
+        "fallback",
+        "parsing-error"
       ],
       "source": "unknown",
       "overridesBase": false,
       "overrideType": "none",
-      "overrideSummary": "No override detected",
-      "inheritanceChain": [
-        {
-          "componentName": "Inputotp",
-          "source": "base",
-          "definitionPath": "library/components/inputotp/Inputotp.vue.d.ts",
-          "childComponents": [],
-          "overrideLevel": 0
-        }
-      ],
-      "inheritanceReport": "Base: Inputotp (library/components/inputotp/Inputotp.vue.d.ts)",
-      "vueFilePath": "library/components/inputotp/Inputotp.vue",
-      "definitionFilePath": "inputotp/index.d.ts",
+      "overrideSummary": "",
+      "inheritanceChain": [],
+      "inheritanceReport": "",
+      "vueFilePath": "",
+      "definitionFilePath": "D:\\wangsitId\\wangsvue\\packages\\globalsettings-tagsamurai\\dist\\inputotp\\index.d.ts",
       "importInfo": {
         "packageName": "@fewangsit/wangsvue-gsts",
-        "importPath": "import { Inputotp } from '@fewangsit/wangsvue-gsts'",
+        "importPath": "import { inputotp } from '@fewangsit/wangsvue-gsts'",
         "treeshakable": true
       },
       "examples": [],
       "useCases": [],
       "dependencies": [],
-      "status": "stable",
+      "status": "unknown",
       "accessibility": {
         "ariaSupport": false,
         "keyboardNavigation": false,
@@ -2899,7 +2891,8 @@
       "Paginator",
       "TagType",
       "ToggleSwitch",
-      "UserName"
+      "UserName",
+      "inputotp"
     ],
     "navigation": [
       "Breadcrumb",
@@ -2926,7 +2919,6 @@
       "InputRangeNumber",
       "InputText",
       "InputURL",
-      "Inputotp",
       "InvisibleField",
       "Textarea"
     ],
@@ -3254,7 +3246,7 @@
         "inputrangenumber"
       ],
       "inputotp": [
-        "inputotp"
+        "inputotp-fallback"
       ],
       "inputpassword": [
         "inputpassword"
@@ -3436,7 +3428,6 @@
         "inputcurrency",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
@@ -3448,12 +3439,17 @@
         "inputcurrency",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
         "inputtext",
         "inputurl"
+      ],
+      "fallback": [
+        "inputotp-fallback"
+      ],
+      "parsing-error": [
+        "inputotp-fallback"
       ]
     },
     "byCategory": {
@@ -3474,6 +3470,7 @@
         "editor",
         "fileupload",
         "icon",
+        "inputotp-fallback",
         "litedropdown",
         "multiselect",
         "paginator",
@@ -3501,7 +3498,6 @@
         "inputbadge",
         "inputemail",
         "inputnumber",
-        "inputotp",
         "inputpassword",
         "inputphonenumber",
         "inputrangenumber",
@@ -3585,7 +3581,7 @@
         "inlinemessage",
         "inputbadge",
         "inputcurrency",
-        "inputotp",
+        "inputotp-fallback",
         "invisiblefield",
         "languageswitcher",
         "litedropdown",
@@ -4507,7 +4503,23 @@
         "inputemail"
       ],
       "inputotp": [
-        "inputotp"
+        "inputotp-fallback"
+      ],
+      "fallback": [
+        "inputotp-fallback"
+      ],
+      "metadata": [
+        "inputotp-fallback"
+      ],
+      "due": [
+        "inputotp-fallback"
+      ],
+      "parsing": [
+        "inputotp-fallback"
+      ],
+      "error": [
+        "inputotp-fallback",
+        "validatormessage"
       ],
       "password": [
         "inputpassword"
@@ -4718,18 +4730,15 @@
       ],
       "validatormessage": [
         "validatormessage"
-      ],
-      "error": [
-        "validatormessage"
       ]
     }
   },
   "statistics": {
     "totalComponents": 68,
     "componentsByCategory": {
-      "utility": 22,
+      "utility": 23,
       "navigation": 3,
-      "input": 22,
+      "input": 21,
       "integration": 1,
       "data-display": 6,
       "overlay": 5,

package/mcp/components.summary.txt

@@ -1,5 +1,5 @@
 Component Data Source Summary
-Generated: 2026-04-25T07:35:10.050Z
+Generated: 2026-04-25T07:37:48.093Z
 Version: 1.0.0
 Total Components: 68
 Package: ../../packages/globalsettings-tagsamurai
@@ -9,12 +9,12 @@ Statistics:
 - Overrides: 7
 - Accessible Components: 0
 - Total Examples: 0
-- Unresolved Components: 0
+- Unresolved Components: 1
 
 Components by Category:
-- utility: 22
+- utility: 23
 - navigation: 3
-- input: 22
+- input: 21
 - integration: 1
 - data-display: 6
 - overlay: 5
@@ -22,3 +22,6 @@ Components by Category:
 - layout: 1
 - feedback: 3
 - localization: 2
+
+Unresolved Components (Fallback):
+- inputotp-fallback

package/mcp/main.js

@@ -9,66 +9,66 @@ import ul from "os";
 import ll from "crypto";
 import * as wt from "typescript";
 import ea from "node:process";
-const dl = `# Wangsvue AI Agent: Master Operating Directive
-
-## 1. Role & Identity
-
-You are the **Senior Wangsvue Systems Architect**. Your primary mission is to deliver production-ready Vue 3 + TypeScript code perfectly aligned with the Wangsit ecosystem.
-
-## 2. Core Principles
-
-### 🌟 The Golden Rule
-
-**NEVER guess.** Use the **Knowledge Base (MD Files)** for architectural standards and the **MCP Toolchain** for technical specifications. If internal training data conflicts with these sources, the provided MD files and MCP results always win.
-
-### 🔒 Total Wangsvue Exclusivity
-
-**FORGET ANY DESIGN SYSTEM OR COMPONENT LIBRARY OUTSIDE WANGSVUE.** You are strictly prohibited from referencing or assuming patterns from PrimeVue, Element Plus, Vuetify, or any other library. You MUST ONLY use the props, slots, events, and patterns defined in the Wangsvue MCP or Knowledge Base.
-
-### 🚫 Zero Assumption Policy
-
-**NEVER assume** a prop name, slot name, icon name, or enum value exists. If it's not in the MCP result, it doesn't exist.
-
-### ✅ MCP-First Verification
-
-Every single line of code involving a component MUST be verified by \`analyze_component\` and \`resolve_type_definition\` first.
-
-## 3. The Two-MCP Toolchain
-
-| MCP Tool            | Purpose           | Source of Truth For...                                                               |
-| :------------------ | :---------------- | :----------------------------------------------------------------------------------- |
-| **\`wangsvue-mcp\`**  | **Technical API** | Component IDs, Inheritance, Import paths, and Props/Slots/Emits types (TOON format). |
-| **\`wangsvue-docs\`** | **Functional**    | Real-world implementation examples, component sections, and variants.                |
-
-## 4. Architectural Standards
-
-### View Architecture
-
-- **Lightweight Views:** Views must only import and compose from modules.
-- **Logic Separation:** Business logic, data, columns, and handlers belong in \`components/modules/\`, NOT in views.
-- **No App.vue Logic:** \`App.vue\` must only contain \`<router-view />\`, except for some case when the project not using Vue Router.
-
-### Design System Compliance
-
-- **Trust Component Styling:** NEVER add styling to Wangsvue components. Trust the built-in design system.
-- **No Manual CSS:** Do not use generic HTML (e.g., \`div.bg-white\`) when a specialized component (e.g., \`Card\`) exists.
-- **Exact Values:** Preserve exact pixel values from design (e.g., 21px). Do not round.
-
-### Color System
-
-- **Tailwind Tokens Only:** NEVER use CSS variables or hex colors directly.
-- **Mapping:** ALWAYS map hex codes to Tailwind tokens (e.g., \`general-50\`, \`primary-500\`) from config files.
-
-## 5. Operational Skills
-
-Use the following skills to execute specific tasks. These skills contain the detailed step-by-step protocols:
-
-- **\`wangsvue-workflow\`**: **MANDATORY** for starting any task. Enforces the 5-step development workflow and component discovery.
-- **\`wangsvue-code-review\`**: **MANDATORY** for validating generated code against architectural principles.
-- **\`import-validator\`**: Enforces strict import protocols and type definitions.
-- **\`figma-to-code\`**: specialized logic for converting Figma/React designs to Wangsvue.
-- **\`api-service-generator\`**: Generates API services from OpenAPI specs.
-- **\`committing-changes\`**: Enforces commit message standards.
+const dl = `# Wangsvue AI Agent: Master Operating Directive\r
+\r
+## 1. Role & Identity\r
+\r
+You are the **Senior Wangsvue Systems Architect**. Your primary mission is to deliver production-ready Vue 3 + TypeScript code perfectly aligned with the Wangsit ecosystem.\r
+\r
+## 2. Core Principles\r
+\r
+### 🌟 The Golden Rule\r
+\r
+**NEVER guess.** Use the **Knowledge Base (MD Files)** for architectural standards and the **MCP Toolchain** for technical specifications. If internal training data conflicts with these sources, the provided MD files and MCP results always win.\r
+\r
+### 🔒 Total Wangsvue Exclusivity\r
+\r
+**FORGET ANY DESIGN SYSTEM OR COMPONENT LIBRARY OUTSIDE WANGSVUE.** You are strictly prohibited from referencing or assuming patterns from PrimeVue, Element Plus, Vuetify, or any other library. You MUST ONLY use the props, slots, events, and patterns defined in the Wangsvue MCP or Knowledge Base.\r
+\r
+### 🚫 Zero Assumption Policy\r
+\r
+**NEVER assume** a prop name, slot name, icon name, or enum value exists. If it's not in the MCP result, it doesn't exist.\r
+\r
+### ✅ MCP-First Verification\r
+\r
+Every single line of code involving a component MUST be verified by \`analyze_component\` and \`resolve_type_definition\` first.\r
+\r
+## 3. The Two-MCP Toolchain\r
+\r
+| MCP Tool            | Purpose           | Source of Truth For...                                                               |\r
+| :------------------ | :---------------- | :----------------------------------------------------------------------------------- |\r
+| **\`wangsvue-mcp\`**  | **Technical API** | Component IDs, Inheritance, Import paths, and Props/Slots/Emits types (TOON format). |\r
+| **\`wangsvue-docs\`** | **Functional**    | Real-world implementation examples, component sections, and variants.                |\r
+\r
+## 4. Architectural Standards\r
+\r
+### View Architecture\r
+\r
+- **Lightweight Views:** Views must only import and compose from modules.\r
+- **Logic Separation:** Business logic, data, columns, and handlers belong in \`components/modules/\`, NOT in views.\r
+- **No App.vue Logic:** \`App.vue\` must only contain \`<router-view />\`, except for some case when the project not using Vue Router.\r
+\r
+### Design System Compliance\r
+\r
+- **Trust Component Styling:** NEVER add styling to Wangsvue components. Trust the built-in design system.\r
+- **No Manual CSS:** Do not use generic HTML (e.g., \`div.bg-white\`) when a specialized component (e.g., \`Card\`) exists.\r
+- **Exact Values:** Preserve exact pixel values from design (e.g., 21px). Do not round.\r
+\r
+### Color System\r
+\r
+- **Tailwind Tokens Only:** NEVER use CSS variables or hex colors directly.\r
+- **Mapping:** ALWAYS map hex codes to Tailwind tokens (e.g., \`general-50\`, \`primary-500\`) from config files.\r
+\r
+## 5. Operational Skills\r
+\r
+Use the following skills to execute specific tasks. These skills contain the detailed step-by-step protocols:\r
+\r
+- **\`wangsvue-workflow\`**: **MANDATORY** for starting any task. Enforces the 5-step development workflow and component discovery.\r
+- **\`wangsvue-code-review\`**: **MANDATORY** for validating generated code against architectural principles.\r
+- **\`import-validator\`**: Enforces strict import protocols and type definitions.\r
+- **\`figma-to-code\`**: specialized logic for converting Figma/React designs to Wangsvue.\r
+- **\`api-service-generator\`**: Generates API services from OpenAPI specs.\r
+- **\`committing-changes\`**: Enforces commit message standards.\r
 `, fl = ns(import.meta.url), ta = tr(fl), hl = "https://fewangsit.gitbook.io", pl = "https://fewangsit.gitbook.io/vue/llms.txt", ra = {
   trae: {
     output_dir: ".trae",

package/mcp/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fewangsit/wangsvue-gsts-mcp",
-  "version": "2.0.0-alpha.12",
+  "version": "2.0.0-alpha.13",
   "description": "MCP Server for @fewangsit/wangsvue-gsts",
   "main": "main.js",
   "type": "module",
@@ -10,18 +10,18 @@
   "buildContext": {
     "package": {
       "name": "@fewangsit/wangsvue-gsts",
-      "version": "2.0.0-alpha.12",
+      "version": "2.0.0-alpha.13",
       "description": "Global Settings Tagsamurai VueJS Component Library",
       "repository": "https://github.com/fewangsit/wangsvue",
       "workspace": "wangsvue-gsts"
     },
     "build": {
-      "timestamp": "2026-04-25T07:35:11.035Z",
+      "timestamp": "2026-04-25T07:37:50.751Z",
       "gitInfo": {
-        "head": "b10a9c022949021610335bb94b4f926d8c69b109",
+        "head": "c174dcda518aeffe4302fe82ec82075558f23272",
         "branch": "dev",
         "repository": "https://github.com/fewangsit/wangsvue.git",
-        "timestamp": "2026-04-25T07:35:10.806Z"
+        "timestamp": "2026-04-25T07:37:50.260Z"
       }
     }
   }

package/mcp/skills/api-service-generator/SKILL.md

@@ -1,93 +1,93 @@
----
-name: 'api-service-generator'
-description: 'Generates production-ready API Services, DTOs, and Response Types from OpenAPI specifications. Invoke when user provides an OpenAPI spec or asks to create API services.'
----
-
-# API Service Generator
-
-This skill automates the creation of API services, request DTOs, and response types based on an OpenAPI (Swagger) specification, following the project's architectural standards.
-
-## When to Use
-
-- Invoke when the user provides an OpenAPI specification (YAML or JSON).
-- Invoke when the user asks to "create API services" or "implement endpoints" from a spec.
-- Invoke when updating existing services based on a new API version.
-
-## Standards & Patterns
-
-### 1. File Structure
-
-- **Services**: `src/services/<serviceName>.service.ts`
-- **Request DTOs**: `src/dto/<serviceName>.dto.ts`
-- **Response Types**: `src/types/<serviceName>.type.ts`
-
-### 2. Service Object
-
-- Use **PascalCase** for the service object name (e.g., `AuthService`).
-- Use **camelCase** for methods (e.g., `postLogin`).
-- Methods should follow the naming: `[httpMethod][ActionName]` (e.g., `getDetail`, `postCreate`).
-- Return type: `Promise<AxiosResponse<ResponseType>>`.
-- Single line spacing between methods.
-
-### 3. Instance Creation
-
-```typescript
-import { AxiosResponse } from 'axios';
-import createAxiosInstance from './createInstance';
-
-const API = createAxiosInstance({
-  env: 'VITE_API_BASE_URL',
-  prefix: '/v2/iam',
-});
-```
-
-### 4. DTOs & Types
-
-- **DTOs**: Interfaces for request bodies and query params.
-- **Types**: Interfaces for response bodies.
-- Use clear, descriptive noun-based names (e.g., `LoginBody`, `LoginResponse`).
-- Use `UserProfileResponse` instead of `GetUserProfileResponse`.
-
-## Workflow
-
-1. **Parse the Spec**: Identify paths, methods, request schemas, and response schemas.
-2. **Group by Module**: Group endpoints by their primary path segment (e.g., `/auth/*` -> `AuthService`).
-3. **Generate Interfaces**:
-   - Create `src/dto/<module>.dto.ts` for all request-related interfaces.
-   - Create `src/types/<module>.type.ts` for all response-related interfaces.
-4. **Generate Service**:
-   - Create `src/services/<module>.service.ts`.
-   - Implement methods for each endpoint in the group.
-5. **Register Service**:
-   - Export the service from `src/main.ts` for global availability.
-
-## Example Transformation
-
-**Input (OpenAPI):**
-
-```yaml
-/auth/login:
-  post:
-    summary: Login
-    requestBody:
-      content:
-        application/json:
-          schema:
-            $ref: '#/components/schemas/LoginRequest'
-    responses:
-      '200':
-        content:
-          application/json:
-            schema:
-              $ref: '#/components/schemas/LoginResponse'
-```
-
-**Output (Service):**
-
-```typescript
-const AuthService = {
-  postLogin: (body: LoginRequest): Promise<AxiosResponse<LoginResponse>> => {
-    return API.post('/auth/login', body);
-  },
-};
-```
+---
+name: 'api-service-generator'
+description: 'Generates production-ready API Services, DTOs, and Response Types from OpenAPI specifications. Invoke when user provides an OpenAPI spec or asks to create API services.'
+---
+
+# API Service Generator
+
+This skill automates the creation of API services, request DTOs, and response types based on an OpenAPI (Swagger) specification, following the project's architectural standards.
+
+## When to Use
+
+- Invoke when the user provides an OpenAPI specification (YAML or JSON).
+- Invoke when the user asks to "create API services" or "implement endpoints" from a spec.
+- Invoke when updating existing services based on a new API version.
+
+## Standards & Patterns
+
+### 1. File Structure
+
+- **Services**: `src/services/<serviceName>.service.ts`
+- **Request DTOs**: `src/dto/<serviceName>.dto.ts`
+- **Response Types**: `src/types/<serviceName>.type.ts`
+
+### 2. Service Object
+
+- Use **PascalCase** for the service object name (e.g., `AuthService`).
+- Use **camelCase** for methods (e.g., `postLogin`).
+- Methods should follow the naming: `[httpMethod][ActionName]` (e.g., `getDetail`, `postCreate`).
+- Return type: `Promise<AxiosResponse<ResponseType>>`.
+- Single line spacing between methods.
+
+### 3. Instance Creation
+
+```typescript
+import { AxiosResponse } from 'axios';
+import createAxiosInstance from './createInstance';
+
+const API = createAxiosInstance({
+  env: 'VITE_API_BASE_URL',
+  prefix: '/v2/iam',
+});
+```
+
+### 4. DTOs & Types
+
+- **DTOs**: Interfaces for request bodies and query params.
+- **Types**: Interfaces for response bodies.
+- Use clear, descriptive noun-based names (e.g., `LoginBody`, `LoginResponse`).
+- Use `UserProfileResponse` instead of `GetUserProfileResponse`.
+
+## Workflow
+
+1. **Parse the Spec**: Identify paths, methods, request schemas, and response schemas.
+2. **Group by Module**: Group endpoints by their primary path segment (e.g., `/auth/*` -> `AuthService`).
+3. **Generate Interfaces**:
+   - Create `src/dto/<module>.dto.ts` for all request-related interfaces.
+   - Create `src/types/<module>.type.ts` for all response-related interfaces.
+4. **Generate Service**:
+   - Create `src/services/<module>.service.ts`.
+   - Implement methods for each endpoint in the group.
+5. **Register Service**:
+   - Export the service from `src/main.ts` for global availability.
+
+## Example Transformation
+
+**Input (OpenAPI):**
+
+```yaml
+/auth/login:
+  post:
+    summary: Login
+    requestBody:
+      content:
+        application/json:
+          schema:
+            $ref: '#/components/schemas/LoginRequest'
+    responses:
+      '200':
+        content:
+          application/json:
+            schema:
+              $ref: '#/components/schemas/LoginResponse'
+```
+
+**Output (Service):**
+
+```typescript
+const AuthService = {
+  postLogin: (body: LoginRequest): Promise<AxiosResponse<LoginResponse>> => {
+    return API.post('/auth/login', body);
+  },
+};
+```