OpenClaw

miro-sdk

Complete Miro Web SDK reference for building web plugins and desktop applications. Covers setup, core APIs (boards, shapes, text, items, selections, events), authentication, real-time collaboration, examples in TypeScript/JavaScript, best practices, and error handling.

bigbubbaagent-bot0 来源安装数☆ 0 仓库 Stars

查看来源 ↗安装与使用 SKILL.md ↗

安装与使用

请根据来源仓库和你的 AI 工具说明安装此技能。先阅读技能文件和依赖要求，再添加到工作流。

SkillHub CLI

skillhub install bigbubbaagent-bot/miro-sdk

打开来源仓库，查看说明和兼容环境后，按来源提供的命令或步骤安装。

将来源链接提供给你的 Agent，让它先读取说明、核对依赖，并向你说明将执行的安装步骤。

查看来源 ↗使用指南

技能说明

Miro Web SDK

The Miro Web SDK enables you to build web plugins that extend Miro's functionality. Create custom tools, automate workflows, and integrate external data directly into Miro boards.

Quick Start

Install SDK:

npm install @mirohq/websdk-cli @mirohq/miro-webplugin

Create Plugin:

npm create @mirohq/websdk-cli my-plugin
cd my-plugin
npm start

Hello World Plugin:

import { Board } from '@mirohq/miro-webplugin';

miro.onReady(async () => {
  console.log('Plugin ready!');
  
  // Get current board
  const board = await miro.board.getInfo();
  console.log('Board name:', board.name);
  
  // Listen for shape creation
  miro.board.events.on('item:create', (event) => {
    console.log('New item:', event.data);
  });
});

Core Capabilities

1. Board Interaction

Get board information (name, owner, size)
Listen to real-time events (item creation, updates, deletions)
Manage board selection and viewport
Access board history and undo/redo

2. Create Items

Shapes (rectangles, circles, diamonds, etc.)
Text and rich text formatting
Images and embeds
Sticky notes and cards
Frames and groups

3. Manipulate Items

Move, resize, rotate items
Change styling (colors, opacity, fonts)
Update content and properties
Apply connectors between shapes
Delete items

4. Selection & Interaction

Get selected items
Listen to selection changes
Programmatically select items
Multi-select operations

5. User Interaction

Viewport and zoom control
Notification system
Modal dialogs
Context menus
Keyboard shortcuts

6. Collaboration Features

Real-time sync with other users
User presence indicators
Shared selections
Live editing

7. Data Management

Metadata and custom properties
Board-level storage
Plugin configuration
Event tracking

8. Advanced Features

Batch operations (bulk create/update)
Search and filtering
Viewport navigation
Animati...

来源信息

Source: github
Repository: openclaw/skills
Path: skills/bigbubbaagent-bot/miro-sdk
Version: —
Commit: 18e94b61fe7d30198c6799e494ee28dd9375b876
分类来源: rules
状态: active
可见性: public

这些信息来自收录时的来源分析，可能滞后；使用前请核对最新来源文件。

来源内容

SKILL.md

# Miro Web SDK

The Miro Web SDK enables you to build web plugins that extend Miro's functionality. Create custom tools, automate workflows, and integrate external data directly into Miro boards.

## Quick Start

**Install SDK:**
```bash
npm install @mirohq/websdk-cli @mirohq/miro-webplugin
```

**Create Plugin:**
```bash
npm create @mirohq/websdk-cli my-plugin
cd my-plugin
npm start
```

**Hello World Plugin:**
```typescript
import { Board } from '@mirohq/miro-webplugin';

miro.onReady(async () => {
  console.log('Plugin ready!');
  
  // Get current board
  const board = await miro.board.getInfo();
  console.log('Board name:', board.name);
  
  // Listen for shape creation
  miro.board.events.on('item:create', (event) => {
    console.log('New item:', event.data);
  });
});
```

## Core Capabilities

### 1. Board Interaction
- Get board information (name, owner, size)
- Listen to real-time events (item creation, updates, deletions)
- Manage board selection and viewport
- Access board history and undo/redo

### 2. Create Items
- Shapes (rectangles, circles, diamonds, etc.)
- Text and rich text formatting
- Images and embeds
- Sticky notes and cards
- Frames and groups

### 3. Manipulate Items
- Move, resize, rotate items
- Change styling (colors, opacity, fonts)
- Update content and properties
- Apply connectors between shapes
- Delete items

### 4. Selection & Interaction
- Get selected items
- Listen to selection changes
- Programmatically select items
- Multi-select operations

### 5. User Interaction
- Viewport and zoom control
- Notification system
- Modal dialogs
- Context menus
- Keyboard shortcuts

### 6. Collaboration Features
- Real-time sync with other users
- User presence indicators
- Shared selections
- Live editing

### 7. Data Management
- Metadata and custom properties
- Board-level storage
- Plugin configuration
- Event tracking

### 8. Advanced Features
- Batch operations (bulk create/update)
- Search and filtering
- Viewport navigation
- Animati...

搜索