스킬 ask-sonner

📦

ask-sonner

Name: ask-sonner
Author: emilkowalski

콘텐츠 리비전 r1 안전 ⚙️ 외부 명령어🌐 네트워크 접근

Build Reliable Sonner Toasts

Sonner integrations can fail through duplicate toasters, server-side calls, styling conflicts, or incorrect promise handling. This skill provides focused setup, API, styling, and troubleshooting guidance.

지원: Claude Codex Code(CC)

🥉 77 브론즈

Maintain this Skill? Claim it 🥉 77 브론즈

내 에이전트로 설치

이 요청을 에이전트에 복사하세요. 공식 Skill 페이지와 매니페스트가 포함되어 있습니다.

에이전트 요청

Review the Skillstore skill "ask-sonner" from https://skillstore.io/skills/emilkowalski-ask-sonner.md and its manifest at https://skillstore.io/api/skills/emilkowalski-ask-sonner/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

에이전트는 계속해서 계획을 표시하고 보안 정책에서 요구하는 확인을 요청해야 합니다.

에이전트가 읽기 쉬운 리소스

AI 에이전트, 크롤러, 스크립트가 전체 페이지 대신 정리된 컨텍스트만 필요할 때 이 링크를 사용하세요.

Markdown 상세 GET /skills/emilkowalski-ask-sonner.md 서명된 manifest GET /api/skills/emilkowalski-ask-sonner/manifest 서명된 lockfile GET /api/skills/emilkowalski-ask-sonner/lockfile

테스트해 보기

"ask-sonner" 사용 중입니다. My toast appears twice in development.

예상 결과:

Check for multiple mounted Toasters first. If only one exists, move the toast call from a StrictMode effect into the event handler.

"ask-sonner" 사용 중입니다. My promise toast never leaves the loading state.

예상 결과:

Confirm that the first argument is a promise or returns one. Then verify that the underlying operation resolves or rejects.

"ask-sonner" 사용 중입니다. Tailwind classes do not change the toast colors.

예상 결과:

Sonner default styles may win the cascade. Use important utilities for small changes, or choose unstyled or custom rendering for broader control.

보안 감사

안전

v1 • 2026. 8. 11. 버전별 보고서 열기

All 45 static findings are false positives caused by Markdown syntax, React and Sonner API examples, and one documentation link. The skill is documentation-only and contains no command execution, system reconnaissance, prompt injection, or suspicious network behavior.

스캔된 파일

146

분석된 줄 수

검토 항목

오탐 무시됨

가장 최근에 완료된 정적·의미론적 감사에서 확인된 보안 발견 사항이 감지되지 않았습니다. 이는 스킬에 부작용이 없음을 증명하지 않습니다.

감사자: codex

이 보고서 공유 및 인용

버전이 지정된 평가 보고서, 중립 배지, 임베드 카드 및 인용을 공유하세요. Skillstore는 근거를 보고하지만 이 Skill의 안전 여부를 판단하지 않습니다.

버전별 보고서 열기

보고서 링크 복사

https://skillstore.io/skills/emilkowalski-ask-sonner/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Markdown 배지

[![Skillstore security assessment](https://skillstore.io/badges/skills/emilkowalski-ask-sonner/security.svg)](https://skillstore.io/skills/emilkowalski-ask-sonner?utm_source=security_passport_badge)

HTML 배지

<a href="https://skillstore.io/skills/emilkowalski-ask-sonner?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/emilkowalski-ask-sonner/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

임베드 카드

<iframe src="https://skillstore.io/embed/skills/emilkowalski-ask-sonner.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 인용

emilkowalski. (2026). ask-sonner security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/emilkowalski-ask-sonner/audits/1

BibTeX 인용

@techreport{emilkowalski-emilkowalski-ask-sonner-2026,
  author = {emilkowalski},
  title = {ask-sonner security audit report (audit version 1)},
  institution = {Skillstore},
  year = {2026},
  number = {1},
  url = {https://skillstore.io/skills/emilkowalski-ask-sonner/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: "ask-sonner security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
  - name: "emilkowalski"
date-released: "2026-08-11"
url: "https://skillstore.io/skills/emilkowalski-ask-sonner/audits/1"
identifiers:
  - type: other
    value: "skillstore:emilkowalski-ask-sonner:audit:1"
    description: "Skillstore immutable audit report identifier"

Skillstore 점수

이 점수의 이유 증거 신뢰도: 중간

아키텍처

유지보수성

콘텐츠

커뮤니티

사양 준수

만들 수 있는 것

Add Toasts to a React Application

Configure the Toaster and choose the correct toast method for common user feedback.

Standardize Product Notifications

Create consistent toast behavior, styling, actions, icons, and themes across a product.

Resolve Sonner Display Problems

Trace missing, duplicated, unstyled, hidden, persistent, or incorrectly targeted notifications.

이 프롬프트를 사용해 보세요

Basic Setup

Show me how to add Sonner to my React application with one Toaster and a success toast.

Promise Feedback

Convert this asynchronous save flow to toast.promise with clear loading, success, and error messages: [describe flow].

Custom Styling

Recommend the simplest Sonner styling approach for these design requirements: [requirements]. Include theme and icon configuration.

Systematic Diagnosis

Diagnose this Sonner issue using my component placement, call site, framework, styles, and observed behavior: [context]. Prioritize likely causes.

모범 사례

Mount one Toaster near the application root.
Trigger toast calls from client events, effects, or callbacks.
Use stable identifiers when updating an existing toast.

피하기

Do not mount a Toaster on every page or conditionally.
Do not call toast directly inside server actions.
Do not layer many important CSS overrides when custom rendering is clearer.

자주 묻는 질문

Does Sonner require a provider?

No. Mount one Toaster and import the toast function where client code needs it.

Can toast be called from a server action?

No. Return the action result and call toast from the client code that receives it.

How do I update a loading toast?

Store the returned toast identifier, then call another toast method with that same identifier.

How do I support dark mode?

Set the Toaster theme to system or pass the resolved value from your theme provider.

Why does one toast appear in every Toaster?

Assign each Toaster an identifier and pass the matching toasterId with the toast call.

When should I use custom rendering?

Use custom rendering when a design system needs complete visual control while retaining Sonner behavior.

개발자 세부 정보

작성자

emilkowalski

라이선스

MIT

Skillstore 리비전

버전 안내

작성자가 버전을 선언하지 않았습니다.

리포지토리

https://github.com/emilkowalski/skills/tree/78761e1b57f97dce65b983d640c70a68f39e8163/skills/ask-sonner

참조

c40485c25b35e0203cf615647a1fd81ad7a69ea8

유지보수 최신성

2026. 8. 11.

사용량

0 다운로드 · 0 조회

파일 구조

📄 API.md

📄 SKILL.md

ask-sonner

내 에이전트로 설치

에이전트가 읽기 쉬운 리소스

테스트해 보기

보안 감사

위험 요인

보고서 링크 복사

Markdown 배지

HTML 배지

임베드 카드

APA 인용

BibTeX 인용

CITATION.cff

Skillstore 점수

만들 수 있는 것

Add Toasts to a React Application

Standardize Product Notifications

Resolve Sonner Display Problems

이 프롬프트를 사용해 보세요

모범 사례

피하기

자주 묻는 질문

개발자 세부 정보