@patternfly/react-core 6.4.1-prerelease.2 → 6.4.1-prerelease.3
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 +4 -0
- package/components/package.json +1 -1
- package/deprecated/package.json +1 -1
- package/dist/dynamic/components/AboutModal/package.json +1 -1
- package/dist/dynamic/components/Accordion/package.json +1 -1
- package/dist/dynamic/components/ActionList/package.json +1 -1
- package/dist/dynamic/components/Alert/package.json +1 -1
- package/dist/dynamic/components/Avatar/package.json +1 -1
- package/dist/dynamic/components/BackToTop/package.json +1 -1
- package/dist/dynamic/components/Backdrop/package.json +1 -1
- package/dist/dynamic/components/BackgroundImage/package.json +1 -1
- package/dist/dynamic/components/Badge/package.json +1 -1
- package/dist/dynamic/components/Banner/package.json +1 -1
- package/dist/dynamic/components/Brand/package.json +1 -1
- package/dist/dynamic/components/Breadcrumb/package.json +1 -1
- package/dist/dynamic/components/Button/package.json +1 -1
- package/dist/dynamic/components/CalendarMonth/package.json +1 -1
- package/dist/dynamic/components/Card/package.json +1 -1
- package/dist/dynamic/components/Checkbox/package.json +1 -1
- package/dist/dynamic/components/ClipboardCopy/package.json +1 -1
- package/dist/dynamic/components/CodeBlock/package.json +1 -1
- package/dist/dynamic/components/Content/package.json +1 -1
- package/dist/dynamic/components/DataList/package.json +1 -1
- package/dist/dynamic/components/DatePicker/package.json +1 -1
- package/dist/dynamic/components/DescriptionList/package.json +1 -1
- package/dist/dynamic/components/Divider/package.json +1 -1
- package/dist/dynamic/components/Drawer/package.json +1 -1
- package/dist/dynamic/components/Dropdown/package.json +1 -1
- package/dist/dynamic/components/DualListSelector/package.json +1 -1
- package/dist/dynamic/components/EmptyState/package.json +1 -1
- package/dist/dynamic/components/ExpandableSection/package.json +1 -1
- package/dist/dynamic/components/FileUpload/package.json +1 -1
- package/dist/dynamic/components/Form/package.json +1 -1
- package/dist/dynamic/components/FormSelect/package.json +1 -1
- package/dist/dynamic/components/HelperText/package.json +1 -1
- package/dist/dynamic/components/Hint/package.json +1 -1
- package/dist/dynamic/components/Icon/package.json +1 -1
- package/dist/dynamic/components/InputGroup/package.json +1 -1
- package/dist/dynamic/components/JumpLinks/package.json +1 -1
- package/dist/dynamic/components/Label/package.json +1 -1
- package/dist/dynamic/components/List/package.json +1 -1
- package/dist/dynamic/components/LoginPage/package.json +1 -1
- package/dist/dynamic/components/Masthead/package.json +1 -1
- package/dist/dynamic/components/Menu/package.json +1 -1
- package/dist/dynamic/components/MenuToggle/package.json +1 -1
- package/dist/dynamic/components/Modal/package.json +1 -1
- package/dist/dynamic/components/MultipleFileUpload/package.json +1 -1
- package/dist/dynamic/components/Nav/package.json +1 -1
- package/dist/dynamic/components/NotificationBadge/package.json +1 -1
- package/dist/dynamic/components/NotificationDrawer/package.json +1 -1
- package/dist/dynamic/components/NumberInput/package.json +1 -1
- package/dist/dynamic/components/OverflowMenu/package.json +1 -1
- package/dist/dynamic/components/Page/package.json +1 -1
- package/dist/dynamic/components/Pagination/package.json +1 -1
- package/dist/dynamic/components/Panel/package.json +1 -1
- package/dist/dynamic/components/Popover/package.json +1 -1
- package/dist/dynamic/components/Progress/package.json +1 -1
- package/dist/dynamic/components/ProgressStepper/package.json +1 -1
- package/dist/dynamic/components/Radio/package.json +1 -1
- package/dist/dynamic/components/SearchInput/package.json +1 -1
- package/dist/dynamic/components/Select/package.json +1 -1
- package/dist/dynamic/components/Sidebar/package.json +1 -1
- package/dist/dynamic/components/SimpleList/package.json +1 -1
- package/dist/dynamic/components/Skeleton/package.json +1 -1
- package/dist/dynamic/components/SkipToContent/package.json +1 -1
- package/dist/dynamic/components/Slider/package.json +1 -1
- package/dist/dynamic/components/Spinner/package.json +1 -1
- package/dist/dynamic/components/Switch/package.json +1 -1
- package/dist/dynamic/components/Tabs/package.json +1 -1
- package/dist/dynamic/components/TextArea/package.json +1 -1
- package/dist/dynamic/components/TextInput/package.json +1 -1
- package/dist/dynamic/components/TextInputGroup/package.json +1 -1
- package/dist/dynamic/components/TimePicker/package.json +1 -1
- package/dist/dynamic/components/Timestamp/package.json +1 -1
- package/dist/dynamic/components/Title/package.json +1 -1
- package/dist/dynamic/components/ToggleGroup/package.json +1 -1
- package/dist/dynamic/components/Toolbar/package.json +1 -1
- package/dist/dynamic/components/Tooltip/package.json +1 -1
- package/dist/dynamic/components/TreeView/package.json +1 -1
- package/dist/dynamic/components/Truncate/package.json +1 -1
- package/dist/dynamic/components/Wizard/hooks/package.json +1 -1
- package/dist/dynamic/components/Wizard/package.json +1 -1
- package/dist/dynamic/deprecated/components/Chip/package.json +1 -1
- package/dist/dynamic/deprecated/components/DragDrop/package.json +1 -1
- package/dist/dynamic/deprecated/components/DualListSelector/package.json +1 -1
- package/dist/dynamic/deprecated/components/Modal/package.json +1 -1
- package/dist/dynamic/deprecated/components/Tile/package.json +1 -1
- package/dist/dynamic/deprecated/components/Wizard/package.json +1 -1
- package/dist/dynamic/deprecated/components/package.json +1 -1
- package/dist/dynamic/helpers/AnimationsProvider/AnimationsProvider/package.json +1 -1
- package/dist/dynamic/helpers/AnimationsProvider/package.json +1 -1
- package/dist/dynamic/helpers/FocusTrap/FocusTrap/package.json +1 -1
- package/dist/dynamic/helpers/GenerateId/GenerateId/package.json +1 -1
- package/dist/dynamic/helpers/KeyboardHandler/package.json +1 -1
- package/dist/dynamic/helpers/OUIA/ouia/package.json +1 -1
- package/dist/dynamic/helpers/Popper/Popper/package.json +1 -1
- package/dist/dynamic/helpers/constants/package.json +1 -1
- package/dist/dynamic/helpers/datetimeUtils/package.json +1 -1
- package/dist/dynamic/helpers/fileUtils/package.json +1 -1
- package/dist/dynamic/helpers/htmlConstants/package.json +1 -1
- package/dist/dynamic/helpers/package.json +1 -1
- package/dist/dynamic/helpers/resizeObserver/package.json +1 -1
- package/dist/dynamic/helpers/typeUtils/package.json +1 -1
- package/dist/dynamic/helpers/useInterval/package.json +1 -1
- package/dist/dynamic/helpers/useIsomorphicLayout/package.json +1 -1
- package/dist/dynamic/helpers/useUnmountEffect/package.json +1 -1
- package/dist/dynamic/helpers/util/package.json +1 -1
- package/dist/dynamic/layouts/Bullseye/package.json +1 -1
- package/dist/dynamic/layouts/Flex/package.json +1 -1
- package/dist/dynamic/layouts/Gallery/package.json +1 -1
- package/dist/dynamic/layouts/Grid/package.json +1 -1
- package/dist/dynamic/layouts/Level/package.json +1 -1
- package/dist/dynamic/layouts/Split/package.json +1 -1
- package/dist/dynamic/layouts/Stack/package.json +1 -1
- package/dist/dynamic/styles/package.json +1 -1
- package/dist/umd/assets/{output-LI8hocVw.css → output-DQl0_1__.css} +12873 -12873
- package/helpers/package.json +1 -1
- package/layouts/package.json +1 -1
- package/next/package.json +1 -1
- package/package.json +2 -2
- package/src/components/Panel/examples/Panel.md +10 -159
- package/src/components/Panel/examples/PanelBasic.tsx +9 -0
- package/src/components/Panel/examples/PanelBordered.tsx +9 -0
- package/src/components/Panel/examples/PanelFooterExample.tsx +10 -0
- package/src/components/Panel/examples/PanelHeaderExample.tsx +11 -0
- package/src/components/Panel/examples/PanelHeaderFooter.tsx +12 -0
- package/src/components/Panel/examples/PanelNoBody.tsx +7 -0
- package/src/components/Panel/examples/PanelRaised.tsx +9 -0
- package/src/components/Panel/examples/PanelScrollable.tsx +35 -0
- package/src/components/Panel/examples/PanelScrollableHeaderFooter.tsx +38 -0
- package/src/components/Panel/examples/PanelSecondaryVariant.tsx +9 -0
package/helpers/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.4.1-prerelease.
|
|
1
|
+
{"name":"@patternfly/react-core-helpers","main":"../dist/js/helpers/index.js","module":"../dist/esm/helpers/index.js","typings":"../dist/esm/helpers/index.d.ts","version":"6.4.1-prerelease.2","private":true}
|
package/layouts/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.4.1-prerelease.
|
|
1
|
+
{"name":"@patternfly/react-core-layouts","main":"../dist/js/layouts/index.js","module":"../dist/esm/layouts/index.js","typings":"../dist/esm/layouts/index.d.ts","version":"6.4.1-prerelease.2","private":true}
|
package/next/package.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.4.1-prerelease.
|
|
1
|
+
{"name":"@patternfly/react-core-next","main":"../dist/js/next/index.js","module":"../dist/esm/next/index.js","typings":"../dist/esm/next/index.d.ts","version":"6.4.1-prerelease.2","private":true}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@patternfly/react-core",
|
|
3
|
-
"version": "6.4.1-prerelease.
|
|
3
|
+
"version": "6.4.1-prerelease.3",
|
|
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",
|
|
@@ -63,5 +63,5 @@
|
|
|
63
63
|
"react": "^17 || ^18 || ^19",
|
|
64
64
|
"react-dom": "^17 || ^18 || ^19"
|
|
65
65
|
},
|
|
66
|
-
"gitHead": "
|
|
66
|
+
"gitHead": "523a71e53493ff0d1ac741eaa8172e21e679548c"
|
|
67
67
|
}
|
|
@@ -9,199 +9,50 @@ propComponents: [Panel, PanelMain, PanelMainBody, PanelHeader, PanelFooter]
|
|
|
9
9
|
|
|
10
10
|
### Basic
|
|
11
11
|
|
|
12
|
-
```
|
|
13
|
-
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
14
|
-
|
|
15
|
-
const BasicPanel = () => (
|
|
16
|
-
<Panel>
|
|
17
|
-
<PanelMain>
|
|
18
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
19
|
-
</PanelMain>
|
|
20
|
-
</Panel>
|
|
21
|
-
);
|
|
12
|
+
```ts file="PanelBasic.tsx"
|
|
22
13
|
```
|
|
23
14
|
|
|
24
15
|
### Header
|
|
25
16
|
|
|
26
|
-
```
|
|
27
|
-
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider } from '@patternfly/react-core';
|
|
28
|
-
|
|
29
|
-
const HeaderPanel = () => (
|
|
30
|
-
<Panel>
|
|
31
|
-
<PanelHeader>Header content</PanelHeader>
|
|
32
|
-
<Divider />
|
|
33
|
-
<PanelMain>
|
|
34
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
35
|
-
</PanelMain>
|
|
36
|
-
</Panel>
|
|
37
|
-
);
|
|
17
|
+
```ts file="PanelHeaderExample.tsx"
|
|
38
18
|
```
|
|
39
19
|
|
|
40
20
|
### Footer
|
|
41
21
|
|
|
42
|
-
```
|
|
43
|
-
import { Panel, PanelMain, PanelMainBody, PanelFooter } from '@patternfly/react-core';
|
|
44
|
-
|
|
45
|
-
const FooterPanel = () => (
|
|
46
|
-
<Panel>
|
|
47
|
-
<PanelMain>
|
|
48
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
49
|
-
</PanelMain>
|
|
50
|
-
<PanelFooter>Footer content</PanelFooter>
|
|
51
|
-
</Panel>
|
|
52
|
-
);
|
|
22
|
+
```ts file="PanelFooterExample.tsx"
|
|
53
23
|
```
|
|
54
24
|
|
|
55
25
|
### Header and footer
|
|
56
26
|
|
|
57
|
-
```
|
|
58
|
-
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
|
|
59
|
-
|
|
60
|
-
const HeaderFooterPanel = () => (
|
|
61
|
-
<Panel>
|
|
62
|
-
<PanelHeader>Header content</PanelHeader>
|
|
63
|
-
<Divider />
|
|
64
|
-
<PanelMain>
|
|
65
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
66
|
-
</PanelMain>
|
|
67
|
-
<PanelFooter>Footer content</PanelFooter>
|
|
68
|
-
</Panel>
|
|
69
|
-
);
|
|
27
|
+
```ts file="PanelHeaderFooter.tsx"
|
|
70
28
|
```
|
|
71
29
|
|
|
72
30
|
### No body
|
|
73
31
|
|
|
74
|
-
```
|
|
75
|
-
import { Panel, PanelMain } from '@patternfly/react-core';
|
|
76
|
-
|
|
77
|
-
const NoBodyPanel = () => (
|
|
78
|
-
<Panel>
|
|
79
|
-
<PanelMain>Main content</PanelMain>
|
|
80
|
-
</Panel>
|
|
81
|
-
);
|
|
32
|
+
```ts file="PanelNoBody.tsx"
|
|
82
33
|
```
|
|
83
34
|
|
|
84
35
|
### Raised
|
|
85
36
|
|
|
86
|
-
```
|
|
87
|
-
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
88
|
-
|
|
89
|
-
const RaisedPanel = () => (
|
|
90
|
-
<Panel variant="raised">
|
|
91
|
-
<PanelMain>
|
|
92
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
93
|
-
</PanelMain>
|
|
94
|
-
</Panel>
|
|
95
|
-
);
|
|
37
|
+
```ts file="PanelRaised.tsx"
|
|
96
38
|
```
|
|
97
39
|
|
|
98
40
|
### Bordered
|
|
99
41
|
|
|
100
|
-
```
|
|
101
|
-
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
102
|
-
|
|
103
|
-
const BorderedPanel = () => (
|
|
104
|
-
<Panel variant="bordered">
|
|
105
|
-
<PanelMain>
|
|
106
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
107
|
-
</PanelMain>
|
|
108
|
-
</Panel>
|
|
109
|
-
);
|
|
42
|
+
```ts file="PanelBordered.tsx"
|
|
110
43
|
```
|
|
111
44
|
|
|
112
45
|
### Secondary variant
|
|
113
46
|
|
|
114
|
-
```
|
|
115
|
-
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
116
|
-
|
|
117
|
-
const PanelSecondaryVariant = () => (
|
|
118
|
-
<Panel variant="secondary">
|
|
119
|
-
<PanelMain>
|
|
120
|
-
<PanelMainBody>Main content</PanelMainBody>
|
|
121
|
-
</PanelMain>
|
|
122
|
-
</Panel>
|
|
123
|
-
);
|
|
47
|
+
```ts file="PanelSecondaryVariant.tsx"
|
|
124
48
|
```
|
|
125
49
|
|
|
126
50
|
### Scrollable
|
|
127
51
|
|
|
128
|
-
```
|
|
129
|
-
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
130
|
-
|
|
131
|
-
const ScrollablePanel = () => (
|
|
132
|
-
<Panel isScrollable>
|
|
133
|
-
<PanelMain tabIndex={0}>
|
|
134
|
-
<PanelMainBody>
|
|
135
|
-
Main content
|
|
136
|
-
<br />
|
|
137
|
-
<br />
|
|
138
|
-
Main content
|
|
139
|
-
<br />
|
|
140
|
-
<br />
|
|
141
|
-
Main content
|
|
142
|
-
<br />
|
|
143
|
-
<br />
|
|
144
|
-
Main content
|
|
145
|
-
<br />
|
|
146
|
-
<br />
|
|
147
|
-
Main content
|
|
148
|
-
<br />
|
|
149
|
-
<br />
|
|
150
|
-
Main content
|
|
151
|
-
<br />
|
|
152
|
-
<br />
|
|
153
|
-
Main content
|
|
154
|
-
<br />
|
|
155
|
-
<br />
|
|
156
|
-
Main content
|
|
157
|
-
<br />
|
|
158
|
-
<br />
|
|
159
|
-
Main content
|
|
160
|
-
</PanelMainBody>
|
|
161
|
-
</PanelMain>
|
|
162
|
-
</Panel>
|
|
163
|
-
);
|
|
52
|
+
```ts file="PanelScrollable.tsx"
|
|
164
53
|
```
|
|
165
54
|
|
|
166
55
|
### Scrollable with header and footer
|
|
167
56
|
|
|
168
|
-
```
|
|
169
|
-
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
|
|
170
|
-
|
|
171
|
-
const ScrollableHeaderFooterPanel = () => (
|
|
172
|
-
<Panel isScrollable>
|
|
173
|
-
<PanelHeader>Header content</PanelHeader>
|
|
174
|
-
<Divider />
|
|
175
|
-
<PanelMain tabIndex={0}>
|
|
176
|
-
<PanelMainBody>
|
|
177
|
-
Main content
|
|
178
|
-
<br />
|
|
179
|
-
<br />
|
|
180
|
-
Main content
|
|
181
|
-
<br />
|
|
182
|
-
<br />
|
|
183
|
-
Main content
|
|
184
|
-
<br />
|
|
185
|
-
<br />
|
|
186
|
-
Main content
|
|
187
|
-
<br />
|
|
188
|
-
<br />
|
|
189
|
-
Main content
|
|
190
|
-
<br />
|
|
191
|
-
<br />
|
|
192
|
-
Main content
|
|
193
|
-
<br />
|
|
194
|
-
<br />
|
|
195
|
-
Main content
|
|
196
|
-
<br />
|
|
197
|
-
<br />
|
|
198
|
-
Main content
|
|
199
|
-
<br />
|
|
200
|
-
<br />
|
|
201
|
-
Main content
|
|
202
|
-
</PanelMainBody>
|
|
203
|
-
</PanelMain>
|
|
204
|
-
<PanelFooter>Footer content</PanelFooter>
|
|
205
|
-
</Panel>
|
|
206
|
-
);
|
|
57
|
+
```ts file="PanelScrollableHeaderFooter.tsx"
|
|
207
58
|
```
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody, PanelFooter } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelFooterExample: React.FunctionComponent = () => (
|
|
4
|
+
<Panel>
|
|
5
|
+
<PanelMain>
|
|
6
|
+
<PanelMainBody>Main content</PanelMainBody>
|
|
7
|
+
</PanelMain>
|
|
8
|
+
<PanelFooter>Footer content</PanelFooter>
|
|
9
|
+
</Panel>
|
|
10
|
+
);
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelHeaderExample: React.FunctionComponent = () => (
|
|
4
|
+
<Panel>
|
|
5
|
+
<PanelHeader>Header content</PanelHeader>
|
|
6
|
+
<Divider />
|
|
7
|
+
<PanelMain>
|
|
8
|
+
<PanelMainBody>Main content</PanelMainBody>
|
|
9
|
+
</PanelMain>
|
|
10
|
+
</Panel>
|
|
11
|
+
);
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelHeaderFooter: React.FunctionComponent = () => (
|
|
4
|
+
<Panel>
|
|
5
|
+
<PanelHeader>Header content</PanelHeader>
|
|
6
|
+
<Divider />
|
|
7
|
+
<PanelMain>
|
|
8
|
+
<PanelMainBody>Main content</PanelMainBody>
|
|
9
|
+
</PanelMain>
|
|
10
|
+
<PanelFooter>Footer content</PanelFooter>
|
|
11
|
+
</Panel>
|
|
12
|
+
);
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelScrollable: React.FunctionComponent = () => (
|
|
4
|
+
<Panel isScrollable>
|
|
5
|
+
<PanelMain tabIndex={0}>
|
|
6
|
+
<PanelMainBody>
|
|
7
|
+
Main content
|
|
8
|
+
<br />
|
|
9
|
+
<br />
|
|
10
|
+
Main content
|
|
11
|
+
<br />
|
|
12
|
+
<br />
|
|
13
|
+
Main content
|
|
14
|
+
<br />
|
|
15
|
+
<br />
|
|
16
|
+
Main content
|
|
17
|
+
<br />
|
|
18
|
+
<br />
|
|
19
|
+
Main content
|
|
20
|
+
<br />
|
|
21
|
+
<br />
|
|
22
|
+
Main content
|
|
23
|
+
<br />
|
|
24
|
+
<br />
|
|
25
|
+
Main content
|
|
26
|
+
<br />
|
|
27
|
+
<br />
|
|
28
|
+
Main content
|
|
29
|
+
<br />
|
|
30
|
+
<br />
|
|
31
|
+
Main content
|
|
32
|
+
</PanelMainBody>
|
|
33
|
+
</PanelMain>
|
|
34
|
+
</Panel>
|
|
35
|
+
);
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody, PanelHeader, Divider, PanelFooter } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelScrollableHeaderFooter: React.FunctionComponent = () => (
|
|
4
|
+
<Panel isScrollable>
|
|
5
|
+
<PanelHeader>Header content</PanelHeader>
|
|
6
|
+
<Divider />
|
|
7
|
+
<PanelMain tabIndex={0}>
|
|
8
|
+
<PanelMainBody>
|
|
9
|
+
Main content
|
|
10
|
+
<br />
|
|
11
|
+
<br />
|
|
12
|
+
Main content
|
|
13
|
+
<br />
|
|
14
|
+
<br />
|
|
15
|
+
Main content
|
|
16
|
+
<br />
|
|
17
|
+
<br />
|
|
18
|
+
Main content
|
|
19
|
+
<br />
|
|
20
|
+
<br />
|
|
21
|
+
Main content
|
|
22
|
+
<br />
|
|
23
|
+
<br />
|
|
24
|
+
Main content
|
|
25
|
+
<br />
|
|
26
|
+
<br />
|
|
27
|
+
Main content
|
|
28
|
+
<br />
|
|
29
|
+
<br />
|
|
30
|
+
Main content
|
|
31
|
+
<br />
|
|
32
|
+
<br />
|
|
33
|
+
Main content
|
|
34
|
+
</PanelMainBody>
|
|
35
|
+
</PanelMain>
|
|
36
|
+
<PanelFooter>Footer content</PanelFooter>
|
|
37
|
+
</Panel>
|
|
38
|
+
);
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { Panel, PanelMain, PanelMainBody } from '@patternfly/react-core';
|
|
2
|
+
|
|
3
|
+
export const PanelSecondaryVariant: React.FunctionComponent = () => (
|
|
4
|
+
<Panel variant="secondary">
|
|
5
|
+
<PanelMain>
|
|
6
|
+
<PanelMainBody>Main content</PanelMainBody>
|
|
7
|
+
</PanelMain>
|
|
8
|
+
</Panel>
|
|
9
|
+
);
|