Skip to content

Commit

Permalink
feat: add divider component
Browse files Browse the repository at this point in the history
  • Loading branch information
abelflopes committed Nov 2, 2023
1 parent f474827 commit c95c7c1
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 0 deletions.
15 changes: 15 additions & 0 deletions packages/components/all/src/divider/index.tsx
Original file line number Diff line number Diff line change
@@ -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} />
);
18 changes: 18 additions & 0 deletions packages/components/all/src/divider/styles/index.module.scss
Original file line number Diff line number Diff line change
@@ -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%;
}

0 comments on commit c95c7c1

Please sign in to comment.