[pull] main from adobe:main

.circleci/config.yml

@@ -68,15 +68,15 @@ commands:
               circleci-agent step halt
             fi
       - aws-s3/sync:
-          arguments: --cache-control public,max-age=300,stale-while-revalidate=300 --exclude * --include *.html --include *.txt --include *.json --include *.md --include *.xml
+          arguments: --cache-control public,max-age=31536000,immutable --include * --exclude *.html --exclude *.rsc --exclude *.txt --exclude *.json --exclude *.md --exclude *.xml
           from: /tmp/dist/s2-docs/<< parameters.dir >>
           to: << parameters.bucket >>
       - aws-s3/sync:
-          arguments: --cache-control public,max-age=300,stale-while-revalidate=300 --content-type text/x-component;charset=utf-8 --exclude * --include *.rsc
+          arguments: --cache-control public,max-age=300,stale-while-revalidate=300 --exclude * --include *.html --include *.txt --include *.json --include *.md --include *.xml
           from: /tmp/dist/s2-docs/<< parameters.dir >>
           to: << parameters.bucket >>
       - aws-s3/sync:
-          arguments: --cache-control public,max-age=31536000,immutable --include * --exclude *.html --exclude *.rsc --exclude *.txt --exclude *.json --exclude *.md --exclude *.xml
+          arguments: --cache-control public,max-age=300,stale-while-revalidate=300 --content-type text/x-component;charset=utf-8 --exclude * --include *.rsc
           from: /tmp/dist/s2-docs/<< parameters.dir >>
           to: << parameters.bucket >>
 

.yarn/patches/@parcel-packager-react-static-npm-2.16.1-138e4b8f05.patch

@@ -1,7 +1,18 @@
 diff --git a/lib/ReactStaticPackager.js b/lib/ReactStaticPackager.js
-index 551b6071819ea7c8c28106281793841d63791856..00ee58c81302cf433ad27a8a8ce2c2d1be5ce716 100644
+index 551b6071819ea7c8c28106281793841d63791856..1556a6abc7a38fc1959eec279810a14614c08772 100644
 --- a/lib/ReactStaticPackager.js
 +++ b/lib/ReactStaticPackager.js
+@@ -291,8 +291,9 @@ async function loadBundleUncached(bundle, bundleGraph, getInlineBundleContents)
+             packagingBundles.set(entryBundle, getInlineBundleContents(entryBundle, bundleGraph));
+           }
+           let packagedBundle = await (0, _nullthrows().default)(packagingBundles.get(entryBundle));
++          let inlineType = (0, _nullthrows().default)(entryBundle.getMainEntry()).meta.inlineType;
+           let contents = await (0, _utils().blobToString)(packagedBundle.contents);
+-          contents = `module.exports = ${contents}`;
++          contents = `module.exports = ${inlineType === 'string' ? JSON.stringify(contents) : contents}`;
+           return [[entryBundle.id, [entryBundle, (0, _nullthrows().default)(entryBundle.getMainEntry()), contents]]];
+         });
+       } else if ((entryBundle === null || entryBundle === void 0 ? void 0 : entryBundle.type) === 'js') {
 @@ -597,7 +597,7 @@ function runModule(code, filename, id, require, parcelRequire) {
    return module.exports;
  }

Makefile

@@ -157,13 +157,13 @@ s2-docs-stage:
 	DOCS_ENV=stage PUBLIC_URL=/ $(MAKE) build-s2-docs
 	cp packages/dev/docs/pages/disallow-robots.txt dist/s2-docs/react-aria/robots.txt
 	cp packages/dev/docs/pages/disallow-robots.txt dist/s2-docs/s2/robots.txt
-	$(MAKE) starters
+	$(MAKE) build-starters
 
 s2-docs-production:
 	DOCS_ENV=prod PUBLIC_URL=/ $(MAKE) build-s2-docs
 	cp packages/dev/docs/pages/robots.txt dist/s2-docs/react-aria/robots.txt
 	cp packages/dev/docs/pages/robots.txt dist/s2-docs/s2/robots.txt
-	$(MAKE) starters
+	$(MAKE) build-starters
 
 build-s2-docs:
 	yarn workspace @react-spectrum/s2-docs generate:md
@@ -184,7 +184,7 @@ build-s2-docs:
 	yarn parcel build 'packages/@react-spectrum/*/docs/*.mdx' 'packages/dev/docs/pages/{react-spectrum,releases}/**/*.mdx' --dist-dir dist/s2-docs/s2/$(PUBLIC_URL) --public-url $(PUBLIC_URL)
 	yarn parcel build 'packages/@react-{aria,stately}/*/docs/*.mdx'  --dist-dir dist/s2-docs/react-aria/$(PUBLIC_URL) --public-url $(PUBLIC_URL)
 
-starters:
+build-starters:
 	$(MAKE) starter-zip
 	$(MAKE) tailwind-starter
 	mv starters/docs/storybook-static dist/s2-docs/react-aria-starter

packages/@react-aria/gridlist/src/useGridListItem.ts

@@ -283,10 +283,10 @@ export function useGridListItem<T>(props: AriaGridListItemOptions, state: ListSt
     onKeyDown,
     onFocus,
     // 'aria-label': [(node.textValue || undefined), rowAnnouncement].filter(Boolean).join(', '),
-    'aria-label': node.textValue || undefined,
+    'aria-label': node['aria-label'] || node.textValue || undefined,
     'aria-selected': state.selectionManager.canSelectItem(node.key) ? state.selectionManager.isSelected(node.key) : undefined,
     'aria-disabled': state.selectionManager.isDisabled(node.key) || undefined,
-    'aria-labelledby': descriptionId && node.textValue ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,
+    'aria-labelledby': descriptionId && (node['aria-label'] || node.textValue) ? `${getRowId(state, node.key)} ${descriptionId}` : undefined,
     id: getRowId(state, node.key)
   });
 

