@gui-chat-plugin/tictactoe 0.1.0

package/README.md

@@ -0,0 +1,100 @@
+# GUIChatPluginTicTacToe
+
+Tic-Tac-Toe game plugin for GUI Chat.
+
+## Development
+
+### 1. Plugin単体でデバッグ
+
+```bash
+yarn install
+yarn run dev
+```
+
+ブラウザで http://localhost:5173/ を開く
+
+### 2. MulmoChatでデバッグ
+
+**初回セットアップ（MulmoChat側）:**
+
+1. `MulmoChat/package.json` に依存関係を追加:
+```json
+"@gui-chat-plugin/tictactoe": "file:../GUIChatPluginTicTacToe",
+```
+
+2. `MulmoChat/src/main.ts` にCSS importを追加:
+```typescript
+import "@gui-chat-plugin/tictactoe/style.css";
+```
+
+3. `MulmoChat/src/tools/index.ts` にプラグインを登録:
+```typescript
+import TicTacToePlugin from "@gui-chat-plugin/tictactoe/vue";
+// pluginList に TicTacToePlugin を追加
+```
+
+**デバッグ実行:**
+```bash
+# プラグインをビルドしてMulmoChatに反映
+./refresh-in-mulmochat.sh
+
+# MulmoChatを起動
+cd ../MulmoChat
+yarn run dev
+```
+
+### 3. チェックスクリプト
+
+```bash
+# プラグインファイル構成チェック
+./check-plugin-structure.sh
+
+# MulmoChat統合チェック（CSS, 依存関係, 登録）
+./check-mulmochat-integration.sh
+```
+
+## Required Files (24 files)
+
+```
+【ルート設定ファイル (7)】
+  .gitignore
+  package.json
+  tsconfig.json
+  tsconfig.build.json
+  vite.config.ts
+  eslint.config.js
+  index.html
+
+【ソースエントリ (2)】
+  src/index.ts
+  src/style.css
+
+【Coreモジュール (6)】
+  src/core/index.ts
+  src/core/types.ts
+  src/core/definition.ts
+  src/core/logic.ts
+  src/core/plugin.ts
+  src/core/samples.ts
+
+【Vueモジュール (3)】
+  src/vue/index.ts
+  src/vue/View.vue
+  src/vue/Preview.vue
+
+【デモファイル (2)】
+  demo/main.ts
+  demo/App.vue
+```
+
+## Scripts
+
+| Command | Description |
+|---------|-------------|
+| `yarn dev` | 開発サーバー起動 |
+| `yarn build` | プロダクションビルド |
+| `yarn typecheck` | TypeScriptチェック |
+| `yarn lint` | ESLintチェック |
+| `./check-plugin-structure.sh` | ファイル構成チェック |
+| `./check-mulmochat-integration.sh` | MulmoChat統合チェック |
+| `./refresh-in-mulmochat.sh` | MulmoChatに反映 |

package/dist/core/definition.d.ts

@@ -0,0 +1,7 @@
+/**
+ * TicTacToe Plugin - Tool Definition
+ */
+import type { ToolDefinition } from "gui-chat-protocol";
+export declare const TOOL_NAME = "playTicTacToe";
+export declare const TOOL_DEFINITION: ToolDefinition;
+export declare const SYSTEM_PROMPT = "You can play Tic-Tac-Toe with users using the playTicTacToe tool.\n\nIMPORTANT: When the user specifies a move (e.g., \"I want to play at top-left, which is row=0, col=0\"), you MUST call the playTicTacToe tool with action=\"move\", NOT respond with text.\n\nGame rules:\n1. Start a new game with action=\"new_game\"\n2. For moves, use action=\"move\" with row (0-2) and col (0-2), plus the current board state\n3. X always goes first. Win by getting 3 in a row (horizontal, vertical, or diagonal)\n4. Positions: row=0 is top, row=2 is bottom; col=0 is left, col=2 is right";

package/dist/core/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * TicTacToe Plugin - Core (Framework-agnostic)
+ */
+export type { Cell, Side, TicTacToeBoard, PlayerType, TicTacToeArgs, NewGameCommand, MoveCommand, Command, TicTacToeState, TicTacToeClickData, } from "./types";
+export { TOOL_NAME, TOOL_DEFINITION, SYSTEM_PROMPT, playTicTacToe, executeTicTacToe, pluginCore, } from "./plugin";
+export { samples } from "./samples";

package/dist/core/logic.d.ts

@@ -0,0 +1,5 @@
+/**
+ * TicTacToe Plugin - Game Logic
+ */
+import type { Command, TicTacToeState } from "./types";
+export declare function playTicTacToe(cmd: Command): TicTacToeState;

package/dist/core/plugin.d.ts

@@ -0,0 +1,9 @@
+/**
+ * TicTacToe Plugin Core
+ */
+import type { ToolPluginCore, ToolContext, ToolResult } from "gui-chat-protocol";
+import type { TicTacToeArgs, TicTacToeState } from "./types";
+export { TOOL_NAME, TOOL_DEFINITION, SYSTEM_PROMPT } from "./definition";
+export { playTicTacToe } from "./logic";
+export declare const executeTicTacToe: (_context: ToolContext, args: TicTacToeArgs) => Promise<ToolResult<never, TicTacToeState>>;
+export declare const pluginCore: ToolPluginCore<never, TicTacToeState, TicTacToeArgs>;

package/dist/core/samples.d.ts

@@ -0,0 +1,5 @@
+/**
+ * TicTacToe Plugin - Sample Data
+ */
+import type { ToolSample } from "gui-chat-protocol";
+export declare const samples: ToolSample[];

package/dist/core/types.d.ts

@@ -0,0 +1,77 @@
+/**
+ * TicTacToe Plugin - Type Definitions
+ */
+export type Cell = "." | "X" | "O";
+export type Side = "X" | "O";
+export type TicTacToeBoard = Cell[][];
+export type PlayerType = "user" | "computer";
+export interface TicTacToeArgs {
+    action: "new_game" | "move";
+    col?: number;
+    row?: number;
+    board?: Cell[][];
+    currentSide?: Side;
+    playerNames?: {
+        X: PlayerType;
+        O: PlayerType;
+    };
+    firstPlayer?: PlayerType;
+}
+export type NewGameCommand = {
+    action: "new_game";
+    playerNames: {
+        X: string;
+        O: string;
+    };
+};
+export type MoveCommand = {
+    action: "move";
+    row: number;
+    col: number;
+    board: TicTacToeBoard;
+    currentSide: Side;
+    playerNames: {
+        X: string;
+        O: string;
+    };
+};
+export type Command = NewGameCommand | MoveCommand;
+export interface TicTacToeState {
+    board: TicTacToeBoard;
+    currentSide: Side;
+    playerNames: {
+        X: string;
+        O: string;
+    };
+    legalMoves: {
+        row: number;
+        col: number;
+    }[];
+    counts: {
+        X: number;
+        O: number;
+        empty: number;
+    };
+    isTerminal: boolean;
+    winner: Side | "draw" | null;
+    winningLine: {
+        row: number;
+        col: number;
+    }[] | null;
+    lastAction: {
+        type: "new_game";
+    } | {
+        type: "move";
+        row: number;
+        col: number;
+    };
+    error?: string;
+}
+/**
+ * Data passed from handleCellClick for demo testing
+ */
+export interface TicTacToeClickData {
+    row: number;
+    col: number;
+    currentState: TicTacToeState;
+}

