npm - @patternfly/react-core - Versions diffs - 6.2.0-prerelease.2 → 6.2.0-prerelease.21 - Mend

@patternfly/react-core 6.2.0-prerelease.2 → 6.2.0-prerelease.21

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (726) hide show

package/src/components/Drawer/__tests__/__snapshots__/Drawer.test.tsx.snap CHANGED Viewed

@@ -34,7 +34,6 @@ exports[`Drawer expands from bottom 1`] = `
               class="pf-v6-c-drawer__close"
             >
               <button
-                aria-disabled="false"
                 aria-label="Close drawer panel"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-4"
@@ -127,7 +126,6 @@ exports[`Drawer has resizable callback and id 1`] = `
                 class="pf-v6-c-drawer__close"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Close drawer panel"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-6"
@@ -222,7 +220,6 @@ exports[`Drawer has resizable css and color variants 1`] = `
                 class="pf-v6-c-drawer__close"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Close drawer panel"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-5"
@@ -351,7 +348,6 @@ exports[`Drawer isExpanded = true and isInline = false and isStatic = false 1`]
               class="pf-v6-c-drawer__close"
             >
               <button
-                aria-disabled="false"
                 aria-label="Close drawer panel"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-1"
@@ -425,7 +421,6 @@ exports[`Drawer isExpanded = true and isInline = false and isStatic = true 1`] =
               class="pf-v6-c-drawer__close"
             >
               <button
-                aria-disabled="false"
                 aria-label="Close drawer panel"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-3"
@@ -499,7 +494,6 @@ exports[`Drawer isExpanded = true and isInline = true and isStatic = false 1`] =
               class="pf-v6-c-drawer__close"
             >
               <button
-                aria-disabled="false"
                 aria-label="Close drawer panel"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-2"

package/src/components/Drawer/examples/DrawerAdditionalSectionAboveContent.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ import {
 export const DrawerAdditionalSectionAboveContent: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerBasic.tsx CHANGED Viewed

@@ -14,7 +14,7 @@ import {
 export const DrawerBasic: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerBasicInline.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerBasicInline: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerBreakpoint.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerBreakpoint: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerInlinePanelEnd.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerInlinePanelEnd: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerInlinePanelStart.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerInlinePanelStart: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerModifiedContentPadding.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerModifiedContentPadding: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerModifiedPanelPadding.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerModifiedPanelPadding: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerPanelBottom.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerPanelBottom: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerPanelEnd.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerPanelEnd: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerPanelStart.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerPanelStart: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerResizableAtEnd.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerResizableAtEnd: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerResizableAtStart.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerResizableAtStart: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerResizableOnBottom.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerResizableOnBottom: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerResizableOnInline.tsx CHANGED Viewed

@@ -12,7 +12,7 @@ import {
 export const DrawerResizableOnInline: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerStackedContentBodyElements.tsx CHANGED Viewed

@@ -14,7 +14,7 @@ import {
 export const DrawerStackedContentBodyElements: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Drawer/examples/DrawerStatic.tsx CHANGED Viewed

@@ -13,7 +13,7 @@ import accessibility from '@patternfly/react-styles/css/utilities/Accessibility/
 export const DrawerStatic: React.FunctionComponent = () => {
   const [isExpanded, setIsExpanded] = React.useState(false);
-  const drawerRef = React.useRef<HTMLDivElement>();
+  const drawerRef = React.useRef<HTMLDivElement>(undefined);
   const onExpand = () => {
     drawerRef.current && drawerRef.current.focus();

package/src/components/Dropdown/Dropdown.tsx CHANGED Viewed

@@ -27,7 +27,7 @@ export interface DropdownToggleProps {
   /**  Dropdown toggle node. */
   toggleNode: React.ReactNode;
   /** Reference to the toggle. */
-  toggleRef?: React.RefObject<HTMLButtonElement>;
+  toggleRef?: React.RefObject<HTMLButtonElement | null>;
 }
 /**
@@ -103,15 +103,15 @@ const DropdownBase: React.FunctionComponent<DropdownProps> = ({
   focusTimeoutDelay = 0,
   ...props
 }: DropdownProps) => {
-  const localMenuRef = React.useRef<HTMLDivElement>();
-  const localToggleRef = React.useRef<HTMLButtonElement>();
+  const localMenuRef = React.useRef<HTMLDivElement>(undefined);
+  const localToggleRef = React.useRef<HTMLButtonElement>(undefined);
   const ouiaProps = useOUIAProps(Dropdown.displayName, ouiaId, ouiaSafe);
-  const menuRef = (innerRef as React.RefObject<HTMLDivElement>) || localMenuRef;
+  const menuRef = (innerRef as React.RefObject<HTMLDivElement | null>) || localMenuRef;
   const toggleRef =
     typeof toggle === 'function' || (typeof toggle !== 'function' && !toggle.toggleRef)
       ? localToggleRef
-      : (toggle?.toggleRef as React.RefObject<HTMLButtonElement>);
+      : (toggle?.toggleRef as React.RefObject<HTMLButtonElement | null>);
   const prevIsOpen = React.useRef<boolean>(isOpen);
   React.useEffect(() => {

package/src/components/DualListSelector/DualListSelectorControlsWrapper.tsx CHANGED Viewed

@@ -11,7 +11,7 @@ export interface DualListSelectorControlsWrapperProps extends React.HTMLProps<HT
   /** Additional classes added to the wrapper. */
   className?: string;
   /** @hide Forwarded ref */
-  innerRef?: React.RefObject<HTMLDivElement>;
+  innerRef?: React.RefObject<HTMLDivElement | null>;
   /** Accessible label for the dual list selector controls wrapper. */
   'aria-label'?: string;
 }

package/src/components/DualListSelector/DualListSelectorList.tsx CHANGED Viewed

@@ -10,7 +10,7 @@ export interface DualListSelectorListProps extends React.HTMLProps<HTMLUListElem
   /** Content rendered inside the dual list selector list. */
   children?: React.ReactNode;
   /** @hide forwarded ref */
-  innerRef?: React.RefObject<HTMLUListElement>;
+  innerRef?: React.RefObject<HTMLUListElement | null>;
 }
 export const DualListSelectorListBase: React.FunctionComponent<DualListSelectorListProps> = ({

package/src/components/DualListSelector/DualListSelectorListItem.tsx CHANGED Viewed

@@ -24,7 +24,7 @@ export interface DualListSelectorListItemProps extends React.HTMLProps<HTMLLIEle
   /** @hide Internal field used to keep track of order of unfiltered options. */
   orderIndex?: number;
   /** @hide Forwarded ref */
-  innerRef?: React.RefObject<HTMLLIElement>;
+  innerRef?: React.RefObject<HTMLLIElement | null>;
   /** Flag indicating this item is draggable for reordering. */
   isDraggable?: boolean;
   /** Accessible label for the draggable button on draggable list items. */

package/src/components/DualListSelector/DualListSelectorListWrapper.tsx CHANGED Viewed

@@ -15,7 +15,7 @@ export interface DualListSelectorListWrapperProps extends React.HTMLProps<HTMLDi
   /** Accessibly label for the list. */
   'aria-labelledby': string;
   /** @hide forwarded ref */
-  innerRef?: React.RefObject<HTMLDivElement>;
+  innerRef?: React.RefObject<HTMLDivElement | null>;
   /** @hide Options to list in the pane. */
   options?: React.ReactNode[];
   /** @hide Options currently selected in the pane. */

package/src/components/DualListSelector/DualListSelectorTreeItem.tsx CHANGED Viewed

@@ -138,7 +138,9 @@ const DualListSelectorTreeItemBase: React.FunctionComponent<DualListSelectorTree
                     e.preventDefault();
                   }
                 }}
-                ref={(elem) => elem && (elem.indeterminate = isChecked === null)}
+                ref={(elem) => {
+                  elem && (elem.indeterminate = isChecked === null);
+                }}
                 checked={isChecked || false}
                 tabIndex={-1}
                 {...checkProps}
@@ -148,7 +150,7 @@ const DualListSelectorTreeItemBase: React.FunctionComponent<DualListSelectorTree
             <span className={css(styles.dualListSelectorItemText)}>{text}</span>
             {hasBadge && children && (
               <span className={css(styles.dualListSelectorItemCount)}>
-                <Badge {...badgeProps}>{flattenTree((children as React.ReactElement).props.data).length}</Badge>
+                <Badge {...badgeProps}>{flattenTree((children as React.ReactElement<any>).props.data).length}</Badge>
               </span>
             )}
           </span>

package/src/components/EmptyState/__tests__/__snapshots__/EmptyState.test.tsx.snap CHANGED Viewed

@@ -94,7 +94,6 @@ exports[`EmptyState Main 1`] = `
           class="pf-v6-c-empty-state__actions"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-primary"
             data-ouia-component-id="OUIA-Generated-Button-primary-1"
             data-ouia-component-type="PF6/Button"
