@s-ui/react-atom-action-button - npm Package Compare versions

Comparing version 1.6.0 to 1.7.0

CHANGELOG.md

 # CHANGELOG
 
+# 1.7.0 (2022-02-02)
+
+
+### Features
+
+* **components/atom/actionButton:** Add a SCSS token to customize border radius of atom/actionButton ([bcc615c](https://github.com/SUI-Components/sui-components/commit/bcc615c5d4a95d1b506567372c86b86525c19b1d))
+
+
+
 # 1.6.0 (2021-12-09)
@@ -4,0 +13,0 @@

demo/index.js

@@ -15,3 +15,2 @@ import {Fragment, useState} from 'react'
   Text,
-  DevIcon,
   Grid,
@@ -22,69 +21,13 @@ Cell
   atomActionButtonColors,
-  atomActionButtonStyles,
   atomActionButtonSizes
 } from '@s-ui/react-atom-action-button'
 
-const icon = <DevIcon icon="DiGithubBadge" />
+import {
+  icon,
+  flexCenteredStyle,
+  handleSubmit,
+  CLASS_SECTION
+} from './settings.js'
+import ActionButtonCatalog from './ActionButtonCatalog.js'
 
-const flexCenteredStyle = {
-  display: 'flex',
-  justifyContent: 'center',
-  wrap: 'nowrap',
-  alignItems: 'center',
-  alignContent: 'center'
-}
-const handleSubmit = event => {
-  event.preventDefault()
-  alert('Form submitted!')
-}
-
-const ActionButtonCatalog = props => {
-  return (
-    <Grid
-      cols={Object.values(atomActionButtonColors).length + 1}
-      gutter="10"
-      style={{width: 800}}
-    >
-      <Cell />
-      {Object.values(atomActionButtonColors).map(
-        (atomActionButtonColor, key) => (
-          <Cell key={key}>
-            <Text>
-              <Label>{atomActionButtonColor}</Label>
-            </Text>
-          </Cell>
-        )
-      )}
-      {Object.values(atomActionButtonStyles).map(
-        (atomActionButtonStyle, index) => (
-          <>
-            <Cell>
-              <Text>
-                <Label>{atomActionButtonStyle}</Label>
-              </Text>
-            </Cell>
-            {Object.values(atomActionButtonColors).map(
-              (atomActionButtonColor, iterator) => (
-                <Cell key={iterator}>
-                  <AtomActionButton
-                    style={atomActionButtonStyle}
-                    color={atomActionButtonColor}
-                    icon={icon}
-                    {...props}
-                  >
-                    Button
-                  </AtomActionButton>
-                </Cell>
-              )
-            )}
-          </>
-        )
-      )}
-    </Grid>
-  )
-}
-
-const BASE_CLASS_DEMO = `DemoAtomActionButton`
-const CLASS_SECTION = `${BASE_CLASS_DEMO}-section`
-
 const Demo = () => {
@@ -91,0 +34,0 @@ const [state, setState] = useState({content: 'button', link: false})

lib/index.js

@@ -1,3 +0,62 @@
-import { COLORS, SIZES, STYLES } from './config';
-import AtomActionButton from './ActionButton';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["children", "className", "color", "disabled", "focused", "href", "icon", "isButton", "isSubmit", "link", "linkFactory", "size", "style", "target", "title"];
+import cx from 'classnames';
+import PropTypes from 'prop-types';
+import AtomIcon, { ATOM_ICON_COLORS, ATOM_ICON_SIZES } from '@s-ui/react-atom-icon';
+import { BASE_CLASS, CLASSES, COLOR_CLASSES, COLORS, MODIFIERS, SIZES, STYLES } from './config.js';
+import ActionButtonWrapper from './ActionButtonWrapper.js';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+
+var AtomActionButton = function AtomActionButton(_ref) {
+  var children = _ref.children,
+      className = _ref.className,
+      _ref$color = _ref.color,
+      color = _ref$color === void 0 ? COLORS.PRIMARY : _ref$color,
+      disabled = _ref.disabled,
+      focused = _ref.focused,
+      href = _ref.href,
+      icon = _ref.icon,
+      isButton = _ref.isButton,
+      isSubmit = _ref.isSubmit,
+      link = _ref.link,
+      linkFactory = _ref.linkFactory,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? SIZES.MEDIUM : _ref$size,
+      _ref$style = _ref.style,
+      style = _ref$style === void 0 ? STYLES.FILLED_NEGATIVE : _ref$style,
+      target = _ref.target,
+      title = _ref.title,
+      restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var classNames = cx(BASE_CLASS, COLOR_CLASSES[color], CLASSES[style], CLASSES[size], focused && CLASSES[MODIFIERS.ACTIVE_FOCUSED], disabled && CLASSES[MODIFIERS.DISABLED], link && CLASSES[MODIFIERS.LINK], className);
+
+  var buttonProps = _extends({
+    href: href,
+    isButton: isButton,
+    isSubmit: isSubmit,
+    link: link,
+    linkFactory: linkFactory,
+    target: target,
+    title: title
+  }, restProps);
+
+  return /*#__PURE__*/_jsxs(ActionButtonWrapper, _extends({}, buttonProps, {
+    className: classNames,
+    children: [/*#__PURE__*/_jsx("div", {
+      className: BASE_CLASS + "-icon",
+      children: /*#__PURE__*/_jsx(AtomIcon, {
+        size: ATOM_ICON_SIZES.medium,
+        color: ATOM_ICON_COLORS.currentColor,
+        children: icon
+      })
+    }), /*#__PURE__*/_jsx("div", {
+      className: BASE_CLASS + "-text",
+      children: children
+    })]
+  }));
+};
+
+AtomActionButton.displayName = 'AtomActionButton';
 export default AtomActionButton;
@@ -4,0 +63,0 @@ export { COLORS as atomActionButtonColors };

package.json

 {
   "name": "@s-ui/react-atom-action-button",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "",
   "main": "lib/index.js",
   "scripts": {
-    "prepare": "npm run build:js && npm run build:styles",
+    "prepare": "rimraf ./lib && npm run build:js && npm run build:styles",
     "build:js": "babel --presets sui ./src --out-dir ./lib",
@@ -9,0 +9,0 @@ "build:styles": "cpx './src/**/*.scss' ./lib"

test/index.test.js

@@ -13,3 +13,3 @@ /*
 
-import * as pkg from '../src'
+import * as pkg from '../src/index.js'
 
@@ -16,0 +16,0 @@ import json from '../package.json'

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

35004

increased by2.06%

Number of package files

16

increased by23.08%

Lines of code

665

increased by1.68%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes