@patternfly/react-core 4.250.4 → 4.250.5

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [4.250.5](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@4.250.4...@patternfly/react-core@4.250.5) (2022-10-12)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **Dropdown next:** Add support for forward ref and updated docs. ([#8142](https://github.com/patternfly/patternfly-react/issues/8142)) ([423dd67](https://github.com/patternfly/patternfly-react/commit/423dd67d0d81910e195722d07a3de3340eba4443))
12
+
13
+
14
+
15
+
16
+
6
17
  ## [4.250.4](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-core@4.250.3...@patternfly/react-core@4.250.4) (2022-10-12)
7
18
 
8
19
  **Note:** Version bump only for package @patternfly/react-core
@@ -20,6 +20,8 @@ export interface DropdownProps extends MenuProps {
20
20
  isScrollable?: boolean;
21
21
  /** Min width of the menu. */
22
22
  minWidth?: string;
23
+ /** @hide Forwarded ref */
24
+ innerRef?: React.Ref<any>;
23
25
  }
24
- export declare const Dropdown: React.FunctionComponent<DropdownProps>;
26
+ export declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<any>>;
25
27
  //# sourceMappingURL=Dropdown.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAGxE,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,MAAM,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC7D,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC7F;yFACqF;IACrF,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAsF3D,CAAC"}
1
+ {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAGxE,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,MAAM,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC7D,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC7F;yFACqF;IACrF,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CAC3B;AA2FD,eAAO,MAAM,QAAQ,2EAEnB,CAAC"}
@@ -3,12 +3,12 @@ import React from 'react';
3
3
  import { css } from '@patternfly/react-styles';
4
4
  import { Menu, MenuContent } from '../../../components/Menu';
5
5
  import { Popper } from '../../../helpers/Popper/Popper';
6
- export const Dropdown = (_a) => {
7
- var { children, className, onSelect, isOpen, toggle, onOpenChange, isPlain, isScrollable, minWidth } = _a, props = __rest(_a, ["children", "className", "onSelect", "isOpen", "toggle", "onOpenChange", "isPlain", "isScrollable", "minWidth"]);
6
+ const DropdownBase = (_a) => {
7
+ var { children, className, onSelect, isOpen, toggle, onOpenChange, isPlain, isScrollable, minWidth, innerRef } = _a, props = __rest(_a, ["children", "className", "onSelect", "isOpen", "toggle", "onOpenChange", "isPlain", "isScrollable", "minWidth", "innerRef"]);
8
8
  const localMenuRef = React.useRef();
9
9
  const toggleRef = React.useRef();
10
10
  const containerRef = React.useRef();
11
- const menuRef = props.innerRef || localMenuRef;
11
+ const menuRef = innerRef || localMenuRef;
12
12
  React.useEffect(() => {
13
13
  const handleMenuKeys = (event) => {
14
14
  var _a, _b, _c, _d;
@@ -55,5 +55,6 @@ export const Dropdown = (_a) => {
55
55
  return (React.createElement("div", { ref: containerRef },
56
56
  React.createElement(Popper, { trigger: toggle(toggleRef), removeFindDomNode: true, popper: menu, appendTo: containerRef.current || undefined, isVisible: isOpen })));
57
57
  };
58
+ export const Dropdown = React.forwardRef((props, ref) => (React.createElement(DropdownBase, Object.assign({ innerRef: ref }, props))));
58
59
  Dropdown.displayName = 'Dropdown';
59
60
  //# sourceMappingURL=Dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
@@ -20,6 +20,8 @@ export interface DropdownProps extends MenuProps {
20
20
  isScrollable?: boolean;
21
21
  /** Min width of the menu. */
22
22
  minWidth?: string;
23
+ /** @hide Forwarded ref */
24
+ innerRef?: React.Ref<any>;
23
25
  }
24
- export declare const Dropdown: React.FunctionComponent<DropdownProps>;
26
+ export declare const Dropdown: React.ForwardRefExoticComponent<DropdownProps & React.RefAttributes<any>>;
25
27
  //# sourceMappingURL=Dropdown.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAGxE,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,MAAM,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC7D,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC7F;yFACqF;IACrF,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,iBAAiB,CAAC,aAAa,CAsF3D,CAAC"}
1
+ {"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAqB,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAGxE,MAAM,WAAW,aAAc,SAAQ,SAAS;IAC9C,oDAAoD;IACpD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,mDAAmD;IACnD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2EAA2E;IAC3E,MAAM,EAAE,CAAC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC;IAC7D,yCAAyC;IACzC,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,EAAE,UAAU,CAAC,EAAE,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC7F;yFACqF;IACrF,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,oEAAoE;IACpE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;CAC3B;AA2FD,eAAO,MAAM,QAAQ,2EAEnB,CAAC"}
@@ -6,12 +6,12 @@ const react_1 = tslib_1.__importDefault(require("react"));
6
6
  const react_styles_1 = require("@patternfly/react-styles");
7
7
  const Menu_1 = require("../../../components/Menu");
8
8
  const Popper_1 = require("../../../helpers/Popper/Popper");
9
- const Dropdown = (_a) => {
10
- var { children, className, onSelect, isOpen, toggle, onOpenChange, isPlain, isScrollable, minWidth } = _a, props = tslib_1.__rest(_a, ["children", "className", "onSelect", "isOpen", "toggle", "onOpenChange", "isPlain", "isScrollable", "minWidth"]);
9
+ const DropdownBase = (_a) => {
10
+ var { children, className, onSelect, isOpen, toggle, onOpenChange, isPlain, isScrollable, minWidth, innerRef } = _a, props = tslib_1.__rest(_a, ["children", "className", "onSelect", "isOpen", "toggle", "onOpenChange", "isPlain", "isScrollable", "minWidth", "innerRef"]);
11
11
  const localMenuRef = react_1.default.useRef();
12
12
  const toggleRef = react_1.default.useRef();
13
13
  const containerRef = react_1.default.useRef();
14
- const menuRef = props.innerRef || localMenuRef;
14
+ const menuRef = innerRef || localMenuRef;
15
15
  react_1.default.useEffect(() => {
16
16
  const handleMenuKeys = (event) => {
17
17
  var _a, _b, _c, _d;
@@ -58,6 +58,6 @@ const Dropdown = (_a) => {
58
58
  return (react_1.default.createElement("div", { ref: containerRef },
59
59
  react_1.default.createElement(Popper_1.Popper, { trigger: toggle(toggleRef), removeFindDomNode: true, popper: menu, appendTo: containerRef.current || undefined, isVisible: isOpen })));
60
60
  };
61
- exports.Dropdown = Dropdown;
61
+ exports.Dropdown = react_1.default.forwardRef((props, ref) => (react_1.default.createElement(DropdownBase, Object.assign({ innerRef: ref }, props))));
62
62
  exports.Dropdown.displayName = 'Dropdown';
63
63
  //# sourceMappingURL=Dropdown.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Dropdown.js","sourceRoot":"","sources":["../../../../../src/next/components/Dropdown/Dropdown.tsx"],"names":[],"mappings":"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"}
@@ -529,245 +529,6 @@
529
529
  --pf-c-alert--m-inline--m-info--BackgroundColor: var(--pf-global--palette--black-600);
530
530
  }
531
531
 
532
- .pf-c-app-launcher {
533
- --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
534
- --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
535
- --pf-c-app-launcher__menu--PaddingTop: var(--pf-global--spacer--sm);
536
- --pf-c-app-launcher__menu--PaddingBottom: var(--pf-global--spacer--sm);
537
- --pf-c-app-launcher__menu--Top: calc(100% + var(--pf-global--spacer--xs));
538
- --pf-c-app-launcher__menu--ZIndex: var(--pf-global--ZIndex--sm);
539
- --pf-c-app-launcher--m-top__menu--Top: 0;
540
- --pf-c-app-launcher--m-top__menu--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
541
- --pf-c-app-launcher__toggle--PaddingTop: var(--pf-global--spacer--form-element);
542
- --pf-c-app-launcher__toggle--PaddingRight: var(--pf-global--spacer--md);
543
- --pf-c-app-launcher__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
544
- --pf-c-app-launcher__toggle--PaddingLeft: var(--pf-global--spacer--md);
545
- --pf-c-app-launcher__toggle--Color: var(--pf-global--Color--200);
546
- --pf-c-app-launcher__toggle--hover--Color: var(--pf-global--Color--100);
547
- --pf-c-app-launcher__toggle--active--Color: var(--pf-global--Color--100);
548
- --pf-c-app-launcher__toggle--focus--Color: var(--pf-global--Color--100);
549
- --pf-c-app-launcher__toggle--disabled--Color: var(--pf-global--disabled-color--200);
550
- --pf-c-app-launcher__toggle--m-expanded--Color: var(--pf-global--Color--100);
551
- --pf-c-app-launcher__menu-search--PaddingTop: var(--pf-global--spacer--sm);
552
- --pf-c-app-launcher__menu-search--PaddingRight: var(--pf-global--spacer--md);
553
- --pf-c-app-launcher__menu-search--PaddingBottom: var(--pf-global--spacer--md);
554
- --pf-c-app-launcher__menu-search--PaddingLeft: var(--pf-global--spacer--md);
555
- --pf-c-app-launcher__menu-search--BottomBorderColor: var(--pf-global--BorderColor--100);
556
- --pf-c-app-launcher__menu-search--BottomBorderWidth: var(--pf-global--BorderWidth--sm);
557
- --pf-c-app-launcher__menu-search--MarginBottom: var(--pf-global--spacer--sm);
558
- --pf-c-app-launcher__menu-item--PaddingTop: var(--pf-global--spacer--sm);
559
- --pf-c-app-launcher__menu-item--PaddingRight: var(--pf-global--spacer--md);
560
- --pf-c-app-launcher__menu-item--PaddingBottom: var(--pf-global--spacer--sm);
561
- --pf-c-app-launcher__menu-item--PaddingLeft: var(--pf-global--spacer--md);
562
- --pf-c-app-launcher__menu-item--Color: var(--pf-global--Color--dark-100);
563
- --pf-c-app-launcher__menu-item--FontWeight: var(--pf-global--FontWeight--normal);
564
- --pf-c-app-launcher__menu-item--Width: 100%;
565
- --pf-c-app-launcher__menu-item--disabled--Color: var(--pf-global--Color--dark-200);
566
- --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
567
- --pf-c-app-launcher__menu-item--m-link--PaddingRight: 0;
568
- --pf-c-app-launcher__menu-item--m-link--hover--BackgroundColor: transparent;
569
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
570
- --pf-c-app-launcher__menu-item--m-action--Width: auto;
571
- --pf-c-app-launcher__menu-item--m-action--FontSize: var(--pf-global--icon--FontSize--sm);
572
- --pf-c-app-launcher__menu-item--m-action--hover--BackgroundColor: transparent;
573
- --pf-c-app-launcher__menu-item--hover__menu-item--m-action--Color: var(--pf-global--Color--200);
574
- --pf-c-app-launcher__menu-item--m-action--hover--Color: var(--pf-global--Color--100);
575
- --pf-c-app-launcher__menu-item--m-action--disabled--Color: var(--pf-global--disabled-color--200);
576
- --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-400);
577
- --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-500);
578
- --pf-c-app-launcher__menu-item-icon--MarginRight: var(--pf-global--spacer--sm);
579
- --pf-c-app-launcher__menu-item-icon--Width: var(--pf-global--icon--FontSize--lg);
580
- --pf-c-app-launcher__menu-item-icon--Height: var(--pf-global--icon--FontSize--lg);
581
- --pf-c-app-launcher__menu-item-external-icon--Color: var(--pf-global--link--Color);
582
- --pf-c-app-launcher__menu-item-external-icon--PaddingLeft: var(--pf-global--spacer--md);
583
- --pf-c-app-launcher__menu-item-external-icon--TranslateY: -0.0625rem;
584
- --pf-c-app-launcher__menu-item-external-icon--FontSize: var(--pf-global--icon--FontSize--sm);
585
- --pf-c-app-launcher__group--group--PaddingTop: var(--pf-global--spacer--sm);
586
- --pf-c-app-launcher__group-title--PaddingTop: var(--pf-global--spacer--sm);
587
- --pf-c-app-launcher__group-title--PaddingRight: var(--pf-c-app-launcher__menu-item--PaddingRight);
588
- --pf-c-app-launcher__group-title--PaddingBottom: var(--pf-c-app-launcher__menu-item--PaddingBottom);
589
- --pf-c-app-launcher__group-title--PaddingLeft: var(--pf-c-app-launcher__menu-item--PaddingLeft);
590
- --pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--xs);
591
- --pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--normal);
592
- --pf-c-app-launcher__group-title--Color: var(--pf-global--Color--dark-200);
593
- --pf-c-app-launcher--c-divider--MarginTop: var(--pf-global--spacer--sm);
594
- --pf-c-app-launcher--c-divider--MarginBottom: var(--pf-global--spacer--sm);
595
- position: relative;
596
- display: inline-block;
597
- max-width: 100%;
598
- }
599
-
600
- .pf-c-app-launcher.pf-m-expanded > .pf-c-app-launcher__toggle {
601
- color: var(--pf-c-app-launcher__toggle--m-expanded--Color);
602
- }
603
-
604
- .pf-c-app-launcher .pf-c-divider {
605
- margin-top: var(--pf-c-app-launcher--c-divider--MarginTop);
606
- margin-bottom: var(--pf-c-app-launcher--c-divider--MarginBottom);
607
- }
608
-
609
- .pf-c-app-launcher .pf-c-divider:last-child {
610
- --pf-c-app-launcher--c-divider--MarginBottom: 0;
611
- }
612
-
613
- .pf-c-app-launcher__toggle {
614
- padding: var(--pf-c-app-launcher__toggle--PaddingTop) var(--pf-c-app-launcher__toggle--PaddingRight) var(--pf-c-app-launcher__toggle--PaddingBottom) var(--pf-c-app-launcher__toggle--PaddingLeft);
615
- color: var(--pf-c-app-launcher__toggle--Color);
616
- border: none;
617
- }
618
-
619
- .pf-c-app-launcher__toggle:hover {
620
- --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--hover--Color);
621
- }
622
-
623
- .pf-c-app-launcher__toggle:active, .pf-c-app-launcher__toggle.pf-m-active {
624
- --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--active--Color);
625
- }
626
-
627
- .pf-c-app-launcher__toggle:focus {
628
- --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--focus--Color);
629
- }
630
-
631
- .pf-c-app-launcher__toggle:disabled {
632
- --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--disabled--Color);
633
- pointer-events: none;
634
- }
635
-
636
- .pf-c-app-launcher__menu {
637
- position: absolute;
638
- top: var(--pf-c-app-launcher__menu--Top);
639
- z-index: var(--pf-c-app-launcher__menu--ZIndex);
640
- min-width: 100%;
641
- padding-top: var(--pf-c-app-launcher__menu--PaddingTop);
642
- padding-bottom: var(--pf-c-app-launcher__menu--PaddingBottom);
643
- background-color: var(--pf-c-app-launcher__menu--BackgroundColor);
644
- background-clip: padding-box;
645
- box-shadow: var(--pf-c-app-launcher__menu--BoxShadow);
646
- }
647
-
648
- .pf-c-app-launcher__menu.pf-m-align-right {
649
- right: 0;
650
- }
651
-
652
- .pf-c-app-launcher.pf-m-top .pf-c-app-launcher__menu {
653
- --pf-c-app-launcher__menu--Top: var(--pf-c-app-launcher--m-top__menu--Top);
654
- transform: translateY(var(--pf-c-app-launcher--m-top__menu--TranslateY));
655
- }
656
-
657
- .pf-c-app-launcher__menu-search {
658
- padding: var(--pf-c-app-launcher__menu-search--PaddingTop) var(--pf-c-app-launcher__menu-search--PaddingRight) var(--pf-c-app-launcher__menu-search--PaddingBottom) var(--pf-c-app-launcher__menu-search--PaddingLeft);
659
- margin-bottom: var(--pf-c-app-launcher__menu-search--MarginBottom);
660
- border-bottom: var(--pf-c-app-launcher__menu-search--BottomBorderWidth) solid var(--pf-c-app-launcher__menu-search--BottomBorderColor);
661
- }
662
-
663
- .pf-c-app-launcher__menu-wrapper {
664
- display: flex;
665
- }
666
-
667
- .pf-c-app-launcher__menu-wrapper.pf-m-favorite {
668
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color);
669
- --pf-c-app-launcher__menu-item--m-action--hover--Color: var(--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color);
670
- }
671
-
672
- .pf-c-app-launcher__menu-item {
673
- display: flex;
674
- align-items: center;
675
- width: var(--pf-c-app-launcher__menu-item--Width);
676
- padding: var(--pf-c-app-launcher__menu-item--PaddingTop) var(--pf-c-app-launcher__menu-item--PaddingRight) var(--pf-c-app-launcher__menu-item--PaddingBottom) var(--pf-c-app-launcher__menu-item--PaddingLeft);
677
- font-weight: var(--pf-c-app-launcher__menu-item--FontWeight);
678
- color: var(--pf-c-app-launcher__menu-item--Color);
679
- white-space: nowrap;
680
- border: 0;
681
- }
682
-
683
- .pf-c-app-launcher__menu-item:hover, .pf-c-app-launcher__menu-item:focus {
684
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--hover__menu-item--m-action--Color);
685
- text-decoration: none;
686
- }
687
-
688
- .pf-c-app-launcher__menu-wrapper:hover,
689
- .pf-c-app-launcher__menu-wrapper:focus-within,
690
- .pf-c-app-launcher__menu-wrapper.pf-m-focus, .pf-c-app-launcher__menu-item:hover, .pf-c-app-launcher__menu-item:focus {
691
- background-color: var(--pf-c-app-launcher__menu-item--hover--BackgroundColor);
692
- }
693
-
694
- .pf-c-app-launcher__menu-item:disabled, .pf-c-app-launcher__menu-item.pf-m-disabled {
695
- --pf-c-app-launcher__menu-item--Color: var(--pf-c-app-launcher__menu-item--disabled--Color);
696
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-action--disabled--Color);
697
- pointer-events: none;
698
- }
699
-
700
- .pf-c-app-launcher__menu-wrapper:disabled, .pf-c-app-launcher__menu-wrapper.pf-m-disabled, .pf-c-app-launcher__menu-item:disabled, .pf-c-app-launcher__menu-item.pf-m-disabled {
701
- background-color: transparent;
702
- }
703
-
704
- .pf-c-app-launcher__menu-wrapper.pf-m-external:hover .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-wrapper.pf-m-external:focus .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-item.pf-m-external:hover .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-item.pf-m-external:focus .pf-c-app-launcher__menu-item-external-icon {
705
- opacity: 1;
706
- }
707
-
708
- .pf-c-app-launcher__menu-item.pf-m-link {
709
- --pf-c-app-launcher__menu-item--PaddingRight: var(--pf-c-app-launcher__menu-item--m-link--PaddingRight);
710
- --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-c-app-launcher__menu-item--m-link--hover--BackgroundColor);
711
- }
712
-
713
- .pf-c-app-launcher__menu-item.pf-m-action {
714
- --pf-c-app-launcher__menu-item--Color: var(--pf-c-app-launcher__menu-item--m-action--Color);
715
- --pf-c-app-launcher__menu-item--Width: var(--pf-c-app-launcher__menu-item--m-action--Width);
716
- --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-c-app-launcher__menu-item--m-action--hover--BackgroundColor);
717
- font-size: var(--pf-c-app-launcher__menu-item--m-action--FontSize);
718
- }
719
-
720
- .pf-c-app-launcher__menu-item.pf-m-action:hover, .pf-c-app-launcher__menu-item.pf-m-action:focus {
721
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-action--hover--Color);
722
- }
723
-
724
- .pf-c-app-launcher__menu-item-icon {
725
- display: inline-flex;
726
- align-items: center;
727
- justify-content: center;
728
- width: var(--pf-c-app-launcher__menu-item-icon--Width);
729
- height: var(--pf-c-app-launcher__menu-item-icon--Height);
730
- margin-right: var(--pf-c-app-launcher__menu-item-icon--MarginRight);
731
- }
732
-
733
- .pf-c-app-launcher__menu-item-icon > * {
734
- max-width: 100%;
735
- max-height: 100%;
736
- }
737
-
738
- .pf-c-app-launcher__menu-item-external-icon {
739
- padding-left: var(--pf-c-app-launcher__menu-item-external-icon--PaddingLeft);
740
- margin-left: auto;
741
- font-size: var(--pf-c-app-launcher__menu-item-external-icon--FontSize);
742
- color: var(--pf-c-app-launcher__menu-item-external-icon--Color);
743
- opacity: 0;
744
- transform: translateY(var(--pf-c-app-launcher__menu-item-external-icon--TranslateY));
745
- }
746
-
747
- .pf-c-app-launcher__group + .pf-c-app-launcher__group {
748
- padding-top: var(--pf-c-app-launcher__group--group--PaddingTop);
749
- }
750
-
751
- .pf-c-app-launcher__group-title {
752
- padding-top: var(--pf-c-app-launcher__group-title--PaddingTop);
753
- padding-right: var(--pf-c-app-launcher__group-title--PaddingRight);
754
- padding-bottom: var(--pf-c-app-launcher__group-title--PaddingBottom);
755
- padding-left: var(--pf-c-app-launcher__group-title--PaddingLeft);
756
- font-size: var(--pf-c-app-launcher__group-title--FontSize);
757
- font-weight: var(--pf-c-app-launcher__group-title--FontWeight);
758
- color: var(--pf-c-app-launcher__group-title--Color);
759
- }
760
-
761
- :where(.pf-theme-dark) .pf-c-app-launcher {
762
- --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
763
- --pf-c-app-launcher__menu--Top: 100%;
764
- --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
765
- --pf-c-app-launcher__menu-item--disabled--Color: var(--pf-global--palette--black-300);
766
- --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
767
- --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-300);
768
- --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-100);
769
- }
770
-
771
532
  .pf-c-form-control {
772
533
  --pf-global--Color--100: var(--pf-global--Color--dark-100);
773
534
  --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -1149,6 +910,245 @@ textarea.pf-c-form-control {
1149
910
  color: var(--pf-global--palette--black-100);
1150
911
  }
1151
912
 
913
+ .pf-c-app-launcher {
914
+ --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
915
+ --pf-c-app-launcher__menu--BoxShadow: var(--pf-global--BoxShadow--md);
916
+ --pf-c-app-launcher__menu--PaddingTop: var(--pf-global--spacer--sm);
917
+ --pf-c-app-launcher__menu--PaddingBottom: var(--pf-global--spacer--sm);
918
+ --pf-c-app-launcher__menu--Top: calc(100% + var(--pf-global--spacer--xs));
919
+ --pf-c-app-launcher__menu--ZIndex: var(--pf-global--ZIndex--sm);
920
+ --pf-c-app-launcher--m-top__menu--Top: 0;
921
+ --pf-c-app-launcher--m-top__menu--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
922
+ --pf-c-app-launcher__toggle--PaddingTop: var(--pf-global--spacer--form-element);
923
+ --pf-c-app-launcher__toggle--PaddingRight: var(--pf-global--spacer--md);
924
+ --pf-c-app-launcher__toggle--PaddingBottom: var(--pf-global--spacer--form-element);
925
+ --pf-c-app-launcher__toggle--PaddingLeft: var(--pf-global--spacer--md);
926
+ --pf-c-app-launcher__toggle--Color: var(--pf-global--Color--200);
927
+ --pf-c-app-launcher__toggle--hover--Color: var(--pf-global--Color--100);
928
+ --pf-c-app-launcher__toggle--active--Color: var(--pf-global--Color--100);
929
+ --pf-c-app-launcher__toggle--focus--Color: var(--pf-global--Color--100);
930
+ --pf-c-app-launcher__toggle--disabled--Color: var(--pf-global--disabled-color--200);
931
+ --pf-c-app-launcher__toggle--m-expanded--Color: var(--pf-global--Color--100);
932
+ --pf-c-app-launcher__menu-search--PaddingTop: var(--pf-global--spacer--sm);
933
+ --pf-c-app-launcher__menu-search--PaddingRight: var(--pf-global--spacer--md);
934
+ --pf-c-app-launcher__menu-search--PaddingBottom: var(--pf-global--spacer--md);
935
+ --pf-c-app-launcher__menu-search--PaddingLeft: var(--pf-global--spacer--md);
936
+ --pf-c-app-launcher__menu-search--BottomBorderColor: var(--pf-global--BorderColor--100);
937
+ --pf-c-app-launcher__menu-search--BottomBorderWidth: var(--pf-global--BorderWidth--sm);
938
+ --pf-c-app-launcher__menu-search--MarginBottom: var(--pf-global--spacer--sm);
939
+ --pf-c-app-launcher__menu-item--PaddingTop: var(--pf-global--spacer--sm);
940
+ --pf-c-app-launcher__menu-item--PaddingRight: var(--pf-global--spacer--md);
941
+ --pf-c-app-launcher__menu-item--PaddingBottom: var(--pf-global--spacer--sm);
942
+ --pf-c-app-launcher__menu-item--PaddingLeft: var(--pf-global--spacer--md);
943
+ --pf-c-app-launcher__menu-item--Color: var(--pf-global--Color--dark-100);
944
+ --pf-c-app-launcher__menu-item--FontWeight: var(--pf-global--FontWeight--normal);
945
+ --pf-c-app-launcher__menu-item--Width: 100%;
946
+ --pf-c-app-launcher__menu-item--disabled--Color: var(--pf-global--Color--dark-200);
947
+ --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--light-300);
948
+ --pf-c-app-launcher__menu-item--m-link--PaddingRight: 0;
949
+ --pf-c-app-launcher__menu-item--m-link--hover--BackgroundColor: transparent;
950
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
951
+ --pf-c-app-launcher__menu-item--m-action--Width: auto;
952
+ --pf-c-app-launcher__menu-item--m-action--FontSize: var(--pf-global--icon--FontSize--sm);
953
+ --pf-c-app-launcher__menu-item--m-action--hover--BackgroundColor: transparent;
954
+ --pf-c-app-launcher__menu-item--hover__menu-item--m-action--Color: var(--pf-global--Color--200);
955
+ --pf-c-app-launcher__menu-item--m-action--hover--Color: var(--pf-global--Color--100);
956
+ --pf-c-app-launcher__menu-item--m-action--disabled--Color: var(--pf-global--disabled-color--200);
957
+ --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-400);
958
+ --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-500);
959
+ --pf-c-app-launcher__menu-item-icon--MarginRight: var(--pf-global--spacer--sm);
960
+ --pf-c-app-launcher__menu-item-icon--Width: var(--pf-global--icon--FontSize--lg);
961
+ --pf-c-app-launcher__menu-item-icon--Height: var(--pf-global--icon--FontSize--lg);
962
+ --pf-c-app-launcher__menu-item-external-icon--Color: var(--pf-global--link--Color);
963
+ --pf-c-app-launcher__menu-item-external-icon--PaddingLeft: var(--pf-global--spacer--md);
964
+ --pf-c-app-launcher__menu-item-external-icon--TranslateY: -0.0625rem;
965
+ --pf-c-app-launcher__menu-item-external-icon--FontSize: var(--pf-global--icon--FontSize--sm);
966
+ --pf-c-app-launcher__group--group--PaddingTop: var(--pf-global--spacer--sm);
967
+ --pf-c-app-launcher__group-title--PaddingTop: var(--pf-global--spacer--sm);
968
+ --pf-c-app-launcher__group-title--PaddingRight: var(--pf-c-app-launcher__menu-item--PaddingRight);
969
+ --pf-c-app-launcher__group-title--PaddingBottom: var(--pf-c-app-launcher__menu-item--PaddingBottom);
970
+ --pf-c-app-launcher__group-title--PaddingLeft: var(--pf-c-app-launcher__menu-item--PaddingLeft);
971
+ --pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--xs);
972
+ --pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--normal);
973
+ --pf-c-app-launcher__group-title--Color: var(--pf-global--Color--dark-200);
974
+ --pf-c-app-launcher--c-divider--MarginTop: var(--pf-global--spacer--sm);
975
+ --pf-c-app-launcher--c-divider--MarginBottom: var(--pf-global--spacer--sm);
976
+ position: relative;
977
+ display: inline-block;
978
+ max-width: 100%;
979
+ }
980
+
981
+ .pf-c-app-launcher.pf-m-expanded > .pf-c-app-launcher__toggle {
982
+ color: var(--pf-c-app-launcher__toggle--m-expanded--Color);
983
+ }
984
+
985
+ .pf-c-app-launcher .pf-c-divider {
986
+ margin-top: var(--pf-c-app-launcher--c-divider--MarginTop);
987
+ margin-bottom: var(--pf-c-app-launcher--c-divider--MarginBottom);
988
+ }
989
+
990
+ .pf-c-app-launcher .pf-c-divider:last-child {
991
+ --pf-c-app-launcher--c-divider--MarginBottom: 0;
992
+ }
993
+
994
+ .pf-c-app-launcher__toggle {
995
+ padding: var(--pf-c-app-launcher__toggle--PaddingTop) var(--pf-c-app-launcher__toggle--PaddingRight) var(--pf-c-app-launcher__toggle--PaddingBottom) var(--pf-c-app-launcher__toggle--PaddingLeft);
996
+ color: var(--pf-c-app-launcher__toggle--Color);
997
+ border: none;
998
+ }
999
+
1000
+ .pf-c-app-launcher__toggle:hover {
1001
+ --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--hover--Color);
1002
+ }
1003
+
1004
+ .pf-c-app-launcher__toggle:active, .pf-c-app-launcher__toggle.pf-m-active {
1005
+ --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--active--Color);
1006
+ }
1007
+
1008
+ .pf-c-app-launcher__toggle:focus {
1009
+ --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--focus--Color);
1010
+ }
1011
+
1012
+ .pf-c-app-launcher__toggle:disabled {
1013
+ --pf-c-app-launcher__toggle--Color: var(--pf-c-app-launcher__toggle--disabled--Color);
1014
+ pointer-events: none;
1015
+ }
1016
+
1017
+ .pf-c-app-launcher__menu {
1018
+ position: absolute;
1019
+ top: var(--pf-c-app-launcher__menu--Top);
1020
+ z-index: var(--pf-c-app-launcher__menu--ZIndex);
1021
+ min-width: 100%;
1022
+ padding-top: var(--pf-c-app-launcher__menu--PaddingTop);
1023
+ padding-bottom: var(--pf-c-app-launcher__menu--PaddingBottom);
1024
+ background-color: var(--pf-c-app-launcher__menu--BackgroundColor);
1025
+ background-clip: padding-box;
1026
+ box-shadow: var(--pf-c-app-launcher__menu--BoxShadow);
1027
+ }
1028
+
1029
+ .pf-c-app-launcher__menu.pf-m-align-right {
1030
+ right: 0;
1031
+ }
1032
+
1033
+ .pf-c-app-launcher.pf-m-top .pf-c-app-launcher__menu {
1034
+ --pf-c-app-launcher__menu--Top: var(--pf-c-app-launcher--m-top__menu--Top);
1035
+ transform: translateY(var(--pf-c-app-launcher--m-top__menu--TranslateY));
1036
+ }
1037
+
1038
+ .pf-c-app-launcher__menu-search {
1039
+ padding: var(--pf-c-app-launcher__menu-search--PaddingTop) var(--pf-c-app-launcher__menu-search--PaddingRight) var(--pf-c-app-launcher__menu-search--PaddingBottom) var(--pf-c-app-launcher__menu-search--PaddingLeft);
1040
+ margin-bottom: var(--pf-c-app-launcher__menu-search--MarginBottom);
1041
+ border-bottom: var(--pf-c-app-launcher__menu-search--BottomBorderWidth) solid var(--pf-c-app-launcher__menu-search--BottomBorderColor);
1042
+ }
1043
+
1044
+ .pf-c-app-launcher__menu-wrapper {
1045
+ display: flex;
1046
+ }
1047
+
1048
+ .pf-c-app-launcher__menu-wrapper.pf-m-favorite {
1049
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color);
1050
+ --pf-c-app-launcher__menu-item--m-action--hover--Color: var(--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color);
1051
+ }
1052
+
1053
+ .pf-c-app-launcher__menu-item {
1054
+ display: flex;
1055
+ align-items: center;
1056
+ width: var(--pf-c-app-launcher__menu-item--Width);
1057
+ padding: var(--pf-c-app-launcher__menu-item--PaddingTop) var(--pf-c-app-launcher__menu-item--PaddingRight) var(--pf-c-app-launcher__menu-item--PaddingBottom) var(--pf-c-app-launcher__menu-item--PaddingLeft);
1058
+ font-weight: var(--pf-c-app-launcher__menu-item--FontWeight);
1059
+ color: var(--pf-c-app-launcher__menu-item--Color);
1060
+ white-space: nowrap;
1061
+ border: 0;
1062
+ }
1063
+
1064
+ .pf-c-app-launcher__menu-item:hover, .pf-c-app-launcher__menu-item:focus {
1065
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--hover__menu-item--m-action--Color);
1066
+ text-decoration: none;
1067
+ }
1068
+
1069
+ .pf-c-app-launcher__menu-wrapper:hover,
1070
+ .pf-c-app-launcher__menu-wrapper:focus-within,
1071
+ .pf-c-app-launcher__menu-wrapper.pf-m-focus, .pf-c-app-launcher__menu-item:hover, .pf-c-app-launcher__menu-item:focus {
1072
+ background-color: var(--pf-c-app-launcher__menu-item--hover--BackgroundColor);
1073
+ }
1074
+
1075
+ .pf-c-app-launcher__menu-item:disabled, .pf-c-app-launcher__menu-item.pf-m-disabled {
1076
+ --pf-c-app-launcher__menu-item--Color: var(--pf-c-app-launcher__menu-item--disabled--Color);
1077
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-action--disabled--Color);
1078
+ pointer-events: none;
1079
+ }
1080
+
1081
+ .pf-c-app-launcher__menu-wrapper:disabled, .pf-c-app-launcher__menu-wrapper.pf-m-disabled, .pf-c-app-launcher__menu-item:disabled, .pf-c-app-launcher__menu-item.pf-m-disabled {
1082
+ background-color: transparent;
1083
+ }
1084
+
1085
+ .pf-c-app-launcher__menu-wrapper.pf-m-external:hover .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-wrapper.pf-m-external:focus .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-item.pf-m-external:hover .pf-c-app-launcher__menu-item-external-icon, .pf-c-app-launcher__menu-item.pf-m-external:focus .pf-c-app-launcher__menu-item-external-icon {
1086
+ opacity: 1;
1087
+ }
1088
+
1089
+ .pf-c-app-launcher__menu-item.pf-m-link {
1090
+ --pf-c-app-launcher__menu-item--PaddingRight: var(--pf-c-app-launcher__menu-item--m-link--PaddingRight);
1091
+ --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-c-app-launcher__menu-item--m-link--hover--BackgroundColor);
1092
+ }
1093
+
1094
+ .pf-c-app-launcher__menu-item.pf-m-action {
1095
+ --pf-c-app-launcher__menu-item--Color: var(--pf-c-app-launcher__menu-item--m-action--Color);
1096
+ --pf-c-app-launcher__menu-item--Width: var(--pf-c-app-launcher__menu-item--m-action--Width);
1097
+ --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-c-app-launcher__menu-item--m-action--hover--BackgroundColor);
1098
+ font-size: var(--pf-c-app-launcher__menu-item--m-action--FontSize);
1099
+ }
1100
+
1101
+ .pf-c-app-launcher__menu-item.pf-m-action:hover, .pf-c-app-launcher__menu-item.pf-m-action:focus {
1102
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-c-app-launcher__menu-item--m-action--hover--Color);
1103
+ }
1104
+
1105
+ .pf-c-app-launcher__menu-item-icon {
1106
+ display: inline-flex;
1107
+ align-items: center;
1108
+ justify-content: center;
1109
+ width: var(--pf-c-app-launcher__menu-item-icon--Width);
1110
+ height: var(--pf-c-app-launcher__menu-item-icon--Height);
1111
+ margin-right: var(--pf-c-app-launcher__menu-item-icon--MarginRight);
1112
+ }
1113
+
1114
+ .pf-c-app-launcher__menu-item-icon > * {
1115
+ max-width: 100%;
1116
+ max-height: 100%;
1117
+ }
1118
+
1119
+ .pf-c-app-launcher__menu-item-external-icon {
1120
+ padding-left: var(--pf-c-app-launcher__menu-item-external-icon--PaddingLeft);
1121
+ margin-left: auto;
1122
+ font-size: var(--pf-c-app-launcher__menu-item-external-icon--FontSize);
1123
+ color: var(--pf-c-app-launcher__menu-item-external-icon--Color);
1124
+ opacity: 0;
1125
+ transform: translateY(var(--pf-c-app-launcher__menu-item-external-icon--TranslateY));
1126
+ }
1127
+
1128
+ .pf-c-app-launcher__group + .pf-c-app-launcher__group {
1129
+ padding-top: var(--pf-c-app-launcher__group--group--PaddingTop);
1130
+ }
1131
+
1132
+ .pf-c-app-launcher__group-title {
1133
+ padding-top: var(--pf-c-app-launcher__group-title--PaddingTop);
1134
+ padding-right: var(--pf-c-app-launcher__group-title--PaddingRight);
1135
+ padding-bottom: var(--pf-c-app-launcher__group-title--PaddingBottom);
1136
+ padding-left: var(--pf-c-app-launcher__group-title--PaddingLeft);
1137
+ font-size: var(--pf-c-app-launcher__group-title--FontSize);
1138
+ font-weight: var(--pf-c-app-launcher__group-title--FontWeight);
1139
+ color: var(--pf-c-app-launcher__group-title--Color);
1140
+ }
1141
+
1142
+ :where(.pf-theme-dark) .pf-c-app-launcher {
1143
+ --pf-c-app-launcher__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
1144
+ --pf-c-app-launcher__menu--Top: 100%;
1145
+ --pf-c-app-launcher__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
1146
+ --pf-c-app-launcher__menu-item--disabled--Color: var(--pf-global--palette--black-300);
1147
+ --pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
1148
+ --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-300);
1149
+ --pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-100);
1150
+ }
1151
+
1152
1152
  .pf-u-screen-reader {
1153
1153
  position: fixed;
1154
1154
  top: 0;
@@ -1585,6 +1585,55 @@ textarea.pf-c-form-control {
1585
1585
  box-shadow: var(--pf-c-back-to-top--c-button--BoxShadow);
1586
1586
  }
1587
1587
 
1588
+ .pf-c-background-image {
1589
+ --pf-c-background-image--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
1590
+ --pf-c-background-image--BackgroundImage: url("../../assets/images/pfbg_576.jpg");
1591
+ --pf-c-background-image--BackgroundImage-2x: url("../../assets/images/pfbg_576@2x.jpg");
1592
+ --pf-c-background-image--BackgroundImage--sm: url("../../assets/images/pfbg_768.jpg");
1593
+ --pf-c-background-image--BackgroundImage--sm-2x: url("../../assets/images/pfbg_768@2x.jpg");
1594
+ --pf-c-background-image--BackgroundImage--lg: url("../../assets/images/pfbg_2000.jpg");
1595
+ --pf-c-background-image--Filter: url("#image_overlay");
1596
+ }
1597
+
1598
+ .pf-c-background-image::before {
1599
+ position: fixed;
1600
+ top: 0;
1601
+ left: 0;
1602
+ z-index: -1;
1603
+ width: 100%;
1604
+ height: 100%;
1605
+ content: "";
1606
+ background-color: var(--pf-c-background-image--BackgroundColor);
1607
+ background-image: var(--pf-c-background-image--BackgroundImage);
1608
+ filter: var(--pf-c-background-image--Filter);
1609
+ background-repeat: no-repeat;
1610
+ background-size: cover;
1611
+ }
1612
+
1613
+ @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
1614
+ .pf-c-background-image::before {
1615
+ --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage-2x);
1616
+ }
1617
+ }
1618
+ @media (min-width: 576px) {
1619
+ .pf-c-background-image::before {
1620
+ --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--sm);
1621
+ }
1622
+ }
1623
+ @media (min-width: 576px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 576px) and (min-resolution: 192dpi) {
1624
+ .pf-c-background-image::before {
1625
+ --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--sm-2x);
1626
+ }
1627
+ }
1628
+ @media (min-width: 992px) {
1629
+ .pf-c-background-image::before {
1630
+ --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--lg);
1631
+ }
1632
+ }
1633
+ .pf-c-background-image__filter {
1634
+ display: block;
1635
+ }
1636
+
1588
1637
  .pf-c-badge {
1589
1638
  --pf-c-badge--BorderRadius: var(--pf-global--BorderRadius--lg);
1590
1639
  --pf-c-badge--FontSize: var(--pf-global--FontSize--xs);
@@ -1802,55 +1851,6 @@ textarea.pf-c-form-control {
1802
1851
  color: var(--pf-global--palette--black-900);
1803
1852
  }
1804
1853
 
1805
- .pf-c-background-image {
1806
- --pf-c-background-image--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
1807
- --pf-c-background-image--BackgroundImage: url("../../assets/images/pfbg_576.jpg");
1808
- --pf-c-background-image--BackgroundImage-2x: url("../../assets/images/pfbg_576@2x.jpg");
1809
- --pf-c-background-image--BackgroundImage--sm: url("../../assets/images/pfbg_768.jpg");
1810
- --pf-c-background-image--BackgroundImage--sm-2x: url("../../assets/images/pfbg_768@2x.jpg");
1811
- --pf-c-background-image--BackgroundImage--lg: url("../../assets/images/pfbg_2000.jpg");
1812
- --pf-c-background-image--Filter: url("#image_overlay");
1813
- }
1814
-
1815
- .pf-c-background-image::before {
1816
- position: fixed;
1817
- top: 0;
1818
- left: 0;
1819
- z-index: -1;
1820
- width: 100%;
1821
- height: 100%;
1822
- content: "";
1823
- background-color: var(--pf-c-background-image--BackgroundColor);
1824
- background-image: var(--pf-c-background-image--BackgroundImage);
1825
- filter: var(--pf-c-background-image--Filter);
1826
- background-repeat: no-repeat;
1827
- background-size: cover;
1828
- }
1829
-
1830
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
1831
- .pf-c-background-image::before {
1832
- --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage-2x);
1833
- }
1834
- }
1835
- @media (min-width: 576px) {
1836
- .pf-c-background-image::before {
1837
- --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--sm);
1838
- }
1839
- }
1840
- @media (min-width: 576px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 576px) and (min-resolution: 192dpi) {
1841
- .pf-c-background-image::before {
1842
- --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--sm-2x);
1843
- }
1844
- }
1845
- @media (min-width: 992px) {
1846
- .pf-c-background-image::before {
1847
- --pf-c-background-image--BackgroundImage: var(--pf-c-background-image--BackgroundImage--lg);
1848
- }
1849
- }
1850
- .pf-c-background-image__filter {
1851
- display: block;
1852
- }
1853
-
1854
1854
  .pf-c-brand {
1855
1855
  --pf-c-brand--Width: auto;
1856
1856
  --pf-c-brand--Height: auto;
@@ -8635,81 +8635,6 @@ label.pf-c-check, .pf-c-check__label,
8635
8635
  font-weight: var(--pf-global--FontWeight--semi-bold);
8636
8636
  }
