button as component

packages/ui/components/button/Button.tsx

@@ -0,0 +1,34 @@
+import { classNames } from "@documenso/lib";
+import Link from "next/link";
+import React from "react";
+import { Tooltip } from "react-tooltip";
+import short from "short-uuid";
+
+export function Button(props: any) {
+  const isLink = typeof props.href !== "undefined";
+  const { color = "primary", icon, disabled, onClick } = props;
+  const baseStyles =
+    "inline-flex items-center justify-center rounded-md border border-transparent px-4 py-2 text-sm font-medium text-white shadow-sm sm:w-auto disabled:bg-gray-300";
+  const primaryStyles = "bg-neon hover:bg-neon-dark";
+  const secondaryStyles =
+    "border-gray-300 bg-white text-gray-700 hover:bg-gray-50";
+
+  return isLink ? (
+    <Link id={props.id} href={props.href} className={classNames(baseStyles)}>
+      {props.children}
+    </Link>
+  ) : (
+    <button
+      id={props.id}
+      className={classNames(
+        baseStyles,
+        color === "primary" ? primaryStyles : secondaryStyles
+      )}
+      onClick={props.onClick}
+      {...props}
+    >
+      <props.icon className="inline text-inherit w-4 mr-1"></props.icon>
+      {props.children}
+    </button>
+  );
+}

packages/ui/components/button/index.ts

@@ -0,0 +1 @@
+export { Button } from "./button";

packages/ui/index.ts

@@ -1 +1 @@
-export {};
+export { Button } from "./components/./button";