·sileo-react-toasts
</>

sileo-react-toasts

React 앱의 Sileo(npm 패키지 "sileo") 토스트 알림에 대한 구현 지침을 제공합니다. 토스터 뷰포트를 추가하고, sileo.success/error/warning/info/show/action을 통해 전역 알림을 실행하고, sileo.promise를 사용하여 비동기 흐름을 처리하고, 알림을 해제/삭제하고, 위치/오프셋을 구성하고, 밝음/어두움/시스템 모드로 테마를 지정하고, 채우기, 스타일 재정의, 자동 조종, 원형율, CSS 변수 및 데이터 속성 선택기를 통해 스타일을 사용자 정의할 때 사용합니다. 또한 스와이프하여 닫기 동작, 사용자 정의 아이콘, JSX 설명, 모션 감소 지원, TypeScript 유형 내보내기 및 Sileo의 내부 SVG 끈끈한 모핑 아키텍처 이해를 위해 이 기술을 사용하세요. 사용자가 sileo, React의 토스트 알림, 끈끈한 토스트, 물리 기반 알림을 언급하거나 명시적으로 패키지 이름을 지정하지 않더라도 sileo를 사용하여 모든 종류의 토스트/알림 시스템을 추가하려고 할 때마다 이 기술을 사용해야 합니다.

19설치·0트렌드·@xoverlap

설치

$npx skills add https://github.com/xoverlap/sileo-skill --skill sileo-react-toasts

sileo-react-toasts 설치 방법

명령줄에서 sileo-react-toasts AI 스킬을 개발 환경에 빠르게 설치

  1. 터미널 열기: 터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다
  2. 설치 명령어 실행: 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/xoverlap/sileo-skill --skill sileo-react-toasts
  3. 설치 확인: 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다

출처: xoverlap/sileo-skill.

Official documentation: https://sileo.aaryan.design/docs API Reference: https://sileo.aaryan.design/docs/api Toaster API: https://sileo.aaryan.design/docs/api/toaster Styling Guide: https://sileo.aaryan.design/docs/styling Playground: https://sileo.aaryan.design/play GitHub: https://github.com/hiaaryan/sileo

Sileo is a tiny, opinionated, physics-based toast component for React. It uses gooey SVG morphing (via an feGaussianBlur + feColorMatrix filter chain) and spring animations (powered by motion/react, formerly Framer Motion) to create buttery-smooth notifications that look beautiful by default with zero configuration.

Sileo is not a general-purpose notification center. It is a highly polished, visually distinctive toast system designed for single-line feedback messages with optional expandable descriptions.

React 앱의 Sileo(npm 패키지 "sileo") 토스트 알림에 대한 구현 지침을 제공합니다. 토스터 뷰포트를 추가하고, sileo.success/error/warning/info/show/action을 통해 전역 알림을 실행하고, sileo.promise를 사용하여 비동기 흐름을 처리하고, 알림을 해제/삭제하고, 위치/오프셋을 구성하고, 밝음/어두움/시스템 모드로 테마를 지정하고, 채우기, 스타일 재정의, 자동 조종, 원형율, CSS 변수 및 데이터 속성 선택기를 통해 스타일을 사용자 정의할 때 사용합니다. 또한 스와이프하여 닫기 동작, 사용자 정의 아이콘, JSX 설명, 모션 감소 지원, TypeScript 유형 내보내기 및 Sileo의 내부 SVG 끈끈한 모핑 아키텍처 이해를 위해 이 기술을 사용하세요. 사용자가 sileo, React의 토스트 알림, 끈끈한 토스트, 물리 기반 알림을 언급하거나 명시적으로 패키지 이름을 지정하지 않더라도 sileo를 사용하여 모든 종류의 토스트/알림 시스템을 추가하려고 할 때마다 이 기술을 사용해야 합니다. 출처: xoverlap/sileo-skill.

인용 가능한 정보

AI/검색 인용용 안정적인 필드와 명령어.

설치 명령어
npx skills add https://github.com/xoverlap/sileo-skill --skill sileo-react-toasts
카테고리
</>개발 도구
인증됨
최초 등록
2026-03-07
업데이트
2026-03-10

Browse more skills from xoverlap/sileo-skill

빠른 답변

sileo-react-toasts이란?

React 앱의 Sileo(npm 패키지 "sileo") 토스트 알림에 대한 구현 지침을 제공합니다. 토스터 뷰포트를 추가하고, sileo.success/error/warning/info/show/action을 통해 전역 알림을 실행하고, sileo.promise를 사용하여 비동기 흐름을 처리하고, 알림을 해제/삭제하고, 위치/오프셋을 구성하고, 밝음/어두움/시스템 모드로 테마를 지정하고, 채우기, 스타일 재정의, 자동 조종, 원형율, CSS 변수 및 데이터 속성 선택기를 통해 스타일을 사용자 정의할 때 사용합니다. 또한 스와이프하여 닫기 동작, 사용자 정의 아이콘, JSX 설명, 모션 감소 지원, TypeScript 유형 내보내기 및 Sileo의 내부 SVG 끈끈한 모핑 아키텍처 이해를 위해 이 기술을 사용하세요. 사용자가 sileo, React의 토스트 알림, 끈끈한 토스트, 물리 기반 알림을 언급하거나 명시적으로 패키지 이름을 지정하지 않더라도 sileo를 사용하여 모든 종류의 토스트/알림 시스템을 추가하려고 할 때마다 이 기술을 사용해야 합니다. 출처: xoverlap/sileo-skill.

sileo-react-toasts 설치 방법은?

터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/xoverlap/sileo-skill --skill sileo-react-toasts 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다

소스 저장소는 어디인가요?

https://github.com/xoverlap/sileo-skill

상세

카테고리
</>개발 도구
출처
skills.sh
최초 등록
2026-03-07

관련 Skills

없음