Skip to content

Commit 0ab0544

Browse files
reidbarberLFDanLu
reidbarber
and
LFDanLu
authored
fix: Accordion release fixes (#7391)
* update DisclosureHeader to DisclosureTitle in v3 * update S2 Disclosure JSDoc * disable controlled S2 Accordion stories in docs * Update packages/@react-spectrum/accordion/docs/Accordion.mdx --------- Co-authored-by: Daniel Lu <[email protected]>
1 parent 0574faf commit 0ab0544

File tree

16 files changed

+96
-123
lines changed

16 files changed

+96
-123
lines changed

‎examples/rsp-cra-18/src/sections/NavigationExamples.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import {Accordion, Disclosure, DisclosureHeader, DisclosurePanel, Flex, Divider, Breadcrumbs, Item, Link, Tabs, TabList, TabPanels} from '@adobe/react-spectrum';
1+
import {Accordion, Disclosure, DisclosureTitle, DisclosurePanel, Flex, Divider, Breadcrumbs, Item, Link, Tabs, TabList, TabPanels} from '@adobe/react-spectrum';
22

33
export default function NavigationExamples() {
44
return (
@@ -35,25 +35,25 @@ export default function NavigationExamples() {
3535
<h3>Accordion</h3>
3636
<Accordion maxWidth="size-3600">
3737
<Disclosure id="files">
38-
<DisclosureHeader>
38+
<DisclosureTitle>
3939
Files
40-
</DisclosureHeader>
40+
</DisclosureTitle>
4141
<DisclosurePanel>
4242
<p>Files content</p>
4343
</DisclosurePanel>
4444
</Disclosure>
4545
<Disclosure id="people">
46-
<DisclosureHeader>
46+
<DisclosureTitle>
4747
People
48-
</DisclosureHeader>
48+
</DisclosureTitle>
4949
<DisclosurePanel>
5050
<p>People content</p>
5151
</DisclosurePanel>
5252
</Disclosure>
5353
</Accordion>
5454
<h3>Disclosure</h3>
5555
<Disclosure>
56-
<DisclosureHeader>System Requirements</DisclosureHeader>
56+
<DisclosureTitle>System Requirements</DisclosureTitle>
5757
<DisclosurePanel>
5858
<p>Details about system requirements here.</p>
5959
</DisclosurePanel>

‎examples/rsp-next-ts-17/pages/index.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ import {
8080
ColorSwatch,
8181
Accordion,
8282
Disclosure,
83-
DisclosureHeader,
83+
DisclosureTitle,
8484
DisclosurePanel
8585
} from "@adobe/react-spectrum";
8686
import Edit from "@spectrum-icons/workflow/Edit";
@@ -316,17 +316,17 @@ export default function Home() {
316316
<h3>Accordion</h3>
317317
<Accordion>
318318
<Disclosure id="files">
319-
<DisclosureHeader>
319+
<DisclosureTitle>
320320
Files
321-
</DisclosureHeader>
321+
</DisclosureTitle>
322322
<DisclosurePanel>
323323
<p>Files content</p>
324324
</DisclosurePanel>
325325
</Disclosure>
326326
<Disclosure id="people">
327-
<DisclosureHeader>
327+
<DisclosureTitle>
328328
People
329-
</DisclosureHeader>
329+
</DisclosureTitle>
330330
<DisclosurePanel>
331331
<p>People content</p>
332332
</DisclosurePanel>
@@ -335,7 +335,7 @@ export default function Home() {
335335

336336
<h3>Disclosure</h3>
337337
<Disclosure>
338-
<DisclosureHeader>System Requirements</DisclosureHeader>
338+
<DisclosureTitle>System Requirements</DisclosureTitle>
339339
<DisclosurePanel>
340340
<p>Details about system requirements here.</p>
341341
</DisclosurePanel>

‎examples/rsp-next-ts/pages/index.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -80,7 +80,7 @@ import {
8080
ColorSwatch,
8181
Accordion,
8282
Disclosure,
83-
DisclosureHeader,
83+
DisclosureTitle,
8484
DisclosurePanel
8585
} from "@adobe/react-spectrum";
8686
import Edit from "@spectrum-icons/workflow/Edit";
@@ -324,17 +324,17 @@ export default function Home() {
324324
<h3>Accordion</h3>
325325
<Accordion>
326326
<Disclosure id="files">
327-
<DisclosureHeader>
327+
<DisclosureTitle>
328328
Files
329-
</DisclosureHeader>
329+
</DisclosureTitle>
330330
<DisclosurePanel>
331331
<p>Files content</p>
332332
</DisclosurePanel>
333333
</Disclosure>
334334
<Disclosure id="people">
335-
<DisclosureHeader>
335+
<DisclosureTitle>
336336
People
337-
</DisclosureHeader>
337+
</DisclosureTitle>
338338
<DisclosurePanel>
339339
<p>People content</p>
340340
</DisclosurePanel>
@@ -343,7 +343,7 @@ export default function Home() {
343343

344344
<h3>Disclosure</h3>
345345
<Disclosure>
346-
<DisclosureHeader>System Requirements</DisclosureHeader>
346+
<DisclosureTitle>System Requirements</DisclosureTitle>
347347
<DisclosurePanel>
348348
<p>Details about system requirements here.</p>
349349
</DisclosurePanel>

‎packages/@adobe/react-spectrum/src/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import 'client-only';
1717
export {ActionGroup} from '@react-spectrum/actiongroup';
1818
export {Badge} from '@react-spectrum/badge';
1919
export {Breadcrumbs} from '@react-spectrum/breadcrumbs';
20-
export {Accordion, Disclosure, DisclosurePanel, DisclosureHeader} from '@react-spectrum/accordion';
20+
export {Accordion, Disclosure, DisclosurePanel, DisclosureTitle} from '@react-spectrum/accordion';
2121
export {ActionBar, ActionBarContainer} from '@react-spectrum/actionbar';
2222
export {ActionButton, Button, LogicButton, ToggleButton} from '@react-spectrum/button';
2323
export {Avatar} from '@react-spectrum/avatar';
@@ -123,4 +123,4 @@ export type {DateFormatter, DateFormatterOptions, Filter, FormatMessage, Locale,
123123
export type {SSRProviderProps} from '@react-aria/ssr';
124124
export type {DirectoryDropItem, DragAndDropHooks, DragAndDropOptions, DraggableCollectionEndEvent, DraggableCollectionMoveEvent, DraggableCollectionStartEvent, DragPreviewRenderer, DragTypes, DropItem, DropOperation, DroppableCollectionDropEvent, DroppableCollectionEnterEvent, DroppableCollectionExitEvent, DroppableCollectionInsertDropEvent, DroppableCollectionMoveEvent, DroppableCollectionOnItemDropEvent, DroppableCollectionReorderEvent, DroppableCollectionRootDropEvent, DropPosition, DropTarget, FileDropItem, ItemDropTarget, RootDropTarget, TextDropItem} from '@react-spectrum/dnd';
125125
export type {Key, Selection, ItemProps, SectionProps, RouterConfig} from '@react-types/shared';
126-
export type {SpectrumAccordionProps, SpectrumDisclosureProps, SpectrumDisclosurePanelProps, SpectrumDisclosureHeaderProps} from '@react-spectrum/accordion';
126+
export type {SpectrumAccordionProps, SpectrumDisclosureProps, SpectrumDisclosurePanelProps, SpectrumDisclosureTitleProps} from '@react-spectrum/accordion';

‎packages/@react-spectrum/accordion/chromatic/Accordion.stories.tsx

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
* governing permissions and limitations under the License.
1111
*/
1212

13-
import {Accordion, Disclosure, DisclosureHeader, DisclosurePanel} from '../';
13+
import {Accordion, Disclosure, DisclosurePanel, DisclosureTitle} from '../';
1414
import {Meta} from '@storybook/react';
1515
import React from 'react';
1616

@@ -25,25 +25,25 @@ export default meta;
2525
export const Template = (args) => (
2626
<Accordion {...args}>
2727
<Disclosure id="files">
28-
<DisclosureHeader>
28+
<DisclosureTitle>
2929
Your files
30-
</DisclosureHeader>
30+
</DisclosureTitle>
3131
<DisclosurePanel>
3232
files
3333
</DisclosurePanel>
3434
</Disclosure>
3535
<Disclosure id="shared">
36-
<DisclosureHeader>
36+
<DisclosureTitle>
3737
Shared with you
38-
</DisclosureHeader>
38+
</DisclosureTitle>
3939
<DisclosurePanel>
4040
shared
4141
</DisclosurePanel>
4242
</Disclosure>
4343
<Disclosure id="last">
44-
<DisclosureHeader>
44+
<DisclosureTitle>
4545
Last item
46-
</DisclosureHeader>
46+
</DisclosureTitle>
4747
<DisclosurePanel>
4848
last
4949
</DisclosurePanel>
@@ -64,25 +64,25 @@ export const WithDisabledDisclosure = {
6464
render: (args) => (
6565
<Accordion {...args}>
6666
<Disclosure id="files">
67-
<DisclosureHeader>
67+
<DisclosureTitle>
6868
Your files
69-
</DisclosureHeader>
69+
</DisclosureTitle>
7070
<DisclosurePanel>
7171
files
7272
</DisclosurePanel>
7373
</Disclosure>
7474
<Disclosure id="shared">
75-
<DisclosureHeader>
75+
<DisclosureTitle>
7676
Shared with you
77-
</DisclosureHeader>
77+
</DisclosureTitle>
7878
<DisclosurePanel>
7979
shared
8080
</DisclosurePanel>
8181
</Disclosure>
8282
<Disclosure id="last" isDisabled>
83-
<DisclosureHeader>
83+
<DisclosureTitle>
8484
Last item
85-
</DisclosureHeader>
85+
</DisclosureTitle>
8686
<DisclosurePanel>
8787
last
8888
</DisclosurePanel>

‎packages/@react-spectrum/accordion/chromatic/Disclosure.stories.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
* governing permissions and limitations under the License.
1111
*/
1212

13-
import {Disclosure, DisclosureHeader, DisclosurePanel} from '../';
13+
import {Disclosure, DisclosurePanel, DisclosureTitle} from '../';
1414
import {Meta} from '@storybook/react';
1515
import React from 'react';
1616

@@ -24,9 +24,9 @@ export default meta;
2424

2525
export const Template = (args) => (
2626
<Disclosure {...args}>
27-
<DisclosureHeader>
27+
<DisclosureTitle>
2828
Your files
29-
</DisclosureHeader>
29+
</DisclosureTitle>
3030
<DisclosurePanel>
3131
files
3232
</DisclosurePanel>

‎packages/@react-spectrum/accordion/docs/Accordion.mdx

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ keywords: [disclosure, accordion, collapse, expand]
2020
---
2121

2222
```jsx import
23-
import {Accordion, Disclosure, DisclosureHeader, DisclosurePanel} from '@react-spectrum/accordion';
23+
import {Accordion, Disclosure, DisclosureTitle, DisclosurePanel} from '@react-spectrum/accordion';
2424
```
2525

2626
# Accordion
@@ -29,20 +29,20 @@ import {Accordion, Disclosure, DisclosureHeader, DisclosurePanel} from '@react-s
2929

3030
<HeaderInfo
3131
packageData={packageData}
32-
componentNames={['Accordion', 'Disclosure', 'DisclosureHeader', 'DisclosurePanel']} />
32+
componentNames={['Accordion', 'Disclosure', 'DisclosureTitle', 'DisclosurePanel']} />
3333

3434
## Example
3535

3636
```tsx example
3737
<Accordion defaultExpandedKeys={['personal']}>
3838
<Disclosure id="personal">
39-
<DisclosureHeader>Personal Information</DisclosureHeader>
39+
<DisclosureTitle>Personal Information</DisclosureTitle>
4040
<DisclosurePanel>
4141
Personal information form here.
4242
</DisclosurePanel>
4343
</Disclosure>
4444
<Disclosure id="billing">
45-
<DisclosureHeader>Billing Address</DisclosureHeader>
45+
<DisclosureTitle>Billing Address</DisclosureTitle>
4646
<DisclosurePanel>
4747
Billing address form here.
4848
</DisclosurePanel>
@@ -72,13 +72,13 @@ function ControlledExpansion() {
7272
<>
7373
<Accordion expandedKeys={expandedKeys} onExpandedChange={setExpandedKeys}>
7474
<Disclosure id="personal">
75-
<DisclosureHeader>Personal Information</DisclosureHeader>
75+
<DisclosureTitle>Personal Information</DisclosureTitle>
7676
<DisclosurePanel>
7777
Personal information form here.
7878
</DisclosurePanel>
7979
</Disclosure>
8080
<Disclosure id="billing">
81-
<DisclosureHeader>Billing Address</DisclosureHeader>
81+
<DisclosureTitle>Billing Address</DisclosureTitle>
8282
<DisclosurePanel>
8383
Billing address form here.
8484
</DisclosurePanel>
@@ -97,13 +97,13 @@ By default, only one disclosure will be expanded at a time. To expand multiple d
9797
```tsx example
9898
<Accordion allowsMultipleExpanded defaultExpandedKeys={['personal', 'billing']}>
9999
<Disclosure id="personal">
100-
<DisclosureHeader>Personal Information</DisclosureHeader>
100+
<DisclosureTitle>Personal Information</DisclosureTitle>
101101
<DisclosurePanel>
102102
Personal information form here.
103103
</DisclosurePanel>
104104
</Disclosure>
105105
<Disclosure id="billing">
106-
<DisclosureHeader>Billing Address</DisclosureHeader>
106+
<DisclosureTitle>Billing Address</DisclosureTitle>
107107
<DisclosurePanel>
108108
Billing address form here.
109109
</DisclosurePanel>
@@ -120,9 +120,9 @@ By default, only one disclosure will be expanded at a time. To expand multiple d
120120

121121
<PropTable component={docs.exports.Disclosure} links={docs.links} />
122122

123-
### Disclosure Header
123+
### Disclosure Title
124124

125-
<PropTable component={docs.exports.DisclosureHeader} links={docs.links} />
125+
<PropTable component={docs.exports.DisclosureTitle} links={docs.links} />
126126

127127
### Disclosure Panel
128128

@@ -135,13 +135,13 @@ By default, only one disclosure will be expanded at a time. To expand multiple d
135135
```tsx example
136136
<Accordion isDisabled>
137137
<Disclosure id="personal">
138-
<DisclosureHeader>Personal Information</DisclosureHeader>
138+
<DisclosureTitle>Personal Information</DisclosureTitle>
139139
<DisclosurePanel>
140140
Personal information form here.
141141
</DisclosurePanel>
142142
</Disclosure>
143143
<Disclosure id="billing">
144-
<DisclosureHeader>Billing Address</DisclosureHeader>
144+
<DisclosureTitle>Billing Address</DisclosureTitle>
145145
<DisclosurePanel>
146146
Billing address form here.
147147
</DisclosurePanel>
@@ -154,13 +154,13 @@ By default, only one disclosure will be expanded at a time. To expand multiple d
154154
```tsx example
155155
<Accordion isQuiet>
156156
<Disclosure id="personal">
157-
<DisclosureHeader>Personal Information</DisclosureHeader>
157+
<DisclosureTitle>Personal Information</DisclosureTitle>
158158
<DisclosurePanel>
159159
Personal information form here.
160160
</DisclosurePanel>
161161
</Disclosure>
162162
<Disclosure id="billing">
163-
<DisclosureHeader>Billing Address</DisclosureHeader>
163+
<DisclosureTitle>Billing Address</DisclosureTitle>
164164
<DisclosurePanel>
165165
Billing address form here.
166166
</DisclosurePanel>

0 commit comments

Comments
 (0)