@patternfly/react-core 6.4.1-prerelease.2 → 6.4.1-prerelease.4

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "6.4.1-prerelease.2",
+  "version": "6.4.1-prerelease.4",
   "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": "e78f9c42128c8500e478eef554711ddf4b73fe00"
+  "gitHead": "02cbfa51ba9eef5bf6df2996fbd18737f7c42278"
 }

package/src/components/Panel/examples/Panel.md

@@ -9,199 +9,50 @@ propComponents: [Panel, PanelMain, PanelMainBody, PanelHeader, PanelFooter]
 
 ### Basic
 
-```js
-import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
-
-const BasicPanel = () => (
-  <Panel>
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelBasic.tsx"
 ```
 
 ### Header
 
-```js
-import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider } from '@patternfly/react-core';
-
-const HeaderPanel = () => (
-  <Panel>
-    <PanelHeader>Header content</PanelHeader>
-    <Divider />
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelHeaderExample.tsx"
 ```
 
 ### Footer
 
-```js
-import { Panel, PanelMain, PanelMainBody, PanelFooter } from '@patternfly/react-core';
-
-const FooterPanel = () => (
-  <Panel>
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-    <PanelFooter>Footer content</PanelFooter>
-  </Panel>
-);
+```ts file="PanelFooterExample.tsx"
 ```
 
 ### Header and footer
 
-```js
-import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
-
-const HeaderFooterPanel = () => (
-  <Panel>
-    <PanelHeader>Header content</PanelHeader>
-    <Divider />
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-    <PanelFooter>Footer content</PanelFooter>
-  </Panel>
-);
+```ts file="PanelHeaderFooter.tsx"
 ```
 
 ### No body
 
-```js
-import { Panel, PanelMain } from '@patternfly/react-core';
-
-const NoBodyPanel = () => (
-  <Panel>
-    <PanelMain>Main content</PanelMain>
-  </Panel>
-);
+```ts file="PanelNoBody.tsx"
 ```
 
 ### Raised
 
-```js
-import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
-
-const RaisedPanel = () => (
-  <Panel variant="raised">
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelRaised.tsx"
 ```
 
 ### Bordered
 
-```js
-import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
-
-const BorderedPanel = () => (
-  <Panel variant="bordered">
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelBordered.tsx"
 ```
 
 ### Secondary variant
 
-```js
-import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
-
-const PanelSecondaryVariant = () => (
-  <Panel variant="secondary">
-    <PanelMain>
-      <PanelMainBody>Main content</PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelSecondaryVariant.tsx"
 ```
 
 ### Scrollable
 
-```js
-import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
-
-const ScrollablePanel = () => (
-  <Panel isScrollable>
-    <PanelMain tabIndex={0}>
-      <PanelMainBody>
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-      </PanelMainBody>
-    </PanelMain>
-  </Panel>
-);
+```ts file="PanelScrollable.tsx"
 ```
 
 ### Scrollable with header and footer
 
-```js
-import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
-
-const ScrollableHeaderFooterPanel = () => (
-  <Panel isScrollable>
-    <PanelHeader>Header content</PanelHeader>
-    <Divider />
-    <PanelMain tabIndex={0}>
-      <PanelMainBody>
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-        <br />
-        <br />
-        Main content
-      </PanelMainBody>
-    </PanelMain>
-    <PanelFooter>Footer content</PanelFooter>
-  </Panel>
-);
+```ts file="PanelScrollableHeaderFooter.tsx"
 ```

package/src/components/Panel/examples/PanelBasic.tsx

@@ -0,0 +1,9 @@
+import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
+
+export const PanelBasic: React.FunctionComponent = () => (
+  <Panel>
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelBordered.tsx

@@ -0,0 +1,9 @@
+import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
+
+export const PanelBordered: React.FunctionComponent = () => (
+  <Panel variant="bordered">
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelFooterExample.tsx

@@ -0,0 +1,10 @@
+import { Panel, PanelMain, PanelMainBody, PanelFooter } from '@patternfly/react-core';
+
+export const PanelFooterExample: React.FunctionComponent = () => (
+  <Panel>
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+    <PanelFooter>Footer content</PanelFooter>
+  </Panel>
+);

package/src/components/Panel/examples/PanelHeaderExample.tsx

@@ -0,0 +1,11 @@
+import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider } from '@patternfly/react-core';
+
+export const PanelHeaderExample: React.FunctionComponent = () => (
+  <Panel>
+    <PanelHeader>Header content</PanelHeader>
+    <Divider />
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelHeaderFooter.tsx

@@ -0,0 +1,12 @@
+import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
+
+export const PanelHeaderFooter: React.FunctionComponent = () => (
+  <Panel>
+    <PanelHeader>Header content</PanelHeader>
+    <Divider />
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+    <PanelFooter>Footer content</PanelFooter>
+  </Panel>
+);

package/src/components/Panel/examples/PanelNoBody.tsx

@@ -0,0 +1,7 @@
+import { Panel, PanelMain } from '@patternfly/react-core';
+
+export const PanelNoBody: React.FunctionComponent = () => (
+  <Panel>
+    <PanelMain>Main content</PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelRaised.tsx

@@ -0,0 +1,9 @@
+import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
+
+export const PanelRaised: React.FunctionComponent = () => (
+  <Panel variant="raised">
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelScrollable.tsx

@@ -0,0 +1,35 @@
+import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
+
+export const PanelScrollable: React.FunctionComponent = () => (
+  <Panel isScrollable>
+    <PanelMain tabIndex={0}>
+      <PanelMainBody>
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+      </PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/components/Panel/examples/PanelScrollableHeaderFooter.tsx

@@ -0,0 +1,38 @@
+import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
+
+export const PanelScrollableHeaderFooter: React.FunctionComponent = () => (
+  <Panel isScrollable>
+    <PanelHeader>Header content</PanelHeader>
+    <Divider />
+    <PanelMain tabIndex={0}>
+      <PanelMainBody>
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+        <br />
+        <br />
+        Main content
+      </PanelMainBody>
+    </PanelMain>
+    <PanelFooter>Footer content</PanelFooter>
+  </Panel>
+);

package/src/components/Panel/examples/PanelSecondaryVariant.tsx

@@ -0,0 +1,9 @@
+import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
+
+export const PanelSecondaryVariant: React.FunctionComponent = () => (
+  <Panel variant="secondary">
+    <PanelMain>
+      <PanelMainBody>Main content</PanelMainBody>
+    </PanelMain>
+  </Panel>
+);

package/src/helpers/resizeObserver.tsx

@@ -1,4 +1,4 @@
-import { canUseDOM, debounce } from './util';
+import { canUseDOM } from './util';
 
 /**
  * This function creates a ResizeObserver used to handle resize events for the given containerRef. If ResizeObserver
@@ -83,7 +83,7 @@ export const getResizeObserver = (
         if (useRequestAnimationFrame) {
           window.requestAnimationFrame(() => {
             if (Array.isArray(entries) && entries.length > 0) {
-              debounce(handleResize, 100);
+              handleResize();
             }
           });
           // Avoid wrapping function in requestAnimationFrame if the function is debounced