@patternfly/react-docs 7.6.0-prerelease.7 → 7.6.0-prerelease.8

package/patternfly-docs/generated/foundations-and-styles/layouts/gallery/react.js

@@ -0,0 +1,94 @@
+import React from 'react';
+import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
+import '../../../../../../react-core/src/layouts/Gallery/examples/./gallery.css';
+const pageData = {
+  "id": "Gallery",
+  "section": "foundations-and-styles",
+  "subsection": "layouts",
+  "deprecated": false,
+  "template": false,
+  "beta": false,
+  "demo": false,
+  "newImplementationLink": false,
+  "source": "react",
+  "tabName": null,
+  "slug": "/foundations-and-styles/layouts/gallery/react",
+  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/layouts/Gallery/examples/Gallery.md",
+  "relPath": "packages/react-core/src/layouts/Gallery/examples/Gallery.md",
+  "propComponents": [
+    {
+      "name": "GalleryItem",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the Gallery Item",
+          "defaultValue": "null"
+        },
+        {
+          "name": "component",
+          "type": "React.ElementType<any> | React.ComponentType<any>",
+          "description": "Sets the base component to render. defaults to div",
+          "defaultValue": "'div'"
+        }
+      ]
+    }
+  ],
+  "cssPrefix": [
+    "pf-v6-l-gallery"
+  ],
+  "examples": [
+    "Basic",
+    "With gutters",
+    "Adjusting min widths",
+    "Adjusting max widths",
+    "Adjusting min and max widths",
+    "Alternative components"
+  ]
+};
+pageData.relativeImports = "import 'react-core/src/layouts/Gallery/examples/./gallery.css';"
+pageData.examples = {
+  'Basic': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryBasic: React.FunctionComponent = () => (\n  <Gallery>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"Basic","lang":"ts","className":""}}>
+      
+    </Example>,
+  'With gutters': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryWithGutters: React.FunctionComponent = () => (\n  <Gallery hasGutter>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"With gutters","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Adjusting min widths': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryAdjustingMinWidths: React.FunctionComponent = () => (\n  <Gallery\n    hasGutter\n    minWidths={{\n      md: '100px',\n      lg: '150px',\n      xl: '200px',\n      '2xl': '300px'\n    }}\n  >\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"Adjusting min widths","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Adjusting max widths': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryAdjustingMaxWidths: React.FunctionComponent = () => (\n  <Gallery\n    hasGutter\n    maxWidths={{\n      md: '280px',\n      lg: '320px',\n      '2xl': '400px'\n    }}\n  >\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"Adjusting max widths","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Adjusting min and max widths': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryAdjustingMinMaxWidths: React.FunctionComponent = () => (\n  <Gallery\n    hasGutter\n    minWidths={{\n      default: '100%',\n      md: '100px',\n      xl: '300px'\n    }}\n    maxWidths={{\n      md: '200px',\n      xl: '1fr'\n    }}\n  >\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n    <GalleryItem>Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"Adjusting min and max widths","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Alternative components': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Gallery, GalleryItem } from '@patternfly/react-core';\n\nexport const GalleryAlternativeComponents: React.FunctionComponent = () => (\n  <Gallery component=\"ul\">\n    <GalleryItem component=\"li\">Gallery Item</GalleryItem>\n    <GalleryItem component=\"li\">Gallery Item</GalleryItem>\n    <GalleryItem component=\"li\">Gallery Item</GalleryItem>\n    <GalleryItem component=\"li\">Gallery Item</GalleryItem>\n    <GalleryItem component=\"li\">Gallery Item</GalleryItem>\n  </Gallery>\n);\n","title":"Alternative components","lang":"ts","className":""}}>
+      
+    </Example>
+};
+
+const Component = () => (
+  <React.Fragment>
+    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
+      {`Examples`}
+    </AutoLinkHeader>
+    {React.createElement(pageData.examples["Basic"])}
+    {React.createElement(pageData.examples["With gutters"])}
+    {React.createElement(pageData.examples["Adjusting min widths"])}
+    {React.createElement(pageData.examples["Adjusting max widths"])}
+    {React.createElement(pageData.examples["Adjusting min and max widths"])}
+    {React.createElement(pageData.examples["Alternative components"])}
+  </React.Fragment>
+);
+Component.displayName = 'FoundationsAndStylesLayoutsGalleryReactDocs';
+Component.pageData = pageData;
+
+export default Component;

