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

package/lib/styles/themes/next-gen/variants/button.js

@@ -13,6 +13,7 @@ import chroma from 'chroma-js';
 import { copyButton } from '../codeView/codeView';
 import colors from '../colors/colors';
 import tShirtSizes from '../customProperties/tShirtSizes';
+import { commonContentProps } from './box';
 var primaryBlue = colors.primary,
   primaryBlueHover = colors.active_hover,
   primaryBluePress = colors.active_pressed,
@@ -109,8 +110,19 @@ var secondary = _objectSpread(_objectSpread({}, buttonBase), {}, {
 var tertiary = _objectSpread(_objectSpread({}, buttonBase), {}, {
   backgroundColor: 'transparent',
   borderColor: 'border.base',
-  color: 'text.secondary',
-  '&.is-hovered': _objectSpread({}, boxShadowNone)
+  color: 'font.base',
+  '&.is-focused': _objectSpread(_objectSpread({}, defaultFocus), {}, {
+    outlineColor: 'gray-700',
+    backgroundColor: 'background.secondary'
+  }),
+  '&.is-pressed': {
+    backgroundColor: 'background.secondary',
+    color: 'font.base'
+  },
+  '&.is-hovered': _objectSpread({
+    backgroundColor: 'background.secondary',
+    color: 'font.base'
+  }, boxShadowNone)
 });
 var outlineCritical = _objectSpread(_objectSpread({}, buttonBase), {}, {
   backgroundColor: 'transparent',
@@ -500,7 +512,21 @@ var iconButtons = {
       }
     }
   }),
-  hintButton: _objectSpread({}, hintButton)
+  hintButton: _objectSpread({}, hintButton),
+  passwordVisibilityIcon: _objectSpread(_objectSpread(_objectSpread({}, baseIconButton), commonContentProps), {}, {
+    right: 0,
+    padding: '12px 20px',
+    border: '0px solid !important',
+    '&:hover, &.is-pressed': {
+      background: 'transparent',
+      boxShadow: 'none'
+    },
+    '&.is-focused': {
+      outline: '2px solid',
+      outlineOffset: '2px',
+      outlineColor: 'gray-700'
+    }
+  })
 };
 var listBoxLink = {
   color: 'active',
@@ -529,6 +555,15 @@ var listBoxLink = {
     }
   })
 };
+var ButtonInputGroupContentRight = _objectSpread(_objectSpread(_objectSpread({}, tertiary), commonContentProps), {}, {
+  right: 0,
+  padding: '12px 20px',
+  borderRadius: '0px 4px 4px 0px !important',
+  borderWidth: '0px !important',
+  borderLeftWidth: '1px !important',
+  borderRightWidth: '1px !important',
+  borderLeftColor: 'gray-500'
+});
 var buttons = {
   neutral: neutral,
   primary: primary,
@@ -552,6 +587,7 @@ var buttons = {
   iconButtons: iconButtons,
   modalCloseButton: modalCloseButton,
   aiChat: aiChat,
-  paginationMenu: paginationMenu
+  paginationMenu: paginationMenu,
+  ButtonInputGroupContentRight: ButtonInputGroupContentRight
 };
 export default buttons;

package/lib/styles/themes/next-gen/variants/input.js

@@ -192,4 +192,25 @@ input.promptInputAttachmentWrapper = {
   overflowY: 'hidden',
   whiteSpace: 'nowrap',
   px: '.75rem'
+};
+input.dropDownContentRight = {
+  background: 'inherit',
+  '& button': {
+    borderRadius: '0px 4px 4px 0px !important',
+    '&.is-focused': {
+      outline: '2px solid',
+      outlineOffset: '2px',
+      outlineColor: 'gray-700'
+    }
+  }
+};
+input.dropDownContentLeft = {
+  '& button': {
+    borderRadius: '4px 0px 0px 4px !important',
+    '&.is-focused': {
+      outline: '2px solid',
+      outlineOffset: '2px',
+      outlineColor: 'gray-700'
+    }
+  }
 };

package/lib/styles/themes/next-gen/variants/variants.js

@@ -12,9 +12,9 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 import attachment from '../../../../components/AIComponents/Attachment/Attachment.styles';
 import skeleton from '../../../../components/Skeleton/Skeleton.styles';
 import codeView from '../codeView/codeView';
-import colors from '../colors/colors';
 import accordion from './accordion';
 import { avatar } from './avatar';
+import { box } from './box';
 import button, { defaultFocus } from './button';
 import callout from './callout';
 import { dataTable } from './dataTable';
@@ -382,21 +382,7 @@ export default {
   attachment: attachment,
   avatar: avatar,
   breadcrumb: breadcrumb,
-  box: {
-    indeterminateCheckboxIcon: {
-      height: '19.25px',
-      width: '19.25px',
-      '&.is-disabled': {
-        '& rect[id="indeterminate-checkbox-icon-wrapper"]': {
-          fill: 'gray-500',
-          stroke: 'gray-500'
-        }
-      },
-      '&.is-focused': {
-        boxShadow: "inset 0px 0px 0px 1px ".concat(colors.focus)
-      }
-    }
-  },
+  box: box,
   buttonBar: buttonBar,
   callout: callout,
   codeView: codeView,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.150.0-alpha.1",
+  "version": "2.150.0-alpha.2",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",