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

package/patternfly-docs/generated/components/hero/react.js

@@ -1,88 +0,0 @@
-import React from 'react';
-import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
-
-const pageData = {
-  "id": "Hero",
-  "section": "components",
-  "subsection": "",
-  "deprecated": false,
-  "template": false,
-  "beta": true,
-  "demo": false,
-  "newImplementationLink": false,
-  "source": "react",
-  "tabName": null,
-  "slug": "/components/hero/react",
-  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/components/Hero/examples/Hero.md",
-  "relPath": "packages/react-core/src/components/Hero/examples/Hero.md",
-  "propComponents": [
-    {
-      "name": "Hero",
-      "description": "The main Hero component that allows adjusting of its background images and gradients in different color modes (such as light and dark).",
-      "props": [
-        {
-          "name": "isGlass",
-          "type": "No type info",
-          "defaultValue": "false"
-        }
-      ]
-    }
-  ],
-  "cssPrefix": [
-    "pf-v6-c-hero"
-  ],
-  "examples": [
-    "Basic"
-  ]
-};
-pageData.examples = {
-  'Basic': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Hero } from '@patternfly/react-core';\n\nexport const HeroBasic: React.FunctionComponent = () => <Hero>Basic hero content</Hero>;\n","title":"Basic","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`If you need finer control over the placement of text content within the `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`<Hero>`}
-        </code>
-        {`, such as when you omit a background image, adjust the `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`bodyWidth`}
-        </code>
-        {` and `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`bodyMaxWidth`}
-        </code>
-        {` properties. Be mindful of using these properties when a background image is still present and ensure there is sufficient contrast between text and any part of the image that it overlaps.`}
-      </p>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`When using `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`gradientLight`}
-        </code>
-        {` or `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`gradientDark`}
-        </code>
-        {` to apply gradient backgrounds, check the color contrast to ensure proper accessibility.`}
-      </p>
-    </Example>
-};
-
-const Component = () => (
-  <React.Fragment>
-    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
-      {`Examples`}
-    </AutoLinkHeader>
-    {React.createElement(pageData.examples["Basic"])}
-  </React.Fragment>
-);
-Component.displayName = 'ComponentsHeroReactDocs';
-Component.pageData = pageData;
-
-export default Component;

package/patternfly-docs/generated/components/hint/react.js