package/patternfly-docs/generated/foundations-and-styles/layouts/grid/react.js

@@ -0,0 +1,272 @@
+import React from 'react';
+import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
+import '../../../../../../react-core/src/layouts/Grid/examples/./grid.css';
+const pageData = {
+  "id": "Grid",
+  "section": "foundations-and-styles",
+  "subsection": "layouts",
+  "deprecated": false,
+  "template": false,
+  "beta": false,
+  "demo": false,
+  "newImplementationLink": false,
+  "source": "react",
+  "tabName": null,
+  "slug": "/foundations-and-styles/layouts/grid/react",
+  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/layouts/Grid/examples/Grid.md",
+  "relPath": "packages/react-core/src/layouts/Grid/examples/Grid.md",
+  "propComponents": [
+    {
+      "name": "Grid",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the Grid layout",
+          "defaultValue": "null"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "description": "additional classes added to the Grid layout",
+          "defaultValue": "''"
+        },
+        {
+          "name": "component",
+          "type": "React.ElementType<any> | React.ComponentType<any>",
+          "description": "Sets the base component to render. defaults to div",
+          "defaultValue": "'div'"
+        },
+        {
+          "name": "hasGutter",
+          "type": "boolean",
+          "description": "Adds space between children."
+        },
+        {
+          "name": "lg",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns all grid items should span on a large device"
+        },
+        {
+          "name": "md",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns all grid items should span on a medium device"
+        },
+        {
+          "name": "order",
+          "type": "{\n  default?: string;\n  md?: string;\n  lg?: string;\n  xl?: string;\n  '2xl'?: string;\n}",
+          "description": "Modifies the flex layout element order property"
+        },
+        {
+          "name": "sm",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns all grid items should span on a small device"
+        },
+        {
+          "name": "span",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "The number of rows a column in the grid should span.  Value should be a number 1-12",
+          "defaultValue": "null"
+        },
+        {
+          "name": "xl",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns all grid items should span on a xLarge device"
+        },
+        {
+          "name": "xl2",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns all grid items should span on a 2xLarge device"
+        }
+      ]
+    },
+    {
+      "name": "GridItem",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the Grid Layout Item",
+          "defaultValue": "null"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "description": "additional classes added to the Grid Layout Item",
+          "defaultValue": "''"
+        },
+        {
+          "name": "component",
+          "type": "React.ElementType<any> | React.ComponentType<any>",
+          "description": "Sets the base component to render. defaults to div",
+          "defaultValue": "'div'"
+        },
+        {
+          "name": "lg",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans on large device. Value should be a number 1-12"
+        },
+        {
+          "name": "lgOffset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item is offset on large device. Value should be a number 1-12"
+        },
+        {
+          "name": "lgRowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans on large device. Value should be a number 1-12"
+        },
+        {
+          "name": "md",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans on medium device. Value should be a number 1-12"
+        },
+        {
+          "name": "mdOffset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item is offset on medium device. Value should be a number 1-12"
+        },
+        {
+          "name": "mdRowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans on medium device. Value should be a number 1-12"
+        },
+        {
+          "name": "offset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns a grid item is offset",
+          "defaultValue": "null"
+        },
+        {
+          "name": "order",
+          "type": "{\n  default?: string;\n  md?: string;\n  lg?: string;\n  xl?: string;\n  '2xl'?: string;\n}",
+          "description": "Modifies the flex layout element order property"
+        },
+        {
+          "name": "rowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans. Value should be a number 1-12",
+          "defaultValue": "null"
+        },
+        {
+          "name": "sm",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans on small device. Value should be a number 1-12"
+        },
+        {
+          "name": "smOffset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item is offset on small device. Value should be a number 1-12"
+        },
+        {
+          "name": "smRowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans on medium device. Value should be a number 1-12"
+        },
+        {
+          "name": "span",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans. Value should be a number 1-12",
+          "defaultValue": "null"
+        },
+        {
+          "name": "xl",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans on xLarge device. Value should be a number 1-12"
+        },
+        {
+          "name": "xl2",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item spans on 2xLarge device. Value should be a number 1-12"
+        },
+        {
+          "name": "xl2Offset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item is offset on 2xLarge device. Value should be a number 1-12"
+        },
+        {
+          "name": "xl2RowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans on 2xLarge device. Value should be a number 1-12"
+        },
+        {
+          "name": "xlOffset",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of columns the grid item is offset on xLarge device. Value should be a number 1-12"
+        },
+        {
+          "name": "xlRowSpan",
+          "type": "1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12",
+          "description": "the number of rows the grid item spans on large device. Value should be a number 1-12"
+        }
+      ]
+    }
+  ],
+  "cssPrefix": [
+    "pf-v6-l-grid"
+  ],
+  "examples": [
+    "Basic",
+    "With gutters",
+    "With overrides",
+    "Standard ordering",
+    "Responsive ordering",
+    "Grouped ordering",
+    "Alternative components"
+  ]
+};
+pageData.relativeImports = "import 'react-core/src/layouts/Grid/examples/./grid.css';"
+pageData.examples = {
+  'Basic': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridBasic: React.FunctionComponent = () => (\n  <Grid>\n    <GridItem span={8}>span = 8</GridItem>\n    <GridItem span={4} rowSpan={2}>\n      span = 4, rowSpan = 2\n    </GridItem>\n    <GridItem span={2} rowSpan={3}>\n      span = 2, rowSpan = 3\n    </GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n  </Grid>\n);\n","title":"Basic","lang":"ts","className":""}}>
+      
+    </Example>,
+  'With gutters': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridWithGutters: React.FunctionComponent = () => (\n  <Grid hasGutter>\n    <GridItem span={8}>span = 8</GridItem>\n    <GridItem span={4} rowSpan={2}>\n      span = 4, rowSpan = 2\n    </GridItem>\n    <GridItem span={2} rowSpan={3}>\n      span = 2, rowSpan = 3\n    </GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={2}>span = 2</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n    <GridItem span={4}>span = 4</GridItem>\n  </Grid>\n);\n","title":"With gutters","lang":"ts","className":""}}>
+      
+    </Example>,
+  'With overrides': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridWithOverrides: React.FunctionComponent = () => (\n  <Grid sm={6} md={4} lg={3} xl2={1}>\n    <GridItem span={3} rowSpan={2}>\n      span = 3 rowSpan= 2\n    </GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n    <GridItem>Grid Item</GridItem>\n  </Grid>\n);\n","title":"With overrides","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Standard ordering': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridStandardOrdering: React.FunctionComponent = () => (\n  <Grid hasGutter span={3}>\n    <GridItem order={{ default: '2' }}>Item A</GridItem>\n    <GridItem>Item B</GridItem>\n    <GridItem order={{ default: '-1' }}>Item C</GridItem>\n  </Grid>\n);\n","title":"Standard ordering","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Responsive ordering': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridResponsiveOrdering: React.FunctionComponent = () => (\n  <Grid hasGutter span={3}>\n    <GridItem order={{ lg: '2' }}>Item A</GridItem>\n    <GridItem>Item B</GridItem>\n    <GridItem order={{ default: '-1', md: '1' }}>Item C</GridItem>\n  </Grid>\n);\n","title":"Responsive ordering","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Grouped ordering': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridGroupingOrdering: React.FunctionComponent = () => (\n  <Grid hasGutter span={12}>\n    <Grid hasGutter span={6} order={{ default: '2' }}>\n      <GridItem order={{ default: '3' }}>Set 1, Item A</GridItem>\n      <GridItem order={{ default: '1' }}>Set 1, Item B</GridItem>\n      <GridItem>Set 1, Item C</GridItem>\n      <GridItem order={{ default: '2' }}>Set 1, Item D</GridItem>\n    </Grid>\n    <Grid hasGutter span={6}>\n      <GridItem order={{ default: '2' }}>Set 2, Item A</GridItem>\n      <GridItem order={{ default: '1' }}>Set 2, Item B</GridItem>\n      <GridItem>Set 2, Item C</GridItem>\n      <GridItem order={{ default: '2' }}>Set 2, Item D</GridItem>\n    </Grid>\n  </Grid>\n);\n","title":"Grouped ordering","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Alternative components': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Grid, GridItem } from '@patternfly/react-core';\n\nexport const GridAlternativeComponents: React.FunctionComponent = () => (\n  <Grid component=\"ul\">\n    <GridItem component=\"li\">Grid item</GridItem>\n    <GridItem component=\"li\">Grid item</GridItem>\n    <GridItem component=\"li\">Grid item</GridItem>\n    <GridItem component=\"li\">Grid item</GridItem>\n    <GridItem component=\"li\">Grid item</GridItem>\n  </Grid>\n);\n","title":"Alternative components","lang":"ts","className":""}}>
+      
+    </Example>
+};
+
+const Component = () => (
+  <React.Fragment>
+    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
+      {`Examples`}
+    </AutoLinkHeader>
+    {React.createElement(pageData.examples["Basic"])}
+    {React.createElement(pageData.examples["With gutters"])}
+    {React.createElement(pageData.examples["With overrides"])}
+    <AutoLinkHeader {...{"id":"ordering","headingLevel":"h2","className":"ws-title ws-h2"}}>
+      {`Ordering`}
+    </AutoLinkHeader>
+    {React.createElement(pageData.examples["Standard ordering"])}
+    {React.createElement(pageData.examples["Responsive ordering"])}
+    {React.createElement(pageData.examples["Grouped ordering"])}
+    {React.createElement(pageData.examples["Alternative components"])}
+  </React.Fragment>
+);
+Component.displayName = 'FoundationsAndStylesLayoutsGridReactDocs';
+Component.pageData = pageData;
+
+export default Component;

