adobe · github-actions · Feb 5, 2025 · Feb 5, 2025
diff --git a/components/actionbar/package.json b/components/actionbar/package.json
@@ -35,7 +35,7 @@
 		"@spectrum-css/actiongroup": "6.0.1",
 		"@spectrum-css/closebutton": "6.0.1",
 		"@spectrum-css/fieldlabel": "10.0.1",
-		"@spectrum-css/popover": "8.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
 		"@spectrum-css/tokens": "16.0.0"
 	},
 	"keywords": [

diff --git a/components/actionmenu/package.json b/components/actionmenu/package.json
@@ -35,7 +35,7 @@
 		"@spectrum-css/actionbutton": "7.0.1",
 		"@spectrum-css/icon": "9.0.1",
 		"@spectrum-css/menu": "9.0.1",
-		"@spectrum-css/popover": "8.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
 		"@spectrum-css/tokens": "16.0.0"
 	},
 	"keywords": [

diff --git a/components/alertdialog/package.json b/components/alertdialog/package.json
@@ -44,7 +44,7 @@
 		"@spectrum-css/buttongroup": "9.0.1",
 		"@spectrum-css/divider": "5.0.1",
 		"@spectrum-css/icon": "9.0.1",
-		"@spectrum-css/modal": "7.0.1",
+		"@spectrum-css/modal": "7.1.0-next.0",
 		"@spectrum-css/tokens": "16.0.0",
 		"@spectrum-css/underlay": "6.0.1"
 	},

diff --git a/components/breadcrumb/CHANGELOG.md b/components/breadcrumb/CHANGELOG.md
@@ -1,5 +1,22 @@
 # Change Log
 
+## 12.0.0-next.0
+
+### Major Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`2bf6512`](https://github.com/adobe/spectrum-css/commit/2bf6512963bca64821c3d4a4869827c6e1254f65) Thanks [@pfulton](https://github.com/pfulton)! - #### Spectrum 2 Migration
+
+  The breadcrumbs component is now updated to use the S2 specs and tokens. This includes updated spacing, heights, colors, font sizes, etc.
+
+  There has been a major design change to the variant classes related to density and sizing, to align their terminology better with t-shirt sizes:
+
+  - The "compact" variant no longer exists. The `spectrum-Breadcrumbs--compact` class and associated custom properties are removed. The default (medium) breadcrumbs are now sized similar to what was previously called compact.
+  - There is a new "large" variant, which uses the `spectrum-Breadcrumbs--sizeL` class. This is sized similarly to what was previously the default.
+
+  In the multiline variant, the size of the title item can optionally be customized using an additional child heading element that applies one of the
+  typography component's `spectrum-Heading--size*` classes. The preferred sizes specified in the design spec are small, medium, large (default), and
+  extra-large. If an additional heading element is not used within the title item, the text will still be sized correctly to the default.
+
 ## 11.0.1
 
 ### Patch Changes
