@pingux/astro 2.30.0 → 2.31.0-alpha.0

package/lib/cjs/components/Badge/Badge.styles.js

@@ -42,6 +42,14 @@ var baseBadge = {
   }
 };
 exports.baseBadge = baseBadge;
+var defaultBadge = _objectSpread(_objectSpread({}, baseBadge), {}, {
+  backgroundColor: 'white !important',
+  outline: '1px solid',
+  outlineColor: 'neutral.80',
+  '& span': {
+    color: 'text.primary'
+  }
+});
 var multivaluesBadge = _objectSpread(_objectSpread({}, baseBadge), {}, {
   alignSelf: 'center',
   cursor: 'default',
@@ -188,24 +196,25 @@ var activeStatusBadge = _objectSpread(_objectSpread({}, statusBadge), {}, {
   backgroundColor: '#F7F8FD !important'
 });
 var _default = {
+  activeStatusBadge: activeStatusBadge,
+  badgeDeleteButton: badgeDeleteButton,
   baseBadge: baseBadge,
+  convenienceDefault: convenienceDefault,
+  countBadge: countBadge,
+  countNeutral: countNeutral,
+  criticalStatusBadge: criticalStatusBadge,
+  defaultBadge: defaultBadge,
+  deleteButton: deleteButton,
   environmentBadge: environmentBadge,
+  errorCalloutBadge: errorCalloutBadge,
+  healthyStatusBadge: healthyStatusBadge,
+  infoCalloutBadge: infoCalloutBadge,
   itemBadgeWithSlot: itemBadgeWithSlot,
   multivaluesBadge: multivaluesBadge,
   readOnlyBadge: readOnlyBadge,
   selectedItemBadge: selectedItemBadge,
-  deleteButton: deleteButton,
-  countBadge: countBadge,
-  countNeutral: countNeutral,
-  badgeDeleteButton: badgeDeleteButton,
-  convenienceDefault: convenienceDefault,
-  errorCalloutBadge: errorCalloutBadge,
-  warningCalloutBadge: warningCalloutBadge,
   successCalloutBadge: successCalloutBadge,
-  infoCalloutBadge: infoCalloutBadge,
-  criticalStatusBadge: criticalStatusBadge,
-  warningStatusBadge: warningStatusBadge,
-  healthyStatusBadge: healthyStatusBadge,
-  activeStatusBadge: activeStatusBadge
+  warningCalloutBadge: warningCalloutBadge,
+  warningStatusBadge: warningStatusBadge
 };
 exports["default"] = _default;

package/lib/cjs/components/TreeView/TreeView.js

@@ -76,6 +76,7 @@ var TreeView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     selectionMode: 'single',
     disallowEmptySelection: true
   }, others));
+  var level = 0;
   var ariaLabel = props['aria-label'];
   var listBoxOptions = {
     disabledKeys: disabledKeys,
@@ -100,16 +101,22 @@ var TreeView = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     sx: {
       overflow: 'hidden'
     }
-  }, others), (0, _map["default"])(_context = (0, _from["default"])(state.collection)).call(_context, function (item) {
+  }, others), (0, _map["default"])(_context = (0, _from["default"])(state.collection)).call(_context, function (item, index) {
     return SectionOrItemRender(item.props.items.length > 0, (0, _react2.jsx)(_index.TreeViewSection, {
       item: item,
       items: item.props.items,
       title: item.props.title,
-      key: item.props.title
+      key: item.props.title,
+      level: level + 1,
+      setSize: state.collection.size,
+      position: index
     }), (0, _react2.jsx)(_index.TreeViewItem, {
       item: item,
       title: item.value.value.title,
-      key: item.value.value.title
+      key: item.value.value.title,
+      level: level + 1,
+      position: index,
+      setSize: state.collection.size
     }));
   })));
 });

package/lib/cjs/components/TreeView/TreeView.test.js

