feat(MenuToggle): add placeholder support

packages/react-core/package.json

@@ -55,7 +55,7 @@
     "tslib": "^2.6.2"
   },
   "devDependencies": {
-    "@patternfly/patternfly": "6.0.0-alpha.210",
+    "@patternfly/patternfly": "6.0.0-alpha.211",
     "case-anything": "^2.1.13",
     "css": "^3.0.0",
     "fs-extra": "^11.2.0"

packages/react-core/src/components/MenuToggle/MenuToggle.tsx

@@ -49,6 +49,8 @@ export interface MenuToggleProps
   isFullHeight?: boolean;
   /** Flag indicating the toggle takes up the full width of its parent */
   isFullWidth?: boolean;
+  /** Flag indicating the toggle contains placeholder text */
+  isPlaceholder?: boolean;
   /** Object used to configure a split button menu toggle */
   splitButtonOptions?: SplitButtonOptions;
   /** Variant styles of the menu toggle */
@@ -85,6 +87,7 @@ class MenuToggleBase extends React.Component<MenuToggleProps, MenuToggleState> {
     isDisabled: false,
     isFullWidth: false,
     isFullHeight: false,
+    isPlaceholder: false,
     size: 'default',
     ouiaSafe: true
   };
@@ -103,6 +106,7 @@ class MenuToggleBase extends React.Component<MenuToggleProps, MenuToggleState> {
       isDisabled,
       isFullHeight,
       isFullWidth,
+      isPlaceholder,
       splitButtonOptions,
       variant,
       status,
@@ -179,6 +183,7 @@ class MenuToggleBase extends React.Component<MenuToggleProps, MenuToggleState> {
       isFullHeight && styles.modifiers.fullHeight,
       isFullWidth && styles.modifiers.fullWidth,
       isDisabled && styles.modifiers.disabled,
+      isPlaceholder && styles.modifiers.placeholder,
       size === MenuToggleSize.sm && styles.modifiers.small,
       className
     );

packages/react-core/src/components/MenuToggle/__tests__/MenuToggle.test.tsx

@@ -100,4 +100,9 @@ describe('menu toggle', () => {
     await user.click(screen.getByRole(`button`) as Element);
     expect(mockClick).toHaveBeenCalled();
   });
+
+  test(`Renders with class ${styles.modifiers.placeholder} when isPlaceholder is passed`, () => {
+    render(<MenuToggle isPlaceholder>Toggle</MenuToggle>);
+    expect(screen.getByRole('button')).toHaveClass(styles.modifiers.placeholder);
+  });
 });

packages/react-core/src/components/MenuToggle/examples/MenuToggle.md

@@ -296,3 +296,11 @@ When the status value is "warning" or "danger", you must include helper text tha
 ```ts file='MenuToggleStatus.tsx'
 
 ```
+
+### Placeholder text in toggle
+
+To indicate the toggle contains placeholder text, pass the `isPlaceholder` property to the `MenuToggle`.
+
+```ts file='MenuTogglePlaceholder.tsx'
+
+```

packages/react-core/src/components/MenuToggle/examples/MenuTogglePlaceholder.tsx

@@ -0,0 +1,6 @@
+import React from 'react';
+import { MenuToggle } from '@patternfly/react-core';
+
+export const MenuTogglePlaceholder: React.FunctionComponent = () => (
+  <MenuToggle isPlaceholder>Placeholder text</MenuToggle>
+);

packages/react-docs/package.json

@@ -23,7 +23,7 @@
     "test:a11y": "patternfly-a11y --config patternfly-a11y.config"
   },
   "dependencies": {
-    "@patternfly/patternfly": "6.0.0-alpha.210",
+    "@patternfly/patternfly": "6.0.0-alpha.211",
     "@patternfly/react-charts": "workspace:^",
     "@patternfly/react-code-editor": "workspace:^",
     "@patternfly/react-core": "workspace:^",

packages/react-icons/package.json

@@ -33,7 +33,7 @@
     "@fortawesome/free-brands-svg-icons": "^5.15.4",
     "@fortawesome/free-regular-svg-icons": "^5.15.4",
     "@fortawesome/free-solid-svg-icons": "^5.15.4",
-    "@patternfly/patternfly": "6.0.0-alpha.210",
+    "@patternfly/patternfly": "6.0.0-alpha.211",
     "fs-extra": "^11.2.0",
     "tslib": "^2.6.2"
   },