8637
8637
 
8638
- .pf-c-file-upload {
8639
- --pf-c-file-upload--m-loading__file-details--before--BackgroundColor: var(--pf-global--BackgroundColor--100);
8640
- --pf-c-file-upload--m-loading__file-details--before--Left: var(--pf-global--BorderWidth--sm);
8641
- --pf-c-file-upload--m-loading__file-details--before--Right: var(--pf-global--BorderWidth--sm);
8642
- --pf-c-file-upload--m-loading__file-details--before--Bottom: var(--pf-global--BorderWidth--sm);
8643
- --pf-c-file-upload--m-drag-hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
8644
- --pf-c-file-upload--m-drag-hover--before--BorderColor: var(--pf-global--primary-color--100);
8645
- --pf-c-file-upload--m-drag-hover--before--ZIndex: var(--pf-global--ZIndex--xs);
8646
- --pf-c-file-upload--m-drag-hover--after--BackgroundColor: var(--pf-global--primary-color--100);
8647
- --pf-c-file-upload--m-drag-hover--after--Opacity: .1;
8648
- --pf-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-global--spacer--3xl) * 2);
8649
- --pf-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
8650
- position: relative;
8651
- display: flex;
8652
- flex-direction: column;
8653
- }
8654
-
8655
- .pf-c-file-upload.pf-m-drag-hover::before {
8656
- position: absolute;
8657
- top: 0;
8658
- right: 0;
8659
- bottom: 0;
8660
- left: 0;
8661
- z-index: var(--pf-c-file-upload--m-drag-hover--before--ZIndex);
8662
- content: "";
8663
- border: var(--pf-c-file-upload--m-drag-hover--before--BorderWidth) solid var(--pf-c-file-upload--m-drag-hover--before--BorderColor);
8664
- }
8665
-
8666
- .pf-c-file-upload.pf-m-drag-hover::after {
8667
- position: absolute;
8668
- top: 0;
8669
- right: 0;
8670
- bottom: 0;
8671
- left: 0;
8672
- content: "";
8673
- background-color: var(--pf-c-file-upload--m-drag-hover--after--BackgroundColor);
8674
- opacity: var(--pf-c-file-upload--m-drag-hover--after--Opacity);
8675
- }
8676
-
8677
- .pf-c-file-upload.pf-m-loading .pf-c-file-upload__file-details {
8678
- position: relative;
8679
- }
8680
-
8681
- .pf-c-file-upload.pf-m-loading .pf-c-file-upload__file-details::before {
8682
- position: absolute;
8683
- top: 0;
8684
- right: var(--pf-c-file-upload--m-loading__file-details--before--Left);
8685
- bottom: var(--pf-c-file-upload--m-loading__file-details--before--Left);
8686
- left: var(--pf-c-file-upload--m-loading__file-details--before--Left);
8687
- content: "";
8688
- background-color: var(--pf-c-file-upload--m-loading__file-details--before--BackgroundColor);
8689
- }
8690
-
8691
- .pf-c-file-upload__file-select .pf-c-button.pf-m-control {
8692
- outline-offset: var(--pf-c-file-upload__file-select__c-button--m-control--OutlineOffset);
8693
- }
8694
-
8695
- .pf-c-file-upload__file-details {
8696
- position: relative;
8697
- display: flex;
8698
- }
8699
-
8700
- .pf-c-file-upload__file-details .pf-c-form-control {
8701
- flex: 1 1 auto;
8702
- min-height: var(--pf-c-file-upload__file-details__c-form-control--MinHeight);
8703
- border-top: 0;
8704
- }
8705
-
8706
- .pf-c-file-upload__file-details-spinner {
8707
- position: absolute;
8708
- top: 50%;
8709
- left: 50%;
8710
- transform: translate(-50%, -50%);
8711
- }
8712
-
8713
8638
  .pf-c-form {
8714
8639
  --pf-c-form--GridGap: var(--pf-global--gutter--md);
8715
8640
  --pf-c-form__group--m-action--MarginTop: var(--pf-global--spacer--xl);
@@ -9276,6 +9201,81 @@ label.pf-c-check, .pf-c-check__label,
9276
9201
  --pf-c-form__helper-text--m-success--Color: var(--pf-global--success-color--100);
9277
9202
  }
