init project

docs/data/joy/components/alert/AlertVariants.js

@@ -0,0 +1,13 @@
+import Box from '@mui/joy/Box';
+import Alert from '@mui/joy/Alert';
+
+export default function AlertVariants() {
+  return (
+    <Box sx={{ display: 'flex', gap: 2, width: '100%', flexDirection: 'column' }}>
+      <Alert variant="solid">This is an Alert using the solid variant.</Alert>
+      <Alert variant="soft">This is an Alert using the soft variant.</Alert>
+      <Alert variant="outlined">This is an Alert using the outlined variant.</Alert>
+      <Alert variant="plain">This is an Alert using the plain variant.</Alert>
+    </Box>
+  );
+}