packages/react-styles/package.json

@@ -19,7 +19,7 @@
     "clean": "rimraf dist css"
   },
   "devDependencies": {
-    "@patternfly/patternfly": "6.0.0-alpha.210",
+    "@patternfly/patternfly": "6.0.0-alpha.211",
     "change-case": "^5.4.4",
     "fs-extra": "^11.2.0"
   },

packages/react-tokens/package.json

@@ -29,7 +29,7 @@
     "clean": "rimraf dist"
   },
   "devDependencies": {
-    "@patternfly/patternfly": "6.0.0-alpha.210",
+    "@patternfly/patternfly": "6.0.0-alpha.211",
     "css": "^3.0.0",
     "fs-extra": "^11.2.0"
   }

yarn.lock

@@ -3129,10 +3129,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@patternfly/patternfly@npm:6.0.0-alpha.210":
-  version: 6.0.0-alpha.210
-  resolution: "@patternfly/patternfly@npm:6.0.0-alpha.210"
-  checksum: 10c0/e48c7d27fca68c372f8236ae73d0ee32f3cf27e06b818894a5e71fa327f55b6b4502d04720137d7deda403435eee9346b44f2117d584c9c4ee7bb3ec18792fb0
+"@patternfly/patternfly@npm:6.0.0-alpha.211":
+  version: 6.0.0-alpha.211
+  resolution: "@patternfly/patternfly@npm:6.0.0-alpha.211"
+  checksum: 10c0/9157662947a49ce702f1a66ef48088aa56c36c4af6a88380fb1e1227f05cae1459663ea3a969b92a5ea052201f9f7a2e118d9cc0dd33519eb325fdd6bd4aaff2
   languageName: node
   linkType: hard
 
@@ -3191,7 +3191,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@patternfly/react-core@workspace:packages/react-core"
   dependencies:
-    "@patternfly/patternfly": "npm:6.0.0-alpha.210"
+    "@patternfly/patternfly": "npm:6.0.0-alpha.211"
     "@patternfly/react-icons": "workspace:^"
     "@patternfly/react-styles": "workspace:^"
     "@patternfly/react-tokens": "workspace:^"
@@ -3212,7 +3212,7 @@ __metadata:
   resolution: "@patternfly/react-docs@workspace:packages/react-docs"
   dependencies:
     "@patternfly/documentation-framework": "npm:^6.0.0-alpha.66"
-    "@patternfly/patternfly": "npm:6.0.0-alpha.210"
+    "@patternfly/patternfly": "npm:6.0.0-alpha.211"
     "@patternfly/patternfly-a11y": "npm:4.3.1"
     "@patternfly/react-charts": "workspace:^"
     "@patternfly/react-code-editor": "workspace:^"
@@ -3250,7 +3250,7 @@ __metadata:
     "@fortawesome/free-brands-svg-icons": "npm:^5.15.4"
     "@fortawesome/free-regular-svg-icons": "npm:^5.15.4"
     "@fortawesome/free-solid-svg-icons": "npm:^5.15.4"
-    "@patternfly/patternfly": "npm:6.0.0-alpha.210"
+    "@patternfly/patternfly": "npm:6.0.0-alpha.211"
     fs-extra: "npm:^11.2.0"
     tslib: "npm:^2.6.2"
   peerDependencies:
@@ -3333,7 +3333,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@patternfly/react-styles@workspace:packages/react-styles"
   dependencies:
-    "@patternfly/patternfly": "npm:6.0.0-alpha.210"
+    "@patternfly/patternfly": "npm:6.0.0-alpha.211"
     change-case: "npm:^5.4.4"
     fs-extra: "npm:^11.2.0"
   languageName: unknown
@@ -3374,7 +3374,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@patternfly/react-tokens@workspace:packages/react-tokens"
   dependencies:
-    "@patternfly/patternfly": "npm:6.0.0-alpha.210"
+    "@patternfly/patternfly": "npm:6.0.0-alpha.211"
     css: "npm:^3.0.0"
     fs-extra: "npm:^11.2.0"
   languageName: unknown