@@ -1,169 +0,0 @@
-import React from 'react';
-import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
-import { Fragment, useState } from 'react';
-import RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';
-const pageData = {
-  "id": "Hint",
-  "section": "components",
-  "subsection": "",
-  "deprecated": false,
-  "template": false,
-  "beta": false,
-  "demo": false,
-  "newImplementationLink": false,
-  "source": "react",
-  "tabName": null,
-  "slug": "/components/hint/react",
-  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/components/Hint/examples/Hint.md",
-  "relPath": "packages/react-core/src/components/Hint/examples/Hint.md",
-  "propComponents": [
-    {
-      "name": "Hint",
-      "description": "",
-      "props": [
-        {
-          "name": "actions",
-          "type": "React.ReactNode",
-          "description": "Actions of the hint."
-        },
-        {
-          "name": "children",
-          "type": "React.ReactNode",
-          "description": "Content rendered inside the hint."
-        },
-        {
-          "name": "className",
-          "type": "string",
-          "description": "Additional classes applied to the hint."
-        },
-        {
-          "name": "hasNoActionsOffset",
-          "type": "boolean",
-          "description": "Flag indicating that the actions have no offset",
-          "defaultValue": "false"
-        }
-      ]
-    },
-    {
-      "name": "HintTitle",
-      "description": "",
-      "props": [
-        {
-          "name": "children",
-          "type": "React.ReactNode",
-          "description": "Content rendered inside the hint title."
-        },
-        {
-          "name": "className",
-          "type": "string",
-          "description": "Additional classes applied to the hint title."
-        }
-      ]
-    },
-    {
-      "name": "HintBody",
-      "description": "",
-      "props": [
-        {
-          "name": "children",
-          "type": "React.ReactNode",
-          "description": "Content rendered inside the hint body."
-        },
-        {
-          "name": "className",
-          "type": "string",
-          "description": "Additional classes applied to the hint body."
-        }
-      ]
-    },
-    {
-      "name": "HintFooter",
-      "description": "",
-      "props": [
-        {
-          "name": "children",
-          "type": "React.ReactNode",
-          "description": "Content rendered inside the hint footer."
-        },
-        {
-          "name": "className",
-          "type": "string",
-          "description": "Additional classes applied to the hint footer."
-        }
-      ]
-    }
-  ],
-  "cssPrefix": [
-    "pf-v6-c-hint"
-  ],
-  "examples": [
-    "Basic with title",
-    "Basic without title",
-    "With actions"
-  ]
-};
-pageData.liveContext = {
-  Fragment,
-  useState,
-  RhUiEllipsisVerticalFillIcon
-};
-pageData.examples = {
-  'Basic with title': props => 
-    <Example {...pageData} {...props} {...{"code":"import { useState } from 'react';\nimport {\n  Hint,\n  HintTitle,\n  HintBody,\n  HintFooter,\n  Button,\n  Dropdown,\n  DropdownList,\n  DropdownItem,\n  Divider,\n  MenuToggle,\n  MenuToggleElement\n} from '@patternfly/react-core';\nimport RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';\n\nexport const HintBasicWithTitle: React.FunctionComponent = () => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n\n  const onToggle = () => {\n    setIsOpen(!isOpen);\n  };\n\n  const onSelect = () => {\n    setIsOpen(!isOpen);\n  };\n\n  const actions = (\n    <Dropdown\n      isOpen={isOpen}\n      onSelect={onSelect}\n      onOpenChange={(isOpen: boolean) => setIsOpen(isOpen)}\n      toggle={(toggleRef: React.Ref<MenuToggleElement>) => (\n        <MenuToggle\n          ref={toggleRef}\n          aria-label=\"With title example kebab toggle\"\n          variant=\"plain\"\n          onClick={onToggle}\n          isExpanded={isOpen}\n          icon={<RhUiEllipsisVerticalFillIcon />}\n        />\n      )}\n    >\n      <DropdownList>\n        <DropdownItem value={0} key=\"action\">\n          Action\n        </DropdownItem>\n        <DropdownItem\n          value={1}\n          key=\"link\"\n          to=\"#default-link2\"\n          // Prevent the default onClick functionality for example purposes\n          onClick={(ev: any) => ev.preventDefault()}\n        >\n          Link\n        </DropdownItem>\n        <DropdownItem value={2} isDisabled key=\"disabled action\">\n          Disabled Action\n        </DropdownItem>\n        <DropdownItem value={3} isDisabled key=\"disabled link\" to=\"#default-link4\">\n          Disabled Link\n        </DropdownItem>\n        <Divider component=\"li\" key=\"separator\" />\n        <DropdownItem value={4} key=\"separated action\">\n          Separated Action\n        </DropdownItem>\n        <DropdownItem value={5} key=\"separated link\" to=\"#default-link6\" onClick={(ev) => ev.preventDefault()}>\n          Separated Link\n        </DropdownItem>\n      </DropdownList>\n    </Dropdown>\n  );\n  return (\n    <Hint actions={actions}>\n      <HintTitle>Do more with Find it Fix it capabilities</HintTitle>\n      <HintBody>\n        Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.\n      </HintBody>\n      <HintFooter>\n        <Button variant=\"link\" isInline>\n          Try it for 90 days\n        </Button>\n      </HintFooter>\n    </Hint>\n  );\n};\n","title":"Basic with title","lang":"ts","className":""}}>
-      
-    </Example>,
-  'Basic without title': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment, useState } from 'react';\nimport {\n  Hint,\n  HintBody,\n  HintFooter,\n  Button,\n  Dropdown,\n  DropdownList,\n  DropdownItem,\n  Divider,\n  MenuToggle,\n  MenuToggleElement\n} from '@patternfly/react-core';\nimport RhUiEllipsisVerticalFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon';\n\nexport const HintBasicWithoutTitle: React.FunctionComponent = () => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n\n  const onToggle = () => {\n    setIsOpen(!isOpen);\n  };\n\n  const onSelect = () => {\n    setIsOpen(!isOpen);\n  };\n\n  const actions = (\n    <Dropdown\n      isOpen={isOpen}\n      onSelect={onSelect}\n      onOpenChange={(isOpen: boolean) => setIsOpen(isOpen)}\n      toggle={(toggleRef: React.Ref<MenuToggleElement>) => (\n        <MenuToggle\n          ref={toggleRef}\n          aria-label=\"Without title example kebab toggle\"\n          variant=\"plain\"\n          onClick={onToggle}\n          isExpanded={isOpen}\n          icon={<RhUiEllipsisVerticalFillIcon />}\n        />\n      )}\n    >\n      <DropdownList>\n        <DropdownItem value={0} key=\"action\">\n          Action\n        </DropdownItem>\n        <DropdownItem\n          value={1}\n          key=\"link\"\n          to=\"#default-link2\"\n          // Prevent the default onClick functionality for example purposes\n          onClick={(ev: any) => ev.preventDefault()}\n        >\n          Link\n        </DropdownItem>\n        <DropdownItem value={2} isDisabled key=\"disabled action\">\n          Disabled Action\n        </DropdownItem>\n        <DropdownItem value={3} isDisabled key=\"disabled link\" to=\"#default-link4\">\n          Disabled Link\n        </DropdownItem>\n        <Divider component=\"li\" key=\"separator\" />\n        <DropdownItem value={4} key=\"separated action\">\n          Separated Action\n        </DropdownItem>\n        <DropdownItem value={5} key=\"separated link\" to=\"#default-link6\" onClick={(ev) => ev.preventDefault()}>\n          Separated Link\n        </DropdownItem>\n      </DropdownList>\n    </Dropdown>\n  );\n  return (\n    <Fragment>\n      <Hint>\n        <HintBody>\n          Welcome to the new documentation experience.\n          <Button variant=\"link\" isInline>\n            Learn more about the improved features.\n          </Button>\n        </HintBody>\n      </Hint>\n      <br />\n      <Hint actions={actions}>\n        <HintBody>\n          Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.\n        </HintBody>\n        <HintFooter>\n          <Button variant=\"link\" isInline>\n            Try it for 90 days\n          </Button>\n        </HintFooter>\n      </Hint>\n    </Fragment>\n  );\n};\n","title":"Basic without title","lang":"ts","className":""}}>
-      
-    </Example>,
-  'With actions': props => 
-    <Example {...pageData} {...props} {...{"code":"import { useState } from 'react';\nimport { Hint, HintTitle, HintBody, Button, Checkbox } from '@patternfly/react-core';\n\nexport const HintActionsWithNoOffset: React.FunctionComponent = () => {\n  const [hasNoActionsOffset, setHasNoActionsOffset] = useState<boolean>(false);\n\n  const toggleOffset = (checked: boolean) => {\n    setHasNoActionsOffset(checked);\n  };\n\n  const actions = <Button variant=\"primary\">Action</Button>;\n  return (\n    <>\n      <Checkbox\n        label=\"actions hasNoOffset\"\n        isChecked={hasNoActionsOffset}\n        onChange={(_event, checked) => toggleOffset(checked)}\n        aria-label=\"remove actions offset\"\n        id=\"toggle-actions-offset\"\n        name=\"toggle-actions-offset\"\n      />\n      <div style={{ marginTop: '15px' }}>\n        <Hint actions={actions} hasNoActionsOffset={hasNoActionsOffset}>\n          <HintTitle>Do more with Find it Fix it capabilities</HintTitle>\n          <HintBody>\n            Upgrade to Red Hat Smart Management to remediate all your systems across regions and geographies.\n          </HintBody>\n        </Hint>\n      </div>\n    </>\n  );\n};\n","title":"With actions","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`You can add actions to a hint to allow users to respond to suggestions and initiate any related processes.`}
-      </p>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`When a `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`<Hint>`}
-        </code>
-        {` contains `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`actions`}
-        </code>
-        {`, a negative margin is applied to the actions so that they are better aligned with the hint title. For larger-sized titles or non-plain actions (such as a button), remove this negative margin by setting `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`hasNoActionsOffset`}
-        </code>
-        {` to `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`true`}
-        </code>
-        {`.`}
-      </p>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`To illustrate this behavior, select the "actions hasNoActionsOffset" checkbox in the following example.`}
-      </p>
-    </Example>
-};
-
-const Component = () => (
-  <React.Fragment>
-    <AutoLinkHeader {...{"id":"examples","headingLevel":"h2","className":"ws-title ws-h2"}}>
-      {`Examples`}
-    </AutoLinkHeader>
-    {React.createElement(pageData.examples["Basic with title"])}
-    {React.createElement(pageData.examples["Basic without title"])}
-    {React.createElement(pageData.examples["With actions"])}
-  </React.Fragment>
-);
-Component.displayName = 'ComponentsHintReactDocs';
-Component.pageData = pageData;
-
-export default Component;

