Ready to supercharge your AI agents?

Install any skill in seconds. Free to start, no credit card required.

Get Started Free →

Plate.js Editor Handler · aiskillstore | DecimalAI

aiskillstore/plate-handler

SkillScore95Maintained

Implement rich text editors using Plate.js. Supports creating both simple (comment/chat) and detailed (document/blog) editors.

Frontendby aiskillstore

Links this skill to your agents and keeps it current with the author’s updates.

Automatic

Frontend / UI pack

1 · One-time — install the CLI (docs ↗)

pip install decimalai

2 · Get the skill — writes .claude/skills/aiskillstore-plate-handler/SKILL.md

decimalai skills pull aiskillstore-plate-handler --out .claude/skills/

No CLI? Get the same file — curl · raw file

curl -fsSL --create-dirs -o .claude/skills/aiskillstore-plate-handler/SKILL.md https://app.decimal.ai/s/aiskillstore-plate-handler/SKILL.md

Raw file: /s/aiskillstore-plate-handler/SKILL.md ↗ · machine-readable summary at /s/aiskillstore-plate-handler.json ↗

In productionGlobal

how this skill behaves on real traffic · last 30 days

No production data for this skill yet — usage numbers appear here once agents start running it.

Anonymized aggregate across every org using this skill — proof from real production use, not a demo.

Does this skill help? · Benchmark: with vs. withoutsign in to run this on your agents

22 test cases from the publisher’s eval.yaml · each run twice on gemini-3.6-flash — with the skill injected, then without · last run 7d ago

Yes — +55% lift-14% tokens0% turns95% of whole cases pass with skill (21/22)

Test case	Without → With	Effect	Δ tokens	Δ turns
case-02	✗→✓	▲ Improved	0%	0%
case-03	✗→✓	▲ Improved	21%	0%
case-04	✗→✓	▲ Improved	-15%	0%
case-11	✗→✓	▲ Improved	-15%	0%
case-06	✗→✓	▲ Improved	-47%	0%

Showing 5 of 22 cases

SkillSafety

✓ 3 of 3 passed

Code scan15 of 15 checks clean

0 critical · 0 warning · 0 info — scanner v4 — 8/3/2026

live_secretremote_code_executionreverse_shelldata_exfiltrationssrf_metadataagent_snoopinganti_refusaldestructive_commandsobfuscated_unicodeunicode_homoglyphopaque_blobsuspicious_urltool_overreachtrigger_abuseprompt_injection_phrasing

IntentSafe

LLM judge · does the skill do what it claims

ContentClean

LLM judge · policy & harmful-content review

Source

Imported

aiskillstore / marketplace

skills/aayushbaniya2006/plate-handler/SKILL.md

View on GitHub ↗

Imported 8/3/2026Version v1

Skill contents

SKILL.md

Plate.js Editor Handler

Instructions

1. Installation & Setup

Use the shadcn CLI to install Plate components.

Core Installation: pnpm dlx shadcn@latest add @plate/editor
Basic Nodes: pnpm dlx shadcn@latest add @plate/basic-nodes-kit @plate/fixed-toolbar @plate/mark-toolbar-button
Preset (Optional): For a quick comprehensive setup, use pnpm dlx shadcn@latest add @plate/editor-basic.

2. Choosing an Editor Type

Decide based on the user's requirement:

A. Small Editor (Comments, Chat, Bio)

Goal: Minimal distraction, basic formatting.
Plugins: Bold, Italic, Underline, maybe Link.
UI: Simple FixedToolbar or no toolbar (shortcuts only).
Location: src/components/plate-editor/simple-editor.tsx

B. Detailed Editor (Blog, Documents, CMS)

Goal: Full content creation capabilities.
Plugins: Headings (H1-H3), Blockquote, Lists, Images, Media, Tables.
UI: Full FixedToolbar with multiple groups, Floating Toolbar.
Location: src/components/plate-editor/detailed-editor.tsx

3. Implementation Steps

