From 3d3d2790740c63c5b23be5bf1c371a30f0193dd0 Mon Sep 17 00:00:00 2001
From: Mario Souto <13791385+omariosouto@users.noreply.github.com>
Date: Thu, 20 Jan 2022 12:50:56 -0300
Subject: [PATCH] fix: add support to sknui-box with default flex

---
 lib/components/box/box.tsx                 | 15 ++++++++++++---
 lib/components/provider/react/CSSReset.tsx |  5 +++++
 2 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/lib/components/box/box.tsx b/lib/components/box/box.tsx
index a72d786..8474309 100644
--- a/lib/components/box/box.tsx
+++ b/lib/components/box/box.tsx
@@ -19,9 +19,18 @@ interface BoxProps {
   ref: Ref<unknown>;
 }
 
-export const Box = React.forwardRef(({ tag, ...props }: BoxProps, ref) => {
-  return <BoxBase as={tag} {...props} ref={ref} />;
-});
+export const Box = React.forwardRef(
+  ({ tag, className, ...props }: BoxProps, ref) => {
+    return (
+      <BoxBase
+        as={tag}
+        className={`${className} sknui-box`}
+        {...props}
+        ref={ref}
+      />
+    );
+  }
+);
 
 Box.defaultProps = {
   tag: 'div',
diff --git a/lib/components/provider/react/CSSReset.tsx b/lib/components/provider/react/CSSReset.tsx
index e4f8cda..7d30e7d 100644
--- a/lib/components/provider/react/CSSReset.tsx
+++ b/lib/components/provider/react/CSSReset.tsx
@@ -563,6 +563,11 @@ Add the correct display in Chrome and Safari.
         --tw-border-opacity: 1;
         border-color: rgba(229, 231, 235, var(--tw-border-opacity));
       }
+
+      /** SkynexUI Styles */
+      .sknui-box {
+        display: flex;
+      }
     `}</style>
   );
 }