스킬 wunderui-screen
📦
wunderui-screen
콘텐츠 리비전 r1 중간 위험 🌐 네트워크 접근📁 파일 시스템 접근⚙️ 외부 명령어🔑 환경 변수
Build React Screens with WunderUI
Generated screens often miss UI states, responsive layouts, and consistent design tokens. This skill guides WunderUI component selection, screen assembly, and validation within the selected plan.
지원: Claude Codex Code(CC)
내 에이전트로 설치
이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.
에이전트 요청
Review the Skillstore skill "wunderui-screen" from https://skillstore.io/skills/wunder-ui-wunderui-screen.md and its manifest at https://skillstore.io/api/skills/wunder-ui-wunderui-screen/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.
에이전트가 읽기 쉬운 리소스
AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.
테스트해 보기
"wunderui-screen" 사용 중입니다. Build a profile settings screen on the Free plan.
예상 결과:
- Illustrative result: a settings screen using free form and feedback components.
- Loading, empty, and error states are available through a development status control.
- The completion report identifies changed files, selected components, defaults, and validation results.
"wunderui-screen" 사용 중입니다. Create a Free-plan revenue overview without paid charts.
예상 결과:
- Illustrative result: metric cards, trend indicators, and progress bars replace chart regions.
- Loading placeholders, an empty overview, and retryable errors remain available.
- The report notes that paid charts and the full app shell require an appropriate paid plan.
보안 감사
중간 위험v1 • 2026. 10. 10. 버전별 보고서 열기
All 62 static findings are false positives involving documentation, JavaScript syntax, expected project reads, or public metadata requests. A semantic finding identifies plan enforcement that defaults to Pro and permits imports with unknown licensing metadata. No evidence found of malicious prompt injection, credential collection, or data exfiltration.
6
스캔된 파일
305
분석된 줄 수
0
검토 항목
0
오탐 무시됨
확인된 보안 우려 사항 (1)
중간
Plan Restrictions Fail Open
Missing plan configuration defaults to Pro, and Core is not restricted separately. Free checks accept unknown component tiers when design metadata is unavailable or incomplete.
The code restricts only Free and rejects only known Pro tiers, despite instructions to determine the user plan first. This permits licensing violations.
위험 요인
🌐 네트워크 접근 (5)
📁 파일 시스템 접근 (14)
references/layouts.md:7 scripts/screen.mjs:12 scripts/screen.mjs:17 scripts/screen.mjs:24 scripts/screen.mjs:119 scripts/screen.mjs:121 scripts/screen.mjs:124 scripts/screen.mjs:129 scripts/screen.mjs:131 scripts/screen.mjs:135 scripts/screen.mjs:136 scripts/screen.mjs:137 scripts/screen.mjs:141 scripts/screen.mjs:144
⚙️ 외부 명령어 (34)
scripts/screen.mjs:8 scripts/screen.mjs:25 scripts/screen.mjs:54 scripts/screen.mjs:57 scripts/screen.mjs:58 scripts/screen.mjs:60 scripts/screen.mjs:69 scripts/screen.mjs:71 scripts/screen.mjs:77 scripts/screen.mjs:89 scripts/screen.mjs:96 scripts/screen.mjs:97 scripts/screen.mjs:98-109 scripts/screen.mjs:109 scripts/screen.mjs:140 scripts/screen.mjs:143 SKILL.md:8 SKILL.md:11 SKILL.md:12 SKILL.md:13 SKILL.md:14 SKILL.md:16 SKILL.md:22 SKILL.md:28 SKILL.md:29 SKILL.md:30 SKILL.md:34 SKILL.md:40 SKILL.md:41 SKILL.md:42 SKILL.md:43 SKILL.md:44 SKILL.md:47 SKILL.md:50
🔑 환경 변수 (2)
감사자: codex
이 보고서 공유 및 인용
버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.
보고서 링크 복사
https://skillstore.io/skills/wunder-ui-wunderui-screen/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 배지
[](https://skillstore.io/skills/wunder-ui-wunderui-screen?utm_source=security_passport_badge)HTML 배지
<a href="https://skillstore.io/skills/wunder-ui-wunderui-screen?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/wunder-ui-wunderui-screen/security.svg" alt="Skillstore security assessment" loading="lazy"></a>임베드 카드
<iframe src="https://skillstore.io/embed/skills/wunder-ui-wunderui-screen.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>학술 인용 (APA · BibTeX · CFF)
APA 인용
wunder-ui. (2026). wunderui-screen security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/wunder-ui-wunderui-screen/audits/1BibTeX 인용
@techreport{wunder-ui-wunder-ui-wunderui-screen-2026,
author = {wunder-ui},
title = {wunderui-screen security audit report (audit version 1)},
institution = {Skillstore},
year = {2026},
number = {1},
url = {https://skillstore.io/skills/wunder-ui-wunderui-screen/audits/1},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "wunderui-screen security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
- name: "wunder-ui"
date-released: "2026-10-10"
url: "https://skillstore.io/skills/wunder-ui-wunderui-screen/audits/1"
identifiers:
- type: other
value: "skillstore:wunder-ui-wunderui-screen:audit:1"
description: "Skillstore immutable audit report identifier"
Skillstore 점수
이 점수의 이유 증거 신뢰도: 중간 68
아키텍처
85
유지보수성
87
콘텐츠
65
커뮤니티
83
사양 준수
만들 수 있는 것
Build Product Dashboards
Assemble a responsive dashboard with plan-appropriate metrics, data regions, actions, and reviewable loading, empty, and error states.
Prototype Settings Screens
Create a Free-plan settings screen using forms, feedback components, design tokens, and invented sample data.
Review Screen Consistency
Check existing screen files for token violations, deep imports, missing state indicators, and known paid components before project validation.
이 프롬프트를 사용해 보세요
Create a Simple Settings Screen
Build a WunderUI profile settings screen on the Free plan. Use invented data, design tokens, and loading, empty, and error states.
Build a Responsive Dashboard
Build a sales dashboard on my WunderUI Pro plan. Find matching blocks, verify component props, and add responsive layouts and reviewable UI states.
Adapt a Screen for Free
Adapt my analytics screen for WunderUI Free. Replace paid components with documented free alternatives, preserve UI states, and explain the lost functionality.
Audit and Validate a Screen
Review [screen files] for my confirmed WunderUI plan. Verify component signatures, tokens, motion, and every data region. Run checks, typecheck, and build.
모범 사례
- Confirm the plan explicitly and verify component entitlements before accepting suggestions or importing blocks.
- Read real component signatures and use design tokens before implementing each screen region.
- Review each UI state on mobile and desktop, then run source checks, typecheck, and build.
피하기
- Treating a successful regex check as proof of runtime correctness or license compliance.
- Copying paid component designs by hand to bypass plan restrictions.
- Using real personal data, guessed props, or hardcoded motion and color values in generated screens.
자주 묻는 질문
Which assistants can use this skill?
The skill supports Claude, Codex, and Claude Code in a React project that uses WunderUI.
What does the bundled helper do?
It searches component and block metadata, then checks specified source files for WunderUI conventions. The assistant performs screen implementation.
Can I use the Free plan?
Yes. Specify Free explicitly and use documented free alternatives. Verify entitlements manually because missing metadata can bypass the helper checks.
Does it need network access?
Block search retrieves a public registry index. Component metadata is read locally when available, otherwise it is fetched from the configured site.
Does it guarantee a working screen?
No. Its regex checks are limited. The workflow also calls for project typechecking, building, and manual review of responsive layouts and UI states.
Does it upload project source or credentials?
No evidence found of source or credential uploads in the bundled helper. Network requests retrieve metadata, and source checks read explicitly selected files.