Skip to content

Commit f0fd7ce

Browse files
author
Eric Olkowski
committed
Added onOpenChange to test demos
1 parent 53465fb commit f0fd7ce

File tree

5 files changed

+22
-2
lines changed

5 files changed

+22
-2
lines changed

packages/react-integration/demo-app-ts/src/components/demos/DualListSelectorDemo/DualListSelectorWithActionsDemo.tsx

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -137,10 +137,11 @@ export class DualListSelectorWithActionsDemo extends React.Component<DualListSel
137137
<Dropdown
138138
key="availableDropdown"
139139
isOpen={this.state.isAvailableKebabOpen}
140+
onOpenChange={(isOpen) => this.setState({ isAvailableKebabOpen: isOpen })}
140141
toggle={(toggleRef) => (
141142
<MenuToggle
142143
variant="plain"
143-
id="toggle-id-6"
144+
id="available-dropdown-toggle"
144145
ref={toggleRef}
145146
isExpanded={this.state.isAvailableKebabOpen}
146147
onClick={() => this.onToggle('available')}
@@ -164,11 +165,12 @@ export class DualListSelectorWithActionsDemo extends React.Component<DualListSel
164165
</Button>,
165166
<Dropdown
166167
isOpen={this.state.isChosenKebabOpen}
168+
onOpenChange={(isOpen) => this.setState({ isChosenKebabOpen: isOpen })}
167169
key="chosenDropdown"
168170
toggle={(toggleRef) => (
169171
<MenuToggle
170172
variant="plain"
171-
id="toggle-id-6"
173+
id="chosen-dropdown-toggle"
172174
ref={toggleRef}
173175
isExpanded={this.state.isChosenKebabOpen}
174176
onClick={() => this.onToggle('chosen')}

packages/react-integration/demo-app-ts/src/components/demos/NotificationDrawerDemo/NotificationDrawerBasicDemo.tsx

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -64,6 +64,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
6464
<Dropdown
6565
onSelect={this.onSelect}
6666
isOpen={isOpen[0]}
67+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
6768
id="notification-0"
6869
popperProps={{ position: 'right' }}
6970
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
@@ -94,6 +95,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
9495
<Dropdown
9596
onSelect={this.onSelect}
9697
isOpen={isOpen[1]}
98+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
9799
id="notification-1"
98100
popperProps={{ position: 'right' }}
99101
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
@@ -124,6 +126,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
124126
<Dropdown
125127
onSelect={this.onSelect}
126128
isOpen={isOpen[2]}
129+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
127130
id="notification-2"
128131
popperProps={{ position: 'right' }}
129132
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
@@ -155,6 +158,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
155158
<Dropdown
156159
onSelect={this.onSelect}
157160
isOpen={isOpen[3]}
161+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
158162
id="notification-3"
159163
popperProps={{ position: 'right' }}
160164
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
@@ -188,6 +192,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
188192
<Dropdown
189193
onSelect={this.onSelect}
190194
isOpen={isOpen[4]}
195+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
191196
id="notification-4"
192197
popperProps={{ position: 'right' }}
193198
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
@@ -214,6 +219,7 @@ export class BasicNotificationDrawerDemo extends React.Component<
214219
<Dropdown
215220
onSelect={this.onSelect}
216221
isOpen={isOpen[5]}
222+
onOpenChange={(_isOpen) => this.setState({ isOpen: new Array(6).fill(false) })}
217223
id="notification-5"
218224
popperProps={{ position: 'right' }}
219225
toggle={(toggleRef: React.Ref<MenuToggleElement>) => (

packages/react-integration/demo-app-ts/src/components/demos/NotificationDrawerDemo/NotificationDrawerGroupsDemo.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
101101
<Dropdown
102102
onSelect={this.onSelect}
103103
isOpen={isOpenMap['toggle-id-0'] || false}
104+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
104105
id="notification-0"
105106
popperProps={{ position: 'right' }}
106107
toggle={(toggleRef) => (
@@ -138,6 +139,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
138139
<Dropdown
139140
onSelect={this.onSelect}
140141
isOpen={isOpenMap['toggle-id-5'] || false}
142+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
141143
id="notification-5"
142144
popperProps={{ position: 'right' }}
143145
toggle={(toggleRef) => (
@@ -168,6 +170,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
168170
<Dropdown
169171
onSelect={this.onSelect}
170172
isOpen={isOpenMap['toggle-id-6'] || false}
173+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
171174
id="notification-6"
172175
popperProps={{ position: 'right' }}
173176
toggle={(toggleRef) => (
@@ -199,6 +202,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
199202
<Dropdown
200203
onSelect={this.onSelect}
201204
isOpen={isOpenMap['toggle-id-7'] || false}
205+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
202206
id="notification-7"
203207
popperProps={{ position: 'right' }}
204208
toggle={(toggleRef) => (
@@ -229,6 +233,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
229233
<Dropdown
230234
onSelect={this.onSelect}
231235
isOpen={isOpenMap['toggle-id-8'] || false}
236+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
232237
id="notification-8"
233238
popperProps={{ position: 'right' }}
234239
toggle={(toggleRef) => (
@@ -271,6 +276,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
271276
<Dropdown
272277
onSelect={this.onSelect}
273278
isOpen={isOpenMap['toggle-id-9'] || false}
279+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
274280
id="notification-9"
275281
popperProps={{ position: 'right' }}
276282
toggle={(toggleRef) => (
@@ -301,6 +307,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
301307
<Dropdown
302308
onSelect={this.onSelect}
303309
isOpen={isOpenMap['toggle-id-10'] || false}
310+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
304311
id="notification-10"
305312
popperProps={{ position: 'right' }}
306313
toggle={(toggleRef) => (
@@ -332,6 +339,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
332339
<Dropdown
333340
onSelect={this.onSelect}
334341
isOpen={isOpenMap['toggle-id-11'] || false}
342+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
335343
id="notification-11"
336344
popperProps={{ position: 'right' }}
337345
toggle={(toggleRef) => (
@@ -362,6 +370,7 @@ export class GroupsNotificationDrawerDemo extends React.Component<
362370
<Dropdown
363371
onSelect={this.onSelect}
364372
isOpen={isOpenMap['toggle-id-12'] || false}
373+
onOpenChange={(_isOpen) => this.setState({ isOpenMap: {} })}
365374
id="notification-12"
366375
popperProps={{ position: 'right' }}
367376
toggle={(toggleRef) => (

packages/react-integration/demo-app-ts/src/components/demos/PageDemo/PageDemo.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -125,6 +125,7 @@ export class PageDemo extends React.Component {
125125
<Dropdown
126126
onSelect={this.onKebabDropdownSelect}
127127
isOpen={isKebabDropdownOpen}
128+
onOpenChange={(isOpen) => this.setState({ isKebabDropdownOpen: isOpen })}
128129
popperProps={{ position: 'right' }}
129130
toggle={(toggleRef) => (
130131
<MenuToggle
@@ -153,6 +154,7 @@ export class PageDemo extends React.Component {
153154
<Dropdown
154155
onSelect={this.onDropdownSelect}
155156
isOpen={isDropdownOpen}
157+
onOpenChange={(isOpen) => this.setState({ isDropdownOpen: isOpen })}
156158
popperProps={{ position: 'right' }}
157159
toggle={(toggleRef) => (
158160
<MenuToggle ref={toggleRef} onClick={this.onDropdownToggle} isExpanded={isDropdownOpen}>

packages/react-integration/demo-app-ts/src/components/demos/ToolbarDemo/ToolbarDemo.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -281,6 +281,7 @@ export class ToolbarDemo extends React.Component<ToolbarProps, ToolbarState> {
281281
<ToolbarItem>
282282
<Dropdown
283283
isOpen={kebabIsOpen}
284+
onOpenChange={(isOpen) => this.setState({ kebabIsOpen: isOpen })}
284285
toggle={(toggleRef) => (
285286
<MenuToggle variant="plain" ref={toggleRef} onClick={this.onKebabToggle} isExpanded={kebabIsOpen}>
286287
<EllipsisVIcon />

0 commit comments

Comments
 (0)