@patternfly/react-core 6.0.0-prerelease.10 → 6.0.0-prerelease.12

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.0.0-prerelease.9","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.0.0-prerelease.11","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.0.0-prerelease.9","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.0.0-prerelease.11","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.0.0-prerelease.9","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.0.0-prerelease.11","private":true}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.0.0-prerelease.10",
+  "version": "6.0.0-prerelease.12",
   "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",
@@ -48,7 +48,7 @@
   "dependencies": {
     "@patternfly/react-icons": "^6.0.0-prerelease.4",
     "@patternfly/react-styles": "^6.0.0-prerelease.3",
-    "@patternfly/react-tokens": "^6.0.0-prerelease.3",
+    "@patternfly/react-tokens": "^6.0.0-prerelease.4",
     "focus-trap": "7.6.0",
     "react-dropzone": "^14.2.3",
     "tslib": "^2.7.0"
@@ -63,5 +63,5 @@
     "react": "^17 || ^18",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "7627465cdd78e21bbbe9ed0b7b3b9f6f8ee0329f"
+  "gitHead": "137a5467319706c5022300bcba71f0aed899c57a"
 }

package/src/components/EmptyState/EmptyState.tsx

@@ -36,7 +36,7 @@ export interface EmptyStateProps extends React.HTMLProps<HTMLDivElement> {
   /** Additional classes added to the title inside empty state header */
   titleClassName?: string;
   /** Text of the title inside empty state header, will be wrapped in headingLevel */
-  titleText: React.ReactNode;
+  titleText?: React.ReactNode;
   /** Empty state icon element to be rendered. Can also be a spinner component */
   icon?: React.ComponentType<any>;
   /** The heading level to use, default is h1 */

package/src/components/EmptyState/EmptyStateHeader.tsx

@@ -18,7 +18,7 @@ export interface EmptyStateHeaderProps extends React.HTMLProps<HTMLDivElement> {
   /** Additional classes added to the title inside empty state header */
   titleClassName?: string;
   /** Text of the title inside empty state header, will be wrapped in headingLevel */
-  titleText: React.ReactNode;
+  titleText?: React.ReactNode;
   /** Empty state icon element to be rendered. Can also be a spinner component */
   icon?: React.ComponentType<any>;
   /** The heading level to use, default is h1 */
@@ -35,9 +35,11 @@ export const EmptyStateHeader: React.FunctionComponent<EmptyStateHeaderProps> =
 }: EmptyStateHeaderProps) => (
   <div className={css(`${styles.emptyState}__header`, className)} {...props}>
     {Icon && <EmptyStateIcon icon={Icon} />}
-    <div className={css(`${styles.emptyState}__title`)}>
-      <HeadingLevel className={css(styles.emptyStateTitleText, titleClassName)}>{titleText}</HeadingLevel>
-    </div>
+    {titleText && (
+      <div className={css(`${styles.emptyState}__title`)}>
+        <HeadingLevel className={css(styles.emptyStateTitleText, titleClassName)}>{titleText}</HeadingLevel>
+      </div>
+    )}
   </div>
 );
 

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

@@ -92,6 +92,11 @@ describe('EmptyState', () => {
     expect(screen.getByRole('heading', { level: 3, name: 'Empty state' })).toHaveClass(styles.emptyStateTitleText);
   });
 