Scaffold Components: Ensure the base UI components (Editor, EditorContainer, Toolbar) are installed in @/components/ui.
Create Editor Component: Create the wrapper component using usePlateEditor and <Plate>.
Configure Plugins: Import and add plugins to the plugins array.
Bind UI: Add FixedToolbar and buttons (MarkToolbarButton, ToolbarButton) inside the <Plate> provider.
State Management: Use value and onChange props on <Plate> to handle content. Sync with localStorage or form state as needed.

4. Reference & Docs

See reference.md for code snippets, CLI commands, and configuration details.

Want to see if aiskillstore/plate-handler would activate on your phrasing? Try it before you install — no LLM call, no signup.

Latest benchmark · publisher runVerified

8/22/2026, 00:06 UTC · 22 cases

Lift

+55%

95% vs 41%

Agent turns

0%

1.0 vs 1.0

Tokens

-15%

1,613.73 vs 1,887.32

fail → pass · 12pass → pass · 9fail → fail · 1

Per-case results (22)

Case	Status	Duration (ms)			Turns			Tokens			Tool calls
Case	Status	Without	With	Δ	Without	With	Δ	Without	With	Δ	Without	With	Δ
case-22 We are using shadcn UI in our project and want to update default primary button styles in Tailwind CSS. How should we configure globals.css for CSS variables?	pass→pass	11,876	10,887	-8%	1	1	0%	2,088	2,588	+24%	0	0	—
case-01 I'm building a user discussion board and need a lightweight comment box using Plate.js and shadcn UI. Could you give me the installation commands to run and create the React component for this simple formatting editor?	fail→fail	17,491	11,597	-34%	1	1	0%	3,289	2,886	-12%	0	0	—
case-02 We are creating a full blogging tool in our React app and want to integrate Plate.js for writing articles with headings, media, and list items. Please provide the terminal commands for adding the components via shadcn and generate the code for a full-featured content editor.	fail→pass	18,410	14,673	-20%	1	1	0%	3,528	3,518	-0%	0	0	—
case-03 I need guidance on adding Plate.js editors to our project. We'll have a brief user bio field and a multi-page document editor. Can you outline the CLI setup instructions and provide the component implementations for both editor requirements?	fail→pass	15,330	14,280	-7%	1	1	0%	2,960	3,576	+21%	0	0	—
case-04 We want a quick, all-in-one comprehensive setup for rich text editing using Plate and shadcn CLI without manually specifying every individual package. What command should we run?	fail→pass	6,687	3,184	-52%	1	1	0%	1,141	974	-15%	0	0	—
case-05 Where should base scaffolding UI components such as Editor, EditorContainer, and Toolbar be located when integrating Plate components via shadcn CLI?	pass→pass	10,158	3,122	-69%	1	1	0%	1,734	1,067	-38%	0	0	—
case-11 Which React hook should be invoked to initialize and configure the editor instance before passing it to the provider?	fail→pass	6,662	2,542	-62%	1	1	0%	1,053	900	-15%	0	0	—
case-06 We already installed core Plate support in our project. What specific shadcn CLI command adds basic node plugins, fixed toolbars, and mark buttons?	fail→pass	9,496	2,311	-76%	1	1	0%	1,598	854	-47%	0	0	—
case-07 When implementing a simple bio input field with minimal formatting plugins, where should the component file be placed within the project structure?	fail→pass	9,731	1,944	-80%	1	1	0%	1,630	786	-52%	0	0	—
case-08 When building a detailed CMS content creation editor with headings, tables, and media support, what file path should be used for this editor component?	fail→pass	10,373	1,942	-81%	1	1	0%	1,771	773	-56%	0	0	—
case-09 How should state synchronization for content values be configured on the main Plate provider element in React?	pass→pass	13,536	10,415	-23%	1	1	0%	2,357	2,403	+2%	0	0	—
case-10 What is the name of the root React component provider wrapper used to enclose the toolbar and editor UI?	fail→pass	7,285	2,150	-70%	1	1	0%	1,186	779	-34%	0	0	—
case-12 Which toolbar UI component wrapper should be placed inside the provider for top-level formatting controls?	fail→pass	9,093	2,798	-69%	1	1	0%	1,374	947	-31%	0	0	—
case-13 Which specific toolbar button component is used for mark controls like bold and italic in Plate UI?	pass→pass	4,071	3,573	-12%	1	1	0%	666	1,186	+78%	0	0	—
case-14 What exact shadcn CLI command installs the core Plate editor component into a React application?	fail→pass	6,759	1,786	-74%	1	1	0%	1,135	749	-34%	0	0	—
case-15 What toolbar layout decision is recommended for lightweight user bio or comment box fields?	pass→pass	10,947	2,384	-78%	1	1	0%	1,667	817	-51%	0	0	—
case-21 Our team decided to use TipTap with React for a simple rich text input. How do we install TipTap core extensions and set up the editor hook?	pass→pass	10,028	10,055	+0%	1	1	0%	1,921	2,331	+21%	0	0	—
case-16 What plugin categories should be configured for a detailed article editor compared to a simple comment editor?	pass→pass	14,744	6,668	-55%	1	1	0%	2,365	1,622	-31%	0	0	—
case-17 Where are code snippets and configuration CLI commands documented for reference within the project repository structure?	fail→pass	10,769	2,238	-79%	1	1	0%	1,776	845	-52%	0	0	—
case-18 How should value changes from the editor state be persisted across page reloads in client-side React code?	pass→pass	14,898	11,499	-23%	1	1	0%	2,730	2,607	-5%	0	0	—
case-19 Which CLI package runner command prefix is used to add Plate components via shadcn?	fail→pass	7,459	2,161	-71%	1	1	0%	1,318	834	-37%	0	0	—
case-20 We are building a custom rich text editor directly using raw Slate.js and Slate React in a standalone React application. What NPM packages should we install and how do we initialize standard Slate state?	pass→pass	12,555	10,624	-15%	1	1	0%	2,234	2,460	+10%	0	0	—