@@ -169,7 +186,8 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 \*feat!: postcss config build and script; remove gulp (#2466)([b0f337b](https://github.com/adobe/spectrum-css/commit/b0f337b)), closes[#2466](https://github.com/adobe/spectrum-css/issues/2466)
 
 ### 🛑 BREAKING CHANGES
- - Removes component-builder & component-builder-simple for script leveraging postcss
+
+- Removes component-builder & component-builder-simple for script leveraging postcss
 
 - Imports added to index.css and themes/express.css
 

diff --git a/components/breadcrumb/package.json b/components/breadcrumb/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/breadcrumb",
-	"version": "11.0.1",
+	"version": "12.0.0-next.0",
 	"description": "The Spectrum CSS breadcrumb component",
 	"license": "Apache-2.0",
 	"author": "Adobe",

diff --git a/components/button/package.json b/components/button/package.json
@@ -40,7 +40,7 @@
 	"devDependencies": {
 		"@spectrum-css/commons": "11.0.0",
 		"@spectrum-css/icon": "9.0.1",
-		"@spectrum-css/progresscircle": "5.0.1",
+		"@spectrum-css/progresscircle": "6.0.0-next.0",
 		"@spectrum-css/tokens": "16.0.0"
 	},
 	"keywords": [

diff --git a/components/coachmark/CHANGELOG.md b/components/coachmark/CHANGELOG.md
@@ -1,5 +1,19 @@
 # Change Log
 
+## 9.1.0-next.0
+
+### Minor Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`f158499`](https://github.com/adobe/spectrum-css/commit/f15849905f28815ebd70198ffaac7532fb37c253) Thanks [@pfulton](https://github.com/pfulton)! - CSS references to popover custom properties/tokens were updated to reflect some mod name changes in the S2 popover (#3365). The corner radius token was updated to correspond to the new S2 popover corner radius, as well as some updated popover mod names:
+
+  - `--mod-popover-content-area-spacing-vertical` was updated to `--mod-popover-content-area-spacing`.
+  - `--spectrum-border-width-100` was updated to `--spectrum-corner-radius-large-default`
+
+### Patch Changes
+
+- Updated dependencies [[`f158499`](https://github.com/adobe/spectrum-css/commit/f15849905f28815ebd70198ffaac7532fb37c253)]:
+  - @spectrum-css/popover@9.0.0-next.0
+
 ## 8.0.0-next.0
 
 ### Patch Changes

diff --git a/components/coachmark/package.json b/components/coachmark/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/coachmark",
-	"version": "9.0.1",
+	"version": "9.1.0-next.0",
 	"description": "The Spectrum CSS coachmark component",
 	"license": "Apache-2.0",
 	"author": "Adobe",
@@ -44,7 +44,7 @@
 		"@spectrum-css/button": "14.0.1",
 		"@spectrum-css/buttongroup": "9.0.1",
 		"@spectrum-css/menu": "9.0.1",
-		"@spectrum-css/popover": "8.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
 		"@spectrum-css/tokens": "16.0.0"
 	},
 	"keywords": [

diff --git a/components/colorslider/CHANGELOG.md b/components/colorslider/CHANGELOG.md
@@ -1,5 +1,17 @@
 # Change Log
 
+## 8.1.0-next.0
+
+### Minor Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`8381dd0`](https://github.com/adobe/spectrum-css/commit/8381dd01378a977341c1158877abe39f07d2e21b) Thanks [@pfulton](https://github.com/pfulton)! - # S2 colorslider migration
+
+  This migrates the `colorslider` component to S2. Custom properties have been remapped per the design spec.
+
+  | Before                    | After                      |
+  | ------------------------- | -------------------------- |
+  | `--spectrum-gray-900-rgb` | `--spectrum-gray-1000-rgb` |
+
 ## 7.0.0-next.0
 
 ### Patch Changes

diff --git a/components/colorslider/package.json b/components/colorslider/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/colorslider",
-	"version": "8.0.1",
+	"version": "8.1.0-next.0",
 	"description": "The Spectrum CSS Color slider component",
 	"license": "Apache-2.0",
 	"author": "Adobe",

diff --git a/components/combobox/package.json b/components/combobox/package.json
@@ -40,8 +40,8 @@
 	"devDependencies": {
 		"@spectrum-css/menu": "9.0.1",
 		"@spectrum-css/pickerbutton": "6.0.1",
-		"@spectrum-css/popover": "8.0.1",
-		"@spectrum-css/progresscircle": "5.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
+		"@spectrum-css/progresscircle": "6.0.0-next.0",
 		"@spectrum-css/textfield": "8.0.1",
 		"@spectrum-css/tokens": "16.0.0"
 	},

diff --git a/components/contextualhelp/package.json b/components/contextualhelp/package.json
@@ -38,7 +38,7 @@
 	"devDependencies": {
 		"@spectrum-css/actionbutton": "7.0.1",
 		"@spectrum-css/link": "7.0.1",
-		"@spectrum-css/popover": "8.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
 		"@spectrum-css/tokens": "16.0.0"
 	},
 	"keywords": [

diff --git a/components/datepicker/package.json b/components/datepicker/package.json
@@ -34,7 +34,7 @@
 	"devDependencies": {
 		"@spectrum-css/calendar": "7.0.1",
 		"@spectrum-css/pickerbutton": "6.0.1",
-		"@spectrum-css/popover": "8.0.1",
+		"@spectrum-css/popover": "9.0.0-next.0",
 		"@spectrum-css/textfield": "8.0.1",
 		"@spectrum-css/tokens": "16.0.0"
 	},

diff --git a/components/dialog/CHANGELOG.md b/components/dialog/CHANGELOG.md
@@ -1,5 +1,33 @@
 # Change Log
 
+## 13.0.0-next.0
+
+### Major Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`8a4ab84`](https://github.com/adobe/spectrum-css/commit/8a4ab8476f4e606b9c020b780baf29248e4f8f24) Thanks [@pfulton](https://github.com/pfulton)! - S2 Takeover dialog
+
+  This is the migration for the fullscreen/fullscreenTakeover dialog stories (these stories correspond to the "takeover dialog" in Figma). The Divider component support was removed in S2 standard dialog migration ([#2860](https://github.com/adobe/spectrum-css/pull/2860)). New and updated tokens are in place to update fullscreen/fullscreenTakeover dialog sizing, grid spacing, spacing in the header, and font sizes. Fullscreen/fullscreenTakeover dialogs do not support additional footer content or checkboxes (in comparison to the standard dialog).
+
+  Takeover dialogs also support replacing text in the header and body areas with other components. This required an additional `.spectrum-Dialog-headerContentWrapper` element that should center whatever component/content within.
+
+  Class names updated to match naming convention (remove hyphens and capitalize second word):
+  `.spectrum-Dialog-header-content` > `.spectrum-Dialog-headerContent`
+  `.spectrum-Dialog-footer-content` > `.spectrum-Dialog-footerContent`
+
+  _New Mods_
+  `--mod-takeover-dialog-grid-spacing`
+  `--mod-takeover-dialog-spacing-header-content-gap`
+  `--mod-takeover-dialog-title-font-size`
+
+  Modal updates
+
+  - Modal component now uses the updated margin token (`window-to-edge`) found in the takeover dialog design specs. This work also introduced `--spectrum-modal-takeover-window-to-edge`
+
+### Patch Changes
+
+- Updated dependencies [[`8a4ab84`](https://github.com/adobe/spectrum-css/commit/8a4ab8476f4e606b9c020b780baf29248e4f8f24)]:
+  - @spectrum-css/modal@7.1.0-next.0
+
 ## 11.0.0-next.1
 
 ### Patch Changes

diff --git a/components/dialog/package.json b/components/dialog/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/dialog",
-	"version": "12.0.1",
+	"version": "13.0.0-next.0",
 	"description": "The Spectrum CSS dialog component",
 	"license": "Apache-2.0",
 	"author": "Adobe",
@@ -48,7 +48,7 @@
 		"@spectrum-css/buttongroup": "9.0.1",
 		"@spectrum-css/closebutton": "6.0.1",
 		"@spectrum-css/divider": "5.0.1",
-		"@spectrum-css/modal": "7.0.1",
+		"@spectrum-css/modal": "7.1.0-next.0",
 		"@spectrum-css/tokens": "16.0.0",
 		"@spectrum-css/underlay": "6.0.1"
 	},

diff --git a/components/dropzone/CHANGELOG.md b/components/dropzone/CHANGELOG.md
@@ -1,5 +1,59 @@
 # Change Log
 
+## 9.0.0-next.0
+
+### Major Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`b50d038`](https://github.com/adobe/spectrum-css/commit/b50d0382f3ce554e89e89e57f86f25d2d84b332e) Thanks [@pfulton](https://github.com/pfulton)! - # S2 Illustrated Message Migration
+
+  This migration contains new tokens for t-shirt sizes (S, M, L), vertical and horizontal orientation along with their maximum width, illustration sizes, and content spacing. Dropzone `--mod` names are renamed to match the semantic tokens in illustrated message.
+
+  ## Illustrated Message
+
+  New properties
+  `--spectrum-illustrated-message-heading-to-description`
+  `--spectrum-illustrated-message-illustration-to-heading`
+  `--spectrum-illustrated-message-illustration-to-content`
+  `--spectrum-illustrated-message-description-to-action`
+  `--spectrum-illustrated-message-illustration-color`
+  `--spectrum-illustrated-message-illustration-size`
+  `--spectrum-illustrated-message-small-cjk-title-font-size`
+  `--spectrum-illustrated-message-large-cjk-title-font-size`
+  `--spectrum-illustrated-message-large-body-font-size`
+  `--spectrum-illustrated-message-horizontal-maximum-width`
+
+  New mods
+  `--mod-illustrated-message-description-to-action`
+  `--mod-illustrated-message-heading-to-description`
+  `--mod-illustrated-message-illustration-to-content`
+  `--mod-illustrated-message-horizontal-maximum-width`
+
+  Removed properties
+  `--spectrum-illustrated-message-title-to-heading`
+  `--spectrum-illustrated-message-description-max-inline-size`
+  `--spectrum-illustrated-message-heading-max-inline-size`
+  `--spectrum-illustrated-message-illustration-accent-color`
+  `--mod-illustrated-message-illustration-accent-color`
+  `--highcontrast-illustrated-message-illustration-accent-color`
+
+  ## Dropzone
+
+  New mods
+  `--mod-drop-zone-body-to-action`
+  `--mod-drop-zone-illustration-to-title`
+
+  ## Dropzone nested mods
+
+  Renamed mods
+  `--mod-illustrated-message-title-to-heading` > `--mod-illustrated-message-illustration-to-heading`
+  `--mod-illustrated-message-heading-to-body` > `--mod-illustrated-message-heading-to-description`
+  `--mod-illustrated-message-content-maximum-width` > `--mod-illustrated-message-vertical-maximum-width`
+
+### Patch Changes
+
+- Updated dependencies [[`b50d038`](https://github.com/adobe/spectrum-css/commit/b50d0382f3ce554e89e89e57f86f25d2d84b332e)]:
+  - @spectrum-css/illustratedmessage@10.0.0-next.0
+
 ## 8.0.1
 
 ### Patch Changes

diff --git a/components/dropzone/package.json b/components/dropzone/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/dropzone",
-	"version": "8.0.1",
+	"version": "9.0.0-next.0",
 	"description": "The Spectrum CSS dropzone component",
 	"license": "Apache-2.0",
 	"author": "Adobe",
@@ -40,7 +40,7 @@
 	},
 	"devDependencies": {
 		"@spectrum-css/actionbutton": "7.0.1",
-		"@spectrum-css/illustratedmessage": "9.0.1",
+		"@spectrum-css/illustratedmessage": "10.0.0-next.0",
 		"@spectrum-css/link": "7.0.1",
 		"@spectrum-css/tokens": "16.0.0"
 	},

diff --git a/components/illustratedmessage/CHANGELOG.md b/components/illustratedmessage/CHANGELOG.md
@@ -1,5 +1,54 @@
 # Change Log
 
+## 10.0.0-next.0
+
+### Major Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`b50d038`](https://github.com/adobe/spectrum-css/commit/b50d0382f3ce554e89e89e57f86f25d2d84b332e) Thanks [@pfulton](https://github.com/pfulton)! - # S2 Illustrated Message Migration
+
+  This migration contains new tokens for t-shirt sizes (S, M, L), vertical and horizontal orientation along with their maximum width, illustration sizes, and content spacing. Dropzone `--mod` names are renamed to match the semantic tokens in illustrated message.
+
+  ## Illustrated Message
+
+  New properties
+  `--spectrum-illustrated-message-heading-to-description`
+  `--spectrum-illustrated-message-illustration-to-heading`
+  `--spectrum-illustrated-message-illustration-to-content`
+  `--spectrum-illustrated-message-description-to-action`
+  `--spectrum-illustrated-message-illustration-color`
+  `--spectrum-illustrated-message-illustration-size`
+  `--spectrum-illustrated-message-small-cjk-title-font-size`
+  `--spectrum-illustrated-message-large-cjk-title-font-size`
+  `--spectrum-illustrated-message-large-body-font-size`
+  `--spectrum-illustrated-message-horizontal-maximum-width`
+
+  New mods
+  `--mod-illustrated-message-description-to-action`
+  `--mod-illustrated-message-heading-to-description`
+  `--mod-illustrated-message-illustration-to-content`
+  `--mod-illustrated-message-horizontal-maximum-width`
+
+  Removed properties
+  `--spectrum-illustrated-message-title-to-heading`
+  `--spectrum-illustrated-message-description-max-inline-size`
+  `--spectrum-illustrated-message-heading-max-inline-size`
+  `--spectrum-illustrated-message-illustration-accent-color`
+  `--mod-illustrated-message-illustration-accent-color`
+  `--highcontrast-illustrated-message-illustration-accent-color`
+
+  ## Dropzone
+
+  New mods
+  `--mod-drop-zone-body-to-action`
+  `--mod-drop-zone-illustration-to-title`
+
+  ## Dropzone nested mods
+
+  Renamed mods
+  `--mod-illustrated-message-title-to-heading` > `--mod-illustrated-message-illustration-to-heading`
+  `--mod-illustrated-message-heading-to-body` > `--mod-illustrated-message-heading-to-description`
+  `--mod-illustrated-message-content-maximum-width` > `--mod-illustrated-message-vertical-maximum-width`
+
 ## 9.0.1
 
 ### Patch Changes

diff --git a/components/illustratedmessage/package.json b/components/illustratedmessage/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/illustratedmessage",
-	"version": "9.0.1",
+	"version": "10.0.0-next.0",
 	"description": "The Spectrum CSS illustratedmessage component",
 	"license": "Apache-2.0",
 	"author": "Adobe",

diff --git a/components/modal/CHANGELOG.md b/components/modal/CHANGELOG.md
@@ -1,5 +1,28 @@
 # Change Log
 
+## 7.1.0-next.0
+
+### Minor Changes
+
+- [#2352](https://github.com/adobe/spectrum-css/pull/2352) [`8a4ab84`](https://github.com/adobe/spectrum-css/commit/8a4ab8476f4e606b9c020b780baf29248e4f8f24) Thanks [@pfulton](https://github.com/pfulton)! - S2 Takeover dialog
+
+  This is the migration for the fullscreen/fullscreenTakeover dialog stories (these stories correspond to the "takeover dialog" in Figma). The Divider component support was removed in S2 standard dialog migration ([#2860](https://github.com/adobe/spectrum-css/pull/2860)). New and updated tokens are in place to update fullscreen/fullscreenTakeover dialog sizing, grid spacing, spacing in the header, and font sizes. Fullscreen/fullscreenTakeover dialogs do not support additional footer content or checkboxes (in comparison to the standard dialog).
+
+  Takeover dialogs also support replacing text in the header and body areas with other components. This required an additional `.spectrum-Dialog-headerContentWrapper` element that should center whatever component/content within.
+
+  Class names updated to match naming convention (remove hyphens and capitalize second word):
+  `.spectrum-Dialog-header-content` > `.spectrum-Dialog-headerContent`
+  `.spectrum-Dialog-footer-content` > `.spectrum-Dialog-footerContent`
+
+  _New Mods_
+  `--mod-takeover-dialog-grid-spacing`
+  `--mod-takeover-dialog-spacing-header-content-gap`
+  `--mod-takeover-dialog-title-font-size`
+
+  Modal updates
+
+  - Modal component now uses the updated margin token (`window-to-edge`) found in the takeover dialog design specs. This work also introduced `--spectrum-modal-takeover-window-to-edge`
+
 ## 5.1.1-next.0
 
 ### Patch Changes

diff --git a/components/modal/package.json b/components/modal/package.json
@@ -1,6 +1,6 @@
 {
 	"name": "@spectrum-css/modal",
-	"version": "7.0.1",
+	"version": "7.1.0-next.0",
 	"description": "The Spectrum CSS modal component",
 	"license": "Apache-2.0",
 	"author": "Adobe",