Skip to content

Commit e3bfb1c

Browse files
committed
Merge branch 'main' of github.com:adobe/react-spectrum into docs_fixes
2 parents 74ef767 + d422ece commit e3bfb1c

File tree

385 files changed

+4726
-3281
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

385 files changed

+4726
-3281
lines changed

.storybook-s2/docs/Intro.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -249,6 +249,7 @@ import {ActionButton} from '@react-spectrum/s2';
249249
<li><Code>insetY</Code></li>
250250
<li><Code>insetStart</Code></li>
251251
<li><Code>insetEnd</Code></li>
252+
<li><Code>visibility</Code></li>
252253
</ul>
253254
<H3>UNSAFE Style Overrides</H3>
254255
<P>We highly discourage overriding the styles of React Spectrum components because it may break at any time when we change our implementation, making it difficult for you to update in the future. Consider using <Link href="https://react-spectrum.adobe.com/react-aria/" target="_blank">React Aria Components</Link> with our <Link href="?path=/docs/style-macro--docs" target="_top">style macro</Link> to build a custom component with Spectrum styles instead.</P>

.storybook-s2/docs/Migrating.jsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -300,6 +300,7 @@ export function Migrating() {
300300
<li className={style({font: 'body', marginY: 8})}>Remove <Code>validationState="valid"</Code> (it is no longer supported in Spectrum 2)</li>
301301
<li className={style({font: 'body', marginY: 8})}>Update <Code>Item</Code> to be a <Code>PickerItem</Code></li>
302302
<li className={style({font: 'body', marginY: 8})}>Change <Code>isLoading</Code> to <Code>loadingState</Code> and provide the appropriate loading state.</li>
303+
<li className={style({font: 'body', marginY: 8})}><Code>defaultSelectedKey</Code> and <Code>selectedKey</Code> have been deprecated in favor of <Code>defaultValue</Code> and <Code>value</Code> respectively. See the <Link href="?path=/docs/picker--docs">props table</Link> for the new accepted types.</li>
303304
</ul>
304305

305306
<H3>ProgressBar</H3>

.storybook-s2/docs/Release Notes.mdx

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,28 @@ export default MDXLayout;
44

55
# Release Notes
66

7+
## v0.12.0
8+
9+
### Updates
10+
* [ActionButton](?path=/docs/actionbutton--docs): Add pending state
11+
* [ColorSlider](?path=/docs/colorslider--docs): Fix `ColorLoupe` position in RTL locales
12+
* [ComboBox](?path=/docs/combobox--docs): Support avatars and onAction
13+
* [CustomDialog](?path=/docs/customdialog--docs): Support custom widths
14+
* [Dialog](?path=/docs/dialog--docs): Add XL size
15+
* [Disclosure](?path=/docs/disclosure--docs): Add animation to disclosure
16+
* [InlineAlert](?path=/docs/inlinealert--docs): Support heading-less Inline Alerts
17+
* [Picker](?path=/docs/picker--docs): Support multiple selection and avatars
18+
* [Tags](?path=/docs/taggroup--docs): Fix Tag collapse calculation for removeable tags
19+
* [Tooltip](?path=/docs/tooltip--docs): Prevent text overflow by default
20+
* Allow placeholders in supported S2 components (e.g. ColorArea, ComboBox, NumberField, SearchField, TextArea, TextField)
21+
* Apply `page.css` styles to the Shadow DOM
22+
23+
### Popover Styling Updates
24+
25+
The Popover component has been updated to better support custom styling. To
26+
remove the preset padding, use the new `padding` prop and wrap your Popover content
27+
in a custom div with your desired styling.
28+
729
## v0.11.0
830

931
### New Components

examples/s2-next-macros/src/app/Lazy.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -109,7 +109,7 @@ export default function Lazy() {
109109
return (
110110
<>
111111
<Section title="Color">
112-
<ColorField label="Primary Color" />
112+
<ColorField placeholder="-" label="Primary Color" />
113113
<ColorSwatchPicker>
114114
<ColorSwatch color="#A00" />
115115
<ColorSwatch color="#f80" />
@@ -153,16 +153,16 @@ export default function Lazy() {
153153
<Checkbox value="baseball">Baseball</Checkbox>
154154
<Checkbox value="basketball">Basketball</Checkbox>
155155
</CheckboxGroup>
156-
<NumberField label="Width" defaultValue={1024} minValue={0} />
156+
<NumberField placeholder="Enter a width" label="Width" defaultValue={1024} minValue={0} />
157157
<RadioGroup label="Favorite pet">
158158
<Radio value="dogs">Dogs</Radio>
159159
<Radio value="cats">Cats</Radio>
160160
</RadioGroup>
161161
<SearchField label="Search" />
162162
<Switch>Low power mode</Switch>
163-
<TextArea label="Description" />
164-
<TextField label="Email" />
165-
<TextField label="Password" />
163+
<TextArea placeholder="Enter a description" label="Description" />
164+
<TextField placeholder="Enter a email" label="Email" />
165+
<TextField placeholder="Enter a password" label="Password" />
166166
<SelectBoxGroup aria-label="Choose a cloud">
167167
<SelectBox id="aws" textValue="Amazon Web Services">
168168
<Server />
@@ -359,7 +359,7 @@ export default function Lazy() {
359359
</Section>
360360

361361
<Section title="Pickers">
362-
<ComboBox label="Favorite Animal">
362+
<ComboBox placeholder="Select a value" label="Favorite Animal">
363363
<ComboBoxItem id="red panda">Red Panda</ComboBoxItem>
364364
<ComboBoxItem id="cat">Cat</ComboBoxItem>
365365
<ComboBoxItem id="dog">Dog</ComboBoxItem>

examples/s2-parcel-example/src/Lazy.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export default function Lazy() {
9595
return (
9696
<>
9797
<Section title="Color">
98-
<ColorField label="Primary Color" />
98+
<ColorField placeholder="-" label="Primary Color" />
9999
<ColorSwatchPicker>
100100
<ColorSwatch color="#A00" />
101101
<ColorSwatch color="#f80" />
@@ -139,16 +139,16 @@ export default function Lazy() {
139139
<Checkbox value="baseball">Baseball</Checkbox>
140140
<Checkbox value="basketball">Basketball</Checkbox>
141141
</CheckboxGroup>
142-
<NumberField label="Width" defaultValue={1024} minValue={0} />
142+
<NumberField placeholder="Enter a width" label="Width" defaultValue={1024} minValue={0} />
143143
<RadioGroup label="Favorite pet">
144144
<Radio value="dogs">Dogs</Radio>
145145
<Radio value="cats">Cats</Radio>
146146
</RadioGroup>
147147
<SearchField label="Search" />
148148
<Switch>Low power mode</Switch>
149-
<TextArea label="Description" />
150-
<TextField label="Email" />
151-
<TextField label="Password" />
149+
<TextArea placeholder="Enter a description" label="Description" />
150+
<TextField placeholder="Enter a email" label="Email" />
151+
<TextField placeholder="Enter a password" label="Password" />
152152
<SelectBoxGroup aria-label="Choose a cloud">
153153
<SelectBox id="aws" textValue="Amazon Web Services">
154154
<Server />
@@ -345,7 +345,7 @@ export default function Lazy() {
345345
</Section>
346346

347347
<Section title="Pickers">
348-
<ComboBox label="Favorite Animal">
348+
<ComboBox placeholder="Select a value" label="Favorite Animal">
349349
<ComboBoxItem id="red panda">Red Panda</ComboBoxItem>
350350
<ComboBoxItem id="cat">Cat</ComboBoxItem>
351351
<ComboBoxItem id="dog">Dog</ComboBoxItem>

examples/s2-webpack-5-example/src/Lazy.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ export default function Lazy() {
9595
return (
9696
<>
9797
<Section title="Color">
98-
<ColorField label="Primary Color" />
98+
<ColorField placeholder="-" label="Primary Color" />
9999
<ColorSwatchPicker>
100100
<ColorSwatch color="#A00" />
101101
<ColorSwatch color="#f80" />
@@ -139,16 +139,16 @@ export default function Lazy() {
139139
<Checkbox value="baseball">Baseball</Checkbox>
140140
<Checkbox value="basketball">Basketball</Checkbox>
141141
</CheckboxGroup>
142-
<NumberField label="Width" defaultValue={1024} minValue={0} />
142+
<NumberField placeholder="Enter a width" label="Width" defaultValue={1024} minValue={0} />
143143
<RadioGroup label="Favorite pet">
144144
<Radio value="dogs">Dogs</Radio>
145145
<Radio value="cats">Cats</Radio>
146146
</RadioGroup>
147147
<SearchField label="Search" />
148148
<Switch>Low power mode</Switch>
149-
<TextArea label="Description" />
150-
<TextField label="Email" />
151-
<TextField label="Password" />
149+
<TextArea placeholder="Enter a description" label="Description" />
150+
<TextField placeholder="Enter a email" label="Email" />
151+
<TextField placeholder="Enter a password" label="Password" />
152152
<SelectBoxGroup aria-label="Choose a cloud">
153153
<SelectBox id="aws" textValue="Amazon Web Services">
154154
<Server />
@@ -345,7 +345,7 @@ export default function Lazy() {
345345
</Section>
346346

347347
<Section title="Pickers">
348-
<ComboBox label="Favorite Animal">
348+
<ComboBox placeholder="Select a value" label="Favorite Animal">
349349
<ComboBoxItem id="red panda">Red Panda</ComboBoxItem>
350350
<ComboBoxItem id="cat">Cat</ComboBoxItem>
351351
<ComboBoxItem id="dog">Dog</ComboBoxItem>

package.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -67,8 +67,7 @@
6767
"packages/react-aria",
6868
"packages/react-aria-components",
6969
"packages/tailwindcss-react-aria-components",
70-
"packages/*/*",
71-
"packages/dev/mcp"
70+
"packages/*/*"
7271
],
7372
"devDependencies": {
7473
"@actions/core": "^1.1.0",

packages/@adobe/react-spectrum/package.json

Lines changed: 62 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@adobe/react-spectrum",
3-
"version": "3.44.2",
3+
"version": "3.45.0",
44
"description": "Spectrum UI components in React",
55
"license": "Apache-2.0",
66
"main": "dist/main.js",
@@ -41,68 +41,68 @@
4141
},
4242
"dependencies": {
4343
"@internationalized/string": "^3.2.7",
44-
"@react-aria/collections": "3.0.0-rc.7",
45-
"@react-aria/i18n": "^3.12.12",
44+
"@react-aria/collections": "^3.0.0",
45+
"@react-aria/i18n": "^3.12.13",
4646
"@react-aria/ssr": "^3.9.10",
47-
"@react-aria/utils": "^3.30.1",
48-
"@react-aria/visually-hidden": "^3.8.27",
49-
"@react-spectrum/accordion": "^3.0.12",
50-
"@react-spectrum/actionbar": "^3.6.13",
51-
"@react-spectrum/actiongroup": "^3.11.3",
52-
"@react-spectrum/avatar": "^3.0.25",
53-
"@react-spectrum/badge": "^3.1.29",
54-
"@react-spectrum/breadcrumbs": "^3.9.23",
55-
"@react-spectrum/button": "^3.17.3",
56-
"@react-spectrum/buttongroup": "^3.6.25",
57-
"@react-spectrum/calendar": "^3.7.7",
58-
"@react-spectrum/checkbox": "^3.10.3",
59-
"@react-spectrum/color": "^3.1.3",
60-
"@react-spectrum/combobox": "^3.16.3",
61-
"@react-spectrum/contextualhelp": "^3.6.27",
62-
"@react-spectrum/datepicker": "^3.14.7",
63-
"@react-spectrum/dialog": "^3.9.3",
64-
"@react-spectrum/divider": "^3.5.26",
65-
"@react-spectrum/dnd": "^3.6.1",
66-
"@react-spectrum/dropzone": "^3.0.17",
67-
"@react-spectrum/filetrigger": "^3.0.17",
68-
"@react-spectrum/form": "^3.7.18",
69-
"@react-spectrum/icon": "^3.8.8",
70-
"@react-spectrum/illustratedmessage": "^3.5.13",
71-
"@react-spectrum/image": "^3.6.1",
72-
"@react-spectrum/inlinealert": "^3.2.19",
73-
"@react-spectrum/labeledvalue": "^3.2.6",
74-
"@react-spectrum/layout": "^3.6.18",
75-
"@react-spectrum/link": "^3.6.21",
76-
"@react-spectrum/list": "^3.10.7",
77-
"@react-spectrum/listbox": "^3.15.7",
78-
"@react-spectrum/menu": "^3.22.7",
79-
"@react-spectrum/meter": "^3.5.13",
80-
"@react-spectrum/numberfield": "^3.10.1",
81-
"@react-spectrum/overlays": "^5.8.2",
82-
"@react-spectrum/picker": "^3.16.3",
83-
"@react-spectrum/progress": "^3.7.19",
84-
"@react-spectrum/provider": "^3.10.10",
85-
"@react-spectrum/radio": "^3.7.20",
86-
"@react-spectrum/searchfield": "^3.8.22",
87-
"@react-spectrum/slider": "^3.8.1",
88-
"@react-spectrum/statuslight": "^3.5.25",
89-
"@react-spectrum/switch": "^3.6.5",
90-
"@react-spectrum/table": "^3.17.7",
91-
"@react-spectrum/tabs": "^3.8.26",
92-
"@react-spectrum/tag": "^3.3.6",
93-
"@react-spectrum/text": "^3.5.21",
94-
"@react-spectrum/textfield": "^3.14.1",
95-
"@react-spectrum/theme-dark": "^3.5.21",
96-
"@react-spectrum/theme-default": "^3.5.21",
97-
"@react-spectrum/theme-light": "^3.4.21",
98-
"@react-spectrum/toast": "^3.1.3",
99-
"@react-spectrum/tooltip": "^3.7.10",
100-
"@react-spectrum/tree": "^3.1.7",
101-
"@react-spectrum/view": "^3.6.22",
102-
"@react-spectrum/well": "^3.4.26",
103-
"@react-stately/collections": "^3.12.7",
104-
"@react-stately/data": "^3.14.0",
105-
"@react-types/shared": "^3.32.0",
47+
"@react-aria/utils": "^3.31.0",
48+
"@react-aria/visually-hidden": "^3.8.28",
49+
"@react-spectrum/accordion": "^3.0.13",
50+
"@react-spectrum/actionbar": "^3.6.14",
51+
"@react-spectrum/actiongroup": "^3.11.4",
52+
"@react-spectrum/avatar": "^3.0.26",
53+
"@react-spectrum/badge": "^3.1.30",
54+
"@react-spectrum/breadcrumbs": "^3.9.24",
55+
"@react-spectrum/button": "^3.17.4",
56+
"@react-spectrum/buttongroup": "^3.6.26",
57+
"@react-spectrum/calendar": "^3.7.8",
58+
"@react-spectrum/checkbox": "^3.10.4",
59+
"@react-spectrum/color": "^3.1.4",
60+
"@react-spectrum/combobox": "^3.16.4",
61+
"@react-spectrum/contextualhelp": "^3.6.28",
62+
"@react-spectrum/datepicker": "^3.14.8",
63+
"@react-spectrum/dialog": "^3.9.4",
64+
"@react-spectrum/divider": "^3.5.27",
65+
"@react-spectrum/dnd": "^3.6.2",
66+
"@react-spectrum/dropzone": "^3.0.18",
67+
"@react-spectrum/filetrigger": "^3.0.18",
68+
"@react-spectrum/form": "^3.7.19",
69+
"@react-spectrum/icon": "^3.8.9",
70+
"@react-spectrum/illustratedmessage": "^3.5.14",
71+
"@react-spectrum/image": "^3.6.2",
72+
"@react-spectrum/inlinealert": "^3.2.20",
73+
"@react-spectrum/labeledvalue": "^3.2.7",
74+
"@react-spectrum/layout": "^3.6.19",
75+
"@react-spectrum/link": "^3.6.22",
76+
"@react-spectrum/list": "^3.10.8",
77+
"@react-spectrum/listbox": "^3.15.8",
78+
"@react-spectrum/menu": "^3.22.8",
79+
"@react-spectrum/meter": "^3.5.14",
80+
"@react-spectrum/numberfield": "^3.10.2",
81+
"@react-spectrum/overlays": "^5.9.0",
82+
"@react-spectrum/picker": "^3.16.4",
83+
"@react-spectrum/progress": "^3.7.20",
84+
"@react-spectrum/provider": "^3.10.11",
85+
"@react-spectrum/radio": "^3.7.21",
86+
"@react-spectrum/searchfield": "^3.8.23",
87+
"@react-spectrum/slider": "^3.8.2",
88+
"@react-spectrum/statuslight": "^3.5.26",
89+
"@react-spectrum/switch": "^3.6.6",
90+
"@react-spectrum/table": "^3.17.8",
91+
"@react-spectrum/tabs": "^3.8.27",
92+
"@react-spectrum/tag": "^3.3.7",
93+
"@react-spectrum/text": "^3.5.22",
94+
"@react-spectrum/textfield": "^3.14.2",
95+
"@react-spectrum/theme-dark": "^3.5.22",
96+
"@react-spectrum/theme-default": "^3.5.22",
97+
"@react-spectrum/theme-light": "^3.4.22",
98+
"@react-spectrum/toast": "^3.1.4",
99+
"@react-spectrum/tooltip": "^3.7.11",
100+
"@react-spectrum/tree": "^3.1.8",
101+
"@react-spectrum/view": "^3.6.23",
102+
"@react-spectrum/well": "^3.4.27",
103+
"@react-stately/collections": "^3.12.8",
104+
"@react-stately/data": "^3.14.1",
105+
"@react-types/shared": "^3.32.1",
106106
"client-only": "^0.0.1"
107107
},
108108
"publishConfig": {

packages/@adobe/spectrum-css-temp/components/tray/index.css

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,7 @@
5555
/* Add padding at the bottom to account for the rest of the viewport height behind the keyboard.
5656
* This is necessary so that there isn't a visible gap that appears while the keyboard is animating
5757
* in and out. Fall back to the safe area inset to account for things like iOS home indicator.
58-
We also add an additional 100vh of padding (offset by the bottom position below) so the tray
58+
We also add an additional 100vh of padding (offset by the bottom position below) so the tray
5959
extends behind Safari's address bar and keyboard in iOS 26. */
6060
padding-bottom: calc(max(calc(100dvh - var(--spectrum-visual-viewport-height)), env(safe-area-inset-bottom)) + 100vh);
6161
position: absolute;
@@ -75,6 +75,8 @@
7575
/* Exit animations */
7676
transition: opacity var(--spectrum-dialog-exit-animation-duration) cubic-bezier(0.5, 0, 1, 1) var(--spectrum-dialog-exit-animation-delay),
7777
transform var(--spectrum-dialog-exit-animation-duration) cubic-bezier(0.5, 0, 1, 1) var(--spectrum-dialog-exit-animation-delay);
78+
79+
box-sizing: content-box;
7880
}
7981

8082
.is-open {

packages/@internationalized/date/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@internationalized/date",
3-
"version": "3.9.0",
3+
"version": "3.10.0",
44
"description": "Internationalized calendar, date, and time manipulation utilities",
55
"license": "Apache-2.0",
66
"main": "dist/main.js",

0 commit comments

Comments
 (0)