9278
9203
 
9204
+ .pf-c-file-upload {
9205
+ --pf-c-file-upload--m-loading__file-details--before--BackgroundColor: var(--pf-global--BackgroundColor--100);
9206
+ --pf-c-file-upload--m-loading__file-details--before--Left: var(--pf-global--BorderWidth--sm);
9207
+ --pf-c-file-upload--m-loading__file-details--before--Right: var(--pf-global--BorderWidth--sm);
9208
+ --pf-c-file-upload--m-loading__file-details--before--Bottom: var(--pf-global--BorderWidth--sm);
9209
+ --pf-c-file-upload--m-drag-hover--before--BorderWidth: var(--pf-global--BorderWidth--sm);
9210
+ --pf-c-file-upload--m-drag-hover--before--BorderColor: var(--pf-global--primary-color--100);
9211
+ --pf-c-file-upload--m-drag-hover--before--ZIndex: var(--pf-global--ZIndex--xs);
9212
+ --pf-c-file-upload--m-drag-hover--after--BackgroundColor: var(--pf-global--primary-color--100);
9213
+ --pf-c-file-upload--m-drag-hover--after--Opacity: .1;
9214
+ --pf-c-file-upload__file-details__c-form-control--MinHeight: calc(var(--pf-global--spacer--3xl) * 2);
9215
+ --pf-c-file-upload__file-select__c-button--m-control--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
9216
+ position: relative;
9217
+ display: flex;
9218
+ flex-direction: column;
9219
+ }
9220
+
9221
+ .pf-c-file-upload.pf-m-drag-hover::before {
9222
+ position: absolute;
9223
+ top: 0;
9224
+ right: 0;
9225
+ bottom: 0;
9226
+ left: 0;
9227
+ z-index: var(--pf-c-file-upload--m-drag-hover--before--ZIndex);
9228
+ content: "";
9229
+ border: var(--pf-c-file-upload--m-drag-hover--before--BorderWidth) solid var(--pf-c-file-upload--m-drag-hover--before--BorderColor);
9230
+ }
9231
+
9232
+ .pf-c-file-upload.pf-m-drag-hover::after {
9233
+ position: absolute;
9234
+ top: 0;
9235
+ right: 0;
9236
+ bottom: 0;
9237
+ left: 0;
9238
+ content: "";
9239
+ background-color: var(--pf-c-file-upload--m-drag-hover--after--BackgroundColor);
9240
+ opacity: var(--pf-c-file-upload--m-drag-hover--after--Opacity);
9241
+ }
9242
+
9243
+ .pf-c-file-upload.pf-m-loading .pf-c-file-upload__file-details {
9244
+ position: relative;
9245
+ }
9246
+
9247
+ .pf-c-file-upload.pf-m-loading .pf-c-file-upload__file-details::before {
9248
+ position: absolute;
9249
+ top: 0;
9250
+ right: var(--pf-c-file-upload--m-loading__file-details--before--Left);
9251
+ bottom: var(--pf-c-file-upload--m-loading__file-details--before--Left);
9252
+ left: var(--pf-c-file-upload--m-loading__file-details--before--Left);
9253
+ content: "";
9254
+ background-color: var(--pf-c-file-upload--m-loading__file-details--before--BackgroundColor);
9255
+ }
9256
+
9257
+ .pf-c-file-upload__file-select .pf-c-button.pf-m-control {
9258
+ outline-offset: var(--pf-c-file-upload__file-select__c-button--m-control--OutlineOffset);
9259
+ }
9260
+
9261
+ .pf-c-file-upload__file-details {
9262
+ position: relative;
9263
+ display: flex;
9264
+ }
9265
+
9266
+ .pf-c-file-upload__file-details .pf-c-form-control {
9267
+ flex: 1 1 auto;
9268
+ min-height: var(--pf-c-file-upload__file-details__c-form-control--MinHeight);
9269
+ border-top: 0;
9270
+ }
9271
+
9272
+ .pf-c-file-upload__file-details-spinner {
9273
+ position: absolute;
9274
+ top: 50%;
9275
+ left: 50%;
9276
+ transform: translate(-50%, -50%);
9277
+ }
9278
+
9279
9279
  .pf-c-helper-text {
9280
9280
  --pf-c-helper-text--Gap: var(--pf-global--spacer--xs);
9281
9281
  --pf-c-helper-text--FontSize: var(--pf-global--FontSize--sm);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-core",
3
- "version": "4.250.4",
3
+ "version": "4.250.5",
4
4
  "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
5
5
  "main": "dist/js/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -70,5 +70,5 @@
70
70
  "react": "^16.8 || ^17 || ^18",
71
71
  "react-dom": "^16.8 || ^17 || ^18"
72
72
  },
