[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"extension-skill-sergiodxa-frontend-accessibility-best-practices-ko":3,"guides-for-sergiodxa-frontend-accessibility-best-practices":222,"similar-k178rsac22w2zxz8xe6b95swr5866tw1":223},{"_creationTime":4,"_id":5,"children":6,"community":7,"display":9,"evaluation":23,"identity":188,"isFallback":193,"parentExtension":194,"providers":195,"relations":200,"repo":202,"workflow":219},1778053269518.5876,"k178rsac22w2zxz8xe6b95swr5866tw1",[],{"reviewCount":8},0,{"description":10,"installMethods":11,"name":12,"sourceUrl":13,"tags":14},"Accessibility (a11y) best practices for React components. Use when creating UI components, forms, interactive elements, or reviewing code for accessibility compliance.",{},"Frontend Accessibility Best Practices","https://github.com/sergiodxa/agent-skills/tree/HEAD/skills/frontend-accessibility-best-practices",[15,16,17,18,19,20,21,22],"react","accessibility","a11y","frontend","best-practices","wcag","code-review","ui-components",{"_creationTime":24,"_id":25,"extensionId":5,"locale":26,"result":27,"trustSignals":177,"workflow":186},1778053306113.567,"kn7bdz2hj7kx9rs4r3eg8qxd5d867k3f","en",{"checks":28,"evaluatedAt":167,"extensionSummary":168,"promptVersionExtension":169,"promptVersionScoring":170,"rationale":171,"score":172,"summary":173,"tags":174,"targetMarket":175,"tier":176},[29,34,37,40,44,47,51,56,59,62,66,71,74,78,81,84,87,90,93,96,100,104,108,112,116,119,122,125,129,132,135,138,141,144,148,151,154,157,160,164],{"category":30,"check":31,"severity":32,"summary":33},"Practical Utility","Problem relevance","pass","The displayed description clearly states the problem of applying accessibility best practices to React components, specifying use cases like creating UI components, forms, interactive elements, and code review.",{"category":30,"check":35,"severity":32,"summary":36},"Unique selling proposition","The extension provides specific rules and code examples for accessibility best practices in React, going beyond basic LLM behavior by offering a structured, actionable guide.",{"category":30,"check":38,"severity":32,"summary":39},"Production readiness","The bundled rules and code examples cover the full lifecycle of applying accessibility best practices, from component creation to code review, making it ready for workflow integration.",{"category":41,"check":42,"severity":32,"summary":43},"Scope","Single responsibility principle","The extension focuses solely on accessibility best practices for React components, adhering to a single, well-defined domain without introducing unrelated capabilities.",{"category":41,"check":45,"severity":32,"summary":46},"Description quality","The displayed description is concise, readable, and accurately reflects the extension's purpose and use cases.",{"category":48,"check":49,"severity":32,"summary":50},"Invocation","Scoped tools","The extension uses specific, narrowly defined rules and checks (e.g., 'semantic-html-landmarks', 'aria-live-regions') rather than a single generalist tool.",{"category":52,"check":53,"severity":54,"summary":55},"Documentation","Configuration & parameter reference","not_applicable","This extension does not appear to have configurable parameters or explicit configuration files that require documentation.",{"category":41,"check":57,"severity":32,"summary":58},"Tool naming","The rules are named descriptively (e.g., 'semantic-html-landmarks', 'keyboard-navigation') and follow a clear convention.",{"category":41,"check":60,"severity":32,"summary":61},"Minimal I/O surface","The rules and examples provided focus on best practices and code snippets, with no indication of excessive or unnecessary input/output.",{"category":63,"check":64,"severity":32,"summary":65},"License","License usability","The extension is licensed under the MIT license, which is a permissive open-source license.",{"category":67,"check":68,"severity":69,"summary":70},"Maintenance","Commit recency","warning","No commits were found in the last 12 months, indicating the extension may be unmaintained.",{"category":67,"check":72,"severity":54,"summary":73},"Dependency Management","No third-party dependencies are explicitly managed or declared, making this check not applicable.",{"category":75,"check":76,"severity":54,"summary":77},"Security","Secret Management","The extension deals with code best practices and does not handle secrets, making this check not applicable.",{"category":75,"check":79,"severity":32,"summary":80},"Injection","The extension provides best practices and code examples; it does not load or execute untrusted third-party data or instructions.",{"category":75,"check":82,"severity":32,"summary":83},"Transitive Supply-Chain Grenades","All content appears to be contained within the skill's directory, and there are no indications of runtime downloads or remote script execution.",{"category":75,"check":85,"severity":32,"summary":86},"Sandbox Isolation","The extension focuses on code practices and does not perform file system operations outside its scope.",{"category":75,"check":88,"severity":32,"summary":89},"Sandbox escape primitives","No detached-process spawns or deny-retry loops were detected in the provided code examples.",{"category":75,"check":91,"severity":32,"summary":92},"Data Exfiltration","The extension deals with code best practices and does not make outbound calls or handle confidential data.",{"category":75,"check":94,"severity":32,"summary":95},"Hidden Text Tricks","The bundled content is free of hidden-steering tricks, with clean printable ASCII and expected Unicode.",{"category":97,"check":98,"severity":32,"summary":99},"Hooks","Opaque code execution","The bundled code examples are plain, readable source code, with no obfuscation, base64 payloads, or runtime fetches.",{"category":101,"check":102,"severity":32,"summary":103},"Portability","Structural Assumption","The skill provides code snippets and examples that do not make structural assumptions about the user's project organization.",{"category":105,"check":106,"severity":54,"summary":107},"Trust","Issues Attention","No issue data was available from the trust signals, making this check not applicable.",{"category":109,"check":110,"severity":69,"summary":111},"Versioning","Release Management","No version information is present in the manifest files (SKILL.md, package.json) or via GitHub releases/CHANGELOG, and install instructions reference 'main'.",{"category":113,"check":114,"severity":54,"summary":115},"Code Execution","Validation","This extension provides code examples and best practices rather than executable code that requires input validation.",{"category":75,"check":117,"severity":54,"summary":118},"Unguarded Destructive Operations","The extension focuses on best practices and code examples, with no destructive operations present.",{"category":113,"check":120,"severity":54,"summary":121},"Error Handling","This extension provides best practices and code examples, not executable scripts with error handling logic.",{"category":113,"check":123,"severity":54,"summary":124},"Logging","The extension provides code examples and best practices, not executable code that requires logging.",{"category":126,"check":127,"severity":54,"summary":128},"Compliance","GDPR","The extension deals with code practices and does not operate on personal data.",{"category":126,"check":130,"severity":32,"summary":131},"Target market","The extension provides general React accessibility best practices applicable globally, with no regional limitations detected.",{"category":101,"check":133,"severity":32,"summary":134},"Runtime stability","The code examples are standard React/TypeScript and do not make assumptions about specific shells, OS, or Claude Code runtime beyond standard JS environments.",{"category":48,"check":136,"severity":32,"summary":137},"Precise Purpose","The description clearly states the purpose (accessibility best practices for React components) and when to use it (creating UI components, reviewing code).",{"category":48,"check":139,"severity":32,"summary":140},"Concise Frontmatter","The frontmatter is concise and effectively summarizes the extension's core capability and use cases.",{"category":52,"check":142,"severity":32,"summary":143},"Concise Body","The skill body is well-structured, under 500 lines, and delegates deeper material to separate rule files.",{"category":145,"check":146,"severity":32,"summary":147},"Context","Progressive Disclosure","The main SKILL.md outlines the flow and links into separate rule files for detailed explanations.",{"category":145,"check":149,"severity":54,"summary":150},"Forked exploration","The skill's nature as a rule-based guide does not involve deep exploration, making 'fork' context not applicable.",{"category":30,"check":152,"severity":32,"summary":153},"Usage examples","Sufficient end-to-end examples are provided for each major capability, demonstrating input, invocation, and observable outcomes.",{"category":30,"check":155,"severity":32,"summary":156},"Edge cases","The rule files document failure modes (e.g., bad patterns, non-semantic elements) and offer recovery steps or best practices.",{"category":113,"check":158,"severity":54,"summary":159},"Tool Fallback","The extension does not rely on external tools like MCP servers, making tool fallback checks not applicable.",{"category":161,"check":162,"severity":32,"summary":163},"Safety","Halt on unexpected state","The provided rules and examples implicitly guide users to halt or correct unexpected states by outlining correct patterns and bad practices.",{"category":101,"check":165,"severity":32,"summary":166},"Cross-skill coupling","The skill is self-contained, focusing on React accessibility and does not implicitly rely on or handle tasks belonging to other skills.",1778053282442,"This skill provides a structured set of rules and code examples to improve the accessibility of React UI components. It covers semantic HTML, screen reader support, keyboard navigation, and user preferences, guiding developers to build more inclusive applications according to WCAG standards.","2.0.0","3.4.0","The extension is well-documented, provides clear and actionable examples, and adheres to best practices. The primary concerns are the lack of recent commits and absence of versioning, which lowers the score from perfect but does not detract from its overall utility and quality.",85,"This extension provides comprehensive accessibility best practices for React components, offering clear rules, code examples, and guidance for developers.",[15,16,17,18,19,20,21,22],"global","verified",{"codeQuality":178,"collectedAt":179,"documentation":180,"maintenance":182,"security":183,"testCoverage":185},{},1778053272957,{"descriptionLength":181,"readmeSize":8},167,{},{"hasNpmPackage":184,"smitheryVerified":184},false,{"hasCi":184,"hasTests":184},{"updatedAt":187},1778053306113,{"githubOwner":189,"githubRepo":190,"locale":26,"slug":191,"type":192},"sergiodxa","agent-skills","frontend-accessibility-best-practices","skill",true,null,{"extract":196,"llm":199},{"commitSha":197,"license":198},"40e21b46189d5c7de6610b68a25280af863f8775","MIT",{"promptVersionExtension":169,"promptVersionScoring":170,"score":172,"targetMarket":175,"tier":176},{"repoId":201},"kd73wtzzjgc8jttgs0x15sp8s9865fzg",{"_creationTime":203,"_id":201,"identity":204,"providers":206,"workflow":216},1777995558409.903,{"githubOwner":189,"githubRepo":190,"sourceUrl":205},"https://github.com/sergiodxa/agent-skills",{"discover":207,"github":210},{"sources":208},[209],"skills-sh",{"closedIssues90d":8,"forks":211,"license":198,"openIssues90d":8,"pushedAt":212,"readmeSize":213,"stars":214,"topics":215},9,1769934384000,156,83,[],{"discoverAt":217,"extractAt":218,"githubAt":218,"updatedAt":218},1777995558409,1778053271306,{"anyEnrichmentAt":220,"extractAt":221,"githubAt":220,"llmAt":187,"updatedAt":187},1778053270043,1778053269518,[],[224,259,283,307,328,347],{"_creationTime":225,"_id":226,"community":227,"display":228,"identity":245,"providers":248,"relations":253,"workflow":255},1778053622473.6697,"k171f477n3e7072bp8naebmft986757y",{"reviewCount":8},{"description":229,"installMethods":230,"name":231,"sourceUrl":232,"tags":233},"Create distinctive, production-grade frontend interfaces with high design quality. Provides analysis tools for auditing existing designs and generation tools for creating color palettes, typography systems, design tokens, and component templates. Supports React, Vue, Svelte, and vanilla HTML/CSS. Use when building web components, pages, or applications. Keywords: design, UI, frontend, CSS, components, palette, typography, tokens, accessibility.",{},"Frontend Design","https://github.com/jwynia/agent-skills/tree/HEAD/skills/tech/frontend/design/frontend-design",[234,235,18,236,237,238,239,240,16,15,241,242,243,244],"design","ui","css","components","palette","typography","tokens","vue","svelte","html","deno",{"githubOwner":246,"githubRepo":190,"locale":26,"slug":247,"type":192},"jwynia","frontend-design",{"extract":249,"llm":251},{"commitSha":250,"license":198},"e02ec7e226a6e4f8419fd3b88a1d8e472d421b32",{"promptVersionExtension":169,"promptVersionScoring":170,"score":252,"targetMarket":175,"tier":176},99,{"repoId":254},"kd7efn3mprpa8rd8vm5hw5ebzx864fph",{"anyEnrichmentAt":256,"extractAt":257,"githubAt":256,"llmAt":258,"updatedAt":258},1778053625386,1778053622473,1778054012696,{"_creationTime":260,"_id":261,"community":262,"display":263,"identity":270,"providers":272,"relations":277,"workflow":279},1778054425877.205,"k1788s1zmn7ntdbw621xdwznvx8664ht",{"reviewCount":8},{"description":264,"installMethods":265,"name":266,"sourceUrl":267,"tags":268},"Brand checking of React Elements.",{},"react-is","https://github.com/facebook/react/tree/HEAD/packages/react-is",[15,269,18,235],"javascript",{"githubOwner":271,"githubRepo":15,"locale":26,"slug":266,"type":192},"facebook",{"extract":273,"llm":275},{"commitSha":274,"license":198},"9635257c1b557acc81f95b1e974a54c752e703a2",{"promptVersionExtension":169,"promptVersionScoring":170,"score":276,"targetMarket":175,"tier":176},98,{"repoId":278},"kd73v9dy7vwq94hgzc7eh43b9s865rhq",{"anyEnrichmentAt":280,"extractAt":281,"githubAt":280,"llmAt":282,"updatedAt":282},1778054428301,1778054425877,1778054588390,{"_creationTime":284,"_id":285,"community":286,"display":287,"identity":293,"providers":296,"relations":301,"workflow":303},1778053100136.2432,"k172mxtfqpq8byws1fyd2va1018674xt",{"reviewCount":8},{"description":288,"installMethods":289,"name":231,"sourceUrl":290,"tags":291},"Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, artifacts, posters, or applications (examples include websites, landing pages, dashboards, React components, HTML/CSS layouts, or when styling/beautifying any web UI). Generates creative, polished code and UI design that avoids generic AI aesthetics.",{},"https://github.com/bytedance/deer-flow/tree/HEAD/skills/public/frontend-design",[18,234,235,292,243,236,15,241],"web-components",{"githubOwner":294,"githubRepo":295,"locale":26,"slug":247,"type":192},"bytedance","deer-flow",{"extract":297,"llm":300},{"commitSha":298,"license":299},"1336872b15c25d45ebcb7c1cf72369c2bdd53187","MIT-0",{"promptVersionExtension":169,"promptVersionScoring":170,"score":276,"targetMarket":175,"tier":176},{"repoId":302},"kd789sm7egx1h0t1jag6zzhcq98656wv",{"anyEnrichmentAt":304,"extractAt":305,"githubAt":304,"llmAt":306,"updatedAt":306},1778053101076,1778053100136,1778053169012,{"_creationTime":308,"_id":309,"community":310,"display":311,"identity":321,"providers":323,"relations":326,"workflow":327},1778053269518.59,"k1735q99n2jwhd044ytk55bcyn8678g9",{"reviewCount":8},{"description":312,"installMethods":313,"name":314,"sourceUrl":315,"tags":316},"React Router performance and architecture patterns. Use when writing loaders, actions, forms, routes, or working with React Router data fetching. Triggers on tasks involving React Router routes, data loading, form handling, or route organization.",{},"React Router Best Practices","https://github.com/sergiodxa/agent-skills/tree/HEAD/skills/frontend-react-router-best-practices",[317,18,318,319,320,19],"react-router","performance","architecture","typescript",{"githubOwner":189,"githubRepo":190,"locale":26,"slug":322,"type":192},"frontend-react-router-best-practices",{"extract":324,"llm":325},{"commitSha":197,"license":198},{"promptVersionExtension":169,"promptVersionScoring":170,"score":276,"targetMarket":175,"tier":176},{"repoId":201},{"anyEnrichmentAt":220,"extractAt":221,"githubAt":220,"llmAt":187,"updatedAt":187},{"_creationTime":329,"_id":330,"community":331,"display":332,"identity":340,"providers":341,"relations":345,"workflow":346},1778054425877.2017,"k1780wrg9mxv8ct14n4s6napqx867dr5",{"reviewCount":8},{"description":333,"installMethods":334,"name":335,"sourceUrl":336,"tags":337},"Embed react-devtools within a website",{},"react-devtools-inline","https://github.com/facebook/react/tree/HEAD/packages/react-devtools-inline",[15,338,339,18],"devtools","debugging",{"githubOwner":271,"githubRepo":15,"locale":26,"slug":335,"type":192},{"extract":342,"llm":343},{"commitSha":274,"license":198},{"promptVersionExtension":169,"promptVersionScoring":170,"score":344,"targetMarket":175,"tier":176},97,{"repoId":278},{"anyEnrichmentAt":280,"extractAt":281,"githubAt":280,"llmAt":282,"updatedAt":282},{"_creationTime":348,"_id":349,"community":350,"display":351,"identity":358,"providers":362,"relations":367,"workflow":369},1778053038365.4285,"k17bkkf71rqak85n36k4z7r13h8662kk",{"reviewCount":8},{"description":352,"installMethods":353,"name":354,"sourceUrl":355,"tags":356},"Proactively apply when creating design systems, component libraries, or any frontend application. Triggers on CSS Grid, Subgrid, Flexbox, Container Queries, :has(), @layer, @scope, CSS nesting, @property, @function, if(), oklch, color-mix, light-dark, relative color, @starting-style, scroll-driven animations, view transitions, anchor positioning, popover, customizable select, content-visibility, logical properties, text-wrap, interpolate-size, clamp, field-sizing, modern CSS, CSS architecture, responsive design, dark mode, theming, design tokens, cascade layers. Use when writing CSS for any web project, choosing layout approaches, building responsive components, implementing dark mode or theming, creating animations or transitions, styling form elements, or modernizing legacy stylesheets. Modern CSS features and best practices for building interfaces with pure native CSS.",{},"Modern CSS","https://github.com/ccheney/robust-skills/tree/HEAD/skills/modern-css",[236,18,235,357,318,16],"design-systems",{"githubOwner":359,"githubRepo":360,"locale":26,"slug":361,"type":192},"ccheney","robust-skills","modern-css",{"extract":363,"llm":365},{"commitSha":364,"license":198},"85e5e2698d9753fb690666ccd59598e8a0b6f004",{"promptVersionExtension":169,"promptVersionScoring":170,"score":366,"targetMarket":175,"tier":176},96,{"repoId":368},"kd75qepasjckthmb72881rzdj58655g4",{"anyEnrichmentAt":370,"extractAt":371,"githubAt":370,"llmAt":372,"updatedAt":372},1778053039088,1778053038365,1778053066880]