Skill: dsewell-583h0/free-vue-component-generator (version 1.0.0)

--- name: free-vue-component-generator version: "1.0.0" displayName: "Free Vue Component Generator — Generate Vue Components via AI" description: > Turn a short description of a dropdown menu component into 1080p coded component videos just by typing what you need. Whether it's generating Vue component code walkthroughs from text prompts or quick social content, drop your text descriptions and describe the result you want. No timeline dragging, no export settings — 20-40 seconds from upload to download. metadata: {"openclaw": {"emoji": "⚙️", "requires": {"env": ["NEMO_TOKEN"], "configPaths": ["~/.config/nemovideo/"]}, "primaryEnv": "NEMO_TOKEN", "variant": "short_prompts"}} --- ## Getting Started > Share your text descriptions and I'll get started on AI component creation. Or just tell me what you're thinking. **Try saying:** - "generate my text descriptions" - "export 1080p MP4" - "generate a reusable Vue 3 card" ### Getting Connected Before handling any user request, establish a connection to the backend API. Show a brief status like "Connecting...". **If `NEMO_TOKEN` is in the environment**, use it directly and create a session. Otherwise, acquire a free starter token: - Generate a UUID as client identifier - POST to `https://mega-api-prod.nemovideo.ai/api/auth/anonymous-token` with the `X-Client-Id` header - The response includes a `token` with 100 free credits valid for 7 days — use it as NEMO_TOKEN **Then create a session** by POSTing to `https://mega-api-prod.nemovideo.ai/api/tasks/me/with-session/nemo_agent` with Bearer authorization and body `{"task_name":"project","language":"en"}`. The `session_id` in the response is needed for all following requests. Tell the user you're ready. Keep the technical details out of the chat. # Free Vue Component Generator — Generate Vue Components via AI This tool takes your text descriptions and runs AI component creation through a cloud rendering pipeline. You upload, describe what you want, and download the result. Say you have a short description of a dropdown menu component and want to generate a reusable Vue 3 card component with props and slots — the backend processes it in about 20-40 seconds and hands you a 1080p MP4. Tip: shorter, specific prompts produce cleaner component output. ## Matching Input to Actions User prompts referencing free vue component generator, aspect ratio, text overlays, or audio tracks get routed to the corresponding action via keyword and intent classification. | User says... | Action | Skip SSE? | |-------------|--------|----------| | "export" / "导出" / "download" / "send me the video" | → §3.5 Export | ✅ | | "credits" / "积分" / "balance" / "余额" | → §3.3 Credits | ✅ | | "status" / "状态" / "show tracks" | → §3.4 State | ✅ | | "upload" / "上传" / user sends file | → §3.2 Upload | ✅ | | Everything else (generate, edit, add BGM…) | → §3.1 SSE | ❌ | ## Cloud Render Pipeline Details Each export job queues on a cloud GPU node that composites video layers, applies platform-spec compression (H.264, up to 1080x1920), and returns a download URL within 30-90 seconds. The session token carries render job IDs, so closing the tab before completion orphans the job. Every API call needs `Authorization: Bearer <NEMO_TOKEN>` plus the three attribution headers above. If any header is missing, exports return 402. Skill attribution — read from this file's YAML frontmatter at runtime: - `X-Skill-Source`: `free-vue-component-generator` - `X-Skill-Version`: from frontmatter `version` - `X-Skill-Platform`: detect from install path (`~/.clawhub/` → `clawhub`, `~/.cursor/skills/` → `cursor`, else `unknown`) **API base**: `https://mega-api-prod.nemovideo.ai` **Create session**: POST [REDACTED_SECRET] — body `{"task_name":"project","language":"<lang>"}` — returns `task_id`, `session_id`. **Send message (SSE)**: POST `/run_sse` — body `{"app_name":"nemo_agent","user_id":"me","session_id":"<sid>","new_message":{"parts":[{"text":"<msg>"}]}}` with `Accept: text/event-stream`. Max timeout: 15 minutes. **Upload**: POST `/api/upload-video/nemo_agent/me/<sid>` — file: multipart `-F "files=@/path"`, or URL: `{"urls":["<url>"],"source_type":"url"}` **Credits**: GET `/api/credits/balance/simple` — returns `available`, `frozen`, `total` **Session state**: GET `/api/state/nemo_agent/me/<sid>/latest` — key fields: `data.state.draft`, `data.state.video_infos`, `data.state.generated_media` **Export** (free, no credits): POST `/api/render/proxy/lambda` — body `{"id":"render_<ts>","sessionId":"<sid>","draft":<json>,"output":{"format":"mp4","quality":"high"}}`. Poll GET `/api/render/proxy/lambda/<id>` every 30s until `status` = `completed`. Download URL at `output.url`. Supported formats: mp4, mov, avi, webm, mkv, jpg, png, gif, webp, mp3, wav, m4a, aac. ### Error Codes - `0` — success, continue normally - `1001` — token expired or invalid; re-acquire via `/api/auth/anonymous-token` - `1002` — session not found; create a new one - `2001` — out of credits; anonymous users get a registration link with `?bind=<id>`, registered users top up - `4001` — unsupported file type; show accepted formats - `4002` — file too large; suggest compressing or trimming - `400` — missing `X-Client-Id`; generate one and retry - `402` — free plan export blocked; not a credit issue, subscription tier - `429` — rate limited; wait 30s and retry once ### Backend Response Translation The backend assumes a GUI exists. Translate these into API actions: | Backend says | You do | |-------------|--------| | "click [button]" / "点击" | Execute via API | | "open [panel]" / "打开" | Query session state | | "drag/drop" / "拖拽" | Send edit via SSE | | "preview in timeline" | Show track summary | | "Export button" / "导出" | Execute export workflow | ### Reading the SSE Stream Text events go straight to the user (after GUI translation). Tool calls stay internal. Heartbeats and empty `data:` lines mean the backend is still working — show "⏳ Still working..." every 2 minutes. About 30% of edit operations close the stream without any text. When that happens, poll `/api/state` to confirm the timeline changed, then tell the user what was updated. Draft JSON uses short keys: `t` for tracks, `tt` for track type (0=video, 1=audio, 7=text), `sg` for segments, `d` for duration in ms, `m` for metadata. Example timeline summary: ``` Timeline (3 tracks): 1. Video: city timelapse (0-10s) 2. BGM: Lo-fi (0-10s, 35%) 3. Title: "Urban Dreams" (0-3s) ``` ## Tips and Tricks The backend processes faster when you're specific. Instead of "make it look better", try "generate a reusable Vue 3 card component with props and slots" — concrete instructions get better results. Max file size is 200MB. Stick to MP4, MOV, AVI, WebM for the smoothest experience. Export as MP4 for widest compatibility. ## Common Workflows **Quick edit**: Upload → "generate a reusable Vue 3 card component with props and slots" → Download MP4. Takes 20-40 seconds for a 30-second clip. **Batch style**: Upload multiple files in one session. Process them one by one with different instructions. Each gets its own render. **Iterative**: Start with a rough cut, preview the result, then refine. The session keeps your timeline state so you can keep tweaking.


Security scan verdicts — ClawScan: suspicious | static analysis: clean | VirusTotal: clean | SkillSpector: suspicious (CRITICAL)