@pingux/astro 2.41.0 → 2.42.0-alpha.0

package/lib/components/TreeView/TreeViewSection.js

@@ -1,13 +1,16 @@
+import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
 import _someInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/some";
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import _filterInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/filter";
+import _forEachInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/for-each";
 import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
 import _Array$from from "@babel/runtime-corejs3/core-js-stable/array/from";
-import React, { forwardRef, useImperativeHandle, useRef } from 'react';
+import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from 'react';
 import { useOption } from '@react-aria/listbox';
+import { VisuallyHidden } from '@react-aria/visually-hidden';
 import PropTypes from 'prop-types';
 import { useTreeViewContext } from '../../context/TreeViewContext';
-import { Box, TreeViewItem } from '../../index';
+import { Box, Loader, TreeViewItem } from '../../index';
 import InsertionIndicator from './InsertionIndicator';
 import { SectionOrItemRender } from './TreeView';
 import { sectionPressHandlers } from './TreeViewKeyboardDelegate';
@@ -94,6 +97,8 @@ var TreeViewSection = /*#__PURE__*/forwardRef(function (props, ref) {
   var item = props.item,
     items = props.items,
     title = props.title,
+    hasChildren = props.hasChildren,
+    loadingNodes = props.loadingNodes,
     focusManager = props.focusManager,
     onKeyDown = props.onKeyDown,
     level = props.level,
@@ -101,6 +106,7 @@ var TreeViewSection = /*#__PURE__*/forwardRef(function (props, ref) {
     setSize = props.setSize;
   var key = item.key;
   var treeSectionRef = useRef();
+
   /* istanbul ignore next */
   useImperativeHandle(ref, function () {
     return treeSectionRef.current;
@@ -120,6 +126,17 @@ var TreeViewSection = /*#__PURE__*/forwardRef(function (props, ref) {
     isDisabled = _useOption.isDisabled;
   var isExpanded = state.expandedKeys.has(key);
   var isDragging = dragState.isDragging(item.key);
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    loaderState = _useState2[0],
+    setLoaderState = _useState2[1];
+  useEffect(function () {
+    if (loadingNodes) {
+      _forEachInstanceProperty(loadingNodes).call(loadingNodes, function (loader) {
+        if (loader.node === title) setLoaderState(loader.loadingState);
+      });
+    }
+  }, [loadingNodes, title]);
   var onKeyDownFunction = function onKeyDownFunction(e) {
     onKeyDownSection(e, state, key, tree, isSelected, isExpanded, focusManager, flatKeyArray, refArray, pageLength, true);
     if (onKeyDown) {
@@ -150,7 +167,8 @@ var TreeViewSection = /*#__PURE__*/forwardRef(function (props, ref) {
     items: items,
     isDragging: isDragging,
     isExpanded: isExpanded,
-    onKeyDown: onKeyDownFunction
+    onKeyDown: onKeyDownFunction,
+    hasChildren: hasChildren
   }), isExpanded && ___EmotionJSX(Box, {
     role: "rowgroup",
     key: "".concat(item.key, " ul"),
@@ -160,13 +178,22 @@ var TreeViewSection = /*#__PURE__*/forwardRef(function (props, ref) {
         border: 'none'
       }
     }
-  }, _mapInstanceProperty(_context3 = _Array$from(items)).call(_context3, function (_item, _index) {
+  }, ___EmotionJSX(VisuallyHidden, {
+    "aria-live": "polite"
+  }, loaderState === false && (isExpanded && items.length > 0 ? ' Loading successful' : 'Loading unsuccessful')), loaderState ? ___EmotionJSX(Loader, {
+    color: "active",
+    ml: "31px"
+  }) : _mapInstanceProperty(_context3 = _Array$from(items)).call(_context3, function (_item, _index) {
     var _item$children;
-    return SectionOrItemRender(((_item$children = _item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) > 0, ___EmotionJSX(TreeViewSection, {
+    return SectionOrItemRender(
+    // _item.value.items?.length > 0 || _item.value.items,
+    ((_item$children = _item.children) === null || _item$children === void 0 ? void 0 : _item$children.length) > 0 || _item.value.items, ___EmotionJSX(TreeViewSection, {
       item: _item,
       items: _item.children,
       title: _item.value.title,
       key: _item.value.title,
+      hasChildren: _item.value.items && true,
+      loadingNodes: loadingNodes,
       focusManager: focusManager,
       level: level + 1,
       position: _index,
@@ -195,6 +222,8 @@ TreeViewSection.propTypes = {
     key: PropTypes.string
   }),
   title: PropTypes.string,
+  hasChildren: PropTypes.bool,
+  loadingNodes: PropTypes.arrayOf(PropTypes.shape({})),
   focusManager: PropTypes.shape({}),
   onKeyDown: PropTypes.func,
   level: PropTypes.number,

package/lib/types/card.js

@@ -0,0 +1 @@
+export {};

package/lib/types/index.js

@@ -2,6 +2,7 @@ export * from './badge';
 export * from './box';
 export * from './bracket';
 export * from './button';
+export * from './card';
 export * from './icon';
 export * from './item';
 export * from './link';

package/package.json

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