From 2da788b861d4acb10551fe7757166fb5bd66c6ad Mon Sep 17 00:00:00 2001
From: Uzhastin-Nikita <fosfor20@mail.ru>
Date: Mon, 23 May 2022 14:04:36 +0300
Subject: [PATCH] feat: relocate Button atom from WEB

---
 .../atoms/Button/Button.styles.module.scss    | 29 ++++++++++++
 src/components/atoms/Button/Button.tsx        | 44 +++++++++++++++++++
 src/components/atoms/Button/index.ts          |  1 +
 3 files changed, 74 insertions(+)
 create mode 100644 src/components/atoms/Button/Button.styles.module.scss
 create mode 100644 src/components/atoms/Button/Button.tsx
 create mode 100644 src/components/atoms/Button/index.ts

diff --git a/src/components/atoms/Button/Button.styles.module.scss b/src/components/atoms/Button/Button.styles.module.scss
new file mode 100644
index 0000000..f382bc0
--- /dev/null
+++ b/src/components/atoms/Button/Button.styles.module.scss
@@ -0,0 +1,29 @@
+@import '@digitable-team/web-ui-components/src/scss/mixins';
+
+.primary {
+  border: 1px solid $color-white;
+  border-radius: 6px;
+  padding: 18px 40px;
+  background: transparent;
+  color: $color-base;
+}
+
+.success {
+  border: 1px solid $color-base;
+  border-radius: 50px;
+  background: transparent;
+  color: $color-base;
+
+  &:hover {
+    opacity: 0.9;
+  }
+}
+
+.round {
+  border-radius: 36px;
+}
+
+.disabled {
+  color: $color-secondary;
+  border-color: $color-secondary;
+}
diff --git a/src/components/atoms/Button/Button.tsx b/src/components/atoms/Button/Button.tsx
new file mode 100644
index 0000000..e70ea94
--- /dev/null
+++ b/src/components/atoms/Button/Button.tsx
@@ -0,0 +1,44 @@
+import React, { ReactNode } from 'react'
+
+import cx from 'classnames'
+
+// eslint-disable-next-line css-modules/no-unused-class
+import css from './Button.styles.module.scss'
+
+export type ButtonProps = {
+  isRounded?: boolean
+  isDisabled?: boolean
+  className?: string
+  type: 'primary' | 'success'
+  buttonType?: 'button' | 'submit' | 'reset'
+  children?: ReactNode | string
+  name?: string
+  onClick?: () => void
+}
+
+export const Button = ({
+  isRounded,
+  buttonType,
+  type,
+  name,
+  children,
+  isDisabled,
+  className,
+  onClick
+}: ButtonProps) => {
+  return (
+    <button
+      disabled={isDisabled}
+      type={buttonType}
+      role={name}
+      name={name}
+      onClick={onClick}
+      className={cx(className, css[type], {
+        [css.round]: isRounded,
+        [css.disabled]: isDisabled
+      })}
+    >
+      {children}
+    </button>
+  )
+}
diff --git a/src/components/atoms/Button/index.ts b/src/components/atoms/Button/index.ts
new file mode 100644
index 0000000..8486fd6
--- /dev/null
+++ b/src/components/atoms/Button/index.ts
@@ -0,0 +1 @@
+export * from './Button'