refactor(CToaster): remove utility class from component

mrholek · mrholek · commit e68605e77e82 · 2023-11-08T14:51:42.000+01:00
diff --git a/packages/coreui-react/src/components/toast/CToaster.tsx b/packages/coreui-react/src/components/toast/CToaster.tsx
@@ -57,7 +57,7 @@ export const CToaster = forwardRef<HTMLDivElement, CToasterProps>(
         {toasts.length > 0 || children ? (
           <div
             className={classNames(
-              'toaster toast-container p-3',
+              'toaster toast-container',
               {
                 'position-fixed': placement,
                 'top-0': placement && placement.includes('top'),
diff --git a/packages/docs/content/components/toast.mdx b/packages/docs/content/components/toast.mdx
@@ -82,7 +82,7 @@ export const BasicExample = () => {
   return (
     <>
       <CButton onClick={() => addToast(exampleToast)}>Send a toast</CButton>
-      <CToaster ref={toaster} push={toast} placement="top-end" />
+      <CToaster className="p-3" placement="top-end" push={toast} ref={toaster} />
     </>
   )
 }
@@ -117,7 +117,7 @@ const exampleToast = (
 return (
   <>
     <CButton onClick={() => addToast(exampleToast)}>Send a toast</CButton>
-    <CToaster ref={toaster} push={toast} placement="top-end" />
+    <CToaster className="p-3" placement="top-end" push={toast} ref={toaster} />
   </>
 )
 ```
@@ -152,7 +152,7 @@ Toasts are slightly translucent to blend in with what's below them.
 You can stack toasts by wrapping them in a toast container, which will vertically add some spacing.
 
 ```jsx preview
-<CToaster>
+<CToaster className="position-static">
   <CToast autohide={false} visible={true}>
     <CToastHeader closeButton>
       <svg

Original file line number	Diff line number	Diff line change
`@@ -57,7 +57,7 @@ export const CToaster = forwardRef<HTMLDivElement, CToasterProps>(`
`57`	`57`	`{toasts.length > 0 \|\| children ? (`
`58`	`58`	`<div`
`59`	`59`	`className={classNames(`
`60`		`- 'toaster toast-container p-3',`
	`60`	`+ 'toaster toast-container',`
`61`	`61`	`{`
`62`	`62`	`'position-fixed': placement,`
`63`	`63`	`'top-0': placement && placement.includes('top'),`