These cases were also screened by the skill’s intent / safety pass.See the Trust review ↗Reproduce this benchmark in Colab ↗

How this skill was measured

DecimalAI ran this skill against gemini-3.6-flash twice over the same eval suite — once with the skill loaded and once without — and compared the two runs case by case. 22 cases were attempted. The headline lift of +55 percentage points is the difference between those two pass rates over the 22 comparable cases.

Model measured: gemini-3.6-flash
Graded by: gemini-3.6-flash
Grading method: judged
Verification: verified
Pass rate without the skill: 40.9%
Pass rate with the skill: 95.5%
Cases attempted: 22
Cases counted toward lift: 22
Cases that regressed: 0
Skill version measured: v1
Run completed: 8/22/2026, 00:06 UTC

Measured example — same prompt, with vs. without the skill · from the benchmark run · case case-02

Prompt

We are creating a full blogging tool in our React app and want to integrate Plate.js for writing articles with headings, media, and list items. Please provide the terminal commands for adding the components via shadcn and generate the code for a full-featured content editor.

Without the skill loaded, the model failed this case. With it loaded, the same prompt on the same model passed. This is one improved case from the latest verified run; every case, including any that regressed, is in the table above.

Show both answers

SkillScore blends 4 signals1 of 4 complete

BenchmarkPass rate WITH skill on a verified run95

Live evalNeeds ≥20 evaluated traces in 30 days

AI ratingNeeds ≥10 rated traces

AdoptionNeeds ≥10 serves across ≥2 orgs in 30 days

Efficiency · separate axis (at equal correctness)+0% turns-4% tokens

Shown for transparency; not credited unless a verified run shows no correctness regression.

Backed by 1 of 4 signals — each added signal makes the score more robust.

Verified on gemini-3.6-flash · re-tested 7 days ago

Other measured skills in the registry, with their headline benchmark lift.