+  test('title is not rendered when titleText is not passed', () => {
+    render(<EmptyStateHeader headingLevel="h3" />);
+    expect(screen.queryByRole('heading', { level: 3 })).not.toBeInTheDocument();
+  });
+
   test('Footer', () => {
     render(<EmptyStateFooter className="custom-empty-state-footer" data-testid="actions-test-id" />);
     expect(screen.getByTestId('actions-test-id')).toHaveClass('custom-empty-state-footer');

package/src/components/Page/Page.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import styles from '@patternfly/react-styles/css/components/Page/page';
 import { css } from '@patternfly/react-styles';
-import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/global_breakpoint_xl';
+import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_xl';
 import { debounce, canUseDOM } from '../../helpers/util';
 import { Drawer, DrawerContent, DrawerContentBody, DrawerPanelContent } from '../Drawer';
 import { PageBreadcrumb, PageBreadcrumbProps } from './PageBreadcrumb';

package/src/components/Skeleton/examples/Skeleton.md

@@ -5,13 +5,13 @@ cssPrefix: pf-v5-c-skeleton
 propComponents: ['Skeleton']
 ---
 
-import global_font_size_4xl from '@patternfly/react-tokens/dist/esm/global_font_size_4xl';
-import global_font_size_3xl from '@patternfly/react-tokens/dist/esm/global_font_size_3xl';
-import global_font_size_2xl from '@patternfly/react-tokens/dist/esm/global_font_size_2xl';
-import global_font_size_xl from '@patternfly/react-tokens/dist/esm/global_font_size_xl';
-import global_font_size_lg from '@patternfly/react-tokens/dist/esm/global_font_size_lg';
-import global_font_size_md from '@patternfly/react-tokens/dist/esm/global_font_size_md';
-import global_font_size_sm from '@patternfly/react-tokens/dist/esm/global_font_size_sm';
+import t_global_font_size_4xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_4xl';
+import t_global_font_size_3xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_3xl';
+import t_global_font_size_2xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_2xl';
+import t_global_font_size_xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_xl';
+import t_global_font_size_lg from '@patternfly/react-tokens/dist/esm/t_global_font_size_lg';
+import t_global_font_size_md from '@patternfly/react-tokens/dist/esm/t_global_font_size_md';
+import t_global_font_size_sm from '@patternfly/react-tokens/dist/esm/t_global_font_size_sm';
 
 ## Examples
 

package/src/components/Skeleton/examples/SkeletonText.tsx

@@ -1,35 +1,35 @@
 import React from 'react';
 import { Skeleton } from '@patternfly/react-core';
 /* eslint-disable camelcase */
-import global_font_size_4xl from '@patternfly/react-tokens/dist/esm/global_font_size_4xl';
-import global_font_size_3xl from '@patternfly/react-tokens/dist/esm/global_font_size_3xl';
-import global_font_size_2xl from '@patternfly/react-tokens/dist/esm/global_font_size_2xl';
-import global_font_size_xl from '@patternfly/react-tokens/dist/esm/global_font_size_xl';
-import global_font_size_lg from '@patternfly/react-tokens/dist/esm/global_font_size_lg';
-import global_font_size_md from '@patternfly/react-tokens/dist/esm/global_font_size_md';
-import global_font_size_sm from '@patternfly/react-tokens/dist/esm/global_font_size_sm';
+import t_global_font_size_4xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_4xl';
+import t_global_font_size_3xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_3xl';
+import t_global_font_size_2xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_2xl';
+import t_global_font_size_xl from '@patternfly/react-tokens/dist/esm/t_global_font_size_xl';
+import t_global_font_size_lg from '@patternfly/react-tokens/dist/esm/t_global_font_size_lg';
+import t_global_font_size_md from '@patternfly/react-tokens/dist/esm/t_global_font_size_md';
+import t_global_font_size_sm from '@patternfly/react-tokens/dist/esm/t_global_font_size_sm';
 
 export const SkeletonText: React.FunctionComponent = () => (
   <React.Fragment>
-    {global_font_size_4xl.name}
+    {t_global_font_size_4xl.name}
     <Skeleton fontSize="4xl" screenreaderText="Loading font size 4xl" />
     <br />
-    {global_font_size_3xl.name}
+    {t_global_font_size_3xl.name}
     <Skeleton fontSize="3xl" screenreaderText="Loading font size 3xl" />
     <br />
-    {global_font_size_2xl.name}
+    {t_global_font_size_2xl.name}
     <Skeleton fontSize="2xl" screenreaderText="Loading font size 2xl" />
     <br />
-    {global_font_size_xl.name}
+    {t_global_font_size_xl.name}
     <Skeleton fontSize="xl" screenreaderText="Loading font size xl" />
     <br />
-    {global_font_size_lg.name}
+    {t_global_font_size_lg.name}
     <Skeleton fontSize="lg" screenreaderText="Loading font size lg" />
     <br />
-    {global_font_size_md.name}
+    {t_global_font_size_md.name}
     <Skeleton fontSize="md" screenreaderText="Loading font size md" />
     <br />
-    {global_font_size_sm.name}
+    {t_global_font_size_sm.name}
     <Skeleton fontSize="sm" screenreaderText="Loading font size sm" />
   </React.Fragment>
 );

package/src/components/Toolbar/ToolbarToggleGroup.tsx

@@ -5,7 +5,7 @@ import { css } from '@patternfly/react-styles';
 import { ToolbarGroupProps } from './ToolbarGroup';
 import { ToolbarContext, ToolbarContentContext } from './ToolbarUtils';
 import { Button } from '../Button';
-import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/global_breakpoint_lg';
+import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_lg';
 import { formatBreakpointMods, toCamel, canUseDOM } from '../../helpers/util';
 import { PageContext } from '../Page/PageContext';
 import { ToolbarExpandableContent } from './ToolbarExpandableContent';

package/src/components/Toolbar/ToolbarUtils.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { RefObject } from 'react';
-import globalBreakpointMd from '@patternfly/react-tokens/dist/esm/global_breakpoint_md';
-import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/global_breakpoint_lg';
-import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/global_breakpoint_xl';
-import globalBreakpoint2xl from '@patternfly/react-tokens/dist/esm/global_breakpoint_2xl';
+import globalBreakpointMd from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_md';
+import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_lg';
+import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_xl';
+import globalBreakpoint2xl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_2xl';
 
 export interface ToolbarContextProps {
   isExpanded: boolean;

package/src/demos/CardDemos.md

@@ -15,7 +15,7 @@ import chart_color_yellow_300 from '@patternfly/react-tokens/dist/esm/chart_colo
 import chart_color_orange_300 from '@patternfly/react-tokens/dist/esm/chart_color_orange_300';
 import chart_color_red_orange_400 from '@patternfly/react-tokens/dist/esm/chart_color_red_orange_400';
 import l_gallery_GridTemplateColumns_min from '@patternfly/react-tokens/dist/esm/l_gallery_GridTemplateColumns_min';
-import global_text_color_subtle from '@patternfly/react-tokens/dist/esm/global_text_color_subtle';
+import t_global_text_color_subtle from '@patternfly/react-tokens/dist/esm/t_global_text_color_subtle';
 import flex from '@patternfly/react-styles/css/utilities/Flex/flex';
 import text from '@patternfly/react-styles/css/utilities/Text/text';
 import sizing from '@patternfly/react-styles/css/utilities/Sizing/sizing';

package/src/demos/examples/Card/CardStatus.tsx

@@ -27,7 +27,7 @@ import BellIcon from '@patternfly/react-icons/dist/js/icons/bell-icon';
 import CheckCircleIcon from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import ExclamationCircleIcon from '@patternfly/react-icons/dist/js/icons/exclamation-circle-icon';
 import ExclamationTriangleIcon from '@patternfly/react-icons/dist/js/icons/exclamation-triangle-icon';
-import global_text_color_subtle from '@patternfly/react-tokens/dist/esm/global_text_color_subtle';
+import t_global_text_color_subtle from '@patternfly/react-tokens/dist/esm/t_global_text_color_subtle';
 
 export const CardStatus: React.FunctionComponent = () => {
   const [drawerExpanded, setDrawerExpanded] = React.useState(false);
@@ -176,7 +176,7 @@ export const CardStatus: React.FunctionComponent = () => {
                 <a href="#">Operators</a>
               </FlexItem>
               <FlexItem>
-                <span style={{ color: global_text_color_subtle.var }}>1 degraded</span>
+                <span style={{ color: t_global_text_color_subtle.var }}>1 degraded</span>
               </FlexItem>
             </Flex>
           </Flex>
@@ -193,7 +193,7 @@ export const CardStatus: React.FunctionComponent = () => {
                 <a href="#">Image Vulnerabilities</a>
               </FlexItem>
               <FlexItem>
-                <span style={{ color: global_text_color_subtle.var }}>0 vulnerabilities</span>
+                <span style={{ color: t_global_text_color_subtle.var }}>0 vulnerabilities</span>
               </FlexItem>
             </Flex>
           </Flex>

package/src/helpers/constants.ts

@@ -1,14 +1,14 @@
-import globalBreakpointSm from '@patternfly/react-tokens/dist/esm/global_breakpoint_sm';
-import globalBreakpointMd from '@patternfly/react-tokens/dist/esm/global_breakpoint_md';
-import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/global_breakpoint_lg';
-import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/global_breakpoint_xl';
-import globalBreakpoint2xl from '@patternfly/react-tokens/dist/esm/global_breakpoint_2xl';
-
-import globalHeightBreakpointSm from '@patternfly/react-tokens/dist/esm/global_breakpoint_height_sm';
-import globalHeightBreakpointMd from '@patternfly/react-tokens/dist/esm/global_breakpoint_height_md';
-import globalHeightBreakpointLg from '@patternfly/react-tokens/dist/esm/global_breakpoint_height_lg';
-import globalHeightBreakpointXl from '@patternfly/react-tokens/dist/esm/global_breakpoint_height_xl';
-import globalHeightBreakpoint2xl from '@patternfly/react-tokens/dist/esm/global_breakpoint_height_2xl';
+import globalBreakpointSm from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_sm';
+import globalBreakpointMd from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_md';
+import globalBreakpointLg from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_lg';
+import globalBreakpointXl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_xl';
+import globalBreakpoint2xl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_2xl';
+
+import globalHeightBreakpointSm from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_height_sm';
+import globalHeightBreakpointMd from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_height_md';
+import globalHeightBreakpointLg from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_height_lg';
+import globalHeightBreakpointXl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_height_xl';
+import globalHeightBreakpoint2xl from '@patternfly/react-tokens/dist/esm/t_global_breakpoint_height_2xl';
 
 import CheckCircleIcon from '@patternfly/react-icons/dist/esm/icons/check-circle-icon';
 import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';