@patternfly/react-core 6.5.0-prerelease.40 → 6.5.0-prerelease.42

package/helpers/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.5.0-prerelease.39","private":true}
+{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.5.0-prerelease.41","private":true}

package/layouts/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.5.0-prerelease.39","private":true}
+{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.5.0-prerelease.41","private":true}

package/next/package.json

@@ -1 +1 @@
-{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.5.0-prerelease.39","private":true}
+{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.5.0-prerelease.41","private":true}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.5.0-prerelease.40",
+  "version": "6.5.0-prerelease.42",
   "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
   "main": "dist/js/index.js",
   "module": "dist/esm/index.js",
@@ -63,5 +63,5 @@
     "react": "^17 || ^18 || ^19",
     "react-dom": "^17 || ^18 || ^19"
   },
-  "gitHead": "550ad935f3c0bb7a084922fd276e21e06b60d043"
+  "gitHead": "e8f083e0608bee09d197e15118882aeeed4b6bcf"
 }

package/src/components/Card/Card.tsx

@@ -34,6 +34,8 @@ export interface CardProps extends React.HTMLProps<HTMLElement>, OUIAProps {
   isFullHeight?: boolean;
   /** Modifies the card to include plain styling; this removes border and background */
   isPlain?: boolean;
+  /** Modifies the card to include glass styling when glass theme is enabled */
+  isGlass?: boolean;
   /** Flag indicating if a card is expanded. Modifies the card to be expandable. */
   isExpanded?: boolean;
   /** Card background color variant */
@@ -81,6 +83,7 @@ const CardBase: React.FunctionComponent<CardProps> = ({
   isLarge = false,
   isFullHeight = false,
   isPlain = false,
+  isGlass = false,
   variant = 'default',
   ouiaId,
   ouiaSafe = true,
@@ -138,6 +141,7 @@ const CardBase: React.FunctionComponent<CardProps> = ({
           isLarge && styles.modifiers.displayLg,
           isFullHeight && styles.modifiers.fullHeight,
           isPlain && styles.modifiers.plain,
+          isGlass && styles.modifiers.glass,
           variant === 'secondary' && styles.modifiers.secondary,
           getSelectableModifiers(),
           isDisabled && styles.modifiers.disabled,

package/src/components/Card/__tests__/Card.test.tsx

@@ -86,6 +86,11 @@ describe('Card', () => {
     expect(consoleWarnMock).toHaveBeenCalled();
   });
 
+  test('card with isGlass applied', () => {
+    render(<Card isGlass>glass card</Card>);
+    expect(screen.getByText('glass card')).toHaveClass('pf-m-glass');
+  });
+
   test('card with variant set to secondary ', () => {
     render(<Card variant="secondary">secondary card</Card>);
 

package/src/components/NotificationBadge/NotificationBadge.tsx

@@ -8,7 +8,8 @@ import { css } from '@patternfly/react-styles';
 export enum NotificationBadgeVariant {
   read = 'read',
   unread = 'unread',
-  attention = 'attention'
+  attention = 'attention',
+  plain = 'plain'
 }
 
 export interface NotificationBadgeProps extends Omit<ButtonProps, 'variant'> {
@@ -29,7 +30,7 @@ export interface NotificationBadgeProps extends Omit<ButtonProps, 'variant'> {
    */
   isExpanded?: boolean;
   /** Determines the variant of the notification badge. */
-  variant?: NotificationBadgeVariant | 'read' | 'unread' | 'attention';
+  variant?: NotificationBadgeVariant | 'read' | 'unread' | 'attention' | 'plain';
   /** Flag indicating whether the notification badge animation should be triggered. Each
    * time this prop is true, the animation will be triggered a single time.
    */
@@ -55,6 +56,8 @@ export const NotificationBadge: React.FunctionComponent<NotificationBadgeProps>
   const hasCount = count > 0;
   const hasChildren = children !== undefined;
   const isAttention = variant === NotificationBadgeVariant.attention;
+  const isPlain = variant === NotificationBadgeVariant.plain;
+  const _buttonState = isPlain ? undefined : (variant as 'read' | 'unread' | 'attention');
   const notificationIcon = isAttention ? attentionIcon : icon;
   let notificationContent: React.ReactNode = null;
 
@@ -77,10 +80,10 @@ export const NotificationBadge: React.FunctionComponent<NotificationBadgeProps>
 
   return (
     <Button
-      variant={ButtonVariant.stateful}
+      variant={isPlain ? ButtonVariant.plain : ButtonVariant.stateful}
       className={buttonClassName}
       aria-expanded={isExpanded}
-      state={variant}
+      state={_buttonState}
       isClicked={isExpanded}
       icon={notificationIcon}
       onAnimationEnd={handleAnimationEnd}