@sk-web-gui/button - npm Package Compare versions

Comparing version 0.1.11 to 0.1.12

dist/cjs/button.js

 "use strict";
 
 exports.__esModule = true;
-exports.Button = void 0;
+exports.getButtonContent = exports.Button = void 0;
 var _spinner = require("@sk-web-gui/spinner");
 var _utils = require("@sk-web-gui/utils");
 var React = _interopRequireWildcard(require("react"));
+var _link = require("@sk-web-gui/link");
 var _styles = require("./styles");
-var _excluded = ["disabled", "loading", "active", "loadingText", "type", "leftIcon", "rightIcon", "children", "className", "color", "variant", "size", "rounded"];
+var _excluded = ["disabled", "loading", "active", "type", "className", "loadingText", "rightIcon", "leftIcon", "color", "variant", "size", "rounded", "iconButton"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -14,2 +15,20 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var getButtonContent = function getButtonContent(props) {
+  var loading = props.loading,
+    loadingText = props.loadingText,
+    leftIcon = props.leftIcon,
+    rightIcon = props.rightIcon,
+    children = props.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, leftIcon && !loading ? /*#__PURE__*/React.createElement("span", {
+    className: "btn-has-icon-left"
+  }, leftIcon) : null, loading && /*#__PURE__*/React.createElement(_spinner.Spinner, {
+    className: (0, _utils.cx)(loadingText ? 'relative' : 'absolute', loadingText ? "mr-2" : 'mr-0'),
+    size: "sm"
+  }), loading ? loadingText || /*#__PURE__*/React.createElement("span", {
+    className: "opacity-0"
+  }, children) : children, rightIcon && !loading ? /*#__PURE__*/React.createElement("span", {
+    className: "btn-has-icon-right"
+  }, rightIcon) : null);
+};
+exports.getButtonContent = getButtonContent;
 var Button = /*#__PURE__*/React.forwardRef(function (props, ref) {
@@ -19,8 +38,7 @@ var _disabled = props.disabled,
     active = props.active,
+    type = props.type,
+    className = props.className,
     loadingText = props.loadingText,
-    type = props.type,
+    rightIcon = props.rightIcon,
     leftIcon = props.leftIcon,
-    rightIcon = props.rightIcon,
-    children = props.children,
-    className = props.className,
     color = props.color,
@@ -33,2 +51,3 @@ _props$variant = props.variant,
     rounded = _props$rounded === void 0 ? false : _props$rounded,
+    iconButton = props.iconButton,
     rest = _objectWithoutPropertiesLoose(props, _excluded);
@@ -41,3 +60,4 @@ var disabled = _disabled || loading;
   });
-  return /*#__PURE__*/React.createElement("button", _extends({
+  return variant === 'link' ? /*#__PURE__*/React.createElement(_link.Link, _extends({
+    as: "button",
     ref: ref,
@@ -47,12 +67,15 @@ disabled: disabled,
     type: type,
+    "data-active": active ? 'true' : undefined,
+    className: (0, _utils.cx)(className)
+  }, rest), getButtonContent(props)) : /*#__PURE__*/React.createElement("button", _extends({
+    ref: ref,
+    disabled: disabled,
+    "aria-disabled": disabled ? disabled : undefined,
+    type: type,
     "data-rounded": rounded ? rounded : undefined,
     "data-active": active ? 'true' : undefined,
     "data-color": color ? color : undefined,
+    "data-icon": iconButton ? iconButton : undefined,
     className: (0, _utils.cx)(classes, className)
-  }, rest), leftIcon && !loading ? leftIcon : null, loading && /*#__PURE__*/React.createElement(_spinner.Spinner, {
-    className: (0, _utils.cx)(loadingText ? 'relative' : 'absolute', loadingText ? "mr-2" : 'mr-0'),
-    size: "sm"
-  }), loading ? loadingText || /*#__PURE__*/React.createElement("span", {
-    className: "opacity-0"
-  }, children) : children, rightIcon && !loading ? rightIcon : null);
+  }, rest), getButtonContent(props));
 });
@@ -59,0 +82,0 @@ exports.Button = Button;

dist/cjs/index.js

@@ -6,2 +6,3 @@ "use strict";
 var _button = require("./button");
+exports.getButtonContent = _button.getButtonContent;
 var _buttonGroup = require("./button-group");
@@ -8,0 +9,0 @@ exports.ButtonGroup = _buttonGroup.ButtonGroup;

dist/esm/button.js