package/patternfly-docs/generated/components/icon/react.js

@@ -1,215 +0,0 @@
-import React from 'react';
-import { AutoLinkHeader, Example, Link as PatternflyThemeLink } from '@patternfly/documentation-framework/components';
-import { Fragment, useState } from 'react';
-import LongArrowAltDownIcon from '@patternfly/react-icons/dist/esm/icons/long-arrow-alt-down-icon';
-import RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';
-import RhMicronsCaretDownIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-down-icon';
-import RhUiSettingsFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-settings-fill-icon';
-import RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';
-import RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';
-import RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';
-import RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';
-import RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';
-import RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';
-const pageData = {
-  "id": "Icon",
-  "section": "components",
-  "subsection": "",
-  "deprecated": false,
-  "template": false,
-  "beta": false,
-  "demo": false,
-  "newImplementationLink": false,
-  "source": "react",
-  "tabName": null,
-  "slug": "/components/icon/react",
-  "sourceLink": "https://github.com/patternfly/patternfly-react/blob/main/packages/react-core/src/components/Icon/examples/Icon.md",
-  "relPath": "packages/react-core/src/components/Icon/examples/Icon.md",
-  "propComponents": [
-    {
-      "name": "Icon",
-      "description": "",
-      "props": [
-        {
-          "name": "children",
-          "type": "React.ReactNode",
-          "description": "Icon content"
-        },
-        {
-          "name": "className",
-          "type": "string",
-          "description": "Additional classes applied to the icon container"
-        },
-        {
-          "name": "defaultProgressArialabel",
-          "type": "string",
-          "description": "Aria-label for the default progress icon",
-          "defaultValue": "'Loading...'"
-        },
-        {
-          "name": "iconSize",
-          "type": "| 'sm'\n| 'md'\n| 'lg'\n| 'xl'\n| '2xl'\n| '3xl'\n| 'headingSm'\n| 'headingMd'\n| 'headingLg'\n| 'headingXl'\n| 'heading_2xl'\n| 'heading_3xl'\n| 'bodySm'\n| 'bodyDefault'\n| 'bodyLg'",
-          "description": "Size of icon. Overrides the icon size set by the size property."
-        },
-        {
-          "name": "isInline",
-          "type": "boolean",
-          "description": "Indicates the icon is inline and should inherit the text font size and color. Overriden by size and iconSize properties.",
-          "defaultValue": "false"
-        },
-        {
-          "name": "isInProgress",
-          "type": "boolean",
-          "description": "Indicates the icon is in progress. Setting this property to true will swap the icon with the progressIcon.",
-          "defaultValue": "false"
-        },
-        {
-          "name": "progressIcon",
-          "type": "React.ReactNode",
-          "description": "Icon when isInProgress is set to true. Defaults to a 1em spinner."
-        },
-        {
-          "name": "progressIconSize",
-          "type": "| 'sm'\n| 'md'\n| 'lg'\n| 'xl'\n| '2xl'\n| '3xl'\n| 'headingSm'\n| 'headingMd'\n| 'headingLg'\n| 'headingXl'\n| 'heading_2xl'\n| 'heading_3xl'\n| 'bodySm'\n| 'bodyDefault'\n| 'bodyLg'",
-          "description": "Size of progress icon. Overrides the icon size set by the size property."
-        },
-        {
-          "name": "shouldMirrorRTL",
-          "type": "boolean",
-          "description": "Flag indicating whether the icon passed as children should be mirrored for\nright to left (RTL) languages. This will not mirror the icon passed to progressIcon.",
-          "defaultValue": "false"
-        },
-        {
-          "name": "size",
-          "type": "| 'sm'\n| 'md'\n| 'lg'\n| 'xl'\n| '2xl'\n| '3xl'\n| 'headingSm'\n| 'headingMd'\n| 'headingLg'\n| 'headingXl'\n| 'heading_2xl'\n| 'heading_3xl'\n| 'bodySm'\n| 'bodyDefault'\n| 'bodyLg'",
-          "description": "Size of the icon component container and icon."
-        },
-        {
-          "name": "status",
-          "type": "'custom' | 'info' | 'success' | 'warning' | 'danger'",
-          "description": "Status color of the icon"
-        }
-      ]
-    }
-  ],
-  "cssPrefix": [
-    "pf-v6-c-icon"
-  ],
-  "examples": [
-    "Basic",
-    "Standalone icon sizes",
-    "Body sizes",
-    "Heading sizes",
-    "Status colors",
-    "Sizing an icon within the icon container",
-    "Inline",
-    "In progress",
-    "Custom in progress icon"
-  ]
-};
-pageData.liveContext = {
-  Fragment,
-  useState,
-  LongArrowAltDownIcon,
-  RhMicronsCaretRightIcon,
-  RhMicronsCaretDownIcon,
-  RhUiSettingsFillIcon,
-  RhUiAddCircleFillIcon,
-  RhUiErrorFillIcon,
-  RhUiWarningFillIcon,
-  RhUiCheckCircleFillIcon,
-  RhUiInformationFillIcon,
-  RhUiNotificationFillIcon
-};
-pageData.examples = {
-  'Basic': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport LongArrowAltDownIcon from '@patternfly/react-icons/dist/esm/icons/long-arrow-alt-down-icon';\nimport RhMicronsCaretRightIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-right-icon';\nimport RhMicronsCaretDownIcon from '@patternfly/react-icons/dist/esm/icons/rh-microns-caret-down-icon';\nimport RhUiSettingsFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-settings-fill-icon';\n\nexport const IconBasic: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon>\n      <LongArrowAltDownIcon />\n    </Icon>{' '}\n    <Icon>\n      <RhMicronsCaretRightIcon />\n    </Icon>{' '}\n    <Icon>\n      <RhMicronsCaretDownIcon />\n    </Icon>{' '}\n    <Icon>\n      <RhUiSettingsFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Basic","lang":"ts","className":""}}>
-      
-    </Example>,
-  'Standalone icon sizes': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';\n\nexport const StandaloneIconSizes: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon size=\"sm\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"md\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"lg\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"2xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"3xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Standalone icon sizes","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`These are the standard options for sizing icons.`}
-      </p>
-    </Example>,
-  'Body sizes': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';\n\nexport const BodyIconSizes: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon size=\"bodySm\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"bodyDefault\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"bodyLg\">\n      <RhUiAddCircleFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Body sizes","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`These size options are meant to make icons match the size of body text.`}
-      </p>
-    </Example>,
-  'Heading sizes': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';\n\nexport const HeadingIconSizes: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon size=\"headingSm\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"headingMd\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"headingLg\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"headingXl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"heading_2xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"heading_3xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Heading sizes","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`These size options are meant to make icons match the size of heading text.`}
-      </p>
-    </Example>,
-  'Status colors': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport RhUiErrorFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-error-fill-icon';\nimport RhUiWarningFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-warning-fill-icon';\nimport RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';\nimport RhUiInformationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-information-fill-icon';\nimport RhUiNotificationFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-notification-fill-icon';\n\nexport const IconStatus: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon status=\"danger\">\n      <RhUiErrorFillIcon />\n    </Icon>{' '}\n    <Icon status=\"warning\">\n      <RhUiWarningFillIcon />\n    </Icon>{' '}\n    <Icon status=\"success\">\n      <RhUiCheckCircleFillIcon />\n    </Icon>{' '}\n    <Icon status=\"info\">\n      <RhUiInformationFillIcon />\n    </Icon>{' '}\n    <Icon status=\"custom\">\n      <RhUiNotificationFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Status colors","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`The following example demonstrates the various status variants of an icon. Keep in mind that these icons are displayed out of a typical context, and that you should not rely on color alone to convey status to users.`}
-      </p>
-    </Example>,
-  'Sizing an icon within the icon container': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon } from '@patternfly/react-core';\nimport RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';\n\nexport const IconContentSizes: React.FunctionComponent = () => (\n  <Fragment>\n    <Icon size=\"3xl\" iconSize=\"lg\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"3xl\" iconSize=\"xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"3xl\" iconSize=\"2xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>{' '}\n    <Icon size=\"3xl\">\n      <RhUiAddCircleFillIcon />\n    </Icon>\n  </Fragment>\n);\n","title":"Sizing an icon within the icon container","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`Providing both size and iconSize properties allows the icon container to maintain a consistent size, even if the icon changes in size.`}
-      </p>
-    </Example>,
-  'Inline': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment } from 'react';\nimport { Icon, Content } from '@patternfly/react-core';\nimport RhUiAddCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-circle-fill-icon';\n\nexport const IconInline: React.FunctionComponent = () => (\n  <Fragment>\n    <Content>\n      <h1>\n        Heading\n        <Icon isInline>\n          <RhUiAddCircleFillIcon />\n        </Icon>\n      </h1>\n      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit Sed hendrerit nisi in cursus maximus.</p>\n      <h2>\n        Second level\n        <Icon isInline>\n          <RhUiAddCircleFillIcon />\n        </Icon>\n      </h2>\n      <p>\n        <Icon isInline>\n          <RhUiAddCircleFillIcon />\n        </Icon>\n        Curabitur accumsan turpis pharetra\n        <strong>\n          augue tincidunt\n          <Icon isInline>\n            <RhUiAddCircleFillIcon />\n          </Icon>\n        </strong>\n        blandit. Quisque condimentum maximus mi, sit amet commodo arcu rutrum id. Proin pretium urna vel cursus\n        venenatis. Suspendisse potenti.\n      </p>\n      <small>\n        Sometimes you need small text\n        <Icon isInline>\n          <RhUiAddCircleFillIcon />\n        </Icon>\n      </small>\n      Inline with size specified:\n      <Icon size=\"sm\" isInline>\n        <RhUiAddCircleFillIcon />\n      </Icon>\n      small,\n      <Icon size=\"md\" isInline>\n        <RhUiAddCircleFillIcon />\n      </Icon>\n      medium,\n      <Icon size=\"lg\" isInline>\n        <RhUiAddCircleFillIcon />\n      </Icon>\n      large,\n      <Icon size=\"xl\" isInline>\n        <RhUiAddCircleFillIcon />\n      </Icon>\n      extra large\n    </Content>\n  </Fragment>\n);\n","title":"Inline","lang":"ts","className":""}}>
-      
-    </Example>,
-  'In progress': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment, useState } from 'react';\nimport { Icon, Checkbox } from '@patternfly/react-core';\nimport RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';\n\nexport const IconProgress: React.FunctionComponent = () => {\n  const [isInProgress, setIsInProgress] = useState<boolean>(false);\n  return (\n    <Fragment>\n      <div style={{ marginBottom: '12px' }}>\n        <Checkbox\n          label=\"Toggle in progress state\"\n          isChecked={isInProgress}\n          onChange={(_event, checked) => setIsInProgress(checked)}\n          aria-label=\"Set icon progress state\"\n          id=\"toggle-icon-progress\"\n          name=\"toggle-icon-progress\"\n        />\n      </div>\n      <Icon isInProgress={isInProgress}>\n        <RhUiCheckCircleFillIcon />\n      </Icon>\n    </Fragment>\n  );\n};\n","title":"In progress","lang":"ts","className":""}}>
-      
-      <p {...{"className":"pf-v6-c-content--p pf-m-editorial ws-p "}}>
-        {`Passing the `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`isInProgress`}
-        </code>
-        {` property will swap the icon to a progress icon. By default this progress icon will be a `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`Spinner`}
-        </code>
-        {` but may be customized or overriden using the `}
-        
-        <code {...{"className":"ws-code "}}>
-          {`progressIcon`}
-        </code>
-        {` property.`}
-      </p>
-    </Example>,
-  'Custom in progress icon': props => 
-    <Example {...pageData} {...props} {...{"code":"import { Fragment, useState } from 'react';\nimport { Icon, Spinner, Checkbox } from '@patternfly/react-core';\nimport RhUiCheckCircleFillIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-check-circle-fill-icon';\n\nexport const IconProgress: React.FunctionComponent = () => {\n  const [isInProgress, setIsInProgress] = useState<boolean>(false);\n  return (\n    <Fragment>\n      <div style={{ marginBottom: '12px' }}>\n        <Checkbox\n          label=\"Toggle in progress state\"\n          isChecked={isInProgress}\n          onChange={(_event, checked) => setIsInProgress(checked)}\n          aria-label=\"Set icon progress state\"\n          id=\"toggle-icon-progress-custom\"\n          name=\"toggle-icon-progress-custom\"\n        />\n      </div>\n      <Icon isInProgress={isInProgress} progressIcon={<Spinner diameter=\"2em\" aria-label=\"Loading...\" />}>\n        <RhUiCheckCircleFillIcon />\n      </Icon>\n    </Fragment>\n  );\n};\n","title":"Custom in progress icon","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["Standalone icon sizes"])}
-    {React.createElement(pageData.examples["Body sizes"])}
-    {React.createElement(pageData.examples["Heading sizes"])}
-    {React.createElement(pageData.examples["Status colors"])}
-    {React.createElement(pageData.examples["Sizing an icon within the icon container"])}
-    {React.createElement(pageData.examples["Inline"])}
-    {React.createElement(pageData.examples["In progress"])}
-    {React.createElement(pageData.examples["Custom in progress icon"])}
-  </React.Fragment>
-);
-Component.displayName = 'ComponentsIconReactDocs';
-Component.pageData = pageData;
-
-export default Component;