@pingux/astro 1.2.0-alpha.1 → 1.2.0-alpha.13

package/lib/hooks/useAriaLabelWarning/useAriaLabelWarning.js

@@ -7,8 +7,9 @@ import { useEffect } from 'react';
 */
 
 var useAriaLabelWarning = function useAriaLabelWarning(component, ariaLabel) {
+  var condition = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
   useEffect(function () {
-    if (process.env.NODE_ENV === 'development' && !ariaLabel) {
+    if (process.env.NODE_ENV === 'development' && condition && !ariaLabel) {
       // eslint-disable-next-line no-console
       console.warn("".concat(component, " requires an aria-label"), '\n', '\n', 'NOTE: This is a development-only warning and will not display in production.');
     }

package/lib/layouts/ListLayout.stories.js

@@ -547,7 +547,7 @@ export var Default = function Default() {
     mr: "md",
     "aria-label": "Save Button"
   }, "Save"), ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: viewItem,
     "aria-label": "Cancel Button"
   }, "Cancel"))), editConfigurationVisible && ___EmotionJSX(OverlayPanel, {
@@ -677,7 +677,7 @@ export var Default = function Default() {
     mr: "md",
     "aria-label": "Save Button"
   }, "Save"), ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: viewItem,
     "aria-label": "Cancel Button"
   }, "Cancel"))), addItemVisible && ___EmotionJSX(OverlayPanel, {
@@ -763,7 +763,7 @@ export var Default = function Default() {
     isRow: true,
     sx: buttonBarStyles
   }, ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: resetListItem,
     mr: "md",
     "aria-label": "Cancel Button"
@@ -824,7 +824,7 @@ export var Default = function Default() {
     isRow: true,
     sx: buttonBarStyles
   }, ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: resetListItem,
     mr: "md"
   }, "Cancel"), ___EmotionJSX(Button, {
@@ -846,11 +846,11 @@ export var Default = function Default() {
     pt: "lg",
     mr: "auto"
   }, ___EmotionJSX(Button, {
-    variant: "danger",
+    variant: "critical",
     mr: "md",
     onPress: deleteItem
   }, "Delete"), ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: function onPress() {
       return setIsDeleting(false);
     }

package/lib/recipes/ArrayField.stories.js

@@ -120,7 +120,7 @@ export var Default = function Default() {
       title: "Text Field"
     }, otherFieldProps)));
   }), ___EmotionJSX(Button, {
-    variant: "text",
+    variant: "link",
     onPress: onFieldAdd,
     role: "button",
     title: "Add Field Button",

package/lib/recipes/ConditionalFilter.stories.js

@@ -96,7 +96,9 @@ export var Default = function Default() {
       setEditOverviewVisible = _React$useState4[1];
 
   return ___EmotionJSX(React.Fragment, null, ___EmotionJSX(OverlayProvider, null, ___EmotionJSX(Button, {
-    onPress: setStaticOverviewVisible
+    onPress: function onPress() {
+      return setStaticOverviewVisible(true);
+    }
   }, "Open Panel"), staticOverviewVisible && ___EmotionJSX(OverlayPanel, {
     isOpen: staticOverviewVisible
   }, ___EmotionJSX(Box, null, ___EmotionJSX(Box, {
@@ -111,7 +113,9 @@ export var Default = function Default() {
     "aria-label": "edit",
     variant: "inverted",
     ml: "xs",
-    onPress: setEditOverviewVisible
+    onPress: function onPress() {
+      return setEditOverviewVisible(true);
+    }
   }, ___EmotionJSX(Icon, {
     icon: CreateIcon,
     size: 14
@@ -435,7 +439,7 @@ export var Default = function Default() {
     onPress: function onPress() {
       return setEditOverviewVisible(false);
     },
-    variant: "text",
+    variant: "link",
     "aria-label": "cancel"
   }, "Cancel"))))));
 };

package/lib/recipes/RadioButtonsWithLinks.stories.js

@@ -48,7 +48,7 @@ export var Default = function Default() {
       label: fieldName,
       isDisabled: isDisabled
     }), ___EmotionJSX(Button, {
-      variant: "text",
+      variant: "link",
       mb: "xs",
       ml: "md",
       onPress: function onPress() {

package/lib/styles/variants/buttons.js

@@ -295,6 +295,11 @@ var helpHint = _objectSpread(_objectSpread({}, iconButton), {}, {
   ml: '5px',
   maxWidth: '13px',
   maxHeight: '14px',
+  borderRadius: '5.5px',
+  'svg': {
+    'height': '100%',
+    mb: 0.75
+  },
   'path': {
     fill: 'neutral.20'
   },
@@ -354,7 +359,7 @@ var chipDeleteButton = {
   borderRadius: '50%',
   cursor: 'pointer',
   height: 14,
-  ml: 'xs',
+  mx: '3px !important',
   p: 0,
   width: 14,
   '&.is-focused, &.is-hovered': {
@@ -534,6 +539,75 @@ var tooltipInline = _objectSpread(_objectSpread({}, text), {}, {
   }
 });
 
+var defaultVariant = _objectSpread(_objectSpread({}, base), {}, {
+  bg: 'white',
+  border: '1px solid',
+  borderColor: 'active',
+  '&.is-hovered': _objectSpread({}, defaultHover),
+  '&.is-pressed': _objectSpread({}, defaultActive),
+  '&.is-focused': _objectSpread({}, defaultFocus)
+});
+
+var filter = _objectSpread(_objectSpread({}, defaultVariant), {}, {
+  px: 'sm',
+  borderColor: 'neutral.80',
+  height: 40,
+  color: 'active',
+  display: 'flex'
+});
+
+var colorBlock = {
+  bg: 'neutral.95',
+  border: '1px solid',
+  borderColor: 'neutral.90',
+  borderRadius: 10,
+  outline: 'none',
+  cursor: 'pointer',
+  width: 150,
+  minHeight: 40,
+  p: '5px 15px',
+  display: 'flex',
+  justifyContent: 'space-between',
+  alignItems: 'center',
+  '&.is-hovered': {
+    bg: 'neutral.80'
+  },
+  '&.is-focused': _objectSpread({}, defaultFocus),
+  '&.is-pressed': {
+    bg: 'neutral.60',
+    borderColor: 'neutral.60'
+  },
+  '& span': {
+    color: 'text.primary',
+    textAlign: 'left'
+  },
+  '&>div': {
+    alignItems: 'baseline'
+  },
+  '&>svg': {
+    color: 'text.secondary',
+    fill: 'text.secondary'
+  },
+  '&.is-configured': {
+    bg: 'active',
+    borderColor: 'active',
+    '& span': {
+      color: 'white'
+    },
+    '&>svg': {
+      color: 'white',
+      fill: 'white'
+    }
+  },
+  '&.is-configured.is-hovered': {
+    bg: 'accent.40',
+    borderColor: 'accent.40'
+  },
+  '&.is-configured.is-pressed': {
+    bg: 'accent.20',
+    borderColor: 'accent.20'
+  }
+};
 export default {
   accordionHeader: accordionHeader,
   chipDeleteButton: chipDeleteButton,
@@ -554,6 +628,7 @@ export default {
   environmentBreadcrumb: environmentBreadcrumb,
   expandableRow: expandableRow,
   fileInputField: fileInputField,
+  filter: filter,
   iconButton: iconButton,
   imageUpload: imageUpload,
   inline: inline,
@@ -573,5 +648,6 @@ export default {
   invertedSquare: invertedSquare,
   tooltipChip: tooltipChip,
   tooltipIconButton: tooltipIconButton,
-  tooltipInline: tooltipInline
+  tooltipInline: tooltipInline,
+  colorBlock: colorBlock
 };

package/lib/styles/variants/text.js

@@ -158,6 +158,20 @@ export var text = {
     color: 'accent.30',
     fontFamily: 'standard'
   }),
+  buttonTitle: _objectSpread(_objectSpread({}, wordWrap), {}, {
+    fontSize: 'xs',
+    fontWeight: 0,
+    color: 'text.primary',
+    fontFamily: 'standard',
+    lineHeight: '13px'
+  }),
+  buttonSubtitle: _objectSpread(_objectSpread({}, wordWrap), {}, {
+    fontSize: 'sm',
+    fontWeight: 3,
+    color: 'text.primary',
+    fontFamily: 'standard',
+    lineHeight: '16px'
+  }),
   capsLabel: _objectSpread(_objectSpread({}, wordWrap), {}, {
     color: 'text.secondary',
     textTransform: 'uppercase',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "1.2.0-alpha.1",
+  "version": "1.2.0-alpha.13",
   "description": "PingUX themeable React component library",
   "author": "uxdev@pingidentity.com",
   "license": "Apache-2.0",
@@ -132,7 +132,7 @@
     "lodash": "^4.17.21",
     "mdi-react": "^7.4.0",
     "moment": "^2.29.1",
-    "prism-react-renderer": "^1.2.1",
+    "prism-react-renderer": "1.2.1",
     "prop-types": "^15.7.2",
     "react-calendar": "^3.4.0",
     "react-color": "^2.19.3",