feat: add custom icon support with container styling for toast notifications #104
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Define Icons by Toast Type: You can now provide custom icons for specific toast types directly through the toast options. This allows for more granular control over the appearance of your notifications.
successIcon
errorIcon
loadingIcon
Example:
jsx
toast.success('Successfully saved!', {
successIcon: '🎉',
});
toast.error('Something went wrong.', {
errorIcon: '🔥',
});
Custom Icon Container Style: A new iconContainerStyle option has been added to allow for custom styling of the icon's container using a CSS properties object. Example:
jsx
toast.success('Custom styled icon!', {
iconContainerStyle: {
border: '2px solid green',
padding: '2px'
}
});
Changes
Updated
ToastOptions
in
src/types/toast.ts
to include the new icon properties.
Modified
ToastBar.tsx
to handle and render the new type-specific icons.
Updated
README.md
to document the new features.