@patternfly/react-core 4.227.8 → 4.227.9

package/dist/umd/react-core.js

@@ -15677,7 +15677,7 @@
         direction: 'right'
     });
     const MenuItemBase = (_a) => {
-        var { children, className, itemId = null, to, hasCheck = false, isActive = null, isFavorited = null, isLoadButton = false, isLoading = false, flyoutMenu, direction, description = null, onClick = () => { }, component = 'button', isDisabled = false, isExternalLink = false, isSelected = null, icon, actions, onShowFlyout, drilldownMenu, isOnPath, innerRef } = _a, props = __rest$1(_a, ["children", "className", "itemId", "to", "hasCheck", "isActive", "isFavorited", "isLoadButton", "isLoading", "flyoutMenu", "direction", "description", "onClick", "component", "isDisabled", "isExternalLink", "isSelected", "icon", "actions", "onShowFlyout", "drilldownMenu", "isOnPath", "innerRef"]);
+        var { children, className, itemId = null, to, hasCheck = false, isActive = null, isFavorited = null, isLoadButton = false, isLoading = false, flyoutMenu, direction, description = null, onClick = () => { }, component = 'button', isDisabled = false, isExternalLink = false, isSelected = null, isFocused, icon, actions, onShowFlyout, drilldownMenu, isOnPath, innerRef } = _a, props = __rest$1(_a, ["children", "className", "itemId", "to", "hasCheck", "isActive", "isFavorited", "isLoadButton", "isLoading", "flyoutMenu", "direction", "description", "onClick", "component", "isDisabled", "isExternalLink", "isSelected", "isFocused", "icon", "actions", "onShowFlyout", "drilldownMenu", "isOnPath", "innerRef"]);
         const { menuId, parentMenu, onSelect, onActionClick, activeItemId, selected, drilldownItemPath, onDrillIn, onDrillOut, flyoutRef, setFlyoutRef, disableHover } = React__namespace.useContext(MenuContext);
         let Component = (to ? 'a' : component);
         if (hasCheck && !to) {
@@ -15843,7 +15843,7 @@
                 setFlyoutRef(null);
             }
         };
