@luscii-healthtech/web-ui 0.6.0 → 0.6.1

package/dist/components/ButtonV2/ButtonProps.type.d.ts

@@ -1,8 +1,11 @@
 /// <reference types="react" />
 import { IconProps } from "../Icons/types/IconProps.type";
+import { TextColor, TextHoverColor } from "../Text/Text";
 export interface BaseButtonProps extends React.HTMLAttributes<HTMLButtonElement> {
     onClick: (event: React.MouseEvent<HTMLButtonElement>) => void;
     text?: string;
+    textColor?: TextColor;
+    textHoverColor?: TextHoverColor;
     icon?: React.FunctionComponent<IconProps>;
     isDisabled?: boolean;
     className?: string;

package/dist/components/ButtonV2/ButtonV2.d.ts

@@ -1,3 +1,3 @@
 /// <reference types="react" />
 import { ButtonProps } from "./ButtonProps.type";
-export declare const ButtonV2: ({ onClick, text, icon, isDisabled, isPending, className, ...otherAttributes }: ButtonProps) => JSX.Element;
+export declare const ButtonV2: ({ onClick, text, textColor, textHoverColor, icon, isDisabled, isPending, className, ...otherAttributes }: ButtonProps) => JSX.Element;

package/dist/web-ui.cjs.development.js

@@ -358,10 +358,12 @@ var Spinner = function Spinner(props) {
   }));
 };
 
-var _excluded = ["onClick", "text", "icon", "isDisabled", "isPending", "className"];
+var _excluded = ["onClick", "text", "textColor", "textHoverColor", "icon", "isDisabled", "isPending", "className"];
 var ButtonV2 = function ButtonV2(_ref) {
   var onClick = _ref.onClick,
       text = _ref.text,
+      textColor = _ref.textColor,
+      textHoverColor = _ref.textHoverColor,
       icon = _ref.icon,
       isDisabled = _ref.isDisabled,
       isPending = _ref.isPending,
@@ -373,7 +375,7 @@ var ButtonV2 = function ButtonV2(_ref) {
     return /*#__PURE__*/React__default.createElement("span", null, "Invalid props passed to this component.");
   }
 
-  var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "border", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-primary"], {
+  var buttonClassName = classNames(["h-11", "relative flex flex-row justify-center items-center", "border", "transition-outline transition-colors duration-300 ease-in-out", "rounded-full", "leading-none", "shadow-sm", "cursor-pointer", "focus:outline-primary", "group"], {
     "w-11": !text && icon,
     "pl-4 pr-6": text && icon,
     "px-4": text && !icon
@@ -400,29 +402,38 @@ var ButtonV2 = function ButtonV2(_ref) {
     }
   }, /*#__PURE__*/React__default.createElement(Spinner, {
     className: "text-white"
-  })), text && /*#__PURE__*/React__default.createElement("span", {
-    className: classNames("text-sm font-medium", {
+  })), text && /*#__PURE__*/React__default.createElement(Text, {
+    className: classNames({
       invisible: isPending,
       "ml-1": icon
-    })
-  }, text));
+    }),
+    text: text,
+    color: textColor,
+    hoverColor: textHoverColor,
+    hoverInGroup: true
+  }));
 };
 
 var PrimaryButton = function PrimaryButton(props) {
   return /*#__PURE__*/React__default.createElement(ButtonV2, Object.assign({}, props, {
-    className: classNames(["text-white", "bg-blue-800", "border-primary-transparent", "hover:bg-blue-900"], props.className)
+    className: classNames(["text-white", "bg-blue-800", "border-primary-transparent", "hover:bg-blue-900"], props.className),
+    textColor: "white"
   }));
 };
 
 var SecondaryButton = function SecondaryButton(props) {
   return /*#__PURE__*/React__default.createElement(ButtonV2, Object.assign({}, props, {
-    className: classNames(["text-blue-800", "bg-white", "border-slate-300", "hover:text-blue-900", "hover:border-slate-400", "focus:border-blue-800"], props.className)
+    className: classNames(["text-blue-800", "bg-white", "border-slate-300", "hover:text-blue-900", "hover:border-slate-400", "focus:border-blue-800"], props.className),
+    textColor: "blue-800",
+    textHoverColor: "blue-900"
   }));
 };
 
 var TertiaryButton = function TertiaryButton(props) {
   return /*#__PURE__*/React__default.createElement(ButtonV2, Object.assign({}, props, {
-    className: classNames(["text-blue-800", "bg-transparent", "border-transparent", "hover:text-blue-900", "focus:border-blue-800", "shadow-none"], props.className)
+    className: classNames(["text-blue-800", "bg-transparent", "border-transparent", "hover:text-blue-900", "focus:border-blue-800", "shadow-none"], props.className),
+    textColor: "blue-800",
+    textHoverColor: "blue-900"
   }));
 };