@@ -112,7 +111,6 @@ exports[`EmptyState Main 1`] = `
           class="pf-v6-c-empty-state__actions"
         >
           <button
-            aria-disabled="false"
             aria-label="learn more action"
             class="pf-v6-c-button pf-m-link"
             data-ouia-component-id="OUIA-Generated-Button-link-1"

package/src/components/ExpandableSection/__tests__/__snapshots__/ExpandableSection.test.tsx.snap CHANGED Viewed

@@ -22,7 +22,6 @@ exports[`Detached ExpandableSection renders successfully 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         aria-expanded="true"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-5"
@@ -73,7 +72,6 @@ exports[`Disclosure ExpandableSection 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-6"
         data-ouia-component-type="PF6/Button"
@@ -127,7 +125,6 @@ exports[`ExpandableSection 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-1"
         data-ouia-component-type="PF6/Button"
@@ -181,7 +178,6 @@ exports[`Renders ExpandableSection expanded 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         aria-expanded="true"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-2"
@@ -235,7 +231,6 @@ exports[`Renders ExpandableSection indented 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         aria-expanded="true"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-7"
@@ -289,7 +284,6 @@ exports[`Renders Uncontrolled ExpandableSection 1`] = `
     >
       <button
         aria-controls="content-id"
-        aria-disabled="false"
         class="pf-v6-c-button pf-m-link"
         data-ouia-component-id="OUIA-Generated-Button-link-4"
         data-ouia-component-type="PF6/Button"

package/src/components/FileUpload/FileUpload.tsx CHANGED Viewed

@@ -179,6 +179,7 @@ export const FileUpload: React.FunctionComponent<FileUploadProps> = ({
       <input
         /* hidden, necessary for react-dropzone */
         {...inputProps}
+        hidden
       />
       {children}
     </FileUploadField>

package/src/components/FileUpload/FileUploadField.tsx CHANGED Viewed

@@ -43,6 +43,8 @@ export interface FileUploadFieldProps extends Omit<React.HTMLProps<HTMLDivElemen
   id: string;
   /** Name property for the text input. */
   name?: string;
+  /** Flag to disable the browse button. */
+  isBrowseButtonDisabled?: boolean;
   /** Flag to disable the clear button. */
   isClearButtonDisabled?: boolean;
   /** Flag to show if the field is disabled. */
@@ -114,6 +116,7 @@ export const FileUploadField: React.FunctionComponent<FileUploadFieldProps> = ({
   browseButtonText = 'Browse...',
   browseButtonAriaDescribedby,
   clearButtonText = 'Clear',
+  isBrowseButtonDisabled = false,
   isClearButtonDisabled = !filename && !value,
   containerRef = null as React.Ref<HTMLDivElement>,
   allowEditingUploadedText = false,
@@ -153,7 +156,7 @@ export const FileUploadField: React.FunctionComponent<FileUploadFieldProps> = ({
             <Button
               variant={ButtonVariant.control}
               onClick={onBrowseButtonClick}
-              isDisabled={isDisabled}
+              isDisabled={isDisabled || isBrowseButtonDisabled}
               aria-describedby={browseButtonAriaDescribedby}
             >
               {browseButtonText}

package/src/components/FileUpload/__tests__/FileUploadField.test.tsx CHANGED Viewed

@@ -1,6 +1,7 @@
 import { FileUploadField } from '../FileUploadField';
 import * as React from 'react';
 import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
 test('simple fileuploadfield', () => {
   const browserBtnClickHandler = jest.fn();
@@ -15,6 +16,7 @@ test('simple fileuploadfield', () => {
       filenamePlaceholder="Do something custom with this!"
       onBrowseButtonClick={browserBtnClickHandler}
       onClearButtonClick={clearBtnClickHandler}
+      isBrowseButtonDisabled={false}
       isClearButtonDisabled={false}
       isLoading={false}
       isDragActive={false}
@@ -32,7 +34,7 @@ test('Renders without aria-describedby on browse button by default', () => {
   expect(screen.getByRole('button', { name: 'Upload' })).not.toHaveAccessibleDescription();
 });
-test('Renders without aria-describedby on browse button by default', () => {
+test('Renders with aria-describedby on browse button', () => {
   render(
     <FileUploadField id="file-upload-field" browseButtonText="Upload" browseButtonAriaDescribedby="helper-text">
       <div id="helper-text">Helper text</div>
@@ -41,3 +43,15 @@ test('Renders without aria-describedby on browse button by default', () => {
   expect(screen.getByRole('button', { name: 'Upload' })).toHaveAccessibleDescription('Helper text');
 });
+test('Browse button is enabled by default', () => {
+  render(<FileUploadField id="file-upload-field" browseButtonText="Upload" />);
+  expect(screen.getByRole('button', { name: 'Upload' })).not.toHaveAttribute('disabled');
+});
+test('Browse button is disabled with isBrowseButtonDisabled prop', () => {
+  render(<FileUploadField id="file-upload-field" browseButtonText="Upload" isBrowseButtonDisabled={true} />);
+  expect(screen.getByRole('button', { name: 'Upload' })).toHaveAttribute('disabled');
+});

package/src/components/FileUpload/__tests__/__snapshots__/FileUpload.test.tsx.snap CHANGED Viewed

@@ -37,7 +37,6 @@ exports[`simple fileupload 1`] = `
           class="pf-v6-c-input-group__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-control"
             data-ouia-component-id="OUIA-Generated-Button-control-1"
             data-ouia-component-type="PF6/Button"
@@ -55,7 +54,6 @@ exports[`simple fileupload 1`] = `
           class="pf-v6-c-input-group__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-control"
             data-ouia-component-id="OUIA-Generated-Button-control-2"
             data-ouia-component-type="PF6/Button"
@@ -76,7 +74,7 @@ exports[`simple fileupload 1`] = `
       class="pf-v6-c-file-upload__file-details"
     >
       <span
-        class="pf-v6-c-form-control pf-m-resize-vertical"
+        class="pf-v6-c-form-control pf-m-textarea pf-m-resize-vertical"
       >
         <textarea
           aria-invalid="false"
@@ -87,6 +85,7 @@ exports[`simple fileupload 1`] = `
       </span>
     </div>
     <input
+      hidden=""
       style="border: 0px; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); height: 1px; margin: 0px -1px -1px 0px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap;"
       tabindex="-1"
       type="file"

package/src/components/FileUpload/__tests__/__snapshots__/FileUploadField.test.tsx.snap CHANGED Viewed

@@ -36,7 +36,6 @@ exports[`simple fileuploadfield 1`] = `
           class="pf-v6-c-input-group__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-control"
             data-ouia-component-id="OUIA-Generated-Button-control-1"
             data-ouia-component-type="PF6/Button"
@@ -54,7 +53,6 @@ exports[`simple fileuploadfield 1`] = `
           class="pf-v6-c-input-group__item"
         >
           <button
-            aria-disabled="false"
             class="pf-v6-c-button pf-m-control"
             data-ouia-component-id="OUIA-Generated-Button-control-2"
             data-ouia-component-type="PF6/Button"
@@ -74,7 +72,7 @@ exports[`simple fileuploadfield 1`] = `
       class="pf-v6-c-file-upload__file-details"
     >
       <span
-        class="pf-v6-c-form-control pf-m-resize-vertical"
+        class="pf-v6-c-form-control pf-m-textarea pf-m-resize-vertical"
       >
         <textarea
           aria-invalid="false"

package/src/components/FileUpload/examples/FileUploadCustomUpload.tsx CHANGED Viewed

@@ -4,6 +4,7 @@ import { FileUploadField, FileUploadHelperText, HelperText, HelperTextItem, Chec
 export const CustomPreviewFileUpload: React.FunctionComponent = () => {
   const properties = [
     'filename',
+    'isBrowseButtonDisabled',
     'isClearButtonDisabled',
     'isDragActive',
     'isLoading',
@@ -15,6 +16,7 @@ export const CustomPreviewFileUpload: React.FunctionComponent = () => {
   const [value, setValue] = React.useState('');
   const [filename, setFilename] = React.useState(false);
+  const [isBrowseButtonDisabled, setIsBrowseButtonDisabled] = React.useState(true);
   const [isClearButtonDisabled, setIsClearButtonDisabled] = React.useState(true);
   const [isLoading, setIsLoading] = React.useState(false);
   const [isDragActive, setIsDragActive] = React.useState(false);
@@ -24,6 +26,7 @@ export const CustomPreviewFileUpload: React.FunctionComponent = () => {
   const [hasPlaceholderText, setHasPlaceholderText] = React.useState(false);
   const [checkedState, setCheckedState] = React.useState([
     filename,
+    isBrowseButtonDisabled,
     isClearButtonDisabled,
     isLoading,
     isDragActive,
@@ -44,6 +47,10 @@ export const CustomPreviewFileUpload: React.FunctionComponent = () => {
         checked ? setFilename(true) : setFilename(false);
         break;
+      case 'isBrowseButtonDisabled':
+        checked ? setIsBrowseButtonDisabled(true) : setIsBrowseButtonDisabled(false);
+        break;
       case 'isClearButtonDisabled':
         checked ? setIsClearButtonDisabled(true) : setIsClearButtonDisabled(false);
         break;
@@ -109,6 +116,7 @@ export const CustomPreviewFileUpload: React.FunctionComponent = () => {
         filenamePlaceholder="Do something custom with this!"
         onBrowseButtonClick={() => alert('Browse button clicked!')}
         onClearButtonClick={() => alert('Clear button clicked!')}
+        isBrowseButtonDisabled={isBrowseButtonDisabled}
         isClearButtonDisabled={isClearButtonDisabled}
         isLoading={isLoading}
         isDragActive={isDragActive}

package/src/components/Form/FormGroup.tsx CHANGED Viewed

@@ -14,7 +14,7 @@ export interface FormGroupProps extends Omit<React.HTMLProps<HTMLDivElement>, 'l
   /** Additional label information displayed after the label. */
   labelInfo?: React.ReactNode;
   /** A help button for the label. We recommend using FormGroupLabelHelp element as a help icon button. The help button should be wrapped or linked to our popover component. */
-  labelHelp?: React.ReactElement;
+  labelHelp?: React.ReactElement<any>;
   /** Sets the FormGroup required. */
   isRequired?: boolean;
   /** Sets the FormGroup isInline. */

package/src/components/Form/__tests__/__snapshots__/FormFieldGroup.test.tsx.snap CHANGED Viewed

@@ -14,7 +14,6 @@ exports[`Check expandable form field group example against snapshot 1`] = `
         class="pf-v6-c-form__field-group-toggle-button"
       >
         <button
-          aria-disabled="false"
           aria-expanded="true"
           aria-label="toggle"
           aria-labelledby="title-text-id2 generated-id"
@@ -75,7 +74,6 @@ exports[`Check expandable form field group example against snapshot 1`] = `
         class="pf-v6-c-form__field-group-header-actions"
       >
         <button
-          aria-disabled="false"
           class="pf-v6-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-2"
           data-ouia-component-type="PF6/Button"
@@ -124,7 +122,6 @@ exports[`Check form field group example against snapshot 1`] = `
         class="pf-v6-c-form__field-group-header-actions"
       >
         <button
-          aria-disabled="false"
           class="pf-v6-c-button pf-m-primary"
           data-ouia-component-id="OUIA-Generated-Button-primary-1"
           data-ouia-component-type="PF6/Button"