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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -171,9 +171,12 @@ var PasswordField = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
171
171
  placement: placement,
172
172
  ref: popoverRef,
173
173
  style: style
174
+ }, (0, _react2.jsx)(_.Box, {
175
+ role: "alert",
176
+ "aria-label": "requirements list"
174
177
  }, (0, _react2.jsx)(_.RequirementsList, (0, _extends2["default"])({
175
178
  requirements: requirements
176
- }, requirementsListProps))));
179
+ }, requirementsListProps)))));
177
180
  });
178
181
  PasswordField.propTypes = _objectSpread(_objectSpread(_objectSpread({
179
182
  /** The rendered label for the field. */
@@ -20,10 +20,11 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/he
20
20
  var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
21
21
  var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/objectWithoutProperties"));
22
22
  var _react = _interopRequireWildcard(require("react"));
23
- var _AlertCircleIcon = _interopRequireDefault(require("mdi-react/AlertCircleIcon"));
24
- var _AlertCircleOutlineIcon = _interopRequireDefault(require("mdi-react/AlertCircleOutlineIcon"));
25
- var _CheckboxBlankCircleOutlineIcon = _interopRequireDefault(require("mdi-react/CheckboxBlankCircleOutlineIcon"));
26
- var _CheckCircleIcon = _interopRequireDefault(require("mdi-react/CheckCircleIcon"));
23
+ var _AlertCircleIcon = _interopRequireDefault(require("@pingux/mdi-react/AlertCircleIcon"));
24
+ var _AlertCircleOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/AlertCircleOutlineIcon"));
25
+ var _CheckboxBlankCircleOutlineIcon = _interopRequireDefault(require("@pingux/mdi-react/CheckboxBlankCircleOutlineIcon"));
26
+ var _CheckCircleIcon = _interopRequireDefault(require("@pingux/mdi-react/CheckCircleIcon"));
27
+ var _kebabCase = _interopRequireDefault(require("lodash/kebabCase"));
27
28
  var _propTypes = _interopRequireDefault(require("prop-types"));
28
29
  var _statusProp = require("../../utils/docUtils/statusProp");
29
30
  var _Box = _interopRequireDefault(require("../Box"));
@@ -43,10 +44,14 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
43
44
  var RequirementsList = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
44
45
  var requirements = props.requirements,
45
46
  others = (0, _objectWithoutProperties2["default"])(props, _excluded);
46
- var statusIconRender = function statusIconRender(status) {
47
+ var statusIconRender = function statusIconRender(status, key) {
47
48
  switch (status) {
48
49
  case 'success':
49
50
  return (0, _react2.jsx)(_Icon["default"], {
51
+ title: {
52
+ id: key,
53
+ name: 'Success Status Icon'
54
+ },
50
55
  icon: _CheckCircleIcon["default"],
51
56
  color: "success.bright",
52
57
  mr: "sm",
@@ -55,6 +60,10 @@ var RequirementsList = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
55
60
  });
56
61
  case 'warning':
57
62
  return (0, _react2.jsx)(_Icon["default"], {
63
+ title: {
64
+ id: key,
65
+ name: 'Warning Status Icon'
66
+ },
58
67
  icon: _AlertCircleOutlineIcon["default"],
59
68
  color: "warning.bright",
60
69
  mr: "sm",
@@ -63,6 +72,10 @@ var RequirementsList = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
63
72
  });
64
73
  case 'error':
65
74
  return (0, _react2.jsx)(_Icon["default"], {
75
+ title: {
76
+ id: key,
77
+ name: 'Error Status Icon'
78
+ },
66
79
  icon: _AlertCircleIcon["default"],
67
80
  color: "critical.bright",
68
81
  mr: "sm",
@@ -71,6 +84,10 @@ var RequirementsList = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
71
84
  });
72
85
  default:
73
86
  return (0, _react2.jsx)(_Icon["default"], {
87
+ title: {
88
+ id: key,
89
+ name: 'Empty Status Icon'
90
+ },
74
91
  icon: _CheckboxBlankCircleOutlineIcon["default"],
75
92
  color: "neutral.40",
76
93
  mr: "sm",
@@ -87,7 +104,7 @@ var RequirementsList = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
87
104
  alignItems: "center",
88
105
  width: "100%",
89
106
  as: "li"
90
- }, statusIconRender(req.status), (0, _react2.jsx)(_Text["default"], {
107
+ }, statusIconRender(req.status, (0, _kebabCase["default"])(req.name)), (0, _react2.jsx)(_Text["default"], {
91
108
  variant: "bodyWeak"
92
109
  }, req.name));
93
110
  };
@@ -159,9 +159,12 @@ var PasswordField = /*#__PURE__*/forwardRef(function (props, ref) {
159
159
  placement: placement,
160
160
  ref: popoverRef,
161
161
  style: style
162
+ }, ___EmotionJSX(Box, {
163
+ role: "alert",
164
+ "aria-label": "requirements list"
162
165
  }, ___EmotionJSX(RequirementsList, _extends({
163
166
  requirements: requirements
164
- }, requirementsListProps))));
167
+ }, requirementsListProps)))));
165
168
  });