@@ -1,2 +0,2 @@
-var _excluded = ["disabled", "loading", "active", "loadingText", "type", "leftIcon", "rightIcon", "children", "className", "color", "variant", "size", "rounded"];
+var _excluded = ["disabled", "loading", "active", "type", "className", "loadingText", "rightIcon", "leftIcon", "color", "variant", "size", "rounded", "iconButton"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -7,3 +7,23 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 import * as React from 'react';
+import { Link } from '@sk-web-gui/link';
 import { useButtonClass } from './styles';
+export var getButtonContent = props => {
+  var {
+    loading,
+    loadingText,
+    leftIcon,
+    rightIcon,
+    children
+  } = props;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, leftIcon && !loading ? /*#__PURE__*/React.createElement("span", {
+    className: "btn-has-icon-left"
+  }, leftIcon) : null, loading && /*#__PURE__*/React.createElement(Spinner, {
+    className: cx(loadingText ? 'relative' : 'absolute', loadingText ? "mr-2" : 'mr-0'),
+    size: "sm"
+  }), loading ? loadingText || /*#__PURE__*/React.createElement("span", {
+    className: "opacity-0"
+  }, children) : children, rightIcon && !loading ? /*#__PURE__*/React.createElement("span", {
+    className: "btn-has-icon-right"
+  }, rightIcon) : null);
+};
 export var Button = /*#__PURE__*/React.forwardRef((props, ref) => {
@@ -14,7 +34,3 @@ var {
       active,
-      loadingText,
       type,
-      leftIcon,
-      rightIcon,
-      children,
       className,
@@ -24,3 +40,4 @@ color,
       size = 'md',
-      rounded = false
+      rounded = false,
+      iconButton
     } = props,
@@ -34,3 +51,4 @@ rest = _objectWithoutPropertiesLoose(props, _excluded);
   });
-  return /*#__PURE__*/React.createElement("button", _extends({
+  return variant === 'link' ? /*#__PURE__*/React.createElement(Link, _extends({
+    as: "button",
     ref: ref,
@@ -40,12 +58,15 @@ disabled: disabled,
     type: type,
+    "data-active": active ? 'true' : undefined,
+    className: cx(className)
+  }, rest), getButtonContent(props)) : /*#__PURE__*/React.createElement("button", _extends({
+    ref: ref,
+    disabled: disabled,
+    "aria-disabled": disabled ? disabled : undefined,
+    type: type,
     "data-rounded": rounded ? rounded : undefined,
     "data-active": active ? 'true' : undefined,
     "data-color": color ? color : undefined,
+    "data-icon": iconButton ? iconButton : undefined,
     className: cx(classes, className)
-  }, rest), leftIcon && !loading ? leftIcon : null, loading && /*#__PURE__*/React.createElement(Spinner, {
-    className: cx(loadingText ? 'relative' : 'absolute', loadingText ? "mr-2" : 'mr-0'),
-    size: "sm"
-  }), loading ? loadingText || /*#__PURE__*/React.createElement("span", {
-    className: "opacity-0"
-  }, children) : children, rightIcon && !loading ? rightIcon : null);
+  }, rest), getButtonContent(props));
 });
@@ -52,0 +73,0 @@ if (__DEV__) {

dist/esm/index.js

@@ -1,2 +0,2 @@
-import { Button as InternalButton } from './button';
+import { Button as InternalButton, getButtonContent } from './button';
 import { ButtonGroup } from './button-group';
@@ -6,3 +6,3 @@ import { IconButton } from './icon-button';
 Button.Group = ButtonGroup;
-export { Button, ButtonGroup, IconButton };
+export { Button, ButtonGroup, IconButton, getButtonContent };
 //# sourceMappingURL=index.js.map

dist/types/button.d.ts

@@ -17,6 +17,8 @@ import { DefaultProps } from '@sk-web-gui/theme';
     rounded?: boolean;
+    iconButton?: boolean;
 }
 export interface ButtonProps extends React.HTMLAttributes<HTMLButtonElement>, IButtonProps {
 }
+export declare const getButtonContent: (props: ButtonProps) => JSX.Element;
 export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export {};

dist/types/index.d.ts

 import * as React from 'react';
-import { ButtonProps } from './button';
+import { ButtonProps, getButtonContent } from './button';
 import { ButtonGroup, ButtonGroupProps } from './button-group';
@@ -10,2 +10,2 @@ import { IconButton, IconButtonProps } from './icon-button';
 export type { ButtonProps, ButtonGroupProps, IconButtonProps };
-export { Button, ButtonGroup, IconButton };
+export { Button, ButtonGroup, IconButton, getButtonContent };

package.json

 {
   "name": "@sk-web-gui/button",
-  "version": "0.1.11",
+  "version": "0.1.12",
   "sideEffects": false,
@@ -47,3 +47,3 @@ "license": "MIT",
   },
-  "gitHead": "bf3806107dcb55bb01ff90098828c57dcc5a8f43"
+  "gitHead": "41f489446f57e29402fdd710cd7203ea35f59b3e"
 }

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

52277

increased by10.96%

Lines of code

437

increased by12.05%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes