@patternfly/react-core 6.2.1-prerelease.1 → 6.2.1-prerelease.2

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.2.1-prerelease.0","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.2.1-prerelease.1","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.2.1-prerelease.0","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.2.1-prerelease.1","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.2.1-prerelease.0","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.2.1-prerelease.1","private":true}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.2.1-prerelease.1",
+  "version": "6.2.1-prerelease.2",
   "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",
     "react-dom": "^17 || ^18"
   },
-  "gitHead": "67083921690cf0fb228cc2cb5045a914f636706f"
+  "gitHead": "25558ac94b9f9f031dbc18cb7424c0f1666097d9"
 }

package/src/components/ExpandableSection/examples/ExpandableSectionBasic.tsx

@@ -9,7 +9,11 @@ export const ExpandableSectionBasic: React.FunctionComponent = () => {
   };
 
   return (
-    <ExpandableSection toggleText={isExpanded ? 'Show less' : 'Show more'} onToggle={onToggle} isExpanded={isExpanded}>
+    <ExpandableSection
+      toggleText={isExpanded ? 'Show less basic example content' : 'Show more basic example content'}
+      onToggle={onToggle}
+      isExpanded={isExpanded}
+    >
       This content is visible only when the component is expanded.
     </ExpandableSection>
   );

package/src/components/ExpandableSection/examples/ExpandableSectionDetached.tsx

@@ -25,7 +25,7 @@ export const ExpandableSectionDetached: React.FunctionComponent = () => {
           contentId={contentId}
           direction="up"
         >
-          {isExpanded ? 'Show less' : 'Show more'}
+          {isExpanded ? 'Show less detached example content' : 'Show more detached example content'}
         </ExpandableSectionToggle>
       </StackItem>
     </Stack>

package/src/components/ExpandableSection/examples/ExpandableSectionDisclosure.tsx

@@ -10,7 +10,9 @@ export const ExpandableSectionDisclosure: React.FunctionComponent = () => {
 
   return (
     <ExpandableSection
-      toggleText={isExpanded ? 'Show less' : 'Show more'}
+      toggleText={
+        isExpanded ? 'Show less disclosure variation example content' : 'Show more disclosure variation example content'
+      }
       onToggle={onToggle}
       isExpanded={isExpanded}
       displaySize="lg"

package/src/components/ExpandableSection/examples/ExpandableSectionIndented.tsx

@@ -21,7 +21,7 @@ export const ExpandableSectionIndented: React.FunctionComponent = () => {
       />
       <br />
       <ExpandableSection
-        toggleText={isExpanded ? 'Show less' : 'Show more'}
+        toggleText={isExpanded ? 'Show less indented example content' : 'Show more indented example content'}
         onToggle={onToggle}
         isExpanded={isExpanded}
         isIndented

package/src/components/ExpandableSection/examples/ExpandableSectionTruncateExpansion.tsx

@@ -11,7 +11,7 @@ export const ExpandableSectionTruncateExpansion: React.FunctionComponent = () =>
   return (
     <ExpandableSection
       variant={ExpandableSectionVariant.truncate}
-      toggleText={isExpanded ? 'Show less' : 'Show more'}
+      toggleText={isExpanded ? 'Show less truncated content' : 'Show more truncated content'}
       onToggle={onToggle}
       isExpanded={isExpanded}
     >

package/src/components/ExpandableSection/examples/ExpandableSectionUncontrolled.tsx

@@ -1,7 +1,7 @@
 import { ExpandableSection } from '@patternfly/react-core';
 
 export const ExpandableSectionUncontrolled: React.FunctionComponent = () => (
-  <ExpandableSection toggleText="Show more">
+  <ExpandableSection toggleText="Show more uncontrolled example content">
     This content is visible only when the component is expanded.
   </ExpandableSection>
 );

package/src/components/ExpandableSection/examples/ExpandableSectionUncontrolledDynamicToggleText.tsx

@@ -1,7 +1,10 @@
 import { ExpandableSection } from '@patternfly/react-core';
 
 export const ExpandableSectionUncontrolledDynamicToggle: React.FunctionComponent = () => (
-  <ExpandableSection toggleTextExpanded="Show less" toggleTextCollapsed="Show more">
+  <ExpandableSection
+    toggleTextExpanded="Show less uncontrolled dynamic toggle example content"
+    toggleTextCollapsed="Show more uncontrolled dynamic toggle example content"
+  >
     This content is visible only when the component is expanded.
   </ExpandableSection>
 );

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

@@ -1,3 +1,3 @@
 import { Skeleton } from '@patternfly/react-core';
 
-export const SkeletonDefault: React.FunctionComponent = () => <Skeleton screenreaderText="Loading contents" />;
+export const SkeletonDefault: React.FunctionComponent = () => <Skeleton screenreaderText="Loading default content" />;

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

@@ -2,11 +2,11 @@ import { Skeleton } from '@patternfly/react-core';
 
 export const SkeletonPercentageHeight: React.FunctionComponent = () => (
   <div style={{ height: '400px', display: 'flex', alignItems: 'flex-end', justifyContent: 'space-between' }}>
-    <Skeleton height="25%" width="15%" screenreaderText="Loaded 25% of content" />
-    <Skeleton height="33%" width="15%" screenreaderText="Loaded 33% of content" />
-    <Skeleton height="50%" width="15%" screenreaderText="Loaded 50% of content" />
-    <Skeleton height="66%" width="15%" screenreaderText="Loaded 66% of content" />
-    <Skeleton height="75%" width="15%" screenreaderText="Loaded 75% of content" />
-    <Skeleton height="100%" width="15%" screenreaderText="Loaded 100% of content" />
+    <Skeleton height="25%" width="15%" screenreaderText="Loading percentage height content" />
+    <Skeleton height="33%" width="15%" />
+    <Skeleton height="50%" width="15%" />
+    <Skeleton height="66%" width="15%" />
+    <Skeleton height="75%" width="15%" />
+    <Skeleton height="100%" width="15%" />
   </div>
 );

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

@@ -3,15 +3,15 @@ import { Skeleton } from '@patternfly/react-core';
 
 export const SkeletonPercentageWidth: React.FunctionComponent = () => (
   <Fragment>
-    <Skeleton width="25%" screenreaderText="Loaded 25% of content" />
+    <Skeleton width="25%" screenreaderText="Loading percentage width content" />
     <br />
-    <Skeleton width="33%" screenreaderText="Loaded 33% of content" />
+    <Skeleton width="33%" />
     <br />
-    <Skeleton width="50%" screenreaderText="Loaded 50% of content" />
+    <Skeleton width="50%" />
     <br />
-    <Skeleton width="66%" screenreaderText="Loaded 66% of content" />
+    <Skeleton width="66%" />
     <br />
-    <Skeleton width="75%" screenreaderText="Loaded 75% of content" />
+    <Skeleton width="75%" />
     <br />
     <Skeleton />
   </Fragment>

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

@@ -4,36 +4,36 @@ import { Skeleton } from '@patternfly/react-core';
 export const SkeletonShapes: React.FunctionComponent = () => (
   <Fragment>
     Small circle
-    <Skeleton shape="circle" width="15%" screenreaderText="Loading small circle contents" />
+    <Skeleton shape="circle" width="15%" screenreaderText="Loading circle content" />
     <br />
     Medium circle
-    <Skeleton shape="circle" width="30%" screenreaderText="Loading medium circle contents" />
+    <Skeleton shape="circle" width="30%" />
     <br />
     Large circle
-    <Skeleton shape="circle" width="50%" screenreaderText="Loading large circle contents" />
+    <Skeleton shape="circle" width="50%" />
     <br />
     Small square
-    <Skeleton shape="square" width="15%" screenreaderText="Loading small square contents" />
+    <Skeleton shape="square" width="15%" screenreaderText="Loading square content" />
     <br />
     Medium square
-    <Skeleton shape="square" width="30%" screenreaderText="Loading medium square contents" />
+    <Skeleton shape="square" width="30%" />
     <br />
     Large square
-    <Skeleton shape="square" width="50%" screenreaderText="Loading large square contents" />
+    <Skeleton shape="square" width="50%" />
     <br />
     Small rectangle
     <div style={{ height: '200px' }}>
-      <Skeleton height="50%" width="50%" screenreaderText="Loading small rectangle contents" />
+      <Skeleton height="50%" width="50%" screenreaderText="Loading rectangle content" />
     </div>
     <br />
     Medium rectangle
     <div style={{ height: '200px' }}>
-      <Skeleton height="75%" width="75%" screenreaderText="Loading medium rectangle contents" />
+      <Skeleton height="75%" width="75%" />
     </div>
     <br />
     Large rectangle
     <div style={{ height: '200px' }}>
-      <Skeleton height="100%" screenreaderText="Loading large rectangle contents" />
+      <Skeleton height="100%" />
     </div>
   </Fragment>
 );

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

@@ -12,24 +12,24 @@ import t_global_font_size_sm from '@patternfly/react-tokens/dist/esm/t_global_fo
 export const SkeletonText: React.FunctionComponent = () => (
   <Fragment>
     {t_global_font_size_4xl.name}
-    <Skeleton fontSize="4xl" screenreaderText="Loading font size 4xl" />
+    <Skeleton fontSize="4xl" screenreaderText="Loading text content" />
     <br />
     {t_global_font_size_3xl.name}
-    <Skeleton fontSize="3xl" screenreaderText="Loading font size 3xl" />
+    <Skeleton fontSize="3xl" />
     <br />
     {t_global_font_size_2xl.name}
-    <Skeleton fontSize="2xl" screenreaderText="Loading font size 2xl" />
+    <Skeleton fontSize="2xl" />
     <br />
     {t_global_font_size_xl.name}
-    <Skeleton fontSize="xl" screenreaderText="Loading font size xl" />
+    <Skeleton fontSize="xl" />
     <br />
     {t_global_font_size_lg.name}
-    <Skeleton fontSize="lg" screenreaderText="Loading font size lg" />
+    <Skeleton fontSize="lg" />
     <br />
     {t_global_font_size_md.name}
-    <Skeleton fontSize="md" screenreaderText="Loading font size md" />
+    <Skeleton fontSize="md" />
     <br />
     {t_global_font_size_sm.name}
-    <Skeleton fontSize="sm" screenreaderText="Loading font size sm" />
+    <Skeleton fontSize="sm" />
   </Fragment>
 );

package/src/demos/ExpandableSection/examples/ExpandableTextDemo.tsx

@@ -13,7 +13,7 @@ export const ExpandableTextDemo: React.FunctionComponent = () => {
   return (
     <ExpandableSection
       variant={ExpandableSectionVariant.truncate}
-      toggleText={isExpanded ? 'Show less' : 'Show more'}
+      toggleText={isExpanded ? 'Show less truncated content' : 'Show more truncated content'}
       onToggle={onToggle}
       isExpanded={isExpanded}
       truncateMaxLines={-1}

package/src/demos/examples/Skeleton/SkeletonCard.tsx

@@ -7,9 +7,9 @@ export const SkeletonCard: React.FunctionComponent = () => {
       <CardBody>
         <Flex direction={{ default: 'column' }} spacer={{ default: 'spacerMd' }}>
           <Skeleton screenreaderText="Loading content" />
-          <Skeleton width="66%" screenreaderText="Loaded 66% of content" />
-          <Skeleton width="25%" screenreaderText="Loaded 25% of content" />
-          <Skeleton width="50%" screenreaderText="Loaded 50% of content" />
+          <Skeleton width="66%" />
+          <Skeleton width="25%" />
+          <Skeleton width="50%" />
         </Flex>
       </CardBody>
       <CardBody>
@@ -18,9 +18,9 @@ export const SkeletonCard: React.FunctionComponent = () => {
       <CardBody>
         <Flex direction={{ default: 'column' }} spacer={{ default: 'spacerMd' }}>
           <Skeleton screenreaderText="Loading content" />
-          <Skeleton width="25%" screenreaderText="Loaded 25% of content" />
-          <Skeleton width="75%" screenreaderText="Loaded 75% of content" />
-          <Skeleton width="50%" screenreaderText="Loaded 50% of content" />
+          <Skeleton width="25%" />
+          <Skeleton width="75%" />
+          <Skeleton width="50%" />
         </Flex>
       </CardBody>
     </Card>