-        return (React__namespace.createElement("li", Object.assign({ className: css(menuStyles.menuListItem, isDisabled && menuStyles.modifiers.disabled, _isOnPath && menuStyles.modifiers.currentPath, isLoadButton && menuStyles.modifiers.load, isLoading && menuStyles.modifiers.loading, className), onMouseOver: onMouseOver }, (flyoutMenu && { onKeyDown: handleFlyout }), { ref: ref, role: !hasCheck ? 'none' : 'menuitem' }, props),
+        return (React__namespace.createElement("li", Object.assign({ className: css(menuStyles.menuListItem, isDisabled && menuStyles.modifiers.disabled, _isOnPath && menuStyles.modifiers.currentPath, isLoadButton && menuStyles.modifiers.load, isLoading && menuStyles.modifiers.loading, isFocused && menuStyles.modifiers.focus, className), onMouseOver: onMouseOver }, (flyoutMenu && { onKeyDown: handleFlyout }), { ref: ref, role: !hasCheck ? 'none' : 'menuitem' }, props),
             React__namespace.createElement(GenerateId, null, randomId => (React__namespace.createElement(Component, Object.assign({ tabIndex: -1, className: css(menuStyles.menuItem, getIsSelected() && !hasCheck && menuStyles.modifiers.selected, className), "aria-current": getAriaCurrent() }, (!hasCheck && { disabled: isDisabled }), (!hasCheck && { role: 'menuitem' }), { ref: innerRef }, (!hasCheck && {
                 onClick: (event) => {
                     onItemSelect(event, onSelect);
@@ -15936,19 +15936,23 @@
             this.displayName = 'MenuToggleBase';
         }
         render() {
-            const _a = this.props, { children, className, icon, badge, isExpanded, isDisabled, isFullHeight, isFullWidth, variant, innerRef } = _a, props = __rest$1(_a, ["children", "className", "icon", "badge", "isExpanded", "isDisabled", "isFullHeight", "isFullWidth", "variant", "innerRef"]);
+            const _a = this.props, { children, className, icon, badge, isExpanded, isDisabled, isFullHeight, isFullWidth, variant, innerRef, onClick, 'aria-label': ariaLabel } = _a, otherProps = __rest$1(_a, ["children", "className", "icon", "badge", "isExpanded", "isDisabled", "isFullHeight", "isFullWidth", "variant", "innerRef", "onClick", 'aria-label']);
             const isPlain = variant === 'plain';
             const isPlainText = variant === 'plainText';
+            const isTypeahead = variant === 'typeahead';
+            const toggleControls = (React__namespace.createElement("span", { className: css(styles$x.menuToggleControls) },
+                React__namespace.createElement("span", { className: css(styles$x.menuToggleToggleIcon) },
+                    React__namespace.createElement(CaretDownIcon$1, { "aria-hidden": true }))));
             const content = (React__namespace.createElement(React__namespace.Fragment, null,
                 icon && React__namespace.createElement("span", { className: css(styles$x.menuToggleIcon) }, icon),
-                React__namespace.createElement("span", { className: "pf-c-menu-toggle__text" }, children),
+                isTypeahead ? children : React__namespace.createElement("span", { className: "pf-c-menu-toggle__text" }, children),
                 badge && React__namespace.createElement("span", { className: css(styles$x.menuToggleCount) }, badge),
-                React__namespace.createElement("span", { className: css(styles$x.menuToggleControls) },
-                    React__namespace.createElement("span", { className: css(styles$x.menuToggleToggleIcon) },
-                        React__namespace.createElement(CaretDownIcon$1, { "aria-hidden": true })))));
-            return (React__namespace.createElement("button", Object.assign({ className: css(styles$x.menuToggle, isExpanded && styles$x.modifiers.expanded, variant === 'primary' && styles$x.modifiers.primary, variant === 'secondary' && styles$x.modifiers.secondary, (isPlain || isPlainText) && styles$x.modifiers.plain, isPlainText && styles$x.modifiers.text, isFullHeight && styles$x.modifiers.fullHeight, isFullWidth && styles$x.modifiers.fullWidth, className), type: "button", "aria-expanded": false, ref: innerRef }, (isExpanded && { 'aria-expanded': true }), (isDisabled && { disabled: true }), props),
-                isPlain && children,
-                !isPlain && content));
+                isTypeahead ? (React__namespace.createElement("button", { type: "button", className: css(styles$x.menuToggleButton), "aria-expanded": isExpanded, onClick: onClick, "aria-label": "Menu toggle" }, toggleControls)) : (toggleControls)));
+            const componentProps = Object.assign(Object.assign({ className: css(styles$x.menuToggle, isExpanded && styles$x.modifiers.expanded, variant === 'primary' && styles$x.modifiers.primary, (isPlain || isPlainText) && styles$x.modifiers.plain, isPlainText && styles$x.modifiers.text, isFullHeight && styles$x.modifiers.fullHeight, isTypeahead && styles$x.modifiers.typeahead, isFullWidth && styles$x.modifiers.fullWidth, className), children: isPlain ? children : content }, (isDisabled && { disabled: true })), otherProps);
+            if (isTypeahead) {
+                return React__namespace.createElement("div", Object.assign({ ref: innerRef }, componentProps));
+            }
+            return (React__namespace.createElement("button", Object.assign({ className: css(styles$x.menuToggle, isExpanded && styles$x.modifiers.expanded, variant === 'primary' && styles$x.modifiers.primary, variant === 'secondary' && styles$x.modifiers.secondary, (isPlain || isPlainText) && styles$x.modifiers.plain, isPlainText && styles$x.modifiers.text, isFullHeight && styles$x.modifiers.fullHeight, isFullWidth && styles$x.modifiers.fullWidth, className), ref: innerRef, type: "button", "aria-label": ariaLabel, "aria-expanded": isExpanded, onClick: onClick }, componentProps)));
         }
     }
     MenuToggleBase.defaultProps = {
@@ -18387,10 +18391,10 @@
         isDisabled: false
     });
     const TextInputGroup = (_a) => {
-        var { children, className, isDisabled, innerRef } = _a, props = __rest$1(_a, ["children", "className", "isDisabled", "innerRef"]);
+        var { children, className, isDisabled, isPlain, innerRef } = _a, props = __rest$1(_a, ["children", "className", "isDisabled", "isPlain", "innerRef"]);
         const textInputGroupRef = innerRef || React__namespace.useRef(null);
         return (React__namespace.createElement(TextInputGroupContext.Provider, { value: { isDisabled } },
-            React__namespace.createElement("div", Object.assign({ ref: textInputGroupRef, className: css(styles$l.textInputGroup, isDisabled && styles$l.modifiers.disabled, className) }, props), children)));
+            React__namespace.createElement("div", Object.assign({ ref: textInputGroupRef, className: css(styles$l.textInputGroup, isDisabled && styles$l.modifiers.disabled, isPlain && styles$l.modifiers.plain, className) }, props), children)));
     };
     TextInputGroup.displayName = 'TextInputGroup';
 
@@ -19054,6 +19058,7 @@
         "nonExpandableOn_2xl": "pf-m-non-expandable-on-2xl",
         "expanded": "pf-m-expanded",
         "pageInsets": "pf-m-page-insets",
+        "overflow": "pf-m-overflow",
         "action": "pf-m-action",
         "active": "pf-m-active",
         "disabled": "pf-m-disabled",

package/dist/umd/react-core.min.css

@@ -587,8 +587,8 @@
   --pf-c-app-launcher__group-title--PaddingRight: var(--pf-c-app-launcher__menu-item--PaddingRight);
   --pf-c-app-launcher__group-title--PaddingBottom: var(--pf-c-app-launcher__menu-item--PaddingBottom);
   --pf-c-app-launcher__group-title--PaddingLeft: var(--pf-c-app-launcher__menu-item--PaddingLeft);
-  --pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
+  --pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--normal);
   --pf-c-app-launcher__group-title--Color: var(--pf-global--Color--dark-200);
   --pf-c-app-launcher--c-divider--MarginTop: var(--pf-global--spacer--sm);
   --pf-c-app-launcher--c-divider--MarginBottom: var(--pf-global--spacer--sm);
@@ -766,8 +766,6 @@
   --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
   --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-300);
   --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-100);
-  --pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--bold);
 }
 
 .pf-c-form-control {
@@ -7348,8 +7346,8 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-dropdown__group-title--PaddingRight: var(--pf-c-dropdown__menu-item--PaddingRight);
   --pf-c-dropdown__group-title--PaddingBottom: var(--pf-c-dropdown__menu-item--PaddingBottom);
   --pf-c-dropdown__group-title--PaddingLeft: var(--pf-c-dropdown__menu-item--PaddingLeft);
-  --pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
+  --pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--normal);
   --pf-c-dropdown__group-title--Color: var(--pf-global--Color--dark-200);
   --pf-c-dropdown__toggle-image--MarginTop: 0;
   --pf-c-dropdown__toggle-image--MarginBottom: 0;