package/dist/core.cjs

@@ -0,0 +1,9 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y="playTicTacToe",T={type:"function",name:y,description:"Play Tic-Tac-Toe (Noughts and Crosses) game with the user. You can start a new game or make moves on the 3x3 board.",parameters:{type:"object",properties:{action:{type:"string",enum:["new_game","move"],description:"The action to perform: start a new game or make a move"},col:{type:"number",description:"Column position for the move (0-2, required for 'move' action). Left=0, Center=1, Right=2",minimum:0,maximum:2},row:{type:"number",description:"Row position for the move (0-2, required for 'move' action). Top=0, Middle=1, Bottom=2",minimum:0,maximum:2},board:{type:"array",description:"Current 3x3 board state BEFORE the move (required for 'move' action). Pass the current board state as-is.",items:{type:"array",items:{type:"string",enum:[".","X","O"]}}},currentSide:{type:"string",enum:["X","O"],description:"Current player's side (required for 'move' action). X always goes first."},playerNames:{type:"object",description:"Player assignments (required for 'move' action)",properties:{X:{type:"string",enum:["user","computer"]},O:{type:"string",enum:["user","computer"]}},required:["X","O"]},firstPlayer:{type:"string",enum:["user","computer"],description:"Optional: Which player should play as X (goes first) for 'new_game' action. If not specified, will be chosen randomly."}},required:["action"],additionalProperties:!1}},f=`You can play Tic-Tac-Toe with users using the playTicTacToe tool.
+
+IMPORTANT: When the user specifies a move (e.g., "I want to play at top-left, which is row=0, col=0"), you MUST call the playTicTacToe tool with action="move", NOT respond with text.
+
+Game rules:
+1. Start a new game with action="new_game"
+2. For moves, use action="move" with row (0-2) and col (0-2), plus the current board state
+3. X always goes first. Win by getting 3 in a row (horizontal, vertical, or diagonal)
+4. Positions: row=0 is top, row=2 is bottom; col=0 is left, col=2 is right`,M=[[{row:0,col:0},{row:0,col:1},{row:0,col:2}],[{row:1,col:0},{row:1,col:1},{row:1,col:2}],[{row:2,col:0},{row:2,col:1},{row:2,col:2}],[{row:0,col:0},{row:1,col:0},{row:2,col:0}],[{row:0,col:1},{row:1,col:1},{row:2,col:1}],[{row:0,col:2},{row:1,col:2},{row:2,col:2}],[{row:0,col:0},{row:1,col:1},{row:2,col:2}],[{row:0,col:2},{row:1,col:1},{row:2,col:0}]];function P(){const r=[];for(let o=0;o<3;o++)r[o]=new Array(3).fill(".");return r}function S(r){return r.map(o=>[...o])}function I(r){return r==="X"?"O":"X"}function p(r){const o=[];for(let t=0;t<3;t++)for(let e=0;e<3;e++)r[t][e]==="."&&o.push({row:t,col:e});return o}function L(r,o,t,e){const n=S(r);return n[o][t]=e,n}function u(r){let o=0,t=0,e=0;for(let n=0;n<3;n++)for(let i=0;i<3;i++){const s=r[n][i];s==="X"?o++:s==="O"?t++:e++}return{X:o,O:t,empty:e}}function _(r){for(const o of M){const t=o.map(e=>r[e.row][e.col]);if(t[0]!=="."&&t[0]===t[1]&&t[1]===t[2])return{winner:t[0],winningLine:o}}return{winner:null,winningLine:null}}function X(r){const{winner:o,winningLine:t}=_(r);return o?{isTerminal:!0,winner:o,winningLine:t}:u(r).empty===0?{isTerminal:!0,winner:"draw",winningLine:null}:{isTerminal:!1,winner:null,winningLine:null}}function g(r){if(r.action==="new_game"){const{playerNames:m}=r,c=P(),N=p(c),O=u(c);return{board:c,currentSide:"X",playerNames:m,legalMoves:N,counts:O,isTerminal:!1,winner:null,winningLine:null,lastAction:{type:"new_game"}}}const{row:o,col:t,board:e,currentSide:n,playerNames:i}=r;if(o<0||o>2||t<0||t>2){const m=p(e),c=u(e);return{board:e,currentSide:n,playerNames:i,legalMoves:m,counts:c,isTerminal:!1,winner:null,winningLine:null,lastAction:{type:"move",row:o,col:t},error:`Invalid move: (${o}, ${t}) is out of bounds. Row and column must be 0-2.`}}if(e[o][t]!=="."){const m=p(e),c=u(e);return{board:e,currentSide:n,playerNames:i,legalMoves:m,counts:c,isTerminal:!1,winner:null,winningLine:null,lastAction:{type:"move",row:o,col:t},error:`Invalid move: (${o}, ${t}) is already occupied by ${e[o][t]}.`}}const s=L(e,o,t,n),a=I(n),l=p(s),d=u(s),{isTerminal:w,winner:h,winningLine:b}=X(s);return{board:s,currentSide:a,playerNames:i,legalMoves:l,counts:d,isTerminal:w,winner:h,winningLine:b,lastAction:{type:"move",row:o,col:t}}}const v=async(r,o)=>{try{let t;if(o.action==="new_game"){let a;o.firstPlayer?a=o.firstPlayer:a=Math.random()<.5?"computer":"user",t={action:"new_game",playerNames:{X:a,O:a==="user"?"computer":"user"}}}else if(o.action==="move"){if(typeof o.row!="number"||typeof o.col!="number"||!o.board||!o.currentSide||!o.playerNames)throw new Error("Move action requires row, col, board, currentSide, and playerNames parameters");t={action:"move",row:o.row,col:o.col,board:o.board,currentSide:o.currentSide,playerNames:o.playerNames}}else throw new Error(`Unknown action: ${o.action}`);const e=g(t);if(e.error){const a=e.playerNames[e.currentSide]==="computer",l=e.legalMoves.map(w=>`(row=${w.row}, col=${w.col})`).join(", "),d=a?`Invalid move attempted. You must make a valid move. Legal moves are: ${l}. Choose one of these moves.`:`Invalid move attempted. Tell the user they must make a valid move. Legal moves are: ${l}.`;return{message:e.error,jsonData:e,instructions:d,updating:!0}}let n="";if(e.lastAction.type==="new_game")n="Started a new Tic-Tac-Toe game! X goes first.";else if(e.lastAction.type==="move"){const a=$(e.lastAction.row,e.lastAction.col);n=`Played ${e.board[e.lastAction.row][e.lastAction.col]==="X"?"O":"X"} at ${a} (row=${e.lastAction.row}, col=${e.lastAction.col}).`}e.isTerminal&&(e.winner==="draw"?n+=" Game over - it's a draw!":e.winner&&(n+=` Game over - ${e.winner} wins!`));const i=e.playerNames[e.currentSide]==="computer",s=e.isTerminal?"The game is over. Briefly announce the result. Do NOT draw the board - the user can see it in the GUI.":i?"It is your turn. You MUST call playTicTacToe with action='move' immediately. Do NOT describe the board or explain - just make your move.":"It is the user's turn. Do NOT draw or describe the board - the user can see it in the GUI. Just say it's their turn briefly. When they specify a move, call playTicTacToe with action='move'.";return{message:n,jsonData:e,instructions:s,instructionsRequired:e.isTerminal||i,updating:o.action!=="new_game"}}catch(t){return console.error("ERR: TicTacToe game error",t),{message:`TicTacToe game error: ${t instanceof Error?t.message:"Unknown error"}`,instructions:"Acknowledge that there was an error with the TicTacToe game and suggest trying again."}}};function $(r,o){const t=["Top","Middle","Bottom"],e=["Left","Center","Right"];return`${t[r]}-${e[o]}`}const A={toolDefinition:T,execute:v,generatingMessage:"Processing TicTacToe move...",isEnabled:()=>!0,systemPrompt:f},E=[{name:"New Game (User plays X)",args:{action:"new_game",firstPlayer:"user"}},{name:"New Game (Computer plays X)",args:{action:"new_game",firstPlayer:"computer"}}];exports.SYSTEM_PROMPT=f;exports.TOOL_DEFINITION=T;exports.TOOL_NAME=y;exports.executeTicTacToe=v;exports.playTicTacToe=g;exports.pluginCore=A;exports.samples=E;

