@ygor-ui/presets
Version:
Panda CSS presets for Ark UI components
36 lines (34 loc) • 739 B
text/typescript
import { toastAnatomy } from '@ark-ui/react'
import { defineSlotRecipe } from '@pandacss/dev'
export const toast = defineSlotRecipe({
className: 'toast',
description: 'A toast style',
slots: toastAnatomy.keys(),
base: {
root: {
background: 'bg.default',
borderRadius: 'l3',
borderWidth: '1px',
boxShadow: 'lg',
minWidth: 'xs',
p: '4',
_open: {
animation: 'slideInFromBottom 0.2s ease-out',
},
_closed: {
animation: 'slideOutFromBottom 0.2s ease-out',
},
},
group: {
p: '4',
},
title: {
fontWeight: 'semibold',
textStyle: 'sm',
},
description: {
color: 'fg.muted',
textStyle: 'sm',
},
},
})