import { a as a$1 } from './chunk-BZFPT54B.js';
import { a } from './chunk-TWGPE4V7.js';
import { cx } from '@onbeam/styled-system/css';
import { CloseIcon } from '@onbeam/icons';
import { notification, noiseBackground, gridBackground } from '@onbeam/styled-system/recipes';
import { jsx, jsxs } from 'react/jsx-runtime';

var f=a(({as:N="div",icon:t,title:a,description:s,onClose:n,className:l,children:d,...b},v)=>{let o=notification(),c=!!n;return jsx(N,{ref:v,className:cx(noiseBackground(),o.root,l),...b,children:jsxs("div",{className:cx(gridBackground(),o.inner),children:[t&&jsx(a$1,{className:o.icon,size:24,children:t}),jsxs("div",{className:o.content,children:[a&&jsx("span",{className:o.title,"data-closable":c,children:a}),s&&jsx("span",{className:o.description,children:s}),d]}),c&&jsx("button",{type:"button",className:o.close,onClick:n,children:jsx(CloseIcon,{height:16,width:16})})]})})});f.displayName="Notification";

export { f as a };
//# sourceMappingURL=out.js.map
//# sourceMappingURL=chunk-T6WQZS4M.js.map