From c88c8c412995bd6de1ca55d8dddb1ff06717e710 Mon Sep 17 00:00:00 2001
From: Victor Genaev <vgenaev@gmail.com>
Date: Thu, 2 Nov 2023 15:08:56 +0100
Subject: [PATCH] test(Separator): add visual test

---
 .../src/Separator/Separator.stories.tsx       | 36 +++++++++++++++++++
 1 file changed, 36 insertions(+)

diff --git a/packages/orbit-components/src/Separator/Separator.stories.tsx b/packages/orbit-components/src/Separator/Separator.stories.tsx
index 7cb314abe6..1a6918dd83 100644
--- a/packages/orbit-components/src/Separator/Separator.stories.tsx
+++ b/packages/orbit-components/src/Separator/Separator.stories.tsx
@@ -43,6 +43,42 @@ export const Rtl = () => (
   </RenderInRtl>
 );
 
+export const VisualTest = () => {
+  return (
+    <div className="space-y-md flex flex-col">
+      <Separator />
+      <Separator type="dotted" />
+      <Separator type="dashed" />
+      <Separator type="double" />
+      <Separator color="paletteRedNormal" type="solid" />
+      <Separator color="paletteBlueNormal" type="solid" />
+      <Separator color="paletteProductNormal" indent="small" type="solid" />
+      <Separator color="paletteProductNormal" indent="medium" type="solid" />
+      <Separator color="paletteProductNormal" indent="large" type="solid" />
+      <Separator color="paletteProductNormal" indent="XLarge" type="solid" />
+      <Separator color="paletteProductNormal" indent="XXLarge" type="solid" />
+      <Separator align="left" indent="large" color="paletteBundleBasic" type="solid" />
+      <Separator align="right" indent="large" color="paletteBundleBasic" type="solid" />
+      <Separator align="center" indent="XXLarge" color="paletteBundleBasic" type="solid" />
+      <Separator spaceAfter="smallest" />
+      <Separator spaceAfter="small" />
+      <Separator spaceAfter="medium" />
+      <Separator spaceAfter="medium" />
+      <Separator spaceAfter="large" />
+      <Separator spaceAfter="largest" />
+    </div>
+  );
+};
+
+VisualTest.story = {
+  name: "Separator visual story",
+  parameters: {
+    chromatic: {
+      disableSnapshot: false,
+    },
+  },
+};
+
 Rtl.story = {
   name: "RTL",