@pingux/astro 1.1.0-alpha.1 → 1.1.0-alpha.2

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [1.1.0-alpha.2](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@1.1.0-alpha.1...@pingux/astro@1.1.0-alpha.2) (2022-01-19)
+
+
+### Bug Fixes
+
+* [UIP-5039] IconButton Square Variant ([2fecfac](https://gitlab.corp.pingidentity.com/ux/pingux/commit/2fecfac9d39974eb5dc773d210c3a830d1bd9e2a))
+
+
+
+
+
 # [1.1.0-alpha.1](https://gitlab.corp.pingidentity.com/ux/pingux/compare/@pingux/astro@1.1.0-alpha.0...@pingux/astro@1.1.0-alpha.1) (2022-01-19)
 
 

package/lib/cjs/components/IconButton/IconButton.stories.js

@@ -8,7 +8,7 @@ _Object$defineProperty(exports, "__esModule", {
   value: true
 });
 
-exports.Disabled = exports.WithTooltip = exports.Inverted = exports.Default = exports["default"] = void 0;
+exports.Disabled = exports.WithTooltip = exports.Default = exports["default"] = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 
@@ -53,8 +53,10 @@ var _default = {
     isDisabled: {},
     variant: {
       control: {
-        type: 'none'
-      }
+        type: 'select',
+        options: ['iconButton', 'inverted', 'square', 'invertedSquare']
+      },
+      defaultValue: 'iconButton'
     }
   }
 };
@@ -62,7 +64,7 @@ exports["default"] = _default;
 
 var Default = function Default(args) {
   return (0, _react2.jsx)(_["default"], (0, _extends2["default"])({
-    "aria-label": "my-label"
+    "aria-label": "default icon button"
   }, args), (0, _react2.jsx)(_Icon["default"], {
     icon: _CreateIcon["default"]
   }));
@@ -70,20 +72,9 @@ var Default = function Default(args) {
 
 exports.Default = Default;
 
-var Inverted = function Inverted() {
-  return (0, _react2.jsx)(_["default"], {
-    "aria-label": "my-label",
-    variant: "inverted"
-  }, (0, _react2.jsx)(_Icon["default"], {
-    icon: _CreateIcon["default"]
-  }));
-};
-
-exports.Inverted = Inverted;
-
 var WithTooltip = function WithTooltip() {
   return (0, _react2.jsx)(_["default"], {
-    "aria-label": "my-label",
+    "aria-label": "icon button with tooltip",
     title: "Edit"
   }, (0, _react2.jsx)(_Icon["default"], {
     icon: _CreateIcon["default"]
@@ -94,7 +85,7 @@ exports.WithTooltip = WithTooltip;
 
 var Disabled = function Disabled() {
   return (0, _react2.jsx)(_["default"], {
-    "aria-label": "my-label",
+    "aria-label": "disabled icon button",
     isDisabled: true
   }, (0, _react2.jsx)(_Icon["default"], {
     icon: _CreateIcon["default"]

package/lib/cjs/styles/variants/buttons.js

@@ -104,6 +104,10 @@ var iconButton = {
   }
 };
 
+var square = _objectSpread(_objectSpread({}, iconButton), {}, {
+  borderRadius: '2px'
+});
+
 var modalCloseButton = _objectSpread(_objectSpread({}, iconButton), {}, {
   position: 'absolute',
   top: 14,
@@ -241,6 +245,10 @@ var inverted = _objectSpread(_objectSpread({}, iconButton), {}, {
   }
 });
 
+var invertedSquare = _objectSpread(_objectSpread({}, inverted), {}, {
+  borderRadius: '2px'
+});
+
 var applicationPortal = _objectSpread(_objectSpread({}, iconButton), {}, {
   background: 'transparent',
   '&.is-focused': _objectSpread({}, defaultFocus),
@@ -532,6 +540,8 @@ var _default = {
   modalCloseButton: modalCloseButton,
   applicationPortalPinned: applicationPortalPinned,
   applicationPortal: applicationPortal,
+  square: square,
+  invertedSquare: invertedSquare,
   tooltipChip: tooltipChip,
   tooltipIconButton: tooltipIconButton,
   tooltipInline: tooltipInline

package/lib/components/IconButton/IconButton.stories.js

@@ -35,29 +35,23 @@ export default {
     isDisabled: {},
     variant: {
       control: {
-        type: 'none'
-      }
+        type: 'select',
+        options: ['iconButton', 'inverted', 'square', 'invertedSquare']
+      },
+      defaultValue: 'iconButton'
     }
   }
 };
 export var Default = function Default(args) {
   return ___EmotionJSX(IconButton, _extends({
-    "aria-label": "my-label"
+    "aria-label": "default icon button"
   }, args), ___EmotionJSX(Icon, {
     icon: CreateIcon
   }));
 };
-export var Inverted = function Inverted() {
-  return ___EmotionJSX(IconButton, {
-    "aria-label": "my-label",
-    variant: "inverted"
-  }, ___EmotionJSX(Icon, {
-    icon: CreateIcon
-  }));
-};
 export var WithTooltip = function WithTooltip() {
   return ___EmotionJSX(IconButton, {
-    "aria-label": "my-label",
+    "aria-label": "icon button with tooltip",
     title: "Edit"
   }, ___EmotionJSX(Icon, {
     icon: CreateIcon
@@ -65,7 +59,7 @@ export var WithTooltip = function WithTooltip() {
 };
 export var Disabled = function Disabled() {
   return ___EmotionJSX(IconButton, {
-    "aria-label": "my-label",
+    "aria-label": "disabled icon button",
     isDisabled: true
   }, ___EmotionJSX(Icon, {
     icon: CreateIcon

package/lib/styles/variants/buttons.js

@@ -82,6 +82,10 @@ var iconButton = {
   }
 };
 
+var square = _objectSpread(_objectSpread({}, iconButton), {}, {
+  borderRadius: '2px'
+});
+
 var modalCloseButton = _objectSpread(_objectSpread({}, iconButton), {}, {
   position: 'absolute',
   top: 14,
@@ -219,6 +223,10 @@ var inverted = _objectSpread(_objectSpread({}, iconButton), {}, {
   }
 });
 
+var invertedSquare = _objectSpread(_objectSpread({}, inverted), {}, {
+  borderRadius: '2px'
+});
+
 var applicationPortal = _objectSpread(_objectSpread({}, iconButton), {}, {
   background: 'transparent',
   '&.is-focused': _objectSpread({}, defaultFocus),
@@ -510,6 +518,8 @@ export default {
   modalCloseButton: modalCloseButton,
   applicationPortalPinned: applicationPortalPinned,
   applicationPortal: applicationPortal,
+  square: square,
+  invertedSquare: invertedSquare,
   tooltipChip: tooltipChip,
   tooltipIconButton: tooltipIconButton,
   tooltipInline: tooltipInline

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "1.1.0-alpha.1",
+  "version": "1.1.0-alpha.2",
   "description": "PingUX themeable React component library",
   "author": "uxdev@pingidentity.com",
   "license": "Apache-2.0",