package/patternfly-docs/generated/foundations-and-styles/layouts/level/react.js

@@ -0,0 +1,87 @@
+import React from 'react';
+import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
+import '../../../../../../react-core/src/layouts/Level/examples/./level.css';
+const pageData = {
+  "id": "Level",
+  "section": "foundations-and-styles",
+  "subsection": "layouts",
+  "deprecated": false,
+  "template": false,
+  "beta": false,
+  "demo": false,
+  "newImplementationLink": false,
+  "source": "react",
+  "tabName": null,
+  "slug": "/foundations-and-styles/layouts/level/react",
+  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/layouts/Level/examples/Level.md",
+  "relPath": "packages/react-core/src/layouts/Level/examples/Level.md",
+  "propComponents": [
+    {
+      "name": "Level",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the Level layout",
+          "defaultValue": "null"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "description": "additional classes added to the Level layout",
+          "defaultValue": "''"
+        },
+        {
+          "name": "hasGutter",
+          "type": "boolean",
+          "description": "Adds space between children."
+        }
+      ]
+    },
+    {
+      "name": "LevelItem",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the Level Layout Item",
+          "defaultValue": "null"
+        }
+      ]
+    }
+  ],
+  "cssPrefix": [
+    "pf-v6-l-level"
+  ],
+  "examples": [
+    "Basic",
+    "With gutters"
+  ]
+};
+pageData.relativeImports = "import 'react-core/src/layouts/Level/examples/./level.css';"
+pageData.examples = {
+  'Basic': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Level, LevelItem } from '@patternfly/react-core';\n\nexport const LevelBasic: React.FunctionComponent = () => (\n  <Level>\n    <LevelItem>Level Item</LevelItem>\n    <LevelItem>Level Item</LevelItem>\n    <LevelItem>Level Item</LevelItem>\n  </Level>\n);\n","title":"Basic","lang":"ts","className":""}}>
+      
+    </Example>,
+  'With gutters': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Level, LevelItem } from '@patternfly/react-core';\n\nexport const LevelWithGutters: React.FunctionComponent = () => (\n  <Level hasGutter>\n    <LevelItem>Level Item</LevelItem>\n    <LevelItem>Level Item</LevelItem>\n    <LevelItem>Level Item</LevelItem>\n  </Level>\n);\n","title":"With gutters","lang":"ts","className":""}}>
+      
+    </Example>
+};
+
+const Component = () => (
+  <React.Fragment>
+    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
+      {`Examples`}
+    </AutoLinkHeader>
+    {React.createElement(pageData.examples["Basic"])}
+    {React.createElement(pageData.examples["With gutters"])}
+  </React.Fragment>
+);
+Component.displayName = 'FoundationsAndStylesLayoutsLevelReactDocs';
+Component.pageData = pageData;
+
+export default Component;

