init project

docs/data/joy/components/button-group/GroupOrientation.js

@@ -0,0 +1,45 @@
+import Button from '@mui/joy/Button';
+import ButtonGroup from '@mui/joy/ButtonGroup';
+import Stack from '@mui/joy/Stack';
+
+const buttons = [
+  <Button key="one">One</Button>,
+  <Button key="two" disabled>
+    Two
+  </Button>,
+  <Button key="three">Three</Button>,
+];
+
+export default function GroupOrientation() {
+  return (
+    <Stack spacing={2} direction="row">
+      <ButtonGroup
+        orientation="vertical"
+        aria-label="vertical outlined button group"
+      >
+        {buttons}
+      </ButtonGroup>
+      <ButtonGroup
+        orientation="vertical"
+        aria-label="vertical plain button group"
+        variant="plain"
+      >
+        {buttons}
+      </ButtonGroup>
+      <ButtonGroup
+        orientation="vertical"
+        aria-label="vertical soft button group"
+        variant="soft"
+      >
+        {buttons}
+      </ButtonGroup>
+      <ButtonGroup
+        orientation="vertical"
+        aria-label="vertical solid button group"
+        variant="solid"
+      >
+        {buttons}
+      </ButtonGroup>
+    </Stack>
+  );
+}