@patternfly/react-core 4.227.7 → 4.228.0
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 +27 -0
- package/dist/esm/components/Menu/MenuItem.d.ts +3 -1
- package/dist/esm/components/Menu/MenuItem.d.ts.map +1 -1
- package/dist/esm/components/Menu/MenuItem.js +2 -2
- package/dist/esm/components/Menu/MenuItem.js.map +1 -1
- package/dist/esm/components/MenuToggle/MenuToggle.d.ts +6 -12
- package/dist/esm/components/MenuToggle/MenuToggle.d.ts.map +1 -1
- package/dist/esm/components/MenuToggle/MenuToggle.js +12 -8
- package/dist/esm/components/MenuToggle/MenuToggle.js.map +1 -1
- package/dist/esm/components/Tabs/OverflowTab.d.ts +16 -0
- package/dist/esm/components/Tabs/OverflowTab.d.ts.map +1 -0
- package/dist/esm/components/Tabs/OverflowTab.js +74 -0
- package/dist/esm/components/Tabs/OverflowTab.js.map +1 -0
- package/dist/esm/components/Tabs/Tabs.d.ts +12 -0
- package/dist/esm/components/Tabs/Tabs.d.ts.map +1 -1
- package/dist/esm/components/Tabs/Tabs.js +36 -13
- package/dist/esm/components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/components/TextInputGroup/TextInputGroup.d.ts +2 -0
- package/dist/esm/components/TextInputGroup/TextInputGroup.d.ts.map +1 -1
- package/dist/esm/components/TextInputGroup/TextInputGroup.js +2 -2
- package/dist/esm/components/TextInputGroup/TextInputGroup.js.map +1 -1
- package/dist/esm/components/TextInputGroup/TextInputGroupMain.d.ts +1 -1
- package/dist/esm/components/TextInputGroup/TextInputGroupMain.d.ts.map +1 -1
- package/dist/esm/components/TreeView/TreeView.d.ts +2 -0
- package/dist/esm/components/TreeView/TreeView.d.ts.map +1 -1
- package/dist/esm/components/TreeView/TreeView.js +3 -3
- package/dist/esm/components/TreeView/TreeView.js.map +1 -1
- package/dist/esm/components/TreeView/TreeViewListItem.d.ts +2 -0
- package/dist/esm/components/TreeView/TreeViewListItem.d.ts.map +1 -1
- package/dist/esm/components/TreeView/TreeViewListItem.js +23 -14
- package/dist/esm/components/TreeView/TreeViewListItem.js.map +1 -1
- package/dist/js/components/Menu/MenuItem.d.ts +3 -1
- package/dist/js/components/Menu/MenuItem.d.ts.map +1 -1
- package/dist/js/components/Menu/MenuItem.js +2 -2
- package/dist/js/components/Menu/MenuItem.js.map +1 -1
- package/dist/js/components/MenuToggle/MenuToggle.d.ts +6 -12
- package/dist/js/components/MenuToggle/MenuToggle.d.ts.map +1 -1
- package/dist/js/components/MenuToggle/MenuToggle.js +12 -8
- package/dist/js/components/MenuToggle/MenuToggle.js.map +1 -1
- package/dist/js/components/Tabs/OverflowTab.d.ts +16 -0
- package/dist/js/components/Tabs/OverflowTab.d.ts.map +1 -0
- package/dist/js/components/Tabs/OverflowTab.js +78 -0
- package/dist/js/components/Tabs/OverflowTab.js.map +1 -0
- package/dist/js/components/Tabs/Tabs.d.ts +12 -0
- package/dist/js/components/Tabs/Tabs.d.ts.map +1 -1
- package/dist/js/components/Tabs/Tabs.js +36 -13
- package/dist/js/components/Tabs/Tabs.js.map +1 -1
- package/dist/js/components/TextInputGroup/TextInputGroup.d.ts +2 -0
- package/dist/js/components/TextInputGroup/TextInputGroup.d.ts.map +1 -1
- package/dist/js/components/TextInputGroup/TextInputGroup.js +2 -2
- package/dist/js/components/TextInputGroup/TextInputGroup.js.map +1 -1
- package/dist/js/components/TextInputGroup/TextInputGroupMain.d.ts +1 -1
- package/dist/js/components/TextInputGroup/TextInputGroupMain.d.ts.map +1 -1
- package/dist/js/components/TreeView/TreeView.d.ts +2 -0
- package/dist/js/components/TreeView/TreeView.d.ts.map +1 -1
- package/dist/js/components/TreeView/TreeView.js +3 -3
- package/dist/js/components/TreeView/TreeView.js.map +1 -1
- package/dist/js/components/TreeView/TreeViewListItem.d.ts +2 -0
- package/dist/js/components/TreeView/TreeViewListItem.d.ts.map +1 -1
- package/dist/js/components/TreeView/TreeViewListItem.js +23 -14
- package/dist/js/components/TreeView/TreeViewListItem.js.map +1 -1
- package/dist/styles/base-no-reset.css +9 -0
- package/dist/styles/base.css +9 -0
- package/dist/umd/react-core.css +21 -31
- package/dist/umd/react-core.js +149 -48
- package/dist/umd/react-core.min.css +21 -31
- package/dist/umd/react-core.min.js +5 -5
- package/package.json +6 -6
- package/src/components/Menu/MenuItem.tsx +4 -0
- package/src/components/MenuToggle/MenuToggle.tsx +63 -25
- package/src/components/Page/examples/Page.md +10 -615
- package/src/components/Page/examples/PageCenteredSection.tsx +76 -0
- package/src/components/Page/examples/PageGroupSection.tsx +106 -0
- package/src/components/Page/examples/PageHorizontalNav.tsx +43 -0
- package/src/components/Page/examples/PageMainSectionPadding.tsx +72 -0
- package/src/components/Page/examples/PageTertiaryNav.tsx +42 -0
- package/src/components/Page/examples/PageUncontrolledNav.tsx +53 -0
- package/src/components/Page/examples/PageVerticalNav.tsx +65 -0
- package/src/components/Page/examples/PageVerticalNavUsingPageHeaderComponent.tsx +44 -0
- package/src/components/Page/examples/PageWithOrWithoutFill.tsx +67 -0
- package/src/components/Switch/examples/Switch.md +6 -153
- package/src/components/Switch/examples/SwitchBasic.tsx +20 -0
- package/src/components/Switch/examples/SwitchCheckedWithLabel.tsx +22 -0
- package/src/components/Switch/examples/SwitchDisabled.tsx +28 -0
- package/src/components/Switch/examples/SwitchReversed.tsx +21 -0
- package/src/components/Switch/examples/SwitchUncontrolled.tsx +14 -0
- package/src/components/Switch/examples/SwitchWithoutLabel.tsx +12 -0
- package/src/components/Tabs/OverflowTab.tsx +141 -0
- package/src/components/Tabs/Tabs.tsx +72 -25
- package/src/components/Tabs/examples/Tabs.md +6 -1
- package/src/components/Tabs/examples/TabsHorizontalOverflow.tsx +67 -0
- package/src/components/TextInputGroup/TextInputGroup.tsx +9 -1
- package/src/components/TextInputGroup/TextInputGroupMain.tsx +1 -1
- package/src/components/TreeView/TreeView.tsx +5 -0
- package/src/components/TreeView/TreeViewListItem.tsx +31 -17
- package/src/components/TreeView/__tests__/__snapshots__/TreeView.test.tsx.snap +299 -299
- package/src/components/TreeView/examples/TreeView.md +125 -7
- package/src/demos/ComposableMenu/ComposableMenu.md +8 -0
- package/src/demos/ComposableMenu/examples/ComposableTypeaheadSelect.tsx +196 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeViewListItem.js","sourceRoot":"","sources":["../../../../src/components/TreeView/TreeViewListItem.tsx"],"names":[],"mappings":";;;;AAAA,uDAAmD;AACnD,2DAA+C;AAC/C,mHAAgF;AAChF,sHAAqF;AAErF,oCAAiC;AACjC,oEAAiE;
|
|
1
|
+
{"version":3,"file":"TreeViewListItem.js","sourceRoot":"","sources":["../../../../src/components/TreeView/TreeViewListItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -687,6 +687,15 @@ html {
|
|
|
687
687
|
border: 0;
|
|
688
688
|
}
|
|
689
689
|
|
|
690
|
+
.pf-screen-reader.pf-m-full-size {
|
|
691
|
+
width: 100%;
|
|
692
|
+
height: 100%;
|
|
693
|
+
}
|
|
694
|
+
|
|
695
|
+
.pf-screen-reader.pf-m-absolute {
|
|
696
|
+
position: absolute;
|
|
697
|
+
}
|
|
698
|
+
|
|
690
699
|
.pf-m-tabular-nums {
|
|
691
700
|
font-variant-numeric: tabular-nums;
|
|
692
701
|
}
|
package/dist/styles/base.css
CHANGED
|
@@ -687,6 +687,15 @@ html {
|
|
|
687
687
|
border: 0;
|
|
688
688
|
}
|
|
689
689
|
|
|
690
|
+
.pf-screen-reader.pf-m-full-size {
|
|
691
|
+
width: 100%;
|
|
692
|
+
height: 100%;
|
|
693
|
+
}
|
|
694
|
+
|
|
695
|
+
.pf-screen-reader.pf-m-absolute {
|
|
696
|
+
position: absolute;
|
|
697
|
+
}
|
|
698
|
+
|
|
690
699
|
.pf-m-tabular-nums {
|
|
691
700
|
font-variant-numeric: tabular-nums;
|
|
692
701
|
}
|
package/dist/umd/react-core.css
CHANGED
|
@@ -587,8 +587,8 @@
|
|
|
587
587
|
--pf-c-app-launcher__group-title--PaddingRight: var(--pf-c-app-launcher__menu-item--PaddingRight);
|
|
588
588
|
--pf-c-app-launcher__group-title--PaddingBottom: var(--pf-c-app-launcher__menu-item--PaddingBottom);
|
|
589
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--
|
|
591
|
-
--pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--
|
|
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
592
|
--pf-c-app-launcher__group-title--Color: var(--pf-global--Color--dark-200);
|
|
593
593
|
--pf-c-app-launcher--c-divider--MarginTop: var(--pf-global--spacer--sm);
|
|
594
594
|
--pf-c-app-launcher--c-divider--MarginBottom: var(--pf-global--spacer--sm);
|
|
@@ -766,8 +766,6 @@
|
|
|
766
766
|
--pf-c-app-launcher__menu-item--m-action--Color: var(--pf-global--Color--200);
|
|
767
767
|
--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--Color: var(--pf-global--palette--gold-300);
|
|
768
768
|
--pf-c-app-launcher__menu-item--m-favorite__menu-item--m-action--hover--Color: var(--pf-global--palette--gold-100);
|
|
769
|
-
--pf-c-app-launcher__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
770
|
-
--pf-c-app-launcher__group-title--FontWeight: var(--pf-global--FontWeight--bold);
|
|
771
769
|
}
|
|
772
770
|
|
|
773
771
|
.pf-c-form-control {
|
|
@@ -7348,8 +7346,8 @@ label.pf-c-check, .pf-c-check__label,
|
|
|
7348
7346
|
--pf-c-dropdown__group-title--PaddingRight: var(--pf-c-dropdown__menu-item--PaddingRight);
|
|
7349
7347
|
--pf-c-dropdown__group-title--PaddingBottom: var(--pf-c-dropdown__menu-item--PaddingBottom);
|
|
7350
7348
|
--pf-c-dropdown__group-title--PaddingLeft: var(--pf-c-dropdown__menu-item--PaddingLeft);
|
|
7351
|
-
--pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--
|
|
7352
|
-
--pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--
|
|
7349
|
+
--pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
7350
|
+
--pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--normal);
|
|
7353
7351
|
--pf-c-dropdown__group-title--Color: var(--pf-global--Color--dark-200);
|
|
7354
7352
|
--pf-c-dropdown__toggle-image--MarginTop: 0;
|
|
7355
7353
|
--pf-c-dropdown__toggle-image--MarginBottom: 0;
|
|
@@ -7952,8 +7950,6 @@ label.pf-c-check, .pf-c-check__label,
|
|
|
7952
7950
|
--pf-c-dropdown__menu--Top: 100%;
|
|
7953
7951
|
--pf-c-dropdown--m-top__menu--TranslateY: -100%;
|
|
7954
7952
|
--pf-c-dropdown__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
|
|
7955
|
-
--pf-c-dropdown__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
7956
|
-
--pf-c-dropdown__group-title--FontWeight: var(--pf-global--FontWeight--bold);
|
|
7957
7953
|
}
|
|
7958
7954
|
|
|
7959
7955
|
: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 {
|
|
|
12022
12018
|
--pf-c-menu__group-title--PaddingTop: var(--pf-global--spacer--md);
|
|
12023
12019
|
--pf-c-menu__group-title--PaddingRight: var(--pf-c-menu__item--PaddingRight);
|
|
12024
12020
|
--pf-c-menu__group-title--PaddingLeft: var(--pf-c-menu__item--PaddingLeft);
|
|
12025
|
-
--pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--
|
|
12026
|
-
--pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--
|
|
12021
|
+
--pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
12022
|
+
--pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--normal);
|
|
12027
12023
|
--pf-c-menu__group-title--Color: var(--pf-global--Color--200);
|
|
12028
12024
|
--pf-c-menu__item-description--FontSize: var(--pf-global--FontSize--xs);
|
|
12029
12025
|
--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)) {
|
|
|
12573
12569
|
--pf-c-menu__list-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
|
|
12574
12570
|
--pf-c-menu__list-item--focus-within--BackgroundColor: var(--pf-global--BackgroundColor--400);
|
|
12575
12571
|
--pf-c-menu__list-item--m-disabled__item--Color: var(--pf-global--Color--200);
|
|
12576
|
-
--pf-c-menu__group-title--FontWeight: var(--pf-global--FontWeight--bold);
|
|
12577
|
-
--pf-c-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
12578
12572
|
}
|
|
12579
12573
|
|
|
12580
12574
|
.pf-c-menu-toggle {
|
|
@@ -14952,8 +14946,8 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
|
|
|
14952
14946
|
--pf-c-options-menu__group-title--PaddingRight: var(--pf-c-options-menu__menu-item--PaddingRight);
|
|
14953
14947
|
--pf-c-options-menu__group-title--PaddingBottom: var(--pf-c-options-menu__menu-item--PaddingBottom);
|
|
14954
14948
|
--pf-c-options-menu__group-title--PaddingLeft: var(--pf-c-options-menu__menu-item--PaddingLeft);
|
|
14955
|
-
--pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--
|
|
14956
|
-
--pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--
|
|
14949
|
+
--pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
14950
|
+
--pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--normal);
|
|
14957
14951
|
--pf-c-options-menu__group-title--Color: var(--pf-global--Color--dark-200);
|
|
14958
14952
|
--pf-c-options-menu--c-divider--MarginTop: var(--pf-global--spacer--sm);
|
|
14959
14953
|
--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)) {
|
|
|
15162
15156
|
--pf-c-options-menu__toggle--disabled--BackgroundColor: var(--pf-global--palette--black-500);
|
|
15163
15157
|
--pf-c-options-menu__menu--BackgroundColor: var(--pf-global--BackgroundColor--300);
|
|
15164
15158
|
--pf-c-options-menu__menu-item--hover--BackgroundColor: var(--pf-global--BackgroundColor--400);
|
|
15165
|
-
--pf-c-options-menu__group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
15166
|
-
--pf-c-options-menu__group-title--FontWeight: var(--pf-global--FontWeight--bold);
|
|
15167
15159
|
--pf-c-options-menu__menu--Top: 100%;
|
|
15168
15160
|
}
|
|
15169
15161
|
|
|
@@ -17920,8 +17912,8 @@ label.pf-c-radio, .pf-c-radio__label,
|
|
|
17920
17912
|
--pf-c-select__menu-group-title--PaddingRight: var(--pf-c-select__menu-item--PaddingRight);
|
|
17921
17913
|
--pf-c-select__menu-group-title--PaddingBottom: var(--pf-c-select__menu-item--PaddingBottom);
|
|
17922
17914
|
--pf-c-select__menu-group-title--PaddingLeft: var(--pf-c-select__menu-item--PaddingLeft);
|
|
17923
|
-
--pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--
|
|
17924
|
-
--pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--
|
|
17915
|
+
--pf-c-select__menu-group-title--FontSize: var(--pf-global--FontSize--xs);
|
|
17916
|
+
--pf-c-select__menu-group-title--FontWeight: var(--pf-global--FontWeight--normal);
|
|
17925
17917
|
--pf-c-select__menu-group-title--Color: var(--pf-global--Color--dark-200);
|
|
17926
17918
|
--pf-c-select__menu-item-count--MarginLeft: var(--pf-global--spacer--md);
|
|
17927
17919
|
--pf-c-select__menu-item-count--FontSize: var(--pf-global--FontSize--sm);
|
|
@@ -19774,6 +19766,11 @@ svg.pf-c-spinner.pf-m-xl {
|
|
|
19774
19766
|
--pf-c-tabs--inset: var(--pf-c-tabs--m-page-insets--inset);
|
|
19775
19767
|
}
|
|
19776
19768
|
|
|
19769
|
+
.pf-c-tabs.pf-m-overflow,
|
|
19770
|
+
.pf-c-tabs.pf-m-overflow .pf-c-tabs__list {
|
|
19771
|
+
overflow: visible;
|
|
19772
|
+
}
|
|
19773
|
+
|
|
19777
19774
|
.pf-c-tabs__toggle {
|
|
19778
19775
|
display: var(--pf-c-tabs__toggle--Display);
|
|
19779
19776
|
align-items: center;
|
|
@@ -22775,23 +22772,16 @@ svg.pf-c-spinner.pf-m-xl {
|
|
|
22775
22772
|
--pf-c-badge--m-read--BackgroundColor: var(--pf-c-tree-view__node-count--c-badge--m-read--BackgroundColor);
|
|
22776
22773
|
}
|
|
22777
22774
|
|
|
22778
|
-
.pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle {
|
|
22779
|
-
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--Color
|
|
22780
|
-
}
|
|
22781
|
-
|
|
22782
|
-
.pf-c-tree-view__node:hover,
|
|
22783
|
-
.pf-c-tree-view__node .pf-c-tree-view__node-toggle:hover {
|
|
22784
|
-
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover__icon--Color);
|
|
22775
|
+
.pf-c-tree-view__node:not(.pf-m-selectable):hover, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:hover {
|
|
22776
|
+
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--hover--Color);
|
|
22785
22777
|
}
|
|
22786
22778
|
|
|
22787
|
-
.pf-c-tree-view__node:focus,
|
|
22788
|
-
|
|
22789
|
-
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus__icon--Color);
|
|
22779
|
+
.pf-c-tree-view__node:not(.pf-m-selectable):focus, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:focus {
|
|
22780
|
+
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--focus--Color);
|
|
22790
22781
|
}
|
|
22791
22782
|
|
|
22792
|
-
.pf-c-tree-view__node:active,
|
|
22793
|
-
|
|
22794
|
-
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active__icon--Color);
|
|
22783
|
+
.pf-c-tree-view__node:not(.pf-m-selectable):active, .pf-c-tree-view__node.pf-m-selectable .pf-c-tree-view__node-toggle:active {
|
|
22784
|
+
--pf-c-tree-view__node-toggle--Color: var(--pf-c-tree-view__node-toggle--active--Color);
|
|
22795
22785
|
}
|
|
22796
22786
|
|
|
22797
22787
|
.pf-c-tree-view__node-container {
|
package/dist/umd/react-core.js
CHANGED
|
@@ -15677,7 +15677,7 @@
|
|
|
15677
15677
|
direction: 'right'
|
|
15678
15678
|
});
|
|
15679
15679
|
const MenuItemBase = (_a) => {
|
|
15680
|
-
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"]);
|
|
15680
|
+
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"]);
|
|
15681
15681
|
const { menuId, parentMenu, onSelect, onActionClick, activeItemId, selected, drilldownItemPath, onDrillIn, onDrillOut, flyoutRef, setFlyoutRef, disableHover } = React__namespace.useContext(MenuContext);
|
|
15682
15682
|
let Component = (to ? 'a' : component);
|
|
15683
15683
|
if (hasCheck && !to) {
|
|
@@ -15843,7 +15843,7 @@
|
|
|
15843
15843
|
setFlyoutRef(null);
|
|
15844
15844
|
}
|
|
15845
15845
|
};
|
|
15846
|
-
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),
|
|
15846
|
+
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),
|
|
15847
15847
|
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 && {
|
|
15848
15848
|
onClick: (event) => {
|
|
15849
15849
|
onItemSelect(event, onSelect);
|
|
@@ -15936,19 +15936,23 @@
|
|
|
15936
15936
|
this.displayName = 'MenuToggleBase';
|
|
15937
15937
|
}
|
|
15938
15938
|
render() {
|
|
15939
|
-
const _a = this.props, { children, className, icon, badge, isExpanded, isDisabled, isFullHeight, isFullWidth, variant, innerRef } = _a,
|
|
15939
|
+
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']);
|
|
15940
15940
|
const isPlain = variant === 'plain';
|
|
15941
15941
|
const isPlainText = variant === 'plainText';
|
|
15942
|
+
const isTypeahead = variant === 'typeahead';
|
|
15943
|
+
const toggleControls = (React__namespace.createElement("span", { className: css(styles$x.menuToggleControls) },
|
|
15944
|
+
React__namespace.createElement("span", { className: css(styles$x.menuToggleToggleIcon) },
|
|
15945
|
+
React__namespace.createElement(CaretDownIcon$1, { "aria-hidden": true }))));
|
|
15942
15946
|
const content = (React__namespace.createElement(React__namespace.Fragment, null,
|
|
15943
15947
|
icon && React__namespace.createElement("span", { className: css(styles$x.menuToggleIcon) }, icon),
|
|
15944
|
-
React__namespace.createElement("span", { className: "pf-c-menu-toggle__text" }, children),
|
|
15948
|
+
isTypeahead ? children : React__namespace.createElement("span", { className: "pf-c-menu-toggle__text" }, children),
|
|
15945
15949
|
badge && React__namespace.createElement("span", { className: css(styles$x.menuToggleCount) }, badge),
|
|
15946
|
-
React__namespace.createElement("
|
|
15947
|
-
|
|
15948
|
-
|
|
15949
|
-
|
|
15950
|
-
|
|
15951
|
-
|
|
15950
|
+
isTypeahead ? (React__namespace.createElement("button", { type: "button", className: css(styles$x.menuToggleButton), "aria-expanded": isExpanded, onClick: onClick, "aria-label": "Menu toggle" }, toggleControls)) : (toggleControls)));
|
|
15951
|
+
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);
|
|
15952
|
+
if (isTypeahead) {
|
|
15953
|
+
return React__namespace.createElement("div", Object.assign({ ref: innerRef }, componentProps));
|
|
15954
|
+
}
|
|
15955
|
+
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)));
|
|
15952
15956
|
}
|
|
15953
15957
|
}
|
|
15954
15958
|
MenuToggleBase.defaultProps = {
|
|
@@ -18387,10 +18391,10 @@
|
|
|
18387
18391
|
isDisabled: false
|
|
18388
18392
|
});
|
|
18389
18393
|
const TextInputGroup = (_a) => {
|
|
18390
|
-
var { children, className, isDisabled, innerRef } = _a, props = __rest$1(_a, ["children", "className", "isDisabled", "innerRef"]);
|
|
18394
|
+
var { children, className, isDisabled, isPlain, innerRef } = _a, props = __rest$1(_a, ["children", "className", "isDisabled", "isPlain", "innerRef"]);
|
|
18391
18395
|
const textInputGroupRef = innerRef || React__namespace.useRef(null);
|
|
18392
18396
|
return (React__namespace.createElement(TextInputGroupContext.Provider, { value: { isDisabled } },
|
|
18393
|
-
React__namespace.createElement("div", Object.assign({ ref: textInputGroupRef, className: css(styles$l.textInputGroup, isDisabled && styles$l.modifiers.disabled, className) }, props), children)));
|
|
18397
|
+
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)));
|
|
18394
18398
|
};
|
|
18395
18399
|
TextInputGroup.displayName = 'TextInputGroup';
|
|
18396
18400
|
|
|
@@ -19054,6 +19058,7 @@
|
|
|
19054
19058
|
"nonExpandableOn_2xl": "pf-m-non-expandable-on-2xl",
|
|
19055
19059
|
"expanded": "pf-m-expanded",
|
|
19056
19060
|
"pageInsets": "pf-m-page-insets",
|
|
19061
|
+
"overflow": "pf-m-overflow",
|
|
19057
19062
|
"action": "pf-m-action",
|
|
19058
19063
|
"active": "pf-m-active",
|
|
19059
19064
|
"disabled": "pf-m-disabled",
|
|
@@ -19211,6 +19216,77 @@
|
|
|
19211
19216
|
};
|
|
19212
19217
|
const TabContent = React__namespace.forwardRef((props, ref) => (React__namespace.createElement(TabContentBase, Object.assign({}, props, { innerRef: ref }))));
|
|
19213
19218
|
|
|
19219
|
+
const TabTitleText = (_a) => {
|
|
19220
|
+
var { children, className = '' } = _a, props = __rest$1(_a, ["children", "className"]);
|
|
19221
|
+
return (React__namespace.createElement("span", Object.assign({ className: css(styles$f.tabsItemText, className) }, props), children));
|
|
19222
|
+
};
|
|
19223
|
+
TabTitleText.displayName = 'TabTitleText';
|
|
19224
|
+
|
|
19225
|
+
const OverflowTab = (_a) => {
|
|
19226
|
+
var { className, overflowingTabs = [], showTabCount, defaultTitleText = 'More', toggleAriaLabel } = _a, props = __rest$1(_a, ["className", "overflowingTabs", "showTabCount", "defaultTitleText", "toggleAriaLabel"]);
|
|
19227
|
+
const menuRef = React__default["default"].useRef();
|
|
19228
|
+
const overflowTabRef = React__default["default"].useRef();
|
|
19229
|
+
const overflowLIRef = React__default["default"].useRef();
|
|
19230
|
+
const [isExpanded, setIsExpanded] = React__default["default"].useState(false);
|
|
19231
|
+
const { localActiveKey, handleTabClick } = React__default["default"].useContext(TabsContext);
|
|
19232
|
+
const closeMenu = () => {
|
|
19233
|
+
setIsExpanded(false);
|
|
19234
|
+
overflowTabRef.current.focus();
|
|
19235
|
+
};
|
|
19236
|
+
const handleMenuKeys = (ev) => {
|
|
19237
|
+
var _a;
|
|
19238
|
+
const menuContainsEventTarget = (_a = menuRef === null || menuRef === void 0 ? void 0 : menuRef.current) === null || _a === void 0 ? void 0 : _a.contains(ev.target);
|
|
19239
|
+
if (isExpanded && menuContainsEventTarget && ev.key === 'Escape') {
|
|
19240
|
+
closeMenu();
|
|
19241
|
+
}
|
|
19242
|
+
};
|
|
19243
|
+
const handleClick = (ev) => {
|
|
19244
|
+
var _a, _b;
|
|
19245
|
+
const clickIsOutsideMenu = !((_a = menuRef === null || menuRef === void 0 ? void 0 : menuRef.current) === null || _a === void 0 ? void 0 : _a.contains(ev.target));
|
|
19246
|
+
const clickIsOutsideOverflowTab = !((_b = overflowTabRef === null || overflowTabRef === void 0 ? void 0 : overflowTabRef.current) === null || _b === void 0 ? void 0 : _b.contains(ev.target));
|
|
19247
|
+
if (isExpanded && clickIsOutsideMenu && clickIsOutsideOverflowTab) {
|
|
19248
|
+
closeMenu();
|
|
19249
|
+
}
|
|
19250
|
+
};
|
|
19251
|
+
React__default["default"].useEffect(() => {
|
|
19252
|
+
window.addEventListener('click', handleClick);
|
|
19253
|
+
window.addEventListener('keydown', handleMenuKeys);
|
|
19254
|
+
return () => {
|
|
19255
|
+
window.removeEventListener('click', handleClick);
|
|
19256
|
+
window.removeEventListener('keydown', handleMenuKeys);
|
|
19257
|
+
};
|
|
19258
|
+
}, [isExpanded, menuRef, overflowTabRef]);
|
|
19259
|
+
const selectedTab = overflowingTabs.find(tab => tab.eventKey === localActiveKey);
|
|
19260
|
+
const tabTitle = (selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.title) ? selectedTab.title : defaultTitleText;
|
|
19261
|
+
const toggleMenu = () => {
|
|
19262
|
+
setIsExpanded(prevIsExpanded => !prevIsExpanded);
|
|
19263
|
+
setTimeout(() => {
|
|
19264
|
+
if (menuRef === null || menuRef === void 0 ? void 0 : menuRef.current) {
|
|
19265
|
+
const firstElement = menuRef.current.querySelector('li > button,input:not(:disabled)');
|
|
19266
|
+
firstElement && firstElement.focus();
|
|
19267
|
+
}
|
|
19268
|
+
}, 0);
|
|
19269
|
+
};
|
|
19270
|
+
const overflowTab = (React__default["default"].createElement("li", Object.assign({ className: css(styles$f.tabsItem, 'pf-m-overflow', selectedTab && styles$f.modifiers.current, className), role: "presentation", ref: overflowLIRef }, props),
|
|
19271
|
+
React__default["default"].createElement("button", { className: css(styles$f.tabsLink, isExpanded && styles$f.modifiers.expanded), onClick: () => toggleMenu(), "aria-label": toggleAriaLabel, "aria-haspopup": "menu", "aria-expanded": isExpanded, role: "tab", ref: overflowTabRef },
|
|
19272
|
+
React__default["default"].createElement(TabTitleText, null,
|
|
19273
|
+
tabTitle,
|
|
19274
|
+
showTabCount && tabTitle === defaultTitleText && ` (${overflowingTabs.length})`),
|
|
19275
|
+
React__default["default"].createElement("span", { className: styles$f.tabsLinkToggleIcon },
|
|
19276
|
+
React__default["default"].createElement(AngleRightIcon$1, null)))));
|
|
19277
|
+
const tabs = overflowingTabs.map(tab => (React__default["default"].createElement(MenuItem, { key: tab.eventKey, itemId: tab.eventKey, isSelected: localActiveKey === tab.eventKey }, tab.title)));
|
|
19278
|
+
const onTabSelect = (event, key) => {
|
|
19279
|
+
closeMenu();
|
|
19280
|
+
const selectedTabRef = overflowingTabs.find(tab => tab.eventKey === key).tabContentRef;
|
|
19281
|
+
handleTabClick(event, key, selectedTabRef);
|
|
19282
|
+
};
|
|
19283
|
+
const overflowMenu = (React__default["default"].createElement(Menu, { ref: menuRef, onSelect: (ev, itemId) => onTabSelect(ev, itemId) },
|
|
19284
|
+
React__default["default"].createElement(MenuContent, null,
|
|
19285
|
+
React__default["default"].createElement(MenuList, null, tabs))));
|
|
19286
|
+
return (React__default["default"].createElement(Popper, { trigger: overflowTab, popper: overflowMenu, isVisible: isExpanded, popperMatchesTriggerWidth: false, appendTo: overflowLIRef.current }));
|
|
19287
|
+
};
|
|
19288
|
+
OverflowTab.displayName = 'OverflowTab';
|
|
19289
|
+
|
|
19214
19290
|
exports.TabsComponent = void 0;
|
|
19215
19291
|
(function (TabsComponent) {
|
|
19216
19292
|
TabsComponent["div"] = "div";
|
|
@@ -19225,7 +19301,12 @@
|
|
|
19225
19301
|
super(props);
|
|
19226
19302
|
this.tabList = React__namespace.createRef();
|
|
19227
19303
|
this.scrollTimeout = null;
|
|
19304
|
+
this.countOverflowingElements = (container) => {
|
|
19305
|
+
const elements = Array.from(container.children);
|
|
19306
|
+
return elements.filter(element => !isElementInView(container, element, false)).length;
|
|
19307
|
+
};
|
|
19228
19308
|
this.handleScrollButtons = () => {
|
|
19309
|
+
const { isOverflowHorizontal: isOverflowHorizontal } = this.props;
|
|
19229
19310
|
// add debounce to the scroll event
|
|
19230
19311
|
clearTimeout(this.scrollTimeout);
|
|
19231
19312
|
this.scrollTimeout = setTimeout(() => {
|
|
@@ -19233,7 +19314,8 @@
|
|
|
19233
19314
|
let disableLeftScrollButton = true;
|
|
19234
19315
|
let disableRightScrollButton = true;
|
|
19235
19316
|
let showScrollButtons = false;
|
|
19236
|
-
|
|
19317
|
+
let overflowingTabCount = 0;
|
|
19318
|
+
if (container && !this.props.isVertical && !isOverflowHorizontal) {
|
|
19237
19319
|
// get first element and check if it is in view
|
|
19238
19320
|
const overflowOnLeft = !isElementInView(container, container.firstChild, false);
|
|
19239
19321
|
// get last element and check if it is in view
|
|
@@ -19242,10 +19324,14 @@
|
|
|
19242
19324
|
disableLeftScrollButton = !overflowOnLeft;
|
|
19243
19325
|
disableRightScrollButton = !overflowOnRight;
|
|
19244
19326
|
}
|
|
19327
|
+
if (isOverflowHorizontal) {
|
|
19328
|
+
overflowingTabCount = this.countOverflowingElements(container);
|
|
19329
|
+
}
|
|
19245
19330
|
this.setState({
|
|
19246
19331
|
showScrollButtons,
|
|
19247
19332
|
disableLeftScrollButton,
|
|
19248
|
-
disableRightScrollButton
|
|
19333
|
+
disableRightScrollButton,
|
|
19334
|
+
overflowingTabCount
|
|
19249
19335
|
});
|
|
19250
19336
|
}, 100);
|
|
19251
19337
|
};
|
|
@@ -19293,7 +19379,8 @@
|
|
|
19293
19379
|
shownKeys: this.props.defaultActiveKey !== undefined ? [this.props.defaultActiveKey] : [this.props.activeKey],
|
|
19294
19380
|
uncontrolledActiveKey: this.props.defaultActiveKey,
|
|
19295
19381
|
uncontrolledIsExpandedLocal: this.props.defaultIsExpanded,
|
|
19296
|
-
ouiaStateId: getDefaultOUIAId(Tabs.displayName)
|
|
19382
|
+
ouiaStateId: getDefaultOUIAId(Tabs.displayName),
|
|
19383
|
+
overflowingTabCount: 0
|
|
19297
19384
|
};
|
|
19298
19385
|
if (this.props.isVertical && this.props.expandable !== undefined) {
|
|
19299
19386
|
if (!this.props.toggleAriaLabel && !this.props.toggleText) {
|
|
@@ -19349,8 +19436,8 @@
|
|
|
19349
19436
|
clearTimeout(this.scrollTimeout);
|
|
19350
19437
|
}
|
|
19351
19438
|
componentDidUpdate(prevProps) {
|
|
19352
|
-
const { activeKey, mountOnEnter, children } = this.props;
|
|
19353
|
-
const { shownKeys } = this.state;
|
|
19439
|
+
const { activeKey, mountOnEnter, isOverflowHorizontal, children } = this.props;
|
|
19440
|
+
const { shownKeys, overflowingTabCount } = this.state;
|
|
19354
19441
|
if (prevProps.activeKey !== activeKey && mountOnEnter && shownKeys.indexOf(activeKey) < 0) {
|
|
19355
19442
|
this.setState({
|
|
19356
19443
|
shownKeys: shownKeys.concat(activeKey)
|
|
@@ -19361,13 +19448,20 @@
|
|
|
19361
19448
|
React__namespace.Children.toArray(prevProps.children).length !== React__namespace.Children.toArray(children).length) {
|
|
19362
19449
|
this.handleScrollButtons();
|
|
19363
19450
|
}
|
|
19451
|
+
const currentOverflowingTabCount = this.countOverflowingElements(this.tabList.current);
|
|
19452
|
+
if (isOverflowHorizontal && currentOverflowingTabCount) {
|
|
19453
|
+
this.setState({ overflowingTabCount: currentOverflowingTabCount + overflowingTabCount });
|
|
19454
|
+
}
|
|
19364
19455
|
}
|
|
19365
19456
|
render() {
|
|
19366
|
-
const _a = this.props, { className, children, activeKey, defaultActiveKey, id, isFilled, isSecondary, isVertical, isBox, hasBorderBottom, hasSecondaryBorderBottom, leftScrollAriaLabel, rightScrollAriaLabel, 'aria-label': ariaLabel, component, ouiaId, ouiaSafe, mountOnEnter, unmountOnExit, usePageInsets, inset, variant, expandable, isExpanded, defaultIsExpanded, toggleText, toggleAriaLabel, addButtonAriaLabel, onToggle, onClose, onAdd } = _a, props = __rest$1(_a, ["className", "children", "activeKey", "defaultActiveKey", "id", "isFilled", "isSecondary", "isVertical", "isBox", "hasBorderBottom", "hasSecondaryBorderBottom", "leftScrollAriaLabel", "rightScrollAriaLabel", 'aria-label', "component", "ouiaId", "ouiaSafe", "mountOnEnter", "unmountOnExit", "usePageInsets", "inset", "variant", "expandable", "isExpanded", "defaultIsExpanded", "toggleText", "toggleAriaLabel", "addButtonAriaLabel", "onToggle", "onClose", "onAdd"]);
|
|
19367
|
-
const { showScrollButtons, disableLeftScrollButton, disableRightScrollButton, shownKeys, uncontrolledActiveKey, uncontrolledIsExpandedLocal } = this.state;
|
|
19457
|
+
const _a = this.props, { className, children, activeKey, defaultActiveKey, id, isFilled, isSecondary, isVertical, isBox, hasBorderBottom, hasSecondaryBorderBottom, leftScrollAriaLabel, rightScrollAriaLabel, 'aria-label': ariaLabel, component, ouiaId, ouiaSafe, mountOnEnter, unmountOnExit, usePageInsets, inset, variant, expandable, isExpanded, defaultIsExpanded, toggleText, toggleAriaLabel, addButtonAriaLabel, onToggle, onClose, onAdd, isOverflowHorizontal: isOverflowHorizontal } = _a, props = __rest$1(_a, ["className", "children", "activeKey", "defaultActiveKey", "id", "isFilled", "isSecondary", "isVertical", "isBox", "hasBorderBottom", "hasSecondaryBorderBottom", "leftScrollAriaLabel", "rightScrollAriaLabel", 'aria-label', "component", "ouiaId", "ouiaSafe", "mountOnEnter", "unmountOnExit", "usePageInsets", "inset", "variant", "expandable", "isExpanded", "defaultIsExpanded", "toggleText", "toggleAriaLabel", "addButtonAriaLabel", "onToggle", "onClose", "onAdd", "isOverflowHorizontal"]);
|
|
19458
|
+
const { showScrollButtons, disableLeftScrollButton, disableRightScrollButton, shownKeys, uncontrolledActiveKey, uncontrolledIsExpandedLocal, overflowingTabCount } = this.state;
|
|
19368
19459
|
const filteredChildren = React__namespace.Children.toArray(children)
|
|
19369
19460
|
.filter(Boolean)
|
|
19370
19461
|
.filter(child => !child.props.isHidden);
|
|
19462
|
+
const filteredChildrenWithoutOverflow = filteredChildren.slice(0, filteredChildren.length - overflowingTabCount);
|
|
19463
|
+
const filteredChildrenOverflowing = filteredChildren.slice(filteredChildren.length - overflowingTabCount);
|
|
19464
|
+
const overflowingTabProps = filteredChildrenOverflowing.map((child) => child.props);
|
|
19371
19465
|
const uniqueId = id || getUniqueId();
|
|
19372
19466
|
const Component = component === exports.TabsComponent.nav ? 'nav' : 'div';
|
|
19373
19467
|
const localActiveKey = defaultActiveKey !== undefined ? uncontrolledActiveKey : activeKey;
|
|
@@ -19381,6 +19475,8 @@
|
|
|
19381
19475
|
onToggle(newValue);
|
|
19382
19476
|
}
|
|
19383
19477
|
};
|
|
19478
|
+
const hasOverflowTab = isOverflowHorizontal && overflowingTabCount > 0;
|
|
19479
|
+
const overflowObjectProps = typeof isOverflowHorizontal === 'object' ? Object.assign({}, isOverflowHorizontal) : {};
|
|
19384
19480
|
return (React__namespace.createElement(TabsContextProvider, { value: {
|
|
19385
19481
|
variant,
|
|
19386
19482
|
mountOnEnter,
|
|
@@ -19390,18 +19486,20 @@
|
|
|
19390
19486
|
handleTabClick: (...args) => this.handleTabClick(...args),
|
|
19391
19487
|
handleTabClose: onClose
|
|
19392
19488
|
} },
|
|
19393
|
-
React__namespace.createElement(Component, Object.assign({ "aria-label": ariaLabel, className: css(styles$f.tabs, isFilled && styles$f.modifiers.fill, isSecondary && styles$f.modifiers.secondary, isVertical && styles$f.modifiers.vertical, isVertical && expandable && formatBreakpointMods(expandable, styles$f), isVertical && expandable && isExpandedLocal && styles$f.modifiers.expanded, isBox && styles$f.modifiers.box, showScrollButtons && !isVertical && styles$f.modifiers.scrollable, usePageInsets && styles$f.modifiers.pageInsets, !hasBorderBottom && styles$f.modifiers.noBorderBottom, hasSecondaryBorderBottom && styles$f.modifiers.borderBottom, formatBreakpointMods(inset, styles$f), variantStyle[variant], className) }, getOUIAProps(Tabs.displayName, ouiaId !== undefined ? ouiaId : this.state.ouiaStateId, ouiaSafe), { id: id && id }, props),
|
|
19489
|
+
React__namespace.createElement(Component, Object.assign({ "aria-label": ariaLabel, className: css(styles$f.tabs, isFilled && styles$f.modifiers.fill, isSecondary && styles$f.modifiers.secondary, isVertical && styles$f.modifiers.vertical, isVertical && expandable && formatBreakpointMods(expandable, styles$f), isVertical && expandable && isExpandedLocal && styles$f.modifiers.expanded, isBox && styles$f.modifiers.box, showScrollButtons && !isVertical && styles$f.modifiers.scrollable, usePageInsets && styles$f.modifiers.pageInsets, !hasBorderBottom && styles$f.modifiers.noBorderBottom, hasSecondaryBorderBottom && styles$f.modifiers.borderBottom, formatBreakpointMods(inset, styles$f), variantStyle[variant], hasOverflowTab && styles$f.modifiers.overflow, className) }, getOUIAProps(Tabs.displayName, ouiaId !== undefined ? ouiaId : this.state.ouiaStateId, ouiaSafe), { id: id && id }, props),
|
|
19394
19490
|
expandable && isVertical && (React__namespace.createElement(GenerateId, null, randomId => (React__namespace.createElement("div", { className: css(styles$f.tabsToggle) },
|
|
19395
19491
|
React__namespace.createElement("div", { className: css(styles$f.tabsToggleButton) },
|
|
19396
19492
|
React__namespace.createElement(Button, { onClick: () => toggleTabs(!isExpandedLocal), variant: "plain", "aria-label": toggleAriaLabel, "aria-expanded": isExpandedLocal, id: `${randomId}-button`, "aria-labelledby": `${randomId}-text ${randomId}-button` },
|
|
19397
19493
|
React__namespace.createElement("span", { className: css(styles$f.tabsToggleIcon) },
|
|
19398
19494
|
React__namespace.createElement(AngleRightIcon$1, { "arian-hidden": "true" })),
|
|
19399
19495
|
toggleText && (React__namespace.createElement("span", { className: css('pf-c-tabs__toggle-text'), id: `${randomId}-text` }, toggleText)))))))),
|
|
19400
|
-
React__namespace.createElement("button", { className: css(styles$f.tabsScrollButton, isSecondary && buttonStyles.modifiers.secondary), "aria-label": leftScrollAriaLabel, onClick: this.scrollLeft, disabled: disableLeftScrollButton, "aria-hidden": disableLeftScrollButton },
|
|
19401
|
-
React__namespace.createElement(AngleLeftIcon$1, null)),
|
|
19402
|
-
React__namespace.createElement("ul", { className: css(styles$f.tabsList), ref: this.tabList, onScroll: this.handleScrollButtons, role: "tablist" },
|
|
19403
|
-
|
|
19404
|
-
React__namespace.createElement(
|
|
19496
|
+
!isOverflowHorizontal && (React__namespace.createElement("button", { className: css(styles$f.tabsScrollButton, isSecondary && buttonStyles.modifiers.secondary), "aria-label": leftScrollAriaLabel, onClick: this.scrollLeft, disabled: disableLeftScrollButton, "aria-hidden": disableLeftScrollButton },
|
|
19497
|
+
React__namespace.createElement(AngleLeftIcon$1, null))),
|
|
19498
|
+
React__namespace.createElement("ul", { className: css(styles$f.tabsList), ref: this.tabList, onScroll: this.handleScrollButtons, role: "tablist" },
|
|
19499
|
+
isOverflowHorizontal ? filteredChildrenWithoutOverflow : filteredChildren,
|
|
19500
|
+
hasOverflowTab && React__namespace.createElement(OverflowTab, Object.assign({ overflowingTabs: overflowingTabProps }, overflowObjectProps))),
|
|
19501
|
+
!isOverflowHorizontal && (React__namespace.createElement("button", { className: css(styles$f.tabsScrollButton, isSecondary && buttonStyles.modifiers.secondary), "aria-label": rightScrollAriaLabel, onClick: this.scrollRight, disabled: disableRightScrollButton, "aria-hidden": disableRightScrollButton },
|
|
19502
|
+
React__namespace.createElement(AngleRightIcon$1, null))),
|
|
19405
19503
|
onAdd !== undefined && (React__namespace.createElement("span", { className: css(styles$f.tabsAdd) },
|
|
19406
19504
|
React__namespace.createElement(Button, { variant: "plain", "aria-label": addButtonAriaLabel || 'Add tab', onClick: onAdd },
|
|
19407
19505
|
React__namespace.createElement(PlusIcon$1, null))))),
|
|
@@ -19438,12 +19536,6 @@
|
|
|
19438
19536
|
};
|
|
19439
19537
|
TabContentBody.displayName = 'TabContentBody';
|
|
19440
19538
|
|
|
19441
|
-
const TabTitleText = (_a) => {
|
|
19442
|
-
var { children, className = '' } = _a, props = __rest$1(_a, ["children", "className"]);
|
|
19443
|
-
return (React__namespace.createElement("span", Object.assign({ className: css(styles$f.tabsItemText, className) }, props), children));
|
|
19444
|
-
};
|
|
19445
|
-
TabTitleText.displayName = 'TabTitleText';
|
|
19446
|
-
|
|
19447
19539
|
const TabTitleIcon = (_a) => {
|
|
19448
19540
|
var { children, className = '' } = _a, props = __rest$1(_a, ["children", "className"]);
|
|
19449
19541
|
return (React__namespace.createElement("span", Object.assign({ className: css(styles$f.tabsItemIcon, className) }, props), children));
|
|
@@ -20594,7 +20686,7 @@
|
|
|
20594
20686
|
|
|
20595
20687
|
const TreeViewListItemBase = ({ name, title, id, isExpanded, defaultExpanded = false, children = null, onSelect, onCheck, hasCheck = false, checkProps = {
|
|
20596
20688
|
checked: false
|
|
20597
|
-
}, hasBadge = false, customBadgeContent, badgeProps = { isRead: true }, isCompact, activeItems = [], itemData, parentItem, icon, expandedIcon, action, compareItems,
|
|
20689
|
+
}, hasBadge = false, customBadgeContent, badgeProps = { isRead: true }, isSelectable = false, isCompact, activeItems = [], itemData, parentItem, icon, expandedIcon, action, compareItems,
|
|
20598
20690
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
20599
20691
|
useMemo }) => {
|
|
20600
20692
|
const [internalIsExpanded, setIsExpanded] = React.useState(defaultExpanded);
|
|
@@ -20606,13 +20698,22 @@
|
|
|
20606
20698
|
setIsExpanded(internalIsExpanded || defaultExpanded);
|
|
20607
20699
|
}
|
|
20608
20700
|
}, [isExpanded, defaultExpanded]);
|
|
20609
|
-
|
|
20610
|
-
|
|
20611
|
-
|
|
20612
|
-
|
|
20701
|
+
let Component = 'button';
|
|
20702
|
+
if (hasCheck) {
|
|
20703
|
+
Component = 'label';
|
|
20704
|
+
}
|
|
20705
|
+
else if (isSelectable) {
|
|
20706
|
+
Component = 'div';
|
|
20707
|
+
}
|
|
20708
|
+
const ToggleComponent = hasCheck || isSelectable ? 'button' : 'span';
|
|
20709
|
+
const renderToggle = (randomId) => (React__default["default"].createElement(ToggleComponent, Object.assign({ className: css(styles$9.treeViewNodeToggle), onClick: (evt) => {
|
|
20710
|
+
if (isSelectable || hasCheck) {
|
|
20613
20711
|
setIsExpanded(!internalIsExpanded);
|
|
20614
20712
|
}
|
|
20615
|
-
|
|
20713
|
+
if (isSelectable) {
|
|
20714
|
+
evt.stopPropagation();
|
|
20715
|
+
}
|
|
20716
|
+
} }, ((hasCheck || isSelectable) && { 'aria-labelledby': `label-${randomId}` }), { tabIndex: -1 }),
|
|
20616
20717
|
React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeToggleIcon) },
|
|
20617
20718
|
React__default["default"].createElement(AngleRightIcon$1, { "aria-hidden": "true" }))));
|
|
20618
20719
|
const renderCheck = (randomId) => (React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeCheck) },
|
|
@@ -20620,11 +20721,11 @@
|
|
|
20620
20721
|
const iconRendered = (React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeIcon) },
|
|
20621
20722
|
!internalIsExpanded && icon,
|
|
20622
20723
|
internalIsExpanded && (expandedIcon || icon)));
|
|
20623
|
-
const renderNodeContent = (
|
|
20724
|
+
const renderNodeContent = () => {
|
|
20624
20725
|
const content = (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
20625
20726
|
isCompact && title && React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeTitle) }, title),
|
|
20626
|
-
hasCheck ? (React__default["default"].createElement("
|
|
20627
|
-
return isCompact ? React__default["default"].createElement("
|
|
20727
|
+
hasCheck ? (React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeText) }, name)) : (React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeText) }, name))));
|
|
20728
|
+
return isCompact ? React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeContent) }, content) : content;
|
|
20628
20729
|
};
|
|
20629
20730
|
const badgeRendered = (React__default["default"].createElement(React__default["default"].Fragment, null,
|
|
20630
20731
|
hasBadge && children && (React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeCount) },
|
|
@@ -20633,7 +20734,7 @@
|
|
|
20633
20734
|
React__default["default"].createElement(Badge, Object.assign({}, badgeProps), customBadgeContent)))));
|
|
20634
20735
|
return (React__default["default"].createElement("li", Object.assign({ id: id, className: css(styles$9.treeViewListItem, internalIsExpanded && styles$9.modifiers.expanded) }, (internalIsExpanded && { 'aria-expanded': 'true' }), { role: "treeitem", tabIndex: -1 }),
|
|
20635
20736
|
React__default["default"].createElement("div", { className: css(styles$9.treeViewContent) },
|
|
20636
|
-
React__default["default"].createElement(GenerateId, { prefix:
|
|
20737
|
+
React__default["default"].createElement(GenerateId, { prefix: isSelectable ? 'selectable-id' : 'checkbox-id' }, randomId => (React__default["default"].createElement(Component, Object.assign({ className: css(styles$9.treeViewNode, children && (isSelectable || hasCheck) && styles$9.modifiers.selectable, (!children || isSelectable) &&
|
|
20637
20738
|
activeItems &&
|
|
20638
20739
|
activeItems.length > 0 &&
|
|
20639
20740
|
activeItems.some(item => compareItems && item && compareItems(item, itemData))
|
|
@@ -20641,16 +20742,16 @@
|
|
|
20641
20742
|
: ''), onClick: (evt) => {
|
|
20642
20743
|
if (!hasCheck) {
|
|
20643
20744
|
onSelect && onSelect(evt, itemData, parentItem);
|
|
20644
|
-
if (children && evt.isDefaultPrevented() !== true) {
|
|
20745
|
+
if (!isSelectable && children && evt.isDefaultPrevented() !== true) {
|
|
20645
20746
|
setIsExpanded(!internalIsExpanded);
|
|
20646
20747
|
}
|
|
20647
20748
|
}
|
|
20648
|
-
}, tabIndex: -1 },
|
|
20649
|
-
React__default["default"].createElement("
|
|
20749
|
+
}, tabIndex: isSelectable ? 0 : -1 }, (hasCheck && { htmlFor: randomId }), ((hasCheck || (isSelectable && children)) && { id: `label-${randomId}` })),
|
|
20750
|
+
React__default["default"].createElement("span", { className: css(styles$9.treeViewNodeContainer) },
|
|
20650
20751
|
children && renderToggle(randomId),
|
|
20651
20752
|
hasCheck && renderCheck(randomId),
|
|
20652
20753
|
icon && iconRendered,
|
|
20653
|
-
renderNodeContent(
|
|
20754
|
+
renderNodeContent(),
|
|
20654
20755
|
badgeRendered)))),
|
|
20655
20756
|
action && React__default["default"].createElement("div", { className: css(styles$9.treeViewAction) }, action)),
|
|
20656
20757
|
internalIsExpanded && children));
|
|
@@ -20821,11 +20922,11 @@
|
|
|
20821
20922
|
}
|
|
20822
20923
|
|
|
20823
20924
|
const TreeView = (_a) => {
|
|
20824
|
-
var { data, isNested = false, hasChecks = false, hasBadges = false, hasGuides = false, variant = 'default', defaultAllExpanded = false, allExpanded, icon, expandedIcon, parentItem, onSelect, onCheck, toolbar, activeItems, compareItems = (item, itemToCheck) => item.id === itemToCheck.id, className, useMemo } = _a, props = __rest$1(_a, ["data", "isNested", "hasChecks", "hasBadges", "hasGuides", "variant", "defaultAllExpanded", "allExpanded", "icon", "expandedIcon", "parentItem", "onSelect", "onCheck", "toolbar", "activeItems", "compareItems", "className", "useMemo"]);
|
|
20925
|
+
var { data, isNested = false, hasChecks = false, hasBadges = false, hasGuides = false, hasSelectableNodes = false, variant = 'default', defaultAllExpanded = false, allExpanded, icon, expandedIcon, parentItem, onSelect, onCheck, toolbar, activeItems, compareItems = (item, itemToCheck) => item.id === itemToCheck.id, className, useMemo } = _a, props = __rest$1(_a, ["data", "isNested", "hasChecks", "hasBadges", "hasGuides", "hasSelectableNodes", "variant", "defaultAllExpanded", "allExpanded", "icon", "expandedIcon", "parentItem", "onSelect", "onCheck", "toolbar", "activeItems", "compareItems", "className", "useMemo"]);
|
|
20825
20926
|
const treeViewList = (React__namespace.createElement(TreeViewList, { isNested: isNested, toolbar: toolbar }, data.map(item => {
|
|
20826
20927
|
var _a;
|
|
20827
|
-
return (React__namespace.createElement(TreeViewListItem, Object.assign({ key: ((_a = item.id) === null || _a === void 0 ? void 0 : _a.toString()) || item.name.toString(), name: item.name, title: item.title, id: item.id, isExpanded: allExpanded, defaultExpanded: item.defaultExpanded !== undefined ? item.defaultExpanded : defaultAllExpanded, onSelect: onSelect, onCheck: onCheck, hasCheck: item.hasCheck !== undefined ? item.hasCheck : hasChecks, checkProps: item.checkProps, hasBadge: item.hasBadge !== undefined ? item.hasBadge : hasBadges, customBadgeContent: item.customBadgeContent, badgeProps: item.badgeProps, activeItems: activeItems, parentItem: parentItem, itemData: item, icon: item.icon !== undefined ? item.icon : icon, expandedIcon: item.expandedIcon !== undefined ? item.expandedIcon : expandedIcon, action: item.action, compareItems: compareItems, isCompact: variant === 'compact' || variant === 'compactNoBackground', useMemo: useMemo }, (item.children && {
|
|
20828
|
-
children: (React__namespace.createElement(TreeView, { data: item.children, isNested: true, parentItem: item, hasChecks: hasChecks, hasBadges: hasBadges, hasGuides: hasGuides, variant: variant, allExpanded: allExpanded, defaultAllExpanded: defaultAllExpanded, onSelect: onSelect, onCheck: onCheck, activeItems: activeItems, icon: icon, expandedIcon: expandedIcon }))
|
|
20928
|
+
return (React__namespace.createElement(TreeViewListItem, Object.assign({ key: ((_a = item.id) === null || _a === void 0 ? void 0 : _a.toString()) || item.name.toString(), name: item.name, title: item.title, id: item.id, isExpanded: allExpanded, isSelectable: hasSelectableNodes, defaultExpanded: item.defaultExpanded !== undefined ? item.defaultExpanded : defaultAllExpanded, onSelect: onSelect, onCheck: onCheck, hasCheck: item.hasCheck !== undefined ? item.hasCheck : hasChecks, checkProps: item.checkProps, hasBadge: item.hasBadge !== undefined ? item.hasBadge : hasBadges, customBadgeContent: item.customBadgeContent, badgeProps: item.badgeProps, activeItems: activeItems, parentItem: parentItem, itemData: item, icon: item.icon !== undefined ? item.icon : icon, expandedIcon: item.expandedIcon !== undefined ? item.expandedIcon : expandedIcon, action: item.action, compareItems: compareItems, isCompact: variant === 'compact' || variant === 'compactNoBackground', useMemo: useMemo }, (item.children && {
|
|
20929
|
+
children: (React__namespace.createElement(TreeView, { data: item.children, isNested: true, parentItem: item, hasChecks: hasChecks, hasBadges: hasBadges, hasGuides: hasGuides, hasSelectableNodes: hasSelectableNodes, variant: variant, allExpanded: allExpanded, defaultAllExpanded: defaultAllExpanded, onSelect: onSelect, onCheck: onCheck, activeItems: activeItems, icon: icon, expandedIcon: expandedIcon }))
|
|
20829
20930
|
}))));
|
|
20830
20931
|
})));
|
|
20831
20932
|
return (React__namespace.createElement(React__namespace.Fragment, null, parentItem ? (treeViewList) : (React__namespace.createElement(TreeViewRoot, Object.assign({ hasChecks: hasChecks, hasGuides: hasGuides, variant: variant, className: className }, props), treeViewList))));
|