166
169
  PasswordField.propTypes = _objectSpread(_objectSpread(_objectSpread({
167
170
  /** The rendered label for the field. */
@@ -14,10 +14,11 @@ import _Object$getOwnPropertyDescriptors from "@babel/runtime-corejs3/core-js-st
14
14
  import _Object$defineProperties from "@babel/runtime-corejs3/core-js-stable/object/define-properties";
15
15
  import _Object$defineProperty from "@babel/runtime-corejs3/core-js-stable/object/define-property";
16
16
  import React, { forwardRef } from 'react';
17
- import ErrorCircle from 'mdi-react/AlertCircleIcon';
18
- import WarningCircle from 'mdi-react/AlertCircleOutlineIcon';
19
- import DefaultCircle from 'mdi-react/CheckboxBlankCircleOutlineIcon';
20
- import SuccessCircle from 'mdi-react/CheckCircleIcon';
17
+ import ErrorCircle from '@pingux/mdi-react/AlertCircleIcon';
18
+ import WarningCircle from '@pingux/mdi-react/AlertCircleOutlineIcon';
19
+ import DefaultCircle from '@pingux/mdi-react/CheckboxBlankCircleOutlineIcon';
20
+ import SuccessCircle from '@pingux/mdi-react/CheckCircleIcon';
21
+ import kebabCase from 'lodash/kebabCase';
21
22
  import PropTypes from 'prop-types';
22
23
  import { statusPropTypes } from '../../utils/docUtils/statusProp';
23
24
  import Box from '../Box';
@@ -32,10 +33,14 @@ import { jsx as ___EmotionJSX } from "@emotion/react";
32
33
  var RequirementsList = /*#__PURE__*/forwardRef(function (props, ref) {
33
34
  var requirements = props.requirements,
34
35
  others = _objectWithoutProperties(props, _excluded);
35
- var statusIconRender = function statusIconRender(status) {
36
+ var statusIconRender = function statusIconRender(status, key) {
36
37
  switch (status) {
37
38
  case 'success':
38
39
  return ___EmotionJSX(Icon, {
40
+ title: {
41
+ id: key,
42
+ name: 'Success Status Icon'
43
+ },
39
44
  icon: SuccessCircle,
40
45
  color: "success.bright",
41
46
  mr: "sm",
@@ -44,6 +49,10 @@ var RequirementsList = /*#__PURE__*/forwardRef(function (props, ref) {
44
49
  });
45
50
  case 'warning':
46
51
  return ___EmotionJSX(Icon, {
52
+ title: {
53
+ id: key,
54
+ name: 'Warning Status Icon'
55
+ },
47
56
  icon: WarningCircle,
48
57
  color: "warning.bright",
49
58
  mr: "sm",
@@ -52,6 +61,10 @@ var RequirementsList = /*#__PURE__*/forwardRef(function (props, ref) {
52
61
  });
53
62
  case 'error':
54
63
  return ___EmotionJSX(Icon, {
64
+ title: {
65
+ id: key,
66
+ name: 'Error Status Icon'
67
+ },
55
68
  icon: ErrorCircle,
56
69
  color: "critical.bright",
57
70
  mr: "sm",
@@ -60,6 +73,10 @@ var RequirementsList = /*#__PURE__*/forwardRef(function (props, ref) {
60
73
  });
61
74
  default:
62
75
  return ___EmotionJSX(Icon, {
76
+ title: {
77
+ id: key,
78
+ name: 'Empty Status Icon'
79
+ },
63
80
  icon: DefaultCircle,
64
81
  color: "neutral.40",
65
82
  mr: "sm",
@@ -76,7 +93,7 @@ var RequirementsList = /*#__PURE__*/forwardRef(function (props, ref) {
76
93
  alignItems: "center",
77
94
  width: "100%",
78
95
  as: "li"
79
- }, statusIconRender(req.status), ___EmotionJSX(Text, {
96
+ }, statusIconRender(req.status, kebabCase(req.name)), ___EmotionJSX(Text, {
80
97
  variant: "bodyWeak"
81
98
  }, req.name));
82
99
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pingux/astro",
3
- "version": "2.5.1-alpha.1",
3
+ "version": "2.5.1-alpha.2",
4
4
  "description": "PingUX themeable React component library",
5
5
  "repository": {
6
6
  "type": "git",