@@ -151,6 +151,21 @@ test('disabledKeys prop disables items in the tree -- rendering them unclickable
   expect(thisItem).not.toHaveClass('is-selected');
   expect(thisItem).toHaveAttribute('aria-selected', 'false');
 });
+test('displays correct aria attributes', function () {
+  (0, _testWrapper.render)((0, _react2.jsx)(TreeViewComponent, null));
+  var listItems = _testWrapper.screen.getAllByRole('treeitem');
+  var lastTreeItem = listItems[2];
+  expect(lastTreeItem).toHaveAttribute('aria-level', '1');
+  expect(lastTreeItem).toHaveAttribute('aria-posinset', '3');
+  expect(lastTreeItem).toHaveAttribute('aria-setsize', '3');
+  var buttons = _testWrapper.screen.queryAllByRole('button');
+  _testWrapper.fireEvent.click(buttons[1]);
+  var expandedItems = _testWrapper.screen.getAllByRole('treeitem');
+  var nestedItem = expandedItems[2];
+  expect(nestedItem).toHaveAttribute('aria-level', '2');
+  expect(nestedItem).toHaveAttribute('aria-posinset', '1');
+  expect(nestedItem).toHaveAttribute('aria-setsize', '1');
+});
 var firstJSX = (0, _react2.jsx)("p", null, "first");
 var secondJSX = (0, _react2.jsx)("p", null, "second");
 test('Section or Item Render renders first item if condition is true', function () {

package/lib/cjs/components/TreeView/TreeViewItem.js

@@ -22,7 +22,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "functi
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 var TreeViewItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var item = props.item,
-    title = props.title;
+    title = props.title,
+    level = props.level,
+    position = props.position,
+    setSize = props.setSize;
   var key = item.key;
   var treeItemRef = (0, _react.useRef)();
   /* istanbul ignore next */
@@ -42,7 +45,10 @@ var TreeViewItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     as: "li",
     isRow: true,
     ref: treeItemRef,
-    "aria-disabled": isDisabled
+    "aria-disabled": isDisabled,
+    "aria-level": level,
+    "aria-posinset": position + 1,
+    "aria-setsize": setSize
   }, optionProps, {
     role: "treeitem",
     sx: {
@@ -67,7 +73,10 @@ TreeViewItem.propTypes = {
     key: _propTypes["default"].string
   }),
   name: _propTypes["default"].string,
-  title: _propTypes["default"].string
+  title: _propTypes["default"].string,
+  level: _propTypes["default"].number,
+  position: _propTypes["default"].number,
+  setSize: _propTypes["default"].number
 };
 var _default = TreeViewItem;
 exports["default"] = _default;

package/lib/cjs/components/TreeView/TreeViewSection.js

@@ -16,7 +16,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _listbox = require("@react-aria/listbox");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _TreeViewContext = require("../../context/TreeViewContext");
-var _index = require("../../index");
+var _index2 = require("../../index");
 var _TreeView = require("./TreeView");
 var _TreeViewRow = _interopRequireDefault(require("./TreeViewRow"));
 var _react2 = require("@emotion/react");
@@ -26,7 +26,10 @@ var TreeViewSection = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
   var _context;
   var item = props.item,
     items = props.items,
-    title = props.title;
+    title = props.title,
+    level = props.level,
+    position = props.position,
+    setSize = props.setSize;
   var key = item.key;
   var treeSectionRef = (0, _react.useRef)();
   /* istanbul ignore next */
@@ -42,7 +45,7 @@ var TreeViewSection = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     isDisabled = _useOption.isDisabled,
     isSelected = _useOption.isSelected;
   var isExpanded = state.expandedKeys.has(key);
-  return (0, _react2.jsx)(_index.Box, (0, _extends2["default"])({
+  return (0, _react2.jsx)(_index2.Box, (0, _extends2["default"])({
     ref: treeSectionRef,
     as: "li",
     sx: {
@@ -51,7 +54,10 @@ var TreeViewSection = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
       }
     },
     "aria-expanded": isExpanded,
-    "aria-disabled": isDisabled
+    "aria-disabled": isDisabled,
+    "aria-level": level,
+    "aria-setsize": setSize,
+    "aria-posinset": position + 1
   }, optionProps, {
     role: "treeitem",
     "aria-selected": isSelected
@@ -62,24 +68,30 @@ var TreeViewSection = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
     isExpanded: isExpanded,
     isSelected: isSelected,
     isDisabled: isDisabled
-  }), isExpanded && (0, _react2.jsx)(_index.Box, {
+  }), isExpanded && (0, _react2.jsx)(_index2.Box, {
     as: "ul",
     role: "group",
     key: "".concat(item.key, " ul"),
     sx: {
       pl: 'md'
     }
-  }, (0, _map["default"])(_context = (0, _from["default"])(items)).call(_context, function (_item) {
+  }, (0, _map["default"])(_context = (0, _from["default"])(items)).call(_context, function (_item, _index) {
     var _item$value$items;
     return (0, _TreeView.SectionOrItemRender)(((_item$value$items = _item.value.items) === null || _item$value$items === void 0 ? void 0 : _item$value$items.length) > 0, (0, _react2.jsx)(TreeViewSection, {
       item: _item,
       items: _item.children,
       title: _item.value.title,
-      key: _item.value.title
-    }), (0, _react2.jsx)(_index.TreeViewItem, {
+      key: _item.value.title,
+      level: level + 1,
+      position: _index,
+      setSize: items.length
+    }), (0, _react2.jsx)(_index2.TreeViewItem, {
       item: _item,
       title: _item.value.title,
-      key: _item.value.title
+      key: _item.value.title,
+      level: level + 1,
+      position: _index,
+      setSize: items.length
     }));
   })));
 });
@@ -88,7 +100,10 @@ TreeViewSection.propTypes = {
   item: _propTypes["default"].shape({
     key: _propTypes["default"].string
   }),
-  title: _propTypes["default"].string
+  title: _propTypes["default"].string,
+  level: _propTypes["default"].number,
+  position: _propTypes["default"].number,
+  setSize: _propTypes["default"].number
 };
 var _default = TreeViewSection;
 exports["default"] = _default;

package/lib/cjs/index.d.ts

@@ -65,6 +65,7 @@ export { default as HelpHint } from './components/HelpHint';
 export * from './components/HelpHint';
 export { default as Icon } from './components/Icon';
 export * from './components/Icon';
+export { NoticeIcon } from './components/Icon/NoticeIcon';
 export { default as IconBadge } from './components/IconBadge';
 export * from './components/IconBadge';
 export { default as IconButton } from './components/IconButton';

package/lib/cjs/index.js

@@ -54,6 +54,7 @@ var _exportNames = {
   FileInputField: true,
   HelpHint: true,
   Icon: true,
+  NoticeIcon: true,
   IconBadge: true,
   IconButton: true,
   IconButtonToggle: true,
@@ -550,6 +551,12 @@ _Object$defineProperty(exports, "NavBarSection", {
     return _NavBarSection["default"];
   }
 });
+_Object$defineProperty(exports, "NoticeIcon", {
+  enumerable: true,
+  get: function get() {
+    return _NoticeIcon.NoticeIcon;
+  }
+});
 _Object$defineProperty(exports, "NumberField", {
   enumerable: true,
   get: function get() {
@@ -1147,6 +1154,7 @@ _forEachInstanceProperty(_context25 = _Object$keys(_Icon)).call(_context25, func
     }
   });
 });
+var _NoticeIcon = require("./components/Icon/NoticeIcon");
 var _IconBadge = _interopRequireWildcard(require("./components/IconBadge"));
 _forEachInstanceProperty(_context26 = _Object$keys(_IconBadge)).call(_context26, function (key) {
   if (key === "default" || key === "__esModule") return;