@patternfly/react-core 4.273.0 → 4.273.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-core",
-  "version": "4.273.0",
+  "version": "4.273.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",
@@ -45,16 +45,16 @@
     "subpaths": "node scripts/copySubpaths.js"
   },
   "dependencies": {
-    "@patternfly/react-icons": "^4.93.3",
-    "@patternfly/react-styles": "^4.92.3",
-    "@patternfly/react-tokens": "^4.94.3",
+    "@patternfly/react-icons": "^4.93.4",
+    "@patternfly/react-styles": "^4.92.4",
+    "@patternfly/react-tokens": "^4.94.4",
     "focus-trap": "6.9.2",
     "react-dropzone": "9.0.0",
     "tippy.js": "5.1.2",
     "tslib": "^2.0.0"
   },
   "devDependencies": {
-    "@patternfly/patternfly": "4.222.4",
+    "@patternfly/patternfly": "4.224.0",
     "@rollup/plugin-commonjs": "^21.0.0",
     "@rollup/plugin-node-resolve": "^15.0.1",
     "@rollup/plugin-replace": "^3.0.0",
@@ -71,5 +71,5 @@
     "react": "^16.8 || ^17 || ^18",
     "react-dom": "^16.8 || ^17 || ^18"
   },
-  "gitHead": "f456ccbaa54574c5e7e52222a0f766d893a9c325"
+  "gitHead": "f4d6511036d4a2a16d2ddae15a23fa80188dfc22"
 }

package/src/components/Tabs/TabAction.tsx

@@ -11,8 +11,6 @@ export interface TabActionProps extends Omit<React.HTMLProps<HTMLButtonElement>,
   className?: string;
   /** Click callback for tab action button */
   onClick?: (event: React.MouseEvent<HTMLElement, MouseEvent>) => void;
-  /** Flag indicating if the tab action is a help action */
-  isHelpAction?: boolean;
   /** Flag indicating if the tab action is disabled */
   isDisabled?: boolean;
   /** Accessible label for the tab action */
@@ -25,7 +23,6 @@ const TabActionBase: React.FunctionComponent<TabActionProps> = ({
   children,
   className,
   onClick,
-  isHelpAction,
   isDisabled,
   'aria-label': ariaLabel = 'Tab action',
   innerRef,
@@ -34,7 +31,7 @@ const TabActionBase: React.FunctionComponent<TabActionProps> = ({
   ouiaSafe,
   ...props
 }: TabActionProps) => (
-  <span className={css(styles.tabsItemAction, isHelpAction && styles.modifiers.help, className)}>
+  <span className={css(styles.tabsItemAction, className)}>
     <Button
       ref={innerRef}
       type="button"

package/src/components/Tabs/examples/Tabs.md

@@ -2,7 +2,7 @@
 id: Tabs
 section: components
 cssPrefix: pf-c-tabs
-propComponents: ['Tabs', 'Tab', 'TabContent', 'TabTitleText', 'TabTitleIcon', 'horizontalOverflowObject']
+propComponents: ['Tabs', 'Tab', TabAction, 'TabContent', 'TabTitleText', 'TabTitleIcon', 'horizontalOverflowObject']
 ouia: true
 ---
 

package/src/components/Tabs/examples/TabsHelp.tsx

@@ -41,7 +41,6 @@ export const TabsHelp: React.FunctionComponent = () => {
             actions={
               <>
                 <TabAction
-                  isHelpAction
                   aria-label={`Help action for ${tab}`}
                   ref={ref}
                   {...(tab === 'Help disabled' && { isDisabled: true })}

package/src/components/Tabs/examples/TabsHelpAndClose.tsx

@@ -65,7 +65,7 @@ export const TabsHelpAndClose: React.FunctionComponent = () => {
             title={<TabTitleText>{tab}</TabTitleText>}
             actions={
               <>
-                <TabAction isHelpAction aria-label={`Help for ${tab}`} ref={ref}>
+                <TabAction aria-label={`Help for ${tab}`} ref={ref}>
                   <HelpIcon />
                 </TabAction>
                 <TabAction aria-label={`Close ${tab}`} onClick={e => onClose(e, index)} isDisabled={tabs.length === 1}>

package/src/next/components/Dropdown/examples/Dropdown.md

@@ -10,22 +10,36 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico
 
 ## Examples
 
-### Basic
+### Basic dropdowns
+Basic dropdowns present users with a menu of items upon clicking a dropdown toggle. 
+
+A `<Dropdown>` uses a [menu toggle](/components/menu-toggle), which is passed to the `toggle` property, as well as a `<DropdownList>` with multiple `<DropdownItem>` components. To allow a dropdown to change the open state of the menu, pass the `isOpen` property into the `onOpenChange` callback. 
+
+The following example shows a few different states of dropdown items. As shown in this example, dropdown items may: 
+- Use the `isDisabled` property to disable an item.
+- Use the `onClick` property to trigger a callback for an action.
+
+This example also uses a `<Divider>` which passes in `key=”separator”` to split the menu into 2 sections with a horizontal line.
 
 ```ts file="./DropdownBasic.tsx"
 ```
 
 ### With kebab toggle
 
+To style a dropdown menu's toggle with a kebab icon, pass a "plain" `<MenuToggle>` to the `toggle` property. When there isn't enough space for a labeled button, a kebab icon can be used to toggle the dropdown menu open or closed.
+
 ```ts file="./DropdownWithKebabToggle.tsx"
 ```
 
-### With groups
+### With groups of items
+To group sets of related dropdown items together, use a `<DropdownGroup>`. When more than 1 `<DropdownGroup>` is created in a menu, use the `label` and `labelHeadingLevel` properties to assign a name and heading level to each group. 
 
 ```ts file="./DropdownWithGroups.tsx"
 ```
 
-### With descriptions
+### With item descriptions
+
+To provide users with more context about a `<DropdownItem>`, pass a short message to `description` property. As shown in the example below, an item's description will appear below its label. 
 
 ```ts file="./DropdownWithDescriptions.tsx"
-```
+```