packages/@react-aria/spinbutton/src/useSpinButton.ts

@@ -57,15 +57,17 @@ export function useSpinButton(
   } = props;
   const stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-aria/spinbutton');
 
-  let prevTouchPosition = useRef<{x: number, y: number} | null>(null);
   let isSpinning = useRef(false);
-  const clearAsync = () => {
+  const clearAsync = useCallback(() => {
     clearTimeout(_async.current);
     isSpinning.current = false;
-  };
+  }, []);
+  const clearAsyncEvent = useEffectEvent(() => {
+    clearAsync();
+  });
 
   useEffect(() => {
-    return () => clearAsync();
+    return () => clearAsyncEvent();
   }, []);
 
   let onKeyDown = (e) => {
@@ -140,21 +142,13 @@ export function useSpinButton(
   }, [ariaTextValue]);
 
   // For touch users, if they move their finger like they're scrolling, we don't want to trigger a spin.
-  let onTouchMove = useCallback((e) => {
-    if (!prevTouchPosition.current) {
-      prevTouchPosition.current = {x: e.touches[0].clientX, y: e.touches[0].clientY};
-    }
-    let touchPosition = {x: e.touches[0].clientX, y: e.touches[0].clientY};
-    // Arbitrary distance that worked in testing, even with slight movements or a slow-ish start to scrolling.
-    if (Math.abs(touchPosition.x - prevTouchPosition.current.x) > 1 || Math.abs(touchPosition.y - prevTouchPosition.current.y) > 1) {
-      clearAsync();
-    }
-    prevTouchPosition.current = touchPosition;
-  }, []);
+  let onPointerCancel = useCallback(() => {
+    clearAsync();
+  }, [clearAsync]);
 
   const onIncrementPressStart = useEffectEvent(
     (initialStepDelay: number) => {
-      clearAsync();
+      clearAsyncEvent();
       isSpinning.current = true;
       onIncrement?.();
       // Start spinning after initial delay
@@ -171,7 +165,7 @@ export function useSpinButton(
 
   const onDecrementPressStart = useEffectEvent(
     (initialStepDelay: number) => {
-      clearAsync();
+      clearAsyncEvent();
       isSpinning.current = true;
       onDecrement?.();
       // Start spinning after initial delay
@@ -239,7 +233,7 @@ export function useSpinButton(
             clearAsync();
           }
 
-          addGlobalListener(window, 'touchmove', onTouchMove, {capture: true});
+          addGlobalListener(window, 'pointercancel', onPointerCancel, {capture: true});
           isUp.current = false;
           // For touch users, don't trigger a decrement on press start, we'll wait for the press end to trigger it if
           // the control isn't spinning.
@@ -253,7 +247,6 @@ export function useSpinButton(
         if (e.pointerType === 'touch') {
           isUp.current = true;
         }
-        prevTouchPosition.current = null;
         clearAsync();
         removeAllGlobalListeners();
         setIsIncrementPressed(null);
@@ -263,6 +256,8 @@ export function useSpinButton(
           if (!isSpinning.current && isUp.current) {
             onIncrement?.();
           }
+        } else {
+          clearAsync();
         }
         isUp.current = false;
         setIsIncrementPressed(null);
@@ -279,7 +274,7 @@ export function useSpinButton(
             clearAsync();
           }
 
-          addGlobalListener(window, 'touchmove', onTouchMove, {capture: true});
+          addGlobalListener(window, 'pointercancel', onPointerCancel, {capture: true});
           isUp.current = false;
           // For touch users, don't trigger a decrement on press start, we'll wait for the press end to trigger it if
           // the control isn't spinning.
@@ -292,7 +287,6 @@ export function useSpinButton(
         if (e.pointerType === 'touch') {
           isUp.current = true;
         }
-        prevTouchPosition.current = null;
         clearAsync();
         removeAllGlobalListeners();
         setIsDecrementPressed(null);
@@ -302,6 +296,8 @@ export function useSpinButton(
           if (!isSpinning.current && isUp.current) {
             onDecrement?.();
           }
+        } else {
+          clearAsync();
         }
         isUp.current = false;
         setIsDecrementPressed(null);

packages/@react-spectrum/s2/chromatic/Breadcrumbs.stories.tsx

@@ -12,7 +12,7 @@
 
 import {Breadcrumb, Breadcrumbs} from '../src';
 import {generatePowerset} from '@react-spectrum/story-utils';
-import {Many} from '../stories/Breadcrumbs.stories';
+import {type IMany, Many} from '../stories/Breadcrumbs.stories';
 import type {Meta, StoryObj} from '@storybook/react';
 import {ReactNode} from 'react';
 import {shortName} from './utils';
@@ -27,7 +27,7 @@ const meta: Meta<typeof Breadcrumbs> = {
 
 export default meta;
 
-export const Dynamic: StoryObj<typeof Breadcrumbs> = {
+export const Dynamic: StoryObj<IMany> = {
   ...Many,
   parameters: {
     // TODO: move these options back to meta above once we get strings for ar-AE. This is just to prevent the RTL story's config from actually applying

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

@@ -140,7 +140,7 @@
     "postpack": "git checkout -- package.json"
   },
   "devDependencies": {
-    "@adobe/spectrum-tokens": "^13.15.1",
+    "@adobe/spectrum-tokens": "^14.0.0",
     "@react-aria/test-utils": "^1.0.0-alpha.8",
     "@storybook/jest": "^0.2.3",
     "@testing-library/dom": "^10.1.0",
@@ -164,6 +164,7 @@
     "@react-stately/utils": "^3.10.8",
     "@react-types/dialog": "^3.5.22",
     "@react-types/grid": "^3.3.6",
+    "@react-types/overlays": "^3.9.2",
     "@react-types/provider": "^3.8.13",
     "@react-types/shared": "^3.32.1",
     "@react-types/table": "^3.13.4",

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/3D.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import _3D_L from 'illustration:./S2_fill_3D_generic1_160.svg';
 import _3D_M from 'illustration:./S2_fill_3D_generic1_96.svg';
 import _3D_S from 'illustration:./S2_fill_3D_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/3Dasset.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import _3Dasset_L from 'illustration:./S2_fill_3Dasset_generic1_160.svg';
 import _3Dasset_M from 'illustration:./S2_fill_3Dasset_generic1_96.svg';
 import _3Dasset_S from 'illustration:./S2_fill_3Dasset_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/AIGenerate.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import AIGenerate_L from 'illustration:./S2_fill_AIGenerate_generic1_160.svg';
 import AIGenerate_M from 'illustration:./S2_fill_AIGenerate_generic1_96.svg';
 import AIGenerate_S from 'illustration:./S2_fill_AIGenerate_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/AIGenerateImage.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import AIGenerateImage_L from 'illustration:./S2_fill_AIGenerateImage_generic1_160.svg';
 import AIGenerateImage_M from 'illustration:./S2_fill_AIGenerateImage_generic1_96.svg';
 import AIGenerateImage_S from 'illustration:./S2_fill_AIGenerateImage_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/AIchat.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import AIchat_L from 'illustration:./S2_fill_AIchat_generic1_160.svg';
 import AIchat_M from 'illustration:./S2_fill_AIchat_generic1_96.svg';
 import AIchat_S from 'illustration:./S2_fill_AIchat_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Accessibility.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Accessibility_L from 'illustration:./S2_fill_accessibility_generic1_160.svg';
 import Accessibility_M from 'illustration:./S2_fill_accessibility_generic1_96.svg';
 import Accessibility_S from 'illustration:./S2_fill_accessibility_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Animation.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Animation_L from 'illustration:./S2_fill_animation_generic1_160.svg';
 import Animation_M from 'illustration:./S2_fill_animation_generic1_96.svg';
 import Animation_S from 'illustration:./S2_fill_animation_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Apps.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Apps_L from 'illustration:./S2_fill_apps_generic1_160.svg';
 import Apps_M from 'illustration:./S2_fill_apps_generic1_96.svg';
 import Apps_S from 'illustration:./S2_fill_apps_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Artboard.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Artboard_L from 'illustration:./S2_fill_artboard_generic1_160.svg';
 import Artboard_M from 'illustration:./S2_fill_artboard_generic1_96.svg';
 import Artboard_S from 'illustration:./S2_fill_artboard_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Assets.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Assets_L from 'illustration:./S2_fill_assets_generic1_160.svg';
 import Assets_M from 'illustration:./S2_fill_assets_generic1_96.svg';
 import Assets_S from 'illustration:./S2_fill_assets_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/AudioWave.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import AudioWave_L from 'illustration:./S2_fill_audioWave_generic1_160.svg';
 import AudioWave_M from 'illustration:./S2_fill_audioWave_generic1_96.svg';
 import AudioWave_S from 'illustration:./S2_fill_audioWave_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/BadgeVerified.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import BadgeVerified_L from 'illustration:./S2_fill_badgeVerified_generic1_160.svg';
 import BadgeVerified_M from 'illustration:./S2_fill_badgeVerified_generic1_96.svg';
 import BadgeVerified_S from 'illustration:./S2_fill_badgeVerified_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Bell.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Bell_L from 'illustration:./S2_fill_bell_generic1_160.svg';
 import Bell_M from 'illustration:./S2_fill_bell_generic1_96.svg';
 import Bell_S from 'illustration:./S2_fill_bell_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Bolt.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Bolt_L from 'illustration:./S2_fill_bolt_generic1_160.svg';
 import Bolt_M from 'illustration:./S2_fill_bolt_generic1_96.svg';
 import Bolt_S from 'illustration:./S2_fill_bolt_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Brand.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Brand_L from 'illustration:./S2_fill_brand_generic1_160.svg';
 import Brand_M from 'illustration:./S2_fill_brand_generic1_96.svg';
 import Brand_S from 'illustration:./S2_fill_brand_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/Briefcase.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import Briefcase_L from 'illustration:./S2_fill_briefcase_generic1_160.svg';
 import Briefcase_M from 'illustration:./S2_fill_briefcase_generic1_96.svg';
 import Briefcase_S from 'illustration:./S2_fill_briefcase_generic1_48.svg';

packages/@react-spectrum/s2/spectrum-illustrations/gradient/generic1/BrightnessContrast.tsx

@@ -9,7 +9,7 @@
  * OF ANY KIND, either express or implied. See the License for the specific language
  * governing permissions and limitations under the License.
  */
-
+'use client';
 import BrightnessContrast_L from 'illustration:./S2_fill_brightnessContrast_generic1_160.svg';
 import BrightnessContrast_M from 'illustration:./S2_fill_brightnessContrast_generic1_96.svg';
 import BrightnessContrast_S from 'illustration:./S2_fill_brightnessContrast_generic1_48.svg';