@pingux/astro 2.161.1-alpha.0 → 2.161.1-alpha.1

package/lib/components/Avatar/Avatar.js

@@ -34,14 +34,15 @@ var Avatar = /*#__PURE__*/forwardRef(function (props, ref) {
   var _useStatusClasses = useStatusClasses(className, _defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty(_defineProperty({}, "is-".concat(color), color), "size-".concat(size), size), "font-size-".concat(size), src ? false : size), 'is-square', isSquare), 'is-image', src), 'is-logo', isLogo)),
     classNames = _useStatusClasses.classNames;
   if (src) {
-    return ___EmotionJSX(Box, {
+    return ___EmotionJSX(Box, _extends({
       variant: "avatar",
       className: classNames
-    }, ___EmotionJSX(ThemeUIAvatar, _extends({
+    }, others), ___EmotionJSX(ThemeUIAvatar, {
       ref: ref,
       alt: alt,
-      src: src
-    }, others)));
+      src: src,
+      size: size
+    }));
   }
   return ___EmotionJSX(Box, _extends({
     variant: "avatar",

package/lib/components/Avatar/stories/AvatarNextGen.js

@@ -2,6 +2,8 @@ import React from 'react';
 import { Avatar } from '../../../index';
 import { jsx as ___EmotionJSX } from "@emotion/react";
 var AvatarNextGen = function AvatarNextGen() {
-  return ___EmotionJSX(Avatar, null);
+  return ___EmotionJSX(Avatar, {
+    color: "cyan"
+  });
 };
 export default AvatarNextGen;

package/lib/components/PanelHeader/PanelHeader.js

@@ -51,7 +51,7 @@ var PanelHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
     }
   }));
   var renderAvatar = ___EmotionJSX(Avatar, _extends({
-    color: "green",
+    color: image !== null && image !== void 0 && image.src ? false : 'green',
     src: image === null || image === void 0 ? void 0 : image.src,
     isSquare: !!(image !== null && image !== void 0 && image.src),
     size: "avatar.lg",

package/lib/components/PanelHeader/PanelHeader.stories.js

@@ -6,7 +6,7 @@ import ChevronRightIcon from '@pingux/mdi-react/ChevronRightIcon';
 import DocsLayout from '../../../.storybook/storybookDocsLayout';
 import { Box, Breadcrumbs, Item, PanelHeader, PanelHeaderCloseButton, PanelHeaderMenu, PanelHeaderSwitchField } from '../../index';
 import { FIGMA_LINKS } from '../../utils/designUtils/figmaLinks.ts';
-import { pingImg } from '../../utils/devUtils/constants/images';
+import { pingImg, userImagePanelHeader } from '../../utils/devUtils/constants/images';
 import { SharedItemArgTypes } from '../ListViewItem/listViewItemAttributes';
 import PanelHeaderReadMe from './PanelHeader.mdx';
 import { jsx as ___EmotionJSX } from "@emotion/react";
@@ -82,12 +82,15 @@ export var WithImage = function WithImage(args) {
   return ___EmotionJSX(PanelHeader, _extends({}, args, {
     data: {
       image: {
-        src: pingImg,
+        src: userImagePanelHeader,
         alt: 'Ping Identity Logo',
-        'aria-label': 'Ping Identity Logo',
-        avatarDefaultText: 'FV'
+        'aria-label': 'Ping Identity Logo'
       },
+      avatarDefaultText: 'FV',
       text: 'Fons Vernall'
+    },
+    avatarProps: {
+      size: 'lg'
     }
   }));
 };
@@ -97,6 +100,28 @@ WithImage.parameters = {
     url: FIGMA_LINKS.panelHeader.withImage
   }
 };
+export var WithAvatar = function WithAvatar(args) {
+  return ___EmotionJSX(PanelHeader, _extends({}, args, {
+    data: {
+      image: {
+        src: pingImg,
+        alt: 'Ping Identity Logo',
+        'aria-label': 'Ping Identity Logo'
+      },
+      text: 'Fons Vernall'
+    },
+    avatarProps: {
+      size: 'lg',
+      isLogo: true
+    }
+  }));
+};
+WithAvatar.parameters = {
+  design: {
+    type: 'figma',
+    url: FIGMA_LINKS.panelHeader.WithAvatar
+  }
+};
 export var WithBreadcrumbs = function WithBreadcrumbs() {
   var breadcrumbs = ___EmotionJSX(Breadcrumbs, {
     icon: ChevronRightIcon
@@ -115,7 +140,7 @@ export var WithBreadcrumbs = function WithBreadcrumbs() {
     slots: {
       rightOfData: breadcrumbs
     }
-  });
+  }, ___EmotionJSX(PanelHeaderCloseButton, null));
 };
 export var BreadcrumbsWithExtraLongText = function BreadcrumbsWithExtraLongText() {
   var breadcrumbs = ___EmotionJSX(Box, {
@@ -137,7 +162,7 @@ export var BreadcrumbsWithExtraLongText = function BreadcrumbsWithExtraLongText(
     slots: {
       rightOfData: breadcrumbs
     }
-  });
+  }, ___EmotionJSX(PanelHeaderCloseButton, null));
 };
 export var WithExtraLongText = function WithExtraLongText(_ref4) {
   var args = _extends({}, (_objectDestructuringEmpty(_ref4), _ref4));

package/lib/styles/themeOverrides/nextGenDarkMode/variants/avatar.js

@@ -1,5 +1,4 @@
 export var avatar = {
-  backgroundColor: 'cyan',
   color: 'black',
   cursor: 'pointer',
   '&.is-orange': {

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

@@ -1,7 +1,5 @@
 import sizes from '../sizes';
 export var avatar = {
-  backgroundColor: 'lightcyan',
-  color: 'darkcyan',
   cursor: 'pointer',
   '&.is-orange': {
     backgroundColor: 'lightorange',

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

@@ -198,6 +198,7 @@ export var text = _objectSpread(_objectSpread({
   panelHeaderSubtext: {
     fontSize: 'md',
     lineHeight: 'body',
-    color: 'font.light'
+    color: 'font.light',
+    marginTop: '0px !important'
   }
 });