package/dist/core.js

@@ -0,0 +1,281 @@
+const h = "playTicTacToe", v = {
+  type: "function",
+  name: h,
+  description: "Play Tic-Tac-Toe (Noughts and Crosses) game with the user. You can start a new game or make moves on the 3x3 board.",
+  parameters: {
+    type: "object",
+    properties: {
+      action: {
+        type: "string",
+        enum: ["new_game", "move"],
+        description: "The action to perform: start a new game or make a move"
+      },
+      col: {
+        type: "number",
+        description: "Column position for the move (0-2, required for 'move' action). Left=0, Center=1, Right=2",
+        minimum: 0,
+        maximum: 2
+      },
+      row: {
+        type: "number",
+        description: "Row position for the move (0-2, required for 'move' action). Top=0, Middle=1, Bottom=2",
+        minimum: 0,
+        maximum: 2
+      },
+      board: {
+        type: "array",
+        description: "Current 3x3 board state BEFORE the move (required for 'move' action). Pass the current board state as-is.",
+        items: {
+          type: "array",
+          items: {
+            type: "string",
+            enum: [".", "X", "O"]
+          }
+        }
+      },
+      currentSide: {
+        type: "string",
+        enum: ["X", "O"],
+        description: "Current player's side (required for 'move' action). X always goes first."
+      },
+      playerNames: {
+        type: "object",
+        description: "Player assignments (required for 'move' action)",
+        properties: {
+          X: {
+            type: "string",
+            enum: ["user", "computer"]
+          },
+          O: {
+            type: "string",
+            enum: ["user", "computer"]
+          }
+        },
+        required: ["X", "O"]
+      },
+      firstPlayer: {
+        type: "string",
+        enum: ["user", "computer"],
+        description: "Optional: Which player should play as X (goes first) for 'new_game' action. If not specified, will be chosen randomly."
+      }
+    },
+    required: ["action"],
+    additionalProperties: !1
+  }
+}, b = `You can play Tic-Tac-Toe with users using the playTicTacToe tool.
+
+IMPORTANT: When the user specifies a move (e.g., "I want to play at top-left, which is row=0, col=0"), you MUST call the playTicTacToe tool with action="move", NOT respond with text.
+
+Game rules:
+1. Start a new game with action="new_game"
+2. For moves, use action="move" with row (0-2) and col (0-2), plus the current board state
+3. X always goes first. Win by getting 3 in a row (horizontal, vertical, or diagonal)
+4. Positions: row=0 is top, row=2 is bottom; col=0 is left, col=2 is right`, N = [
+  // Rows
+  [{ row: 0, col: 0 }, { row: 0, col: 1 }, { row: 0, col: 2 }],
+  [{ row: 1, col: 0 }, { row: 1, col: 1 }, { row: 1, col: 2 }],
+  [{ row: 2, col: 0 }, { row: 2, col: 1 }, { row: 2, col: 2 }],
+  // Columns
+  [{ row: 0, col: 0 }, { row: 1, col: 0 }, { row: 2, col: 0 }],
+  [{ row: 0, col: 1 }, { row: 1, col: 1 }, { row: 2, col: 1 }],
+  [{ row: 0, col: 2 }, { row: 1, col: 2 }, { row: 2, col: 2 }],
+  // Diagonals
+  [{ row: 0, col: 0 }, { row: 1, col: 1 }, { row: 2, col: 2 }],
+  [{ row: 0, col: 2 }, { row: 1, col: 1 }, { row: 2, col: 0 }]
+];
+function O() {
+  const n = [];
+  for (let o = 0; o < 3; o++)
+    n[o] = new Array(3).fill(".");
+  return n;
+}
+function M(n) {
+  return n.map((o) => [...o]);
+}
+function P(n) {
+  return n === "X" ? "O" : "X";
+}
+function p(n) {
+  const o = [];
+  for (let t = 0; t < 3; t++)
+    for (let e = 0; e < 3; e++)
+      n[t][e] === "." && o.push({ row: t, col: e });
+  return o;
+}
+function S(n, o, t, e) {
+  const r = M(n);
+  return r[o][t] = e, r;
+}
+function u(n) {
+  let o = 0, t = 0, e = 0;
+  for (let r = 0; r < 3; r++)
+    for (let i = 0; i < 3; i++) {
+      const s = n[r][i];
+      s === "X" ? o++ : s === "O" ? t++ : e++;
+    }
+  return { X: o, O: t, empty: e };
+}
+function X(n) {
+  for (const o of N) {
+    const t = o.map((e) => n[e.row][e.col]);
+    if (t[0] !== "." && t[0] === t[1] && t[1] === t[2])
+      return { winner: t[0], winningLine: o };
+  }
+  return { winner: null, winningLine: null };
+}
+function $(n) {
+  const { winner: o, winningLine: t } = X(n);
+  return o ? { isTerminal: !0, winner: o, winningLine: t } : u(n).empty === 0 ? { isTerminal: !0, winner: "draw", winningLine: null } : { isTerminal: !1, winner: null, winningLine: null };
+}
+function I(n) {
+  if (n.action === "new_game") {
+    const { playerNames: m } = n, c = O(), T = p(c), g = u(c);
+    return {
+      board: c,
+      currentSide: "X",
+      // X always goes first
+      playerNames: m,
+      legalMoves: T,
+      counts: g,
+      isTerminal: !1,
+      winner: null,
+      winningLine: null,
+      lastAction: { type: "new_game" }
+    };
+  }
+  const { row: o, col: t, board: e, currentSide: r, playerNames: i } = n;
+  if (o < 0 || o > 2 || t < 0 || t > 2) {
+    const m = p(e), c = u(e);
+    return {
+      board: e,
+      currentSide: r,
+      playerNames: i,
+      legalMoves: m,
+      counts: c,
+      isTerminal: !1,
+      winner: null,
+      winningLine: null,
+      lastAction: { type: "move", row: o, col: t },
+      error: `Invalid move: (${o}, ${t}) is out of bounds. Row and column must be 0-2.`
+    };
+  }
+  if (e[o][t] !== ".") {
+    const m = p(e), c = u(e);
+    return {
+      board: e,
+      currentSide: r,
+      playerNames: i,
+      legalMoves: m,
+      counts: c,
+      isTerminal: !1,
+      winner: null,
+      winningLine: null,
+      lastAction: { type: "move", row: o, col: t },
+      error: `Invalid move: (${o}, ${t}) is already occupied by ${e[o][t]}.`
+    };
+  }
+  const s = S(e, o, t, r), a = P(r), l = p(s), d = u(s), { isTerminal: w, winner: y, winningLine: f } = $(s);
+  return {
+    board: s,
+    currentSide: a,
+    playerNames: i,
+    legalMoves: l,
+    counts: d,
+    isTerminal: w,
+    winner: y,
+    winningLine: f,
+    lastAction: { type: "move", row: o, col: t }
+  };
+}
+const L = async (n, o) => {
+  try {
+    let t;
+    if (o.action === "new_game") {
+      let a;
+      o.firstPlayer ? a = o.firstPlayer : a = Math.random() < 0.5 ? "computer" : "user", t = {
+        action: "new_game",
+        playerNames: { X: a, O: a === "user" ? "computer" : "user" }
+      };
+    } else if (o.action === "move") {
+      if (typeof o.row != "number" || typeof o.col != "number" || !o.board || !o.currentSide || !o.playerNames)
+        throw new Error(
+          "Move action requires row, col, board, currentSide, and playerNames parameters"
+        );
+      t = {
+        action: "move",
+        row: o.row,
+        col: o.col,
+        board: o.board,
+        currentSide: o.currentSide,
+        playerNames: o.playerNames
+      };
+    } else
+      throw new Error(`Unknown action: ${o.action}`);
+    const e = I(t);
+    if (e.error) {
+      const a = e.playerNames[e.currentSide] === "computer", l = e.legalMoves.map((w) => `(row=${w.row}, col=${w.col})`).join(", "), d = a ? `Invalid move attempted. You must make a valid move. Legal moves are: ${l}. Choose one of these moves.` : `Invalid move attempted. Tell the user they must make a valid move. Legal moves are: ${l}.`;
+      return {
+        message: e.error,
+        jsonData: e,
+        instructions: d,
+        updating: !0
+      };
+    }
+    let r = "";
+    if (e.lastAction.type === "new_game")
+      r = "Started a new Tic-Tac-Toe game! X goes first.";
+    else if (e.lastAction.type === "move") {
+      const a = A(e.lastAction.row, e.lastAction.col);
+      r = `Played ${e.board[e.lastAction.row][e.lastAction.col] === "X" ? "O" : "X"} at ${a} (row=${e.lastAction.row}, col=${e.lastAction.col}).`;
+    }
+    e.isTerminal && (e.winner === "draw" ? r += " Game over - it's a draw!" : e.winner && (r += ` Game over - ${e.winner} wins!`));
+    const i = e.playerNames[e.currentSide] === "computer", s = e.isTerminal ? "The game is over. Briefly announce the result. Do NOT draw the board - the user can see it in the GUI." : i ? "It is your turn. You MUST call playTicTacToe with action='move' immediately. Do NOT describe the board or explain - just make your move." : "It is the user's turn. Do NOT draw or describe the board - the user can see it in the GUI. Just say it's their turn briefly. When they specify a move, call playTicTacToe with action='move'.";
+    return {
+      message: r,
+      jsonData: e,
+      instructions: s,
+      instructionsRequired: e.isTerminal || i,
+      updating: o.action !== "new_game"
+    };
+  } catch (t) {
+    return console.error("ERR: TicTacToe game error", t), {
+      message: `TicTacToe game error: ${t instanceof Error ? t.message : "Unknown error"}`,
+      instructions: "Acknowledge that there was an error with the TicTacToe game and suggest trying again."
+    };
+  }
+};
+function A(n, o) {
+  const t = ["Top", "Middle", "Bottom"], e = ["Left", "Center", "Right"];
+  return `${t[n]}-${e[o]}`;
+}
+const _ = {
+  toolDefinition: v,
+  execute: L,
+  generatingMessage: "Processing TicTacToe move...",
+  isEnabled: () => !0,
+  systemPrompt: b
+}, E = [
+  {
+    name: "New Game (User plays X)",
+    args: {
+      action: "new_game",
+      firstPlayer: "user"
+    }
+  },
+  {
+    name: "New Game (Computer plays X)",
+    args: {
+      action: "new_game",
+      firstPlayer: "computer"
+    }
+  }
+];
+export {
+  b as SYSTEM_PROMPT,
+  v as TOOL_DEFINITION,
+  h as TOOL_NAME,
+  L as executeTicTacToe,
+  I as playTicTacToe,
+  _ as pluginCore,
+  E as samples
+};

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./core.cjs");exports.SYSTEM_PROMPT=e.SYSTEM_PROMPT;exports.TOOL_DEFINITION=e.TOOL_DEFINITION;exports.TOOL_NAME=e.TOOL_NAME;exports.executeTicTacToe=e.executeTicTacToe;exports.playTicTacToe=e.playTicTacToe;exports.pluginCore=e.pluginCore;exports.samples=e.samples;

