@os-design/core - npm Package Compare versions

Comparing version 0.0.71 to 0.0.72

lib/Button/index.d.ts

@@ -11,2 +11,5 @@ import React from 'react';
 }
+export declare type StyledButtonProps = ButtonProps & {
+    disabledProp?: boolean;
+};
 export declare const BUTTON_PADDING_HORIZONTAL_EM = 1.2;
@@ -13,0 +16,0 @@ declare const Button: React.FC<ButtonProps>;

lib/Button/index.js

@@ -10,7 +10,5 @@ "use strict";
 const utils_1 = require("@os-design/utils");
-const icons_1 = require("@os-design/icons");
-const defaultColor = (p) => !p.disabledProp && !p.ghost && core_1.css `
-  background-color: ${p.darkMode ? '#fff' : p.theme.colorPrimary};
-  color: ${p.darkMode ? p.theme.colorPrimary : '#fff'};
-  
+const ButtonLoading_1 = __importDefault(require("./ButtonLoading"));
+const sharedStyles_1 = require("./sharedStyles");
+const defaultColorHover = (p) => !p.disabledProp && !p.ghost && core_1.css `
   @media (hover: hover) {
@@ -23,6 +21,3 @@ &:focus, &:hover {
 `;
-const ghost = (p) => !p.disabledProp && p.ghost && core_1.css `
-  background-color: transparent;
-  color: ${p.darkMode ? '#fff' : p.theme.colorPrimary};
-  
+const ghostHover = (p) => !p.disabledProp && p.ghost && core_1.css `
   @media (hover: hover) {
@@ -36,9 +31,4 @@ &:focus, &:hover {
   pointer-events: none;
-  opacity: 0.8;
+  ${p.ghost && core_1.css `color: transparent;`};
 `;
-const disabled = (p) => p.disabledProp && core_1.css `
-  background-color: #eee;
-  color: rgba(0, 0, 0, 0.4);
-  cursor: not-allowed;
-`;
 const shapeRounded = p => p.shape === 'rounded' && core_1.css `border-radius: ${p.theme.borderRadius}em;`;
@@ -71,6 +61,8 @@ const shapeRound = p => p.shape === 'round' && core_1.css `border-radius: ${p.theme.baseHeight / 2}em;`;
   
-  ${defaultColor};
-  ${ghost};
-  ${loading};
-  ${disabled};
+  ${sharedStyles_1.defaultColor};
+  ${defaultColorHover};
+  ${sharedStyles_1.ghost};
+  ${ghostHover};
+  ${sharedStyles_1.disabled};
+  ${loading}; // Important to place it after disabled styles
   
@@ -86,4 +78,6 @@ ${shapeRounded};
 `;
-const Button = props => (react_1.default.createElement(StyledButton, { darkMode: props.darkMode, ghost: props.ghost, shape: props.shape || 'rounded', sizing: props.sizing, loading: props.loading, disabled: props.disabled || props.loading, disabledProp: props.disabled, onClick: props.onClick, className: props.className }, props.loading ? react_1.default.createElement(icons_1.Loading, null) : props.children));
+const Button = props => (react_1.default.createElement(StyledButton, { darkMode: props.darkMode, ghost: props.ghost, shape: props.shape || 'rounded', sizing: props.sizing, loading: props.loading, disabled: props.disabled || props.loading, disabledProp: props.disabled, onClick: props.onClick, className: props.className },
+    props.children,
+    react_1.default.createElement(ButtonLoading_1.default, { loading: props.loading, darkMode: props.darkMode, ghost: props.ghost, disabledProp: props.disabled })));
 exports.default = Button;
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@os-design/core",
-  "version": "0.0.71",
+  "version": "0.0.72",
   "license": "MIT",
@@ -35,3 +35,3 @@ "main": "lib/index.js",
   },
-  "gitHead": "dee9053f1b470844dbdad69feefb31980ad3bb60"
+  "gitHead": "7e730f09e7c71c0901ccd27b23aaf5bccc1a196c"
 }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

267816

increased by1.87%

Number of package files

278

increased by2.96%

Lines of code

3272

increased by1.9%

No dependency changes