[PR #27] [CLOSED] feat: add optional Sonner-compatible API wrapper #29

New issue

Closed

opened 2026-03-02 05:16:38 +03:00 by kerem · 0 comments

kerem commented

2026-03-02 05:16:38 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/hiaaryan/sileo/pull/27
Author: @lubauss
Created: 2/21/2026
Status: ❌ Closed

Base: main ← Head: feat/sonner-compat

📝 Commits (1)

064e9c4 feat: add optional Sonner-compatible API wrapper

📊 Changes

2 files changed (+60 additions, -0 deletions)

View changed files

➕ src/compat.ts (+58 -0)
📝 src/index.ts (+2 -0)

📄 Description

Summary

Add an optional toast export that provides a Sonner-compatible API, making migration from Sonner to Sileo a simple import change.

Problem

Sileo uses a different API shape than Sonner:

// Sonner
toast.success('Saved!', { description: 'Your changes were saved.' })

// Sileo
sileo.success({ title: 'Saved!', description: 'Your changes were saved.' })

Projects migrating from Sonner need to rewrite every toast call.

Solution

New src/compat.ts providing a callable toast with method variants:

import { toast } from 'sileo';

// Direct call (like Sonner's default)
toast('Hello');

// Typed calls
toast.success('Saved!', { description: 'Changes saved.' });
toast.error('Failed', { duration: 5000 });
toast.warning('Careful', { action: { label: 'Undo', onClick: undo } });

// Also available
toast.dismiss(id);
toast.promise(asyncFn, { loading, success, error });

Option Mapping

Sonner	Sileo
First arg (string)	`title`
`opts.description`	`description`
`opts.duration`	`duration` (`Infinity` → `null` for sticky toasts)
`opts.action.label` / `onClick`	`button.title` / `onClick`
`opts.id`	`id`

Files Changed

File	Changes
`src/compat.ts`	New file — Sonner-compatible API wrapper
`src/index.ts`	Export `toast` from compat, export `SileoToasterProps` type

Backward Compatibility

Additive only — no changes to existing sileo API
toast is a new named export alongside the existing sileo export
Projects not using Sonner can ignore this entirely

Testing

import { toast } from 'sileo';

toast.success('It works!');
toast.error('Oops', { description: 'Something broke', duration: 8000 });
toast('Plain notification');

Note: This could alternatively live in a separate sileo-compat package if you prefer to keep the core package minimal. Happy to adjust the approach.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/hiaaryan/sileo/pull/27 **Author:** [@lubauss](https://github.com/lubauss) **Created:** 2/21/2026 **Status:** ❌ Closed **Base:** `main` ← **Head:** `feat/sonner-compat` --- ### 📝 Commits (1) - [`064e9c4`](https://github.com/hiaaryan/sileo/commit/064e9c4104fab6ca6a2e8d5a0857c1e77c7e3263) feat: add optional Sonner-compatible API wrapper ### 📊 Changes **2 files changed** (+60 additions, -0 deletions) <details> <summary>View changed files</summary> ➕ `src/compat.ts` (+58 -0) 📝 `src/index.ts` (+2 -0) </details> ### 📄 Description ## Summary Add an optional `toast` export that provides a Sonner-compatible API, making migration from Sonner to Sileo a simple import change. ## Problem Sileo uses a different API shape than Sonner: ```ts // Sonner toast.success('Saved!', { description: 'Your changes were saved.' }) // Sileo sileo.success({ title: 'Saved!', description: 'Your changes were saved.' }) ``` Projects migrating from Sonner need to rewrite every toast call. ## Solution New `src/compat.ts` providing a callable `toast` with method variants: ```ts import { toast } from 'sileo'; // Direct call (like Sonner's default) toast('Hello'); // Typed calls toast.success('Saved!', { description: 'Changes saved.' }); toast.error('Failed', { duration: 5000 }); toast.warning('Careful', { action: { label: 'Undo', onClick: undo } }); // Also available toast.dismiss(id); toast.promise(asyncFn, { loading, success, error }); ``` ### Option Mapping | Sonner | Sileo | |--------|-------| | First arg (string) | `title` | | `opts.description` | `description` | | `opts.duration` | `duration` (`Infinity` → `null` for sticky toasts) | | `opts.action.label` / `onClick` | `button.title` / `onClick` | | `opts.id` | `id` | ## Files Changed | File | Changes | |------|---------| | `src/compat.ts` | New file — Sonner-compatible API wrapper | | `src/index.ts` | Export `toast` from compat, export `SileoToasterProps` type | ## Backward Compatibility - Additive only — no changes to existing `sileo` API - `toast` is a new named export alongside the existing `sileo` export - Projects not using Sonner can ignore this entirely ## Testing ```ts import { toast } from 'sileo'; toast.success('It works!'); toast.error('Oops', { description: 'Something broke', duration: 8000 }); toast('Plain notification'); ``` --- > **Note:** This could alternatively live in a separate `sileo-compat` package if you prefer to keep the core package minimal. Happy to adjust the approach. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>