feat: add divider component

Author: abelflopes

packages/components/all/src/divider/index.tsx

@@ -0,0 +1,15 @@
+import React from "react";
+import styles from "./styles/index.module.scss";
+import classNames from "classnames";
+
+export interface DividerProps extends React.HTMLAttributes<HTMLHRElement> {
+  type?: "vertical" | "horizontal";
+}
+
+export const Divider = ({
+  type = "horizontal",
+  className,
+  ...otherProps
+}: Readonly<DividerProps>): React.ReactElement => (
+  <hr className={classNames(styles.root, styles[type], className)} {...otherProps} />
+);

packages/components/all/src/divider/styles/index.module.scss

@@ -0,0 +1,18 @@
+@import "@rck/theme";
+
+.root {
+  background-color: get-color("neutral200");
+  border: none;
+  height: var(--height);
+  width: var(--width);
+}
+
+.horizontal {
+  --width: 100%;
+  --height: 1px;
+}
+
+.vertical {
+  --width: 1px;
+  --height: 100%;
+}