@@ -7952,8 +7950,6 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-dropdown__menu--Top: 100%;
   --pf-c-dropdown--m-top__menu--TranslateY: -100%;
   --pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
-  --pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--bold);
 }
 
 :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain):disabled, :where(.pf-theme-dark) .pf-c-dropdown__toggle:not(.pf-m-plain).pf-m-disabled {
@@ -12022,8 +12018,8 @@ ul.pf-c-list {
   --pf-c-menu__group-title--PaddingTop: var(--pf-global--spacer--md);
   --pf-c-menu__group-title--PaddingRight: var(--pf-c-menu__item--PaddingRight);
   --pf-c-menu__group-title--PaddingLeft: var(--pf-c-menu__item--PaddingLeft);
-  --pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--bold);
+  --pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--normal);
   --pf-c-menu__group-title--Color: var(--pf-global--Color--200);
   --pf-c-menu__item-description--FontSize: var(--pf-global--FontSize--xs);
   --pf-c-menu__item-description--Color: var(--pf-global--Color--200);
@@ -12573,8 +12569,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-menu__list-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
   --pf-c-menu__list-item--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--400);
   --pf-c-menu__list-item--m-disabled__item--Color: var(--pf-global--Color--200);
-  --pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--bold);
-  --pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
 }
 
 .pf-c-menu-toggle {
@@ -14952,8 +14946,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-options-menu__group-title--PaddingRight: var(--pf-c-options-menu__menu-item--PaddingRight);
   --pf-c-options-menu__group-title--PaddingBottom: var(--pf-c-options-menu__menu-item--PaddingBottom);
   --pf-c-options-menu__group-title--PaddingLeft: var(--pf-c-options-menu__menu-item--PaddingLeft);
-  --pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
+  --pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--normal);
   --pf-c-options-menu__group-title--Color: var(--pf-global--Color--dark-200);
   --pf-c-options-menu--c-divider--MarginTop: var(--pf-global--spacer--sm);
   --pf-c-options-menu--c-divider--MarginBottom: var(--pf-global--spacer--sm);
@@ -15162,8 +15156,6 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-options-menu__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
   --pf-c-options-menu__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
   --pf-c-options-menu__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
-  --pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--bold);
   --pf-c-options-menu__menu--Top: 100%;
 }
 
@@ -17920,8 +17912,8 @@ label.pf-c-radio, .pf-c-radio__label,
   --pf-c-select__menu-group-title--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
   --pf-c-select__menu-group-title--PaddingBottom: var(--pf-c-select__menu-item--PaddingBottom);
   --pf-c-select__menu-group-title--PaddingLeft: var(--pf-c-select__menu-item--PaddingLeft);
-  --pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--semi-bold);
+  --pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--normal);
   --pf-c-select__menu-group-title--Color: var(--pf-global--Color--dark-200);
   --pf-c-select__menu-item-count--MarginLeft: var(--pf-global--spacer--md);
   --pf-c-select__menu-item-count--FontSize: var(--pf-global--FontSize--sm);
@@ -19774,6 +19766,11 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-tabs--inset: var(--pf-c-tabs--m-page-insets--inset);
 }
 
+.pf-c-tabs.pf-m-overflow,
+.pf-c-tabs.pf-m-overflow .pf-c-tabs__list {
+  overflow: visible;
+}
+
 .pf-c-tabs__toggle {
   display: var(--pf-c-tabs__toggle--Display);
   align-items: center;