Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add jiushiwon/wg-skills --skill vue-table-skillgit clone --depth 1 https://github.com/jiushiwon/wg-skillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/jiushiwon/wg-skills/vue-table-skill)<a href="https://agentmods.dev/skills/jiushiwon/wg-skills/vue-table-skill"><img src="https://agentmods.dev/badge/skills/jiushiwon/wg-skills/vue-table-skill/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/jiushiwon/wg-skills/vue-table-skill"><img src="https://agentmods.dev/badge/skills/jiushiwon/wg-skills/vue-table-skill.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00129 | $0.02537 |
| Opus 5 | $0.00064 | $0.01269 |
| Sonnet 5 | $0.00026 | $0.00507 |
| Haiku 4.5 | $0.00013 | $0.00254 |
Grade A, and why
vue-table-skill scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 279 lines — stays where its author put it; the contents beside it link to each section on GitHub.
vue-table-skill 表格技能
🎯 定位
Vue3 + TypeScript 泛型表格组件,支持 23 种形态,包含 3 个独立组件:
base-table- 通用表格组件(23 种形态)base-loading- 加载中组件(7 种动画 / 5 种尺寸 / 5 种主题)base-paginated- 分页组件(5 种模式 / 3 种尺寸 / 3 种形状)
核心约束:
- ✅ 零 HTML5 标签(
<button><input><select><table>全部禁用) - ✅ 全部用
<div><span>+ CSS3 实现 - ✅ 强依赖
<base-button><base-status><base-card> - ✅ 全部使用
var(--*)Token
📦 组件清单
1. base-table 通用表格(23 种形态)
| # | 形态 | 说明 | 参数 |
|---|---|---|---|
| 1 | 基础表格 | 默认形态 | - |
| 2 | 固定列 | 左/右固定列 | fixed: 'left'|'right' |
| 3 | 操作列 | 编辑/删除/自定义 | actions |
| 4 | 可选择行 | 自定义复选框 | selectable |
| 5 | 可排序 | 表头排序 | sortable |
| 6 | 可筛选 | 列筛选 | filterable |
| 7 | 可展开行 | 详情展开 | expandable |
| 8 | 表头分组 | 多级表头 | children |
| 9 | 合并单元格 | 行列合并 | spanMethod |
| 10 | 行编辑 | 单元格编辑 | editable |
| 11 | 树形数据 | 树形结构 | treeData |
| 12 | 虚拟滚动 | 大数据量 | virtual |
| 13 | 拖拽排序 | 拖拽调整 | dragSort |
| 14 | 可调整列宽 | 拖拽列宽 | resizable |
| 15 | 汇总行 | 底部汇总 | showSummary |
| 16 | 斑马纹 | 隔行变色 | striped |
| 17 | 边框 | 带边框 | bordered |
| 18 | 悬停高亮 | 鼠标悬停 | hover |
| 19 | 紧凑模式 | 减少内边距 | compact |
| 20 | 固定表头 | 表头固定 | height |
| 21 | 加载中 | 加载状态 | loading |
| 22 | 空状态 | 无数据 | emptyText |
| 23 | 分页表格 | 内置分页 | pagination |
2. base-loading 加载中(7 种动画)
| 动画 | 说明 |
|---|---|
| dots | 三点弹跳(默认) |
| bar | 条状横扫 |
| ring | 圆环旋转 |
| pulse | 脉冲扩散 |
| wave | 波浪起伏 |
| cube | 方块翻转(3D) |
| ripple | 涟漪扩散 |
类型 / 5 种:container / fullscreen / section / inline / overlay 尺寸 / 5 种:xs / sm / md / lg / xl 主题 / 5 种:primary / success / warning / danger / info
3. base-paginated 分页(5 种模式)
| 模式 | 说明 | 适用场景 |
|---|---|---|
| classic | 经典分页(数字按钮 + 上下页) | 桌面端默认 |
| button | 按钮组(首末页 + 上下页) | 卡片风格 |
| dropdown | 下拉页码 | 页数多时 |
| simple | 简洁模式 | 移动端 |
| scroll | 滚动加载 | 无限滚动 |
尺寸 / 3 种:sm / md / lg 形状 / 3 种:round / square / circle 主题 / 5 种:primary / success / warning / danger / info 位置 / 3 种:left / center / right
What ships with it
14 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
- base-loading.md 24 KB
- base-paginated.md 33 KB
- base-table.md 60 KB
- demo-components/base-table/html/base-loading.html 8.4 KB
- demo-components/base-table/html/base-paginated.html 5.1 KB
- demo-components/base-table/html/base-table.html 26 KB
- demo-components/base-table/html/demo.css 30 KB
- demo-components/base-table/html/demo.js 36 KB runs code
- demo-components/base-table/html/loading.js 8.7 KB runs code
- demo-components/base-table/html/paginated.js 11 KB runs code
- demo-components/base-table/README.md 3.3 KB
- demo-components/shared/demo.css 9.7 KB
- demo-components/shared/tokens.css 2.3 KB
- README.md 7.0 KB
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 6d ago Changed · +139 lines · +54 tokens per session 15b7d48878da
- 9d ago First seen · 140 lines · 75 tokens per session scan A 027528c48e10
vue-table-skill is a skill published in the GitHub repository jiushiwon/wg-skills (100 stars, last pushed 2d ago), licensed Apache-2.0. It adds 129 tokens to every session and 2,537 once invoked, about $0.0006 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-09-03.
Other skills, from other repositories
shadcn-svelte
Pre-built shadcn-svelte components for json-render Svelte apps. Use when working with @json-render/shadcn-svelte, adding standard UI components to a Svelte catalog, or building Svelte web UIs with shadcn-svelte + Tailwind CSS components.
create-site
Creates a new Power Pages code site (SPA) using React, Angular, Vue, or Astro. Guides through the full process from initial concept to deployed site: requirements discovery, scaffolding, component planning, design, implementation, validation, and deployment. Use when the user wants to create, build, or scaffold a new…
v3-create-crud
A page generator for standard create, read, update, and delete screens, commonly called CRUD screens. It uses Element Plus, a Vue user-interface library, to build tables, searches, pagination, forms, and delete confirmations.
v3-use-composables
Documentation for reusable Vue functions in a project, covering device detection, asynchronous dropdown data, loading screens, pagination, routing, themes, page titles, and watermarks.
moai-domain-uiux
UI/UX design systems specialist covering accessibility, icons, theming, design tokens, and user experience patterns. Use when working on design systems, WCAG compliance, ARIA patterns, or dark mode theming.
moai-domain-frontend
Frontend development specialist covering React 19, Next.js 16, Vue 3.5, and modern UI/UX patterns with component architecture. Use when building web UIs, implementing components, optimizing frontend performance, or integrating state management.