package/dist/index.d.ts

@@ -0,0 +1,4 @@
+/**
+ * TicTacToe Plugin - Main Entry Point
+ */
+export * from "./core";

package/dist/index.js

@@ -0,0 +1,10 @@
+import { SYSTEM_PROMPT as O, TOOL_DEFINITION as c, TOOL_NAME as o, executeTicTacToe as a, playTicTacToe as p, pluginCore as i, samples as l } from "./core.js";
+export {
+  O as SYSTEM_PROMPT,
+  c as TOOL_DEFINITION,
+  o as TOOL_NAME,
+  a as executeTicTacToe,
+  p as playTicTacToe,
+  i as pluginCore,
+  l as samples
+};

package/dist/style.css

@@ -0,0 +1 @@
+@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-400:oklch(70.4% .191 22.216);--color-red-600:oklch(57.7% .245 27.325);--color-yellow-200:oklch(94.5% .129 101.54);--color-yellow-400:oklch(85.2% .199 91.936);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-600:oklch(54.6% .245 262.881);--color-indigo-100:oklch(93% .034 272.788);--color-indigo-200:oklch(87% .065 274.039);--color-indigo-700:oklch(45.7% .24 277.023);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-white:#fff;--spacing:.25rem;--container-3xl:48rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.mx-auto{margin-inline:auto}.mt-4{margin-top:calc(var(--spacing)*4)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.flex{display:flex}.grid{display:grid}.inline-block{display:inline-block}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-16{height:calc(var(--spacing)*16)}.h-24{height:calc(var(--spacing)*24)}.h-\[500px\]{height:500px}.h-full{height:100%}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-16{width:calc(var(--spacing)*16)}.w-24{width:calc(var(--spacing)*24)}.w-full{width:100%}.max-w-3xl{max-width:var(--container-3xl)}.max-w-\[200px\]{max-width:200px}.cursor-pointer{cursor:pointer}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.gap-0\.5{gap:calc(var(--spacing)*.5)}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-8{gap:calc(var(--spacing)*8)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.border{border-style:var(--tw-border-style);border-width:1px}.border-gray-600{border-color:var(--color-gray-600)}.border-indigo-200{border-color:var(--color-indigo-200)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-gray-600{background-color:var(--color-gray-600)}.bg-gray-700{background-color:var(--color-gray-700)}.bg-gray-800{background-color:var(--color-gray-800)}.bg-indigo-100{background-color:var(--color-indigo-100)}.bg-white{background-color:var(--color-white)}.bg-yellow-200{background-color:var(--color-yellow-200)}.p-0\.5{padding:calc(var(--spacing)*.5)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-5{padding:calc(var(--spacing)*5)}.p-8{padding:calc(var(--spacing)*8)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-2{padding-block:calc(var(--spacing)*2)}.text-center{text-align:center}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-blue-400{color:var(--color-blue-400)}.text-blue-600{color:var(--color-blue-600)}.text-gray-200{color:var(--color-gray-200)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-indigo-700{color:var(--color-indigo-700)}.text-red-400{color:var(--color-red-400)}.text-red-600{color:var(--color-red-600)}.opacity-30{opacity:.3}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-yellow-400{--tw-ring-color:var(--color-yellow-400)}@media(hover:hover){.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-indigo-200:hover{background-color:var(--color-indigo-200)}}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}

