@pingux/astro 2.26.0-alpha.0 → 2.26.0-alpha.2

package/lib/cjs/components/ColorField/ColorField.js

@@ -127,7 +127,7 @@ var ColorField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     restoreFocus: true,
     contain: true,
     autoFocus: true
-  }, (0, _react2.jsx)(_reactColor.ChromePicker, {
+  }, (0, _react2.jsx)(_reactColor.SketchPicker, {
     color: getRgbaFromState(state),
     onChange: handleColorChange
   }))));

package/lib/cjs/components/ColorField/ColorField.mdx

@@ -29,10 +29,11 @@ These keys provide additional functionality to the component.
 | Shift + Tab | Moves focus to the previous focusable component. |
 | Space or Enter | Opens the color swatch when it is focused. Once opened, the focus moves to the input field and is locked inside the ColorPicker Overlay. |
 | Esc | When the picker is open, pressing the escape key closes the overlay and focuses on the previously focused component. |
+| Up and Down Arrows | Using the up and down arrows on any of the RGBA inputs adjusts the value of the input in focus.
 
 #### Screen Readers
 
 This component uses the following attributes to assist screen readers:
-- The trigger button uses the **`aria-expanded`** attribute to indicate the expansion and collapse of Chrome Picker.
-- When expanded, **`aria-controls`** is added to the button pointing to the Chrome Picker.
+- The trigger button uses the **`aria-expanded`** attribute to indicate the expansion and collapse of Sketch Picker.
+- When expanded, **`aria-controls`** is added to the button pointing to the Sketch Picker.
 - The visibly hidden input uses the **`aria-labelledby`** attribute supplied with label ID.

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

@@ -304,7 +304,8 @@ var Warning = function Warning() {
     onVisibleChange: onVisibleChange,
     isVisible: isVisible,
     label: "Example Label",
-    status: "warning"
+    status: "warning",
+    helperText: "This might match a password you\u2019ve used before."
   });
 };
 exports.Warning = Warning;
@@ -320,7 +321,8 @@ var Success = function Success() {
     onVisibleChange: onVisibleChange,
     isVisible: isVisible,
     label: "Example Label",
-    status: "success"
+    status: "success",
+    helperText: "This password meets requirements."
   });
 };
 exports.Success = Success;

package/lib/components/ColorField/ColorField.js

@@ -13,7 +13,7 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context5, _context6; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context5 = ownKeys(Object(source), !0)).call(_context5, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context6 = ownKeys(Object(source))).call(_context6, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
 import React, { forwardRef, useCallback, useImperativeHandle, useRef } from 'react';
 import { FocusScope, mergeProps, useOverlayPosition, useOverlayTrigger, useVisuallyHidden } from 'react-aria';
-import { ChromePicker } from 'react-color';
+import { SketchPicker } from 'react-color';
 import { useOverlayTriggerState } from 'react-stately';
 import { useColorField } from '@react-aria/color';
 import { useColorFieldState } from '@react-stately/color';
@@ -116,7 +116,7 @@ var ColorField = /*#__PURE__*/forwardRef(function (props, ref) {
     restoreFocus: true,
     contain: true,
     autoFocus: true
-  }, ___EmotionJSX(ChromePicker, {
+  }, ___EmotionJSX(SketchPicker, {
     color: getRgbaFromState(state),
     onChange: handleColorChange
   }))));

package/lib/components/ColorField/ColorField.mdx

@@ -29,10 +29,11 @@ These keys provide additional functionality to the component.
 | Shift + Tab | Moves focus to the previous focusable component. |
 | Space or Enter | Opens the color swatch when it is focused. Once opened, the focus moves to the input field and is locked inside the ColorPicker Overlay. |
 | Esc | When the picker is open, pressing the escape key closes the overlay and focuses on the previously focused component. |
+| Up and Down Arrows | Using the up and down arrows on any of the RGBA inputs adjusts the value of the input in focus.
 
 #### Screen Readers
 
 This component uses the following attributes to assist screen readers:
-- The trigger button uses the **`aria-expanded`** attribute to indicate the expansion and collapse of Chrome Picker.
-- When expanded, **`aria-controls`** is added to the button pointing to the Chrome Picker.
+- The trigger button uses the **`aria-expanded`** attribute to indicate the expansion and collapse of Sketch Picker.
+- When expanded, **`aria-controls`** is added to the button pointing to the Sketch Picker.
 - The visibly hidden input uses the **`aria-labelledby`** attribute supplied with label ID.

package/lib/components/PasswordField/PasswordField.stories.js

@@ -283,7 +283,8 @@ export var Warning = function Warning() {
     onVisibleChange: onVisibleChange,
     isVisible: isVisible,
     label: "Example Label",
-    status: "warning"
+    status: "warning",
+    helperText: "This might match a password you\u2019ve used before."
   });
 };
 export var Success = function Success() {
@@ -298,7 +299,8 @@ export var Success = function Success() {
     onVisibleChange: onVisibleChange,
     isVisible: isVisible,
     label: "Example Label",
-    status: "success"
+    status: "success",
+    helperText: "This password meets requirements."
   });
 };
 export var DynamicRequired = function DynamicRequired() {

package/package.json

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