labsense-ui-kit 1.0.24 → 1.0.26

package/dist/Buttons/Button.d.ts

@@ -18,6 +18,7 @@ export interface ButtonProps {
     fontWeight?: string;
     fontSize?: string;
     fontFamily?: string;
+    borderDefault?: string;
     borderHover?: string;
     borderRadius?: string;
     padding?: string;

package/dist/index.js

@@ -2304,37 +2304,41 @@ var LoaderWrapper = styled__default.div(_templateObject3$1 || (_templateObject3$
   var loaderPosition = _ref6.loaderPosition;
   return loaderPosition === 'left' ? '4px' : '0';
 });
-var Container = styled__default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: ", ";\n  gap: ", ";\n"])), function (_ref7) {
+var Container = styled__default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: ", ";\n  gap: ", ";\n  \n  svg {\n    cursor: ", ";\n  }\n"])), function (_ref7) {
   var iconPosition = _ref7.iconPosition;
   return iconPosition === 'right' ? 'row-reverse' : 'row';
 }, function (_ref8) {
   var gap = _ref8.gap;
   return gap || '4px';
+}, function (_ref9) {
+  var cursor = _ref9.cursor;
+  return cursor;
 });
-var StyledButton = styled__default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  pointer-events: ", ";\n  cursor: ", ";\n  height: max-content;\n  min-height: max-content;\n  width: max-content;\n  box-sizing: border-box;\n  border-radius: ", ";\n  outline: none;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ", ";\n\n  &:focus {\n    outline: none;\n  }\n\n  ", "\n  color: ", "; \n"])), function (_ref9) {
-  var disabled = _ref9.disabled;
-  return disabled ? 'none' : 'auto';
-}, function (_ref10) {
+var StyledButton = styled__default.button(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n  pointer-events: ", ";\n  cursor: ", ";\n  height: max-content;\n  min-height: max-content;\n  width: max-content;\n  box-sizing: border-box;\n  border-radius: ", ";\n  outline: none;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  padding: ", ";\n\n  &:focus {\n    outline: none;\n  }\n\n  ", "\n  color: ", "; \n"])), function (_ref10) {
   var disabled = _ref10.disabled;
-  return disabled ? 'not-allowed' : 'pointer';
+  return disabled ? 'none' : 'auto';
 }, function (_ref11) {
-  var borderRadius = _ref11.borderRadius;
-  return borderRadius || '8px';
+  var disabled = _ref11.disabled;
+  return disabled ? 'not-allowed' : 'pointer';
 }, function (_ref12) {
-  var size = _ref12.size,
-    padding = _ref12.padding;
-  return size === 'small' ? '8px 12.2px' : size === 'medium' ? '10px 19px' : size === 'large' ? '12px 24.5px' : size === 'custom' ? padding : '10px 16px';
+  var borderRadius = _ref12.borderRadius;
+  return borderRadius || '8px';
 }, function (_ref13) {
-  var variant = _ref13.variant,
-    disabled = _ref13.disabled,
-    borderHover = _ref13.borderHover;
+  var size = _ref13.size,
+    padding = _ref13.padding;
+  return size === 'small' ? '8px 12.2px' : size === 'medium' ? '10px 19px' : size === 'large' ? '12px 24.5px' : size === 'custom' ? padding : '10px 16px';
+}, function (_ref14) {
+  var variant = _ref14.variant,
+    disabled = _ref14.disabled,
+    borderHover = _ref14.borderHover,
+    borderDefault = _ref14.borderDefault;
   switch (variant) {
     case 'primary':
       return "\n          background: " + (disabled ? colorVariables.disabled.primary : colorVariables["default"].primary) + ";\n          color: " + colorVariables.text.white + ";\n          border: " + (disabled ? "1px solid " + colorVariables.disabled.primary : "1px solid " + colorVariables["default"].primary) + ";\n          &:hover {\n            background: " + colorVariables.hover.primary + ";\n            border: 1px solid " + colorVariables.hover.primary + ";\n          }\n        ";
     case 'secondary':
       return "\n          background: " + (disabled ? colorVariables.disabled.secondary : colorVariables["default"].secondary) + "; \n          color: " + colorVariables.text.white + ";\n          border: " + (disabled ? "1px solid " + colorVariables.disabled.secondary : "1px solid " + colorVariables["default"].secondary) + ";\n          &:hover{\n           background: " + colorVariables.hover.secondary + ";\n           border: 1px solid " + colorVariables.hover.secondary + ";\n          }\n        ";
     case 'tertiary':
-      return "\n          background: " + colorVariables["default"].tertiary + ";\n          color: " + (disabled ? colorVariables.disabled.primary : colorVariables["default"].primary) + ";\n          border: 1px solid transparent;\n          &:hover {\n            color: " + colorVariables.hover.primary + ";\n            border: " + (borderHover ? "" + borderHover : "1px solid " + colorVariables.hover.primary) + ";\n          }\n        ";
+      return "\n          background: " + colorVariables["default"].tertiary + ";\n          color: " + (disabled ? colorVariables.disabled.primary : colorVariables["default"].primary) + ";\n          border: " + (borderDefault ? "" + borderDefault : "1px solid " + colorVariables["default"].tertiary) + ";\n          &:hover {\n            color: " + colorVariables.hover.primary + ";\n            border: " + (borderHover ? "" + borderHover : "1px solid " + colorVariables.hover.primary) + ";\n          }\n        ";
     case 'error':
       return "\n          background: " + (disabled ? colorVariables.disabled.error : colorVariables["default"].error) + "; \n          color: " + colorVariables.text.white + ";\n          border: " + (disabled ? "1px solid " + colorVariables.disabled.error : "1px solid " + colorVariables["default"].error) + ";\n          &:hover{\n           background: " + colorVariables.hover.error + ";\n           border: 1px solid " + colorVariables.hover.error + ";\n          }\n        ";
     case 'outline-primary':
@@ -2346,55 +2350,56 @@ var StyledButton = styled__default.button(_templateObject5 || (_templateObject5
     default:
       return '';
   }
-}, function (_ref14) {
-  var color = _ref14.color;
+}, function (_ref15) {
+  var color = _ref15.color;
   return color;
 });
-var ButtonText = styled__default.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  white-space: nowrap;\n"])), function (_ref15) {
-  var fontFamily = _ref15.fontFamily;
+var ButtonText = styled__default.span(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n  font-family: ", ";\n  font-size: ", ";\n  font-weight: ", ";\n  line-height: ", ";\n  white-space: nowrap;\n"])), function (_ref16) {
+  var fontFamily = _ref16.fontFamily;
   return fontFamily ? fontFamily : GlobalFonts.bold;
-}, function (_ref16) {
-  var size = _ref16.size,
-    fontSize = _ref16.fontSize;
-  return size === 'small' ? '14px' : size === 'medium' ? '16px' : size === 'large' ? '18px' : size === 'custom' ? fontSize : '16px';
 }, function (_ref17) {
-  var fontWeight = _ref17.fontWeight,
-    size = _ref17.size;
-  return size === 'custom' && fontWeight || '500';
+  var size = _ref17.size,
+    fontSize = _ref17.fontSize;
+  return size === 'small' ? '14px' : size === 'medium' ? '16px' : size === 'large' ? '18px' : size === 'custom' ? fontSize : '16px';
 }, function (_ref18) {
-  var size = _ref18.size,
-    fontSize = _ref18.fontSize;
+  var fontWeight = _ref18.fontWeight,
+    size = _ref18.size;
+  return size === 'custom' && fontWeight || '500';
+}, function (_ref19) {
+  var size = _ref19.size,
+    fontSize = _ref19.fontSize;
   return size === 'small' ? '14px' : size === 'medium' ? '16px' : size === 'large' ? '18px' : size === 'custom' ? fontSize : '16px';
 });
-var ButtonComponent = function ButtonComponent(_ref19) {
-  var onClick = _ref19.onClick,
-    text = _ref19.text,
-    size = _ref19.size,
-    background = _ref19.background,
-    color = _ref19.color,
-    borderHover = _ref19.borderHover,
-    borderRadius = _ref19.borderRadius,
-    fontWeight = _ref19.fontWeight,
-    fontSize = _ref19.fontSize,
-    fontFamily = _ref19.fontFamily,
-    padding = _ref19.padding,
-    icon = _ref19.icon,
-    gap = _ref19.gap,
-    _ref19$variant = _ref19.variant,
-    variant = _ref19$variant === void 0 ? 'primary' : _ref19$variant,
-    _ref19$iconPosition = _ref19.iconPosition,
-    iconPosition = _ref19$iconPosition === void 0 ? 'right' : _ref19$iconPosition,
-    _ref19$iconWeight = _ref19.iconWeight,
-    iconWeight = _ref19$iconWeight === void 0 ? '2' : _ref19$iconWeight,
-    iconSize = _ref19.iconSize,
-    _ref19$disabled = _ref19.disabled,
-    disabled = _ref19$disabled === void 0 ? false : _ref19$disabled,
-    _ref19$loaderProps = _ref19.loaderProps,
-    loaderProps = _ref19$loaderProps === void 0 ? {
+var ButtonComponent = function ButtonComponent(_ref20) {
+  var onClick = _ref20.onClick,
+    text = _ref20.text,
+    size = _ref20.size,
+    background = _ref20.background,
+    color = _ref20.color,
+    borderDefault = _ref20.borderDefault,
+    borderHover = _ref20.borderHover,
+    borderRadius = _ref20.borderRadius,
+    fontWeight = _ref20.fontWeight,
+    fontSize = _ref20.fontSize,
+    fontFamily = _ref20.fontFamily,
+    padding = _ref20.padding,
+    icon = _ref20.icon,
+    gap = _ref20.gap,
+    _ref20$variant = _ref20.variant,
+    variant = _ref20$variant === void 0 ? 'primary' : _ref20$variant,
+    _ref20$iconPosition = _ref20.iconPosition,
+    iconPosition = _ref20$iconPosition === void 0 ? 'right' : _ref20$iconPosition,
+    _ref20$iconWeight = _ref20.iconWeight,
+    iconWeight = _ref20$iconWeight === void 0 ? '2' : _ref20$iconWeight,
+    iconSize = _ref20.iconSize,
+    _ref20$disabled = _ref20.disabled,
+    disabled = _ref20$disabled === void 0 ? false : _ref20$disabled,
+    _ref20$loaderProps = _ref20.loaderProps,
+    loaderProps = _ref20$loaderProps === void 0 ? {
       loading: false,
       loaderPosition: 'right',
       loaderColor: colorVariables.text.white
-    } : _ref19$loaderProps;
+    } : _ref20$loaderProps;
   var _useState = React.useState(false),
     isHovered = _useState[0],
     setIsHovered = _useState[1];
@@ -2404,6 +2409,7 @@ var ButtonComponent = function ButtonComponent(_ref19) {
     disabled: disabled,
     onClick: onClick,
     background: background,
+    borderDefault: borderDefault,
     borderHover: borderHover,
     borderRadius: borderRadius,
     size: size,
@@ -2418,7 +2424,8 @@ var ButtonComponent = function ButtonComponent(_ref19) {
     }
   }, React__default.createElement(Container, {
     iconPosition: iconPos,
-    gap: gap
+    gap: gap,
+    cursor: !disabled && onclick ? 'pointer' : 'default'
   }, icon && React__default.createElement(Icon, {
     icon: icon,
     weight: iconWeight,