package/patternfly-docs/generated/foundations-and-styles/layouts/split/react.js

@@ -0,0 +1,124 @@
+import React from 'react';
+import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
+import '../../../../../../react-core/src/layouts/Split/examples/./split.css';
+const pageData = {
+  "id": "Split",
+  "section": "foundations-and-styles",
+  "subsection": "layouts",
+  "deprecated": false,
+  "template": false,
+  "beta": false,
+  "demo": false,
+  "newImplementationLink": false,
+  "source": "react",
+  "tabName": null,
+  "slug": "/foundations-and-styles/layouts/split/react",
+  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/layouts/Split/examples/Split.md",
+  "relPath": "packages/react-core/src/layouts/Split/examples/Split.md",
+  "propComponents": [
+    {
+      "name": "Split",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "content rendered inside the split layout.",
+          "defaultValue": "null"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "description": "Additional classes added to the split layout.",
+          "defaultValue": "''"
+        },
+        {
+          "name": "component",
+          "type": "React.ReactNode",
+          "description": "Sets the base component to render. Defaults to div.",
+          "defaultValue": "'div'"
+        },
+        {
+          "name": "hasGutter",
+          "type": "boolean",
+          "description": "Adds space between children.",
+          "defaultValue": "false"
+        },
+        {
+          "name": "isWrappable",
+          "type": "boolean",
+          "description": "Allows children to wrap.",
+          "defaultValue": "false"
+        }
+      ]
+    },
+    {
+      "name": "SplitItem",
+      "description": "",
+      "props": [
+        {
+          "name": "children",
+          "type": "React.ReactNode",
+          "description": "Content rendered inside the split layout item.",
+          "defaultValue": "null"
+        },
+        {
+          "name": "className",
+          "type": "string",
+          "description": "Additional classes added to the split layout item.",
+          "defaultValue": "''"
+        },
+        {
+          "name": "component",
+          "type": "React.ReactNode",
+          "description": "Sets the base component to render. Defaults to div.",
+          "defaultValue": "'div'"
+        },
+        {
+          "name": "isFilled",
+          "type": "boolean",
+          "description": "Flag indicating if this split layout item should fill the available horizontal space.",
+          "defaultValue": "false"
+        }
+      ]
+    }
+  ],
+  "cssPrefix": [
+    "pf-v6-l-split"
+  ],
+  "examples": [
+    "Basic",
+    "With gutter",
+    "Wrappable"
+  ]
+};
+pageData.relativeImports = "import 'react-core/src/layouts/Split/examples/./split.css';"
+pageData.examples = {
+  'Basic': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Split, SplitItem } from '@patternfly/react-core';\n\nexport const SplitBasic: React.FunctionComponent = () => (\n  <Split>\n    <SplitItem>content</SplitItem>\n    <SplitItem isFilled>pf-m-fill</SplitItem>\n    <SplitItem>content</SplitItem>\n  </Split>\n);\n","title":"Basic","lang":"ts","className":""}}>
+      
+    </Example>,
+  'With gutter': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Split, SplitItem } from '@patternfly/react-core';\n\nexport const SplitWithGutter: React.FunctionComponent = () => (\n  <Split hasGutter>\n    <SplitItem>content</SplitItem>\n    <SplitItem isFilled>pf-m-fill</SplitItem>\n    <SplitItem>content</SplitItem>\n  </Split>\n);\n","title":"With gutter","lang":"ts","className":""}}>
+      
+    </Example>,
+  'Wrappable': props => 
+    <Example {...pageData} {...props} {...{"code":"import { Split, SplitItem } from '@patternfly/react-core';\n\nexport const SplitWrappable: React.FunctionComponent = () => (\n  <Split hasGutter isWrappable>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n    <SplitItem>content</SplitItem>\n  </Split>\n);\n","title":"Wrappable","lang":"ts","className":""}}>
+      
+    </Example>
+};
+
+const Component = () => (
+  <React.Fragment>
+    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
+      {`Examples`}
+    </AutoLinkHeader>
+    {React.createElement(pageData.examples["Basic"])}
+    {React.createElement(pageData.examples["With gutter"])}
+    {React.createElement(pageData.examples["Wrappable"])}
+  </React.Fragment>
+);
+Component.displayName = 'FoundationsAndStylesLayoutsSplitReactDocs';
+Component.pageData = pageData;
+
+export default Component;