73
- "gitHead": "2f37a674bf64e0a0b40879834d1fb8b9da9f9944"
73
+ "gitHead": "8cea2e5427953062a640877854086934b93ce1f7"
74
74
  }
@@ -23,9 +23,11 @@ export interface DropdownProps extends MenuProps {
23
23
  isScrollable?: boolean;
24
24
  /** Min width of the menu. */
25
25
  minWidth?: string;
26
+ /** @hide Forwarded ref */
27
+ innerRef?: React.Ref<any>;
26
28
  }
27
29
 
28
- export const Dropdown: React.FunctionComponent<DropdownProps> = ({
30
+ const DropdownBase: React.FunctionComponent<DropdownProps> = ({
29
31
  children,
30
32
  className,
31
33
  onSelect,
@@ -35,13 +37,14 @@ export const Dropdown: React.FunctionComponent<DropdownProps> = ({
35
37
  isPlain,
36
38
  isScrollable,
37
39
  minWidth,
40
+ innerRef,
38
41
  ...props
39
42
  }: DropdownProps) => {
40
43
  const localMenuRef = React.useRef<HTMLDivElement>();
41
44
  const toggleRef = React.useRef<HTMLButtonElement>();
42
45
  const containerRef = React.useRef<HTMLDivElement>();
43
46
 
44
- const menuRef = (props.innerRef as React.RefObject<HTMLDivElement>) || localMenuRef;
47
+ const menuRef = (innerRef as React.RefObject<HTMLDivElement>) || localMenuRef;
45
48
  React.useEffect(() => {
46
49
  const handleMenuKeys = (event: KeyboardEvent) => {
47
50
  if (!isOpen && toggleRef.current?.contains(event.target as Node)) {
@@ -112,4 +115,8 @@ export const Dropdown: React.FunctionComponent<DropdownProps> = ({
112
115
  </div>
113
116
  );
114
117
  };
118
+
119
+ export const Dropdown = React.forwardRef((props: DropdownProps, ref: React.Ref<any>) => (
120
+ <DropdownBase innerRef={ref} {...props} />
121
+ ));
115
122
  Dropdown.displayName = 'Dropdown';
@@ -4,7 +4,6 @@ import { Divider, MenuToggle } from '@patternfly/react-core';
4
4
 
5
5
  export const DropdownBasic: React.FunctionComponent = () => {
6
6
  const [isOpen, setIsOpen] = React.useState(false);
7
- const menuRef = React.useRef<HTMLDivElement>(null);
8
7
 
9
8
  const onToggleClick = () => {
10
9
  setIsOpen(!isOpen);
@@ -18,7 +17,6 @@ export const DropdownBasic: React.FunctionComponent = () => {
18
17
 
19
18
  return (
20
19
  <Dropdown
21
- innerRef={menuRef}
22
20
  isOpen={isOpen}
23
21
  onSelect={onSelect}
24
22
  onOpenChange={isOpen => setIsOpen(isOpen)}
@@ -4,7 +4,6 @@ import { MenuToggle } from '@patternfly/react-core';
4
4
 
5
5
  export const DropdownWithDescriptions: React.FunctionComponent = () => {
6
6
  const [isOpen, setIsOpen] = React.useState(false);
7
- const menuRef = React.useRef<HTMLDivElement>(null);
8
7
 
9
8
  const onToggleClick = () => {
10
9
  setIsOpen(!isOpen);
@@ -18,7 +17,6 @@ export const DropdownWithDescriptions: React.FunctionComponent = () => {
18
17
 
19
18
  return (
20
19
  <Dropdown
21
- innerRef={menuRef}
22
20
  isOpen={isOpen}
23
21
  onSelect={onSelect}
24
22
  minWidth="150px"
@@ -4,7 +4,6 @@ import { MenuToggle, Divider } from '@patternfly/react-core';
4
4
 
5
5
  export const DropdownWithGroups: React.FunctionComponent = () => {
6
6
  const [isOpen, setIsOpen] = React.useState(false);
7
- const menuRef = React.useRef<HTMLDivElement>(null);
8
7
 
9
8
  const onToggleClick = () => {
10
9
  setIsOpen(!isOpen);
@@ -18,7 +17,6 @@ export const DropdownWithGroups: React.FunctionComponent = () => {
18
17
 
19
18
  return (
20
19
  <Dropdown
21
- innerRef={menuRef}
22
20
  isOpen={isOpen}
23
21
  onSelect={onSelect}
24
22
  onOpenChange={isOpen => setIsOpen(isOpen)}
@@ -5,7 +5,6 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico
5
5
 
6
6
  export const DropdownWithKebab: React.FunctionComponent = () => {
7
7
  const [isOpen, setIsOpen] = React.useState(false);
8
- const menuRef = React.useRef<HTMLDivElement>(null);
9
8
 
10
9
  const onToggleClick = () => {
11
10
  setIsOpen(!isOpen);
@@ -19,7 +18,6 @@ export const DropdownWithKebab: React.FunctionComponent = () => {
19
18
 
20
19
  return (
21
20
  <Dropdown
22
- innerRef={menuRef}
23
21
  isOpen={isOpen}
24
22
  onSelect={onSelect}
25
23
  minWidth="150px"