feat(Drawer): refactor to tailwind

packages/orbit-components/src/Drawer/__tests__/index.test.tsx

@@ -18,6 +18,7 @@ describe("Drawer", () => {
     expect(screen.getByTestId("test")).toBeInTheDocument();
     expect(screen.getByText("content"));
   });
+
   it("should be able to toggle visibility", () => {
     jest.useFakeTimers();
     const { rerender } = render(<Drawer shown={false}>content</Drawer>);

packages/orbit-components/src/Drawer/components/DrawerClose.tsx

@@ -1,25 +1,14 @@
 import * as React from "react";
-import styled from "styled-components";
 
 import ButtonLink from "../../ButtonLink";
 import Close from "../../icons/Close";
-import defaultTheme from "../../defaultTheme";
-import { left } from "../../utils/rtl";
 import type { Props } from "./types";
 
-const StyledDrawerClose = styled.div`
-  margin-${left}: ${({ theme }) => theme.orbit.spaceMedium};
-`;
-
-StyledDrawerClose.defaultProps = {
-  theme: defaultTheme,
-};
-
 const DrawerClose = React.forwardRef<HTMLButtonElement, Props>(({ onClick, title }, ref) => {
   return (
-    <StyledDrawerClose>
+    <div className="ms-md">
       <ButtonLink onClick={onClick} iconLeft={<Close />} ref={ref} type="secondary" title={title} />
-    </StyledDrawerClose>
+    </div>
   );
 });