package/dist/vue/Preview.vue.d.ts

@@ -0,0 +1,8 @@
+import type { ToolResult } from "gui-chat-protocol/vue";
+import type { TicTacToeState } from "../core/types";
+type __VLS_Props = {
+    result: ToolResult<never, TicTacToeState>;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/vue/View.vue.d.ts

@@ -0,0 +1,9 @@
+import type { ToolResult, SendTextMessageOptions } from "gui-chat-protocol/vue";
+import type { TicTacToeState } from "../core/types";
+type __VLS_Props = {
+    selectedResult: ToolResult<never, TicTacToeState> | null;
+    sendTextMessage?: (text: string, options?: SendTextMessageOptions) => void;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/vue/index.d.ts

@@ -0,0 +1,17 @@
+/**
+ * TicTacToe Plugin - Vue Implementation
+ */
+import "../style.css";
+import type { ToolPlugin } from "gui-chat-protocol/vue";
+import type { TicTacToeArgs, TicTacToeState } from "../core/types";
+import View from "./View.vue";
+import Preview from "./Preview.vue";
+export declare const plugin: ToolPlugin<never, TicTacToeState, TicTacToeArgs>;
+export type { Cell, Side, TicTacToeBoard, PlayerType, TicTacToeArgs, NewGameCommand, MoveCommand, Command, TicTacToeState, TicTacToeClickData, } from "../core/types";
+export { TOOL_NAME, TOOL_DEFINITION, SYSTEM_PROMPT, playTicTacToe, executeTicTacToe, pluginCore, } from "../core/plugin";
+export { samples } from "../core/samples";
+export { View, Preview };
+declare const _default: {
+    plugin: ToolPlugin<never, TicTacToeState, TicTacToeArgs, import("gui-chat-protocol/vue").InputHandler, Record<string, unknown>>;
+};
+export default _default;

package/dist/vue.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("./core.cjs"),e=require("vue"),N={class:"w-full h-full flex flex-col items-center justify-center p-4 bg-gray-100"},T={key:0,class:"flex flex-col items-center"},C={key:0},h={key:1},V={class:"grid grid-cols-3 gap-1 p-2 bg-gray-700 rounded-lg shadow-lg"},b=["onClick","onMouseenter","onMouseleave"],_={key:0,class:"w-16 h-16 text-blue-600",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round"},D={key:1,class:"w-16 h-16 text-red-600",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3"},S={key:1,cx:"12",cy:"12",r:"8"},O={class:"mt-4 flex gap-8 text-lg"},$={class:"flex items-center gap-2"},M={class:"text-gray-500 text-sm"},j={class:"flex items-center gap-2"},L={class:"text-gray-500 text-sm"},w=e.defineComponent({__name:"View",props:{selectedResult:{},sendTextMessage:{type:Function}},setup(a){const u=a,t=e.ref(null),v=e.ref(null);e.watch(()=>u.selectedResult,n=>{n?.toolName==="playTicTacToe"&&n.jsonData&&(t.value=n.jsonData)},{immediate:!0});const f=e.computed(()=>{if(!t.value?.playerNames)return"";const n=t.value.playerNames[t.value.currentSide];return n.charAt(0).toUpperCase()+n.slice(1)}),d=e.computed(()=>t.value?.playerNames&&t.value.playerNames[t.value.currentSide]==="computer"),s=e.computed(()=>t.value?t.value.isTerminal?t.value.winner==="draw"?"text-gray-600":t.value.winner==="X"?"text-blue-600":"text-red-600":t.value.currentSide==="X"?"text-blue-600":"text-red-600":""),c=e.computed(()=>{if(!t.value?.board)return[];const n=[];for(let l=0;l<3;l++)for(let o=0;o<3;o++){const r=t.value.board[l][o],p=t.value.legalMoves?.some(y=>y.row===l&&y.col===o),x=t.value.winningLine?.some(y=>y.row===l&&y.col===o);n.push({row:l,col:o,piece:r!=="."?r:null,isLegalMove:p??!1,isWinningCell:x??!1})}return n});function m(n,l){const o="w-24 h-24 flex items-center justify-center bg-white rounded";let r="";return n.isWinningCell?r="bg-yellow-200 ring-2 ring-yellow-400":n.isLegalMove&&!d.value&&!t.value?.isTerminal&&(r=v.value===l?"bg-gray-200 cursor-pointer":"hover:bg-gray-100 cursor-pointer"),`${o} ${r}`}function g(n){if(!t.value||t.value.isTerminal||d.value)return;const l=c.value[n];if(!l.isLegalMove)return;const o=["top","middle","bottom"],r=["left","center","right"],p=`${o[l.row]}-${r[l.col]}`,x={row:l.row,col:l.col,currentState:t.value};u.sendTextMessage?.(`I want to play at ${p}, which is row=${l.row}, col=${l.col}`,{data:x})}function k(n,l){!t.value||t.value.isTerminal||d.value||!c.value[n].isLegalMove||(v.value=l?n:null)}return(n,l)=>(e.openBlock(),e.createElementBlock("div",N,[t.value?(e.openBlock(),e.createElementBlock("div",T,[l[6]||(l[6]=e.createElementVNode("h1",{class:"text-2xl font-bold text-gray-800 mb-2"},"Tic-Tac-Toe",-1)),e.createElementVNode("div",{class:e.normalizeClass(["text-lg font-semibold mb-4 text-center",s.value])},[t.value.isTerminal?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[t.value.winner==="draw"?(e.openBlock(),e.createElementBlock("span",C,"It's a Draw!")):(e.openBlock(),e.createElementBlock("span",h,e.toDisplayString(t.value.winner)+" Wins!",1))],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.createTextVNode(e.toDisplayString(f.value)+"'s Turn ("+e.toDisplayString(t.value.currentSide)+") ",1)],64))],2),e.createElementVNode("div",V,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(c.value,(o,r)=>(e.openBlock(),e.createElementBlock("div",{key:r,class:e.normalizeClass(m(o,r)),onClick:p=>g(r),onMouseenter:p=>k(r,!0),onMouseleave:p=>k(r,!1)},[o.piece==="X"?(e.openBlock(),e.createElementBlock("svg",_,[...l[0]||(l[0]=[e.createElementVNode("line",{x1:"4",y1:"4",x2:"20",y2:"20"},null,-1),e.createElementVNode("line",{x1:"20",y1:"4",x2:"4",y2:"20"},null,-1)])])):o.piece==="O"?(e.openBlock(),e.createElementBlock("svg",D,[...l[1]||(l[1]=[e.createElementVNode("circle",{cx:"12",cy:"12",r:"8"},null,-1)])])):o.isLegalMove&&!d.value&&v.value===r?(e.openBlock(),e.createElementBlock("svg",{key:2,class:e.normalizeClass(["w-16 h-16 opacity-30",t.value.currentSide==="X"?"text-blue-400":"text-red-400"]),viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round"},[t.value.currentSide==="X"?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[l[2]||(l[2]=e.createElementVNode("line",{x1:"4",y1:"4",x2:"20",y2:"20"},null,-1)),l[3]||(l[3]=e.createElementVNode("line",{x1:"20",y1:"4",x2:"4",y2:"20"},null,-1))],64)):(e.openBlock(),e.createElementBlock("circle",S))],2)):e.createCommentVNode("",!0)],42,b))),128))]),e.createElementVNode("div",O,[e.createElementVNode("div",$,[l[4]||(l[4]=e.createElementVNode("span",{class:"text-blue-600 font-bold"},"X:",-1)),e.createElementVNode("span",null,e.toDisplayString(t.value.counts.X),1),e.createElementVNode("span",M,"("+e.toDisplayString(t.value.playerNames.X)+")",1)]),e.createElementVNode("div",j,[l[5]||(l[5]=e.createElementVNode("span",{class:"text-red-600 font-bold"},"O:",-1)),e.createElementVNode("span",null,e.toDisplayString(t.value.counts.O),1),e.createElementVNode("span",L,"("+e.toDisplayString(t.value.playerNames.O)+")",1)])])])):e.createCommentVNode("",!0)]))}}),X={class:"p-3 bg-gray-50 rounded"},F={key:0,class:"space-y-2"},P={class:"flex justify-center"},z={class:"inline-block bg-gray-600 p-0.5 rounded"},W={class:"grid grid-cols-3 gap-0.5"},I={key:0,class:"w-4 h-4 text-blue-600",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3","stroke-linecap":"round"},A={key:1,class:"w-4 h-4 text-red-600",viewBox:"0 0 24 24",fill:"none",stroke:"currentColor","stroke-width":"3"},R={class:"text-xs text-center space-y-1"},q={key:0,class:"text-gray-600"},E=e.defineComponent({__name:"Preview",props:{result:{}},setup(a){const u=a;function t(s,c){return u.result.jsonData?.winningLine?.some(m=>m.row===s&&m.col===c)??!1}function v(s){return s.isTerminal?s.winner==="draw"?"Draw!":s.winner==="X"?"X Wins!":s.winner==="O"?"O Wins!":"Game Over":""}function f(){return u.result.jsonData?.isTerminal?u.result.jsonData.winner==="draw"?"text-gray-600":u.result.jsonData.winner==="X"?"text-blue-600":u.result.jsonData.winner==="O"?"text-red-600":"":""}function d(s){return s.charAt(0).toUpperCase()+s.slice(1)}return(s,c)=>(e.openBlock(),e.createElementBlock("div",X,[a.result.jsonData?(e.openBlock(),e.createElementBlock("div",F,[e.createElementVNode("div",P,[e.createElementVNode("div",z,[e.createElementVNode("div",W,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.result.jsonData.board,(m,g)=>(e.openBlock(),e.createElementBlock(e.Fragment,{key:g},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(m,(k,n)=>(e.openBlock(),e.createElementBlock("div",{key:`${g}-${n}`,class:e.normalizeClass(["w-6 h-6 flex items-center justify-center bg-white rounded-sm",t(g,n)?"bg-yellow-200":""])},[k==="X"?(e.openBlock(),e.createElementBlock("svg",I,[...c[0]||(c[0]=[e.createElementVNode("line",{x1:"4",y1:"4",x2:"20",y2:"20"},null,-1),e.createElementVNode("line",{x1:"20",y1:"4",x2:"4",y2:"20"},null,-1)])])):k==="O"?(e.openBlock(),e.createElementBlock("svg",A,[...c[1]||(c[1]=[e.createElementVNode("circle",{cx:"12",cy:"12",r:"8"},null,-1)])])):e.createCommentVNode("",!0)],2))),128))],64))),128))])])]),e.createElementVNode("div",R,[a.result.jsonData.isTerminal?(e.openBlock(),e.createElementBlock("div",{key:1,class:e.normalizeClass(["font-medium",f()])},e.toDisplayString(v(a.result.jsonData)),3)):(e.openBlock(),e.createElementBlock("div",q,[e.createElementVNode("span",{class:e.normalizeClass(a.result.jsonData.currentSide==="X"?"text-blue-600":"text-red-600")},e.toDisplayString(a.result.jsonData.currentSide),3),e.createTextVNode(" "+e.toDisplayString(d(a.result.jsonData.playerNames[a.result.jsonData.currentSide]))+" to play ",1)]))])])):e.createCommentVNode("",!0)]))}}),B={...i.pluginCore,viewComponent:w,previewComponent:E,samples:i.samples},G={plugin:B};exports.SYSTEM_PROMPT=i.SYSTEM_PROMPT;exports.TOOL_DEFINITION=i.TOOL_DEFINITION;exports.TOOL_NAME=i.TOOL_NAME;exports.executeTicTacToe=i.executeTicTacToe;exports.playTicTacToe=i.playTicTacToe;exports.pluginCore=i.pluginCore;exports.samples=i.samples;exports.Preview=E;exports.View=w;exports.default=G;exports.plugin=B;

package/dist/vue.js

@@ -0,0 +1,278 @@
+import { samples as M, pluginCore as O } from "./core.js";
+import { SYSTEM_PROMPT as ce, TOOL_DEFINITION as de, TOOL_NAME as ve, executeTicTacToe as ye, playTicTacToe as fe } from "./core.js";
+import { defineComponent as j, ref as D, watch as X, computed as b, createElementBlock as n, openBlock as l, createCommentVNode as C, createElementVNode as s, normalizeClass as x, Fragment as y, toDisplayString as d, createTextVNode as N, renderList as $ } from "vue";
+const L = { class: "w-full h-full flex flex-col items-center justify-center p-4 bg-gray-100" }, S = {
+  key: 0,
+  class: "flex flex-col items-center"
+}, B = { key: 0 }, W = { key: 1 }, V = { class: "grid grid-cols-3 gap-1 p-2 bg-gray-700 rounded-lg shadow-lg" }, E = ["onClick", "onMouseenter", "onMouseleave"], P = {
+  key: 0,
+  class: "w-16 h-16 text-blue-600",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3",
+  "stroke-linecap": "round"
+}, F = {
+  key: 1,
+  class: "w-16 h-16 text-red-600",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3"
+}, A = {
+  key: 1,
+  cx: "12",
+  cy: "12",
+  r: "8"
+}, I = { class: "mt-4 flex gap-8 text-lg" }, R = { class: "flex items-center gap-2" }, z = { class: "text-gray-500 text-sm" }, G = { class: "flex items-center gap-2" }, U = { class: "text-gray-500 text-sm" }, H = /* @__PURE__ */ j({
+  __name: "View",
+  props: {
+    selectedResult: {},
+    sendTextMessage: { type: Function }
+  },
+  setup(u) {
+    const v = u, e = D(null), p = D(null);
+    X(
+      () => v.selectedResult,
+      (r) => {
+        r?.toolName === "playTicTacToe" && r.jsonData && (e.value = r.jsonData);
+      },
+      { immediate: !0 }
+    );
+    const T = b(() => {
+      if (!e.value?.playerNames) return "";
+      const r = e.value.playerNames[e.value.currentSide];
+      return r.charAt(0).toUpperCase() + r.slice(1);
+    }), f = b(() => e.value?.playerNames && e.value.playerNames[e.value.currentSide] === "computer"), i = b(() => e.value ? e.value.isTerminal ? e.value.winner === "draw" ? "text-gray-600" : e.value.winner === "X" ? "text-blue-600" : "text-red-600" : e.value.currentSide === "X" ? "text-blue-600" : "text-red-600" : ""), c = b(() => {
+      if (!e.value?.board) return [];
+      const r = [];
+      for (let t = 0; t < 3; t++)
+        for (let o = 0; o < 3; o++) {
+          const a = e.value.board[t][o], m = e.value.legalMoves?.some(
+            (h) => h.row === t && h.col === o
+          ), _ = e.value.winningLine?.some(
+            (h) => h.row === t && h.col === o
+          );
+          r.push({
+            row: t,
+            col: o,
+            piece: a !== "." ? a : null,
+            isLegalMove: m ?? !1,
+            isWinningCell: _ ?? !1
+          });
+        }
+      return r;
+    });
+    function g(r, t) {
+      const o = "w-24 h-24 flex items-center justify-center bg-white rounded";
+      let a = "";
+      return r.isWinningCell ? a = "bg-yellow-200 ring-2 ring-yellow-400" : r.isLegalMove && !f.value && !e.value?.isTerminal && (a = p.value === t ? "bg-gray-200 cursor-pointer" : "hover:bg-gray-100 cursor-pointer"), `${o} ${a}`;
+    }
+    function w(r) {
+      if (!e.value || e.value.isTerminal || f.value)
+        return;
+      const t = c.value[r];
+      if (!t.isLegalMove) return;
+      const o = ["top", "middle", "bottom"], a = ["left", "center", "right"], m = `${o[t.row]}-${a[t.col]}`, _ = {
+        row: t.row,
+        col: t.col,
+        currentState: e.value
+      };
+      v.sendTextMessage?.(
+        `I want to play at ${m}, which is row=${t.row}, col=${t.col}`,
+        { data: _ }
+      );
+    }
+    function k(r, t) {
+      !e.value || e.value.isTerminal || f.value || !c.value[r].isLegalMove || (p.value = t ? r : null);
+    }
+    return (r, t) => (l(), n("div", L, [
+      e.value ? (l(), n("div", S, [
+        t[6] || (t[6] = s("h1", { class: "text-2xl font-bold text-gray-800 mb-2" }, "Tic-Tac-Toe", -1)),
+        s("div", {
+          class: x(["text-lg font-semibold mb-4 text-center", i.value])
+        }, [
+          e.value.isTerminal ? (l(), n(y, { key: 0 }, [
+            e.value.winner === "draw" ? (l(), n("span", B, "It's a Draw!")) : (l(), n("span", W, d(e.value.winner) + " Wins!", 1))
+          ], 64)) : (l(), n(y, { key: 1 }, [
+            N(d(T.value) + "'s Turn (" + d(e.value.currentSide) + ") ", 1)
+          ], 64))
+        ], 2),
+        s("div", V, [
+          (l(!0), n(y, null, $(c.value, (o, a) => (l(), n("div", {
+            key: a,
+            class: x(g(o, a)),
+            onClick: (m) => w(a),
+            onMouseenter: (m) => k(a, !0),
+            onMouseleave: (m) => k(a, !1)
+          }, [
+            o.piece === "X" ? (l(), n("svg", P, [...t[0] || (t[0] = [
+              s("line", {
+                x1: "4",
+                y1: "4",
+                x2: "20",
+                y2: "20"
+              }, null, -1),
+              s("line", {
+                x1: "20",
+                y1: "4",
+                x2: "4",
+                y2: "20"
+              }, null, -1)
+            ])])) : o.piece === "O" ? (l(), n("svg", F, [...t[1] || (t[1] = [
+              s("circle", {
+                cx: "12",
+                cy: "12",
+                r: "8"
+              }, null, -1)
+            ])])) : o.isLegalMove && !f.value && p.value === a ? (l(), n("svg", {
+              key: 2,
+              class: x(["w-16 h-16 opacity-30", e.value.currentSide === "X" ? "text-blue-400" : "text-red-400"]),
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              "stroke-width": "3",
+              "stroke-linecap": "round"
+            }, [
+              e.value.currentSide === "X" ? (l(), n(y, { key: 0 }, [
+                t[2] || (t[2] = s("line", {
+                  x1: "4",
+                  y1: "4",
+                  x2: "20",
+                  y2: "20"
+                }, null, -1)),
+                t[3] || (t[3] = s("line", {
+                  x1: "20",
+                  y1: "4",
+                  x2: "4",
+                  y2: "20"
+                }, null, -1))
+              ], 64)) : (l(), n("circle", A))
+            ], 2)) : C("", !0)
+          ], 42, E))), 128))
+        ]),
+        s("div", I, [
+          s("div", R, [
+            t[4] || (t[4] = s("span", { class: "text-blue-600 font-bold" }, "X:", -1)),
+            s("span", null, d(e.value.counts.X), 1),
+            s("span", z, "(" + d(e.value.playerNames.X) + ")", 1)
+          ]),
+          s("div", G, [
+            t[5] || (t[5] = s("span", { class: "text-red-600 font-bold" }, "O:", -1)),
+            s("span", null, d(e.value.counts.O), 1),
+            s("span", U, "(" + d(e.value.playerNames.O) + ")", 1)
+          ])
+        ])
+      ])) : C("", !0)
+    ]));
+  }
+}), Y = { class: "p-3 bg-gray-50 rounded" }, q = {
+  key: 0,
+  class: "space-y-2"
+}, J = { class: "flex justify-center" }, K = { class: "inline-block bg-gray-600 p-0.5 rounded" }, Q = { class: "grid grid-cols-3 gap-0.5" }, Z = {
+  key: 0,
+  class: "w-4 h-4 text-blue-600",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3",
+  "stroke-linecap": "round"
+}, ee = {
+  key: 1,
+  class: "w-4 h-4 text-red-600",
+  viewBox: "0 0 24 24",
+  fill: "none",
+  stroke: "currentColor",
+  "stroke-width": "3"
+}, te = { class: "text-xs text-center space-y-1" }, se = {
+  key: 0,
+  class: "text-gray-600"
+}, ne = /* @__PURE__ */ j({
+  __name: "Preview",
+  props: {
+    result: {}
+  },
+  setup(u) {
+    const v = u;
+    function e(i, c) {
+      return v.result.jsonData?.winningLine?.some(
+        (g) => g.row === i && g.col === c
+      ) ?? !1;
+    }
+    function p(i) {
+      return i.isTerminal ? i.winner === "draw" ? "Draw!" : i.winner === "X" ? "X Wins!" : i.winner === "O" ? "O Wins!" : "Game Over" : "";
+    }
+    function T() {
+      return v.result.jsonData?.isTerminal ? v.result.jsonData.winner === "draw" ? "text-gray-600" : v.result.jsonData.winner === "X" ? "text-blue-600" : v.result.jsonData.winner === "O" ? "text-red-600" : "" : "";
+    }
+    function f(i) {
+      return i.charAt(0).toUpperCase() + i.slice(1);
+    }
+    return (i, c) => (l(), n("div", Y, [
+      u.result.jsonData ? (l(), n("div", q, [
+        s("div", J, [
+          s("div", K, [
+            s("div", Q, [
+              (l(!0), n(y, null, $(u.result.jsonData.board, (g, w) => (l(), n(y, { key: w }, [
+                (l(!0), n(y, null, $(g, (k, r) => (l(), n("div", {
+                  key: `${w}-${r}`,
+                  class: x(["w-6 h-6 flex items-center justify-center bg-white rounded-sm", e(w, r) ? "bg-yellow-200" : ""])
+                }, [
+                  k === "X" ? (l(), n("svg", Z, [...c[0] || (c[0] = [
+                    s("line", {
+                      x1: "4",
+                      y1: "4",
+                      x2: "20",
+                      y2: "20"
+                    }, null, -1),
+                    s("line", {
+                      x1: "20",
+                      y1: "4",
+                      x2: "4",
+                      y2: "20"
+                    }, null, -1)
+                  ])])) : k === "O" ? (l(), n("svg", ee, [...c[1] || (c[1] = [
+                    s("circle", {
+                      cx: "12",
+                      cy: "12",
+                      r: "8"
+                    }, null, -1)
+                  ])])) : C("", !0)
+                ], 2))), 128))
+              ], 64))), 128))
+            ])
+          ])
+        ]),
+        s("div", te, [
+          u.result.jsonData.isTerminal ? (l(), n("div", {
+            key: 1,
+            class: x(["font-medium", T()])
+          }, d(p(u.result.jsonData)), 3)) : (l(), n("div", se, [
+            s("span", {
+              class: x(u.result.jsonData.currentSide === "X" ? "text-blue-600" : "text-red-600")
+            }, d(u.result.jsonData.currentSide), 3),
+            N(" " + d(f(u.result.jsonData.playerNames[u.result.jsonData.currentSide])) + " to play ", 1)
+          ]))
+        ])
+      ])) : C("", !0)
+    ]));
+  }
+}), le = {
+  ...O,
+  viewComponent: H,
+  previewComponent: ne,
+  samples: M
+}, ae = { plugin: le };
+export {
+  ne as Preview,
+  ce as SYSTEM_PROMPT,
+  de as TOOL_DEFINITION,
+  ve as TOOL_NAME,
+  H as View,
+  ae as default,
+  ye as executeTicTacToe,
+  fe as playTicTacToe,
+  le as plugin,
+  O as pluginCore,
+  M as samples
+};

package/package.json

@@ -0,0 +1,63 @@
+{
+  "name": "@gui-chat-plugin/tictactoe",
+  "version": "0.1.0",
+  "description": "Tic-Tac-Toe game plugin for GUI Chat",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./core": {
+      "types": "./dist/core/index.d.ts",
+      "import": "./dist/core.js",
+      "require": "./dist/core.cjs"
+    },
+    "./vue": {
+      "types": "./dist/vue/index.d.ts",
+      "import": "./dist/vue.js",
+      "require": "./dist/vue.cjs"
+    },
+    "./style.css": "./dist/style.css"
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build && vue-tsc -p tsconfig.build.json --emitDeclarationOnly",
+    "typecheck": "vue-tsc --noEmit",
+    "lint": "eslint src demo"
+  },
+  "peerDependencies": {
+    "gui-chat-protocol": "^0.0.1",
+    "vue": "^3.5.0"
+  },
+  "devDependencies": {
+    "@tailwindcss/vite": "^4.1.18",
+    "@typescript-eslint/eslint-plugin": "^8.53.0",
+    "@typescript-eslint/parser": "^8.53.0",
+    "@vitejs/plugin-vue": "^6.0.3",
+    "eslint": "^9.39.2",
+    "eslint-plugin-vue": "^10.6.2",
+    "globals": "^17.0.0",
+    "gui-chat-protocol": "^0.0.2",
+    "tailwindcss": "^4.1.18",
+    "typescript": "~5.9.3",
+    "vite": "^7.3.1",
+    "vue": "^3.5.27",
+    "vue-eslint-parser": "^10.2.0",
+    "vue-tsc": "^3.2.2"
+  },
+  "keywords": [
+    "guichat",
+    "plugin",
+    "tictactoe",
+    "game"
+  ],
+  "license": "MIT"
+}