Curated AI prompts for iOS and Swift development tasks, helping developers write better code with guided prompting strategies.
200 skills
0
claude
bennypowers-cem
Standards-based toolkit for Web Components providing Custom Elements Manifests, dev server, LSP, and MCP integration for design systems and component libraries.
/
Plugin bennypowers-cem from marketplace cascade-code-languages-misc-1 in joshuarweaver/cascade-code-languages-misc-1. Commands read from the repo's manifest — 1 month ago.
What it installs
Skills (12)
a11y-reviewReview custom element HTML for accessibility issues. Use when the user asks to "review accessibility", "check a11y", "audit accessibility", "find accessibility issues", or mentions "WCAG", "screen reader", "keyboard navigation", or "ARIA" in the context of custom elements.
angularShow how to use custom elements in Angular, including required CUSTOM_ELEMENTS_SCHEMA configuration. Use when the user asks to "use in Angular", "Angular custom elements", "custom elements in Angular", "CUSTOM_ELEMENTS_SCHEMA", or mentions "Angular module", "standalone component", or "angular integr
cem-serveSet up cem serve for custom element development. Use when the user asks to "start dev server", "set up cem serve", "preview elements", "run demos", or needs help configuring the dev server, import maps, or CSS transforms.
composeSuggest and generate custom element compositions for a UI goal. Use when the user asks to "compose elements", "build a layout", "combine components", "create a page with", "what elements should I use for", or describes a UI they want to build using custom elements.
design-apiDesign a custom element's public API e.g. attributes, properties, events, slots, CSS parts and custom properties. Use when the user asks to "design an element", "plan a component API", "create element API", "design component interface", or discusses naming conventions, API surface, or element archit
docs-healthAudit custom element manifest documentation for completeness and quality. Use when the user asks to "check docs", "audit documentation", "review manifest quality", "find missing descriptions", "docs health", or mentions "undocumented" attributes, slots, events, or CSS properties.
gen-testsGenerate test scaffolding for custom elements using cem serve's chromeless demo UI with Playwright or Puppeteer. Use when the user asks to "generate tests", "scaffold tests", "create test boilerplate", "write tests for element", "playwright tests", "puppeteer tests", or mentions "test coverage" for
migrateIdentify breaking changes between custom element manifest versions and suggest migration steps. Use when the user asks to "migrate", "upgrade components", "find breaking changes", "compare manifests", "what changed between versions", or mentions "deprecation" or "migration guide".
reactShow how to use custom elements in React, including workarounds for React 18 vs 19 differences. Use when the user asks to "use in React", "React wrapper", "custom elements in React", "JSX custom element", or mentions "React 18", "React 19", or "react integration".
vueShow how to use custom elements in Vue, including required configuration for the Vue compiler. Use when the user asks to "use in Vue", "Vue custom elements", "custom elements in Vue", "isCustomElement", or mentions "Vue 3", "Vue 2", "Nuxt", or "vue integration".
write-demosWrite demo HTML files for custom elements that work with cem serve. Use when the user asks to "write a demo", "create a demo", "add a demo", "demo file", "demo page", or mentions "cem serve demos".
write-docsGenerate documentation for custom elements based on their manifest data. Use when the user asks to "write docs", "generate documentation", "document this element", "create API docs", or mentions "usage examples" or "component documentation".
More from joshuarweaver/cascade-code-languages-misc-1
All 150 plugins →Optimizes context usage and improves Claude integration performance. Targets React development workflows.
155 skills · 28 agents · 2 MCP servers
0
secondsky-claude-skills
claudeProduction-ready Claude Code skills for Cloudflare, React, Tailwind CSS v4, and AI integrations. Accelerates full-stack development with modern tooling.
182 skills
0
Skills pack for AI-driven macOS development, system automation, and Apple platform integration.
181 skills
0
Claude skill for building accessible, styled UI components with DaisyUI and Tailwind CSS. Accelerates frontend development with pre-built design system.
170 skills
0
Implement computer vision and image processing in iOS using Apple's Vision framework. Covers object detection, face recognition, and barcode scanning.
86 skills · 1 MCP server
0
Similar plugins
web-dev
claudeFull-stack web development with app scaffolding and page generation
2 commands
rohitg00/awesome-claude-code-toolkit 2,836
web-dev
claudeUse this agent for expert assistance with web development tasks using React, Next.js, NestJS, and other modern web frameworks with TypeScript and Tailwind CSS. This includes code analysis, component creation, debugging, performance optimization, and architectural decisions. Examples: <example>Context: User is building a Next.js app and encounters a routing issue. user: 'My dynamic routes in Next.js are not rendering correctly' assistant: 'Let me use the web-dev agent to analyze your Next.js routing setup and provide a solution' <commentary>This is a Next.js-specific routing issue, so the web-dev agent will provide targeted guidance.</commentary></example> <example>Context: User needs a reusable React component with Tailwind CSS. user: 'I need a card component that matches my app's Tailwind-based design system' assistant: 'I'll use the web-dev agent to create a TypeScript-based React card component styled with Tailwind CSS, following your app's design patterns' <commentary>The user requires a component that aligns with their Tailwind CSS design system, so the web-dev agent ensures compatibility.</commentary></example>
1 agent
ccplugins/awesome-claude-code-plugins 1,005
web-dev
claudeUse this agent for expert assistance with web development tasks using React, Next.js, NestJS, and other modern web frameworks with TypeScript and Tailwind CSS. This includes code analysis, component creation, debugging, performance optimization, and architectural decisions. Examples: <example>Context: User is building a Next.js app and encounters a routing issue. user: 'My dynamic routes in Next.js are not rendering correctly' assistant: 'Let me use the web-dev agent to analyze your Next.js routing setup and provide a solution' <commentary>This is a Next.js-specific routing issue, so the web-dev agent will provide targeted guidance.</commentary></example> <example>Context: User needs a reusable React component with Tailwind CSS. user: 'I need a card component that matches my app's Tailwind-based design system' assistant: 'I'll use the web-dev agent to create a TypeScript-based React card component styled with Tailwind CSS, following your app's design patterns' <commentary>The user requires a component that aligns with their Tailwind CSS design system, so the web-dev agent ensures compatibility.</commentary></example>
1 agent
ananddtyagi/cc-marketplace 688
agent-glance
claudeRender a three.ws agent card in the terminal or as README badge, SVG and embed snippets with the agent-glance CLI.
1 skill
nirholas/three.ws 278
nanotags-components
claudeSkill for writing idiomatic nanotags components (Custom Elements + nanostores): props, refs, effects, events, cleanup and the anti-patterns to avoid, plus references for the exact API, Astro integration and testing.
1 skill
psd-coder/nanotags 198
web-dev
claudeExpert web development assistance with React, Next.js, NestJS, TypeScript, and Tailwind CSS
1 agent
devsforge/marketplace 78
Maintain bennypowers-cem?
This page updates itself from your repo. Add the badge to your README, or get it Featured to pin it above the organic results with a followed link to your site.
claude & codex plugins150 plugins