diff --git a/.circleci/config.yml b/.circleci/config.yml
index 06208a61d9c..f1937eba432 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -192,7 +192,7 @@ jobs:
             - run: yarn analyze
             - run:
                   name: Are there changes?
-                  command: git diff-files
+                  command: git diff-files --exit-code
 
     preview-docs:
         executor: node
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2712cb93769..90dd4d5e1d3 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -3,6 +3,20 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **action-menu:** allow tray to display full width ([31415e4](https://github.com/adobe/spectrum-web-components/commit/31415e4ebe6b5369775074e52ed92fcd6b70c932))
+-   **overlay:** ensure events are only bound once ([abe57ce](https://github.com/adobe/spectrum-web-components/commit/abe57cedcc18a309f3acf1b664bfa561f13b4f8f))
+-   **picker:** ensure menu placement in mobile ([#3835](https://github.com/adobe/spectrum-web-components/issues/3835)) ([4aba1c6](https://github.com/adobe/spectrum-web-components/commit/4aba1c6094e45481dec428fcc95fb4148f62dbc9))
+-   **slider:** align editable slider when no label provided ([#3816](https://github.com/adobe/spectrum-web-components/issues/3816)) ([a5f4900](https://github.com/adobe/spectrum-web-components/commit/a5f49009d4acc1e8c5403a08b127769e18bda56c))
+-   **tabs:** prevent vertical scrolling in overflow tabs ([eb0592f](https://github.com/adobe/spectrum-web-components/commit/eb0592f87c1f52fe34745af030331060b3641a59))
+
+### Performance Improvements
+
+-   **checkbox:** refactor architecture for more rendering perf and DOM element count ([7c2277f](https://github.com/adobe/spectrum-web-components/commit/7c2277f1a21e2e886678c3a3ad1d454cbd6637e0))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/lerna.json b/lerna.json
index a5d21b77ffb..3be535b3d7b 100644
--- a/lerna.json
+++ b/lerna.json
@@ -1,6 +1,6 @@
 {
     "packages": ["linters/*", "packages/*", "projects/*", "tools/*", "react/*"],
-    "version": "0.40.0",
+    "version": "0.40.1",
     "granularPathspec": false,
     "npmClient": "yarn",
     "command": {
diff --git a/linters/eslint/CHANGELOG.md b/linters/eslint/CHANGELOG.md
index a9442dd4262..1797d7a3d74 100644
--- a/linters/eslint/CHANGELOG.md
+++ b/linters/eslint/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/eslint-plugin
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/eslint-plugin
diff --git a/linters/eslint/package.json b/linters/eslint/package.json
index 335d5586833..17d81eddbfc 100644
--- a/linters/eslint/package.json
+++ b/linters/eslint/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/eslint-plugin",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "main": "index.js"
 }
diff --git a/linters/stylelint-header/CHANGELOG.md b/linters/stylelint-header/CHANGELOG.md
index 2047efd6329..c02dd70f081 100644
--- a/linters/stylelint-header/CHANGELOG.md
+++ b/linters/stylelint-header/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package stylelint-header
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package stylelint-header
diff --git a/linters/stylelint-header/package.json b/linters/stylelint-header/package.json
index 7f0a3b6e1de..08a37854b05 100644
--- a/linters/stylelint-header/package.json
+++ b/linters/stylelint-header/package.json
@@ -1,6 +1,6 @@
 {
     "name": "stylelint-header",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "license": "Apache-2.0",
     "author": "Adobe",
diff --git a/package.json b/package.json
index 5a7345275e2..04b3618e2a4 100644
--- a/package.json
+++ b/package.json
@@ -138,7 +138,7 @@
         "alex": "^10.0.0",
         "cem-plugin-module-file-extensions": "^0.0.5",
         "chalk": "^5.0.1",
-        "chromedriver": "119",
+        "chromedriver": "^119.0.1",
         "common-tags": "^1.8.2",
         "cssnano": "^6.0.1",
         "custom-elements-manifest": "^2.0.0",
diff --git a/packages/accordion/CHANGELOG.md b/packages/accordion/CHANGELOG.md
index 29bc63e4755..c1d221e9e46 100644
--- a/packages/accordion/CHANGELOG.md
+++ b/packages/accordion/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/accordion
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/accordion
diff --git a/packages/accordion/package.json b/packages/accordion/package.json
index a91f456690f..897dd15d067 100644
--- a/packages/accordion/package.json
+++ b/packages/accordion/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/accordion",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -66,11 +66,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/accordion": "^4.0.17"
diff --git a/packages/action-bar/CHANGELOG.md b/packages/action-bar/CHANGELOG.md
index 3d2764eaaad..072310097ac 100644
--- a/packages/action-bar/CHANGELOG.md
+++ b/packages/action-bar/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/action-bar
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/action-bar
diff --git a/packages/action-bar/package.json b/packages/action-bar/package.json
index a5f11744c07..0b0b3f425d1 100644
--- a/packages/action-bar/package.json
+++ b/packages/action-bar/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/action-bar",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/action-group": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/popover": "^0.40.0"
+        "@spectrum-web-components/action-group": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/popover": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/actionbar": "^7.0.1"
diff --git a/packages/action-bar/src/ActionBar.ts b/packages/action-bar/src/ActionBar.ts
index e8df80d4967..54d5f6f8b68 100644
--- a/packages/action-bar/src/ActionBar.ts
+++ b/packages/action-bar/src/ActionBar.ts
@@ -58,7 +58,7 @@ export class ActionBar extends SpectrumElement {
      *
      * @param {String} variant
      */
-    @property({ type: String, reflect: true })
+    @property({ type: String })
     public set variant(variant: string) {
         if (variant === this.variant) {
             return;
diff --git a/packages/action-button/CHANGELOG.md b/packages/action-button/CHANGELOG.md
index b8c9336edff..4c88f20a861 100644
--- a/packages/action-button/CHANGELOG.md
+++ b/packages/action-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/action-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/action-button
diff --git a/packages/action-button/package.json b/packages/action-button/package.json
index e556487804b..70b60d0d768 100644
--- a/packages/action-button/package.json
+++ b/packages/action-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/action-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/actionbutton": "^5.0.7"
diff --git a/packages/action-group/CHANGELOG.md b/packages/action-group/CHANGELOG.md
index 0e0763129d4..100dd0e4d62 100644
--- a/packages/action-group/CHANGELOG.md
+++ b/packages/action-group/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/action-group
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/action-group
diff --git a/packages/action-group/package.json b/packages/action-group/package.json
index e566c2bcb76..d55f7f55a30 100644
--- a/packages/action-group/package.json
+++ b/packages/action-group/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/action-group",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -58,10 +58,10 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/action-button": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0"
+        "@spectrum-web-components/action-button": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/actiongroup": "^4.0.7"
diff --git a/packages/action-menu/CHANGELOG.md b/packages/action-menu/CHANGELOG.md
index e4e7430c1df..e060b34901a 100644
--- a/packages/action-menu/CHANGELOG.md
+++ b/packages/action-menu/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **action-menu:** allow tray to display full width ([31415e4](https://github.com/adobe/spectrum-web-components/commit/31415e4ebe6b5369775074e52ed92fcd6b70c932))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/action-menu
diff --git a/packages/action-menu/package.json b/packages/action-menu/package.json
index f21b739545c..e22926c8160 100644
--- a/packages/action-menu/package.json
+++ b/packages/action-menu/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/action-menu",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -61,12 +61,12 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/action-button": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/picker": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/action-button": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/picker": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/actionmenu": "^5.0.0"
diff --git a/packages/action-menu/src/action-menu.css b/packages/action-menu/src/action-menu.css
index 648d716f410..c3cef519b2b 100644
--- a/packages/action-menu/src/action-menu.css
+++ b/packages/action-menu/src/action-menu.css
@@ -35,7 +35,6 @@ governing permissions and limitations under the License.
 }
 
 #popover {
-    width: auto;
     max-width: none;
 }
 
diff --git a/packages/alert-dialog/CHANGELOG.md b/packages/alert-dialog/CHANGELOG.md
index fdad2a20db5..d59bb29717a 100644
--- a/packages/alert-dialog/CHANGELOG.md
+++ b/packages/alert-dialog/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/alert-dialog
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/alert-dialog
diff --git a/packages/alert-dialog/package.json b/packages/alert-dialog/package.json
index f0b8783b6b0..db60b880544 100644
--- a/packages/alert-dialog/package.json
+++ b/packages/alert-dialog/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/alert-dialog",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -58,12 +58,12 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/button-group": "^0.40.0",
-        "@spectrum-web-components/divider": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/button-group": "^0.40.1",
+        "@spectrum-web-components/divider": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/alertdialog": "^1.0.6"
diff --git a/packages/asset/CHANGELOG.md b/packages/asset/CHANGELOG.md
index a5931f4dc5f..587ea3d5abd 100644
--- a/packages/asset/CHANGELOG.md
+++ b/packages/asset/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/asset
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/asset
diff --git a/packages/asset/package.json b/packages/asset/package.json
index 90c8536cdbd..606fe080088 100644
--- a/packages/asset/package.json
+++ b/packages/asset/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/asset",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/asset": "^3.0.48"
diff --git a/packages/avatar/CHANGELOG.md b/packages/avatar/CHANGELOG.md
index 73068063e0e..8343457f0b9 100644
--- a/packages/avatar/CHANGELOG.md
+++ b/packages/avatar/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/avatar
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/avatar
diff --git a/packages/avatar/package.json b/packages/avatar/package.json
index 8f80723c452..7869cc9fbae 100644
--- a/packages/avatar/package.json
+++ b/packages/avatar/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/avatar",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/avatar": "^6.0.52"
diff --git a/packages/badge/CHANGELOG.md b/packages/badge/CHANGELOG.md
index bf957e451ca..4771e3a3940 100644
--- a/packages/badge/CHANGELOG.md
+++ b/packages/badge/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/badge
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/badge
diff --git a/packages/badge/package.json b/packages/badge/package.json
index 5864aec1b72..4fe5eb15c03 100644
--- a/packages/badge/package.json
+++ b/packages/badge/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/badge",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/badge": "^3.1.8"
diff --git a/packages/banner/CHANGELOG.md b/packages/banner/CHANGELOG.md
index 79f02a39bf0..12b12d2e883 100644
--- a/packages/banner/CHANGELOG.md
+++ b/packages/banner/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/banner
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/banner
diff --git a/packages/banner/package.json b/packages/banner/package.json
index ce4138eb183..441abe31dcd 100644
--- a/packages/banner/package.json
+++ b/packages/banner/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/banner",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/banner": "3.0.0-beta.2"
diff --git a/packages/button-group/CHANGELOG.md b/packages/button-group/CHANGELOG.md
index 56a33935432..c15e2ca8844 100644
--- a/packages/button-group/CHANGELOG.md
+++ b/packages/button-group/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/button-group
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/button-group
diff --git a/packages/button-group/package.json b/packages/button-group/package.json
index 9d5b05ad089..7ca5ca36555 100644
--- a/packages/button-group/package.json
+++ b/packages/button-group/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/button-group",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/buttongroup": "^6.1.6"
diff --git a/packages/button/CHANGELOG.md b/packages/button/CHANGELOG.md
index 1c40f957e20..4d44f471f45 100644
--- a/packages/button/CHANGELOG.md
+++ b/packages/button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/button/package.json b/packages/button/package.json
index 43c13d0f125..ed1f62e1692 100644
--- a/packages/button/package.json
+++ b/packages/button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -82,12 +82,12 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/clear-button": "^0.40.0",
-        "@spectrum-web-components/close-button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/clear-button": "^0.40.1",
+        "@spectrum-web-components/close-button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/button": "^11.0.8"
diff --git a/packages/button/src/Button.ts b/packages/button/src/Button.ts
index 153f76dc045..21f27c060e2 100644
--- a/packages/button/src/Button.ts
+++ b/packages/button/src/Button.ts
@@ -128,6 +128,10 @@ export class Button extends SizedMixin(ButtonBase, { noDefaultSize: true }) {
         this.treatment = quiet ? 'outline' : 'fill';
     }
 
+    public get quiet(): boolean {
+        return this.treatment === 'outline';
+    }
+
     protected override firstUpdated(changes: PropertyValues<this>): void {
         super.firstUpdated(changes);
         // There is no Spectrum design context for an `<sp-button>` without a variant
diff --git a/packages/calendar/package.json b/packages/calendar/package.json
index 68d066c0ceb..11892321f1f 100644
--- a/packages/calendar/package.json
+++ b/packages/calendar/package.json
@@ -61,7 +61,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@internationalized/date": "^3.2.1",
+        "@internationalized/date": "^3.5.0",
         "@internationalized/number": "^3.1.0",
         "@spectrum-web-components/action-button": "^0.40.0",
         "@spectrum-web-components/base": "^0.40.0",
@@ -69,7 +69,8 @@
         "@spectrum-web-components/reactive-controllers": "^0.40.0"
     },
     "devDependencies": {
-        "@spectrum-css/calendar": "^4.0.9"
+        "@spectrum-css/calendar": "^4.0.9",
+        "@spectrum-web-components/story-decorator": "^0.40.0"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/calendar/src/spectrum-calendar.css b/packages/calendar/src/spectrum-calendar.css
index 8d000b4305e..a9b8ed053ca 100644
--- a/packages/calendar/src/spectrum-calendar.css
+++ b/packages/calendar/src/spectrum-calendar.css
@@ -184,6 +184,7 @@ governing permissions and limitations under the License.
         --mod-calendar-day-width,
         var(--spectrum-calendar-day-width)
     );
+    padding: 0;
     padding: var(
         --mod-calendar-day-padding,
         var(--spectrum-calendar-day-padding)
diff --git a/packages/calendar/stories/calendar.stories.ts b/packages/calendar/stories/calendar.stories.ts
index 73c2512e93e..bd61e328f8a 100644
--- a/packages/calendar/stories/calendar.stories.ts
+++ b/packages/calendar/stories/calendar.stories.ts
@@ -9,112 +9,37 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-import { html, TemplateResult } from '@spectrum-web-components/base';
-import { ifDefined } from '@spectrum-web-components/base/src/directives.js';
+import { html, render, TemplateResult } from '@spectrum-web-components/base';
+import { defaultLocale } from '@spectrum-web-components/story-decorator/src/StoryDecorator.js';
 
 import { spreadProps } from '../../../test/lit-helpers.js';
 
 import '@spectrum-web-components/calendar/sp-calendar.js';
 import '@spectrum-web-components/theme/sp-theme.js';
 
-const locales = [
-    'cs-CZ',
-    'cy-GB',
-    'da-DK',
-    'de-DE',
-    'en-GB',
-    'en-US',
-    'es-ES',
-    'fi-FI',
-    'fr-FR',
-    'hu-HU',
-    'it-IT',
-    'ja-JP',
-    'ko-KR',
-    'nb-NO',
-    'nl-NL',
-    'pl-PL',
-    'pt-BR',
-    'ru-RU',
-    'sv-SE',
-    'tr-TR',
-    'uk-UA',
-    'zh-Hans-CN',
-    'zh-Hans-CN-u-nu-hanidec',
-    'zh-Hant-TW',
-    'zz-ZY',
-    'zz-ZZ',
-] as const;
-
-const defaultLocale = 'en-US';
-
-const hiddenProperty = {
-    table: {
-        disable: true,
-    },
-};
-
 export default {
     title: 'Calendar',
     component: 'sp-calendar',
-
-    argTypes: {
-        lang: {
-            options: locales,
-            control: {
-                type: 'select',
-            },
-            table: {
-                defaultValue: {
-                    summary: defaultLocale,
-                },
-            },
-        },
-
-        // Don't render private properties and getters in the Storybook UI
-        currentDate: { ...hiddenProperty },
-        minDate: { ...hiddenProperty },
-        maxDate: { ...hiddenProperty },
-        weeksInCurrentMonth: { ...hiddenProperty },
-        weekdays: { ...hiddenProperty },
-        languageResolver: { ...hiddenProperty },
-        timeZone: { ...hiddenProperty },
-        locale: { ...hiddenProperty },
-        today: { ...hiddenProperty },
-
-        // Inherited
-        _dirParent: { ...hiddenProperty },
-        shadowRoot: { ...hiddenProperty },
-        dir: { ...hiddenProperty },
-        isLTR: { ...hiddenProperty },
-    },
-
-    args: {
-        lang: defaultLocale,
-    },
-
     parameters: {
-        controls: {
-            // Hide "This story is not configured to handle controls" warning
-            hideNoControlsWarning: true,
-        },
         actions: {
             handles: ['onChange'],
         },
     },
 };
 
-interface StoryArgs {
-    lang?: string;
-
-    padded?: boolean;
-    disabled?: boolean;
+type ComponentArgs = {
     selectedDate?: Date;
     min?: Date;
     max?: Date;
+    padded?: boolean;
+    disabled?: boolean;
+};
 
-    onChange?: (date: Date) => void;
+type StoryArgs = ComponentArgs & {
+    onChange?: (dateTime: Date) => void;
+};
 
+interface SpreadStoryArgs {
     [prop: string]: unknown;
 }
 
@@ -122,64 +47,34 @@ const renderCalendar = (
     title: string,
     args: StoryArgs = {}
 ): TemplateResult => {
-    return html`
-        <sp-theme lang=${ifDefined(args.lang || undefined)}>
-            <h1>${title}</h1>
-            <h2>
-                Locale:
-                <code>${args.lang}</code>
-            </h2>
-
-            <hr />
-
-            <sp-calendar
-                ...=${spreadProps(args)}
-                @change=${args.onChange}
-            ></sp-calendar>
-        </sp-theme>
+    const story = html`
+        <h1>${title}</h1>
+        <hr />
+        <sp-calendar
+            ...=${spreadProps(args as SpreadStoryArgs)}
+            @change=${args.onChange}
+        ></sp-calendar>
     `;
-};
-
-export const Default = (args: StoryArgs = {}): TemplateResult => {
-    return renderCalendar('Default', args);
-};
 
-export const padded = (args: StoryArgs = {}): TemplateResult => {
-    return renderCalendar(`Padded? ${args.padded}`, args);
-};
+    const randomId = Math.floor(Math.random() * 99999);
 
-padded.argTypes = {
-    padded: {
-        control: 'boolean',
-        table: {
-            defaultValue: {
-                summary: true,
-            },
-        },
-    },
-};
-
-padded.args = {
-    padded: true,
-};
+    requestAnimationFrame(() => {
+        const container = document.querySelector(
+            `.story-container-${randomId}`
+        );
 
-export const disabled = (args: StoryArgs = {}): TemplateResult => {
-    return renderCalendar(`Disabled? ${args.disabled}`, args);
-};
+        if (container) {
+            render(story, container as HTMLElement);
+        }
+    });
 
-disabled.argTypes = {
-    disabled: {
-        control: 'boolean',
-        table: {
-            defaultValue: {
-                summary: true,
-            },
-        },
-    },
+    return html`
+        <div class="story-container-${randomId}"></div>
+    `;
 };
 
-disabled.args = {
-    disabled: true,
+export const Default = (args: StoryArgs = {}): TemplateResult => {
+    return renderCalendar('Default', args);
 };
 
 export const selectedDate = (args: StoryArgs = {}): TemplateResult => {
@@ -241,3 +136,41 @@ export const maximumDate = (args: StoryArgs = {}): TemplateResult => {
 
     return renderCalendar(`Maximum Date: ${formatted}`, args);
 };
+
+export const disabled = (args: StoryArgs = {}): TemplateResult => {
+    return renderCalendar(`Disabled? ${args.disabled}`, args);
+};
+
+disabled.argTypes = {
+    disabled: {
+        control: 'boolean',
+        table: {
+            defaultValue: {
+                summary: true,
+            },
+        },
+    },
+};
+
+disabled.args = {
+    disabled: true,
+};
+
+export const padded = (args: StoryArgs = {}): TemplateResult => {
+    return renderCalendar(`Padded? ${args.padded}`, args);
+};
+
+padded.argTypes = {
+    padded: {
+        control: 'boolean',
+        table: {
+            defaultValue: {
+                summary: true,
+            },
+        },
+    },
+};
+
+padded.args = {
+    padded: true,
+};
diff --git a/packages/card/CHANGELOG.md b/packages/card/CHANGELOG.md
index a968e40fad2..5dae1241c46 100644
--- a/packages/card/CHANGELOG.md
+++ b/packages/card/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/card
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/card
diff --git a/packages/card/package.json b/packages/card/package.json
index 2837be94c09..6981f190863 100644
--- a/packages/card/package.json
+++ b/packages/card/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/card",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,17 +57,17 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/asset": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/checkbox": "^0.40.0",
-        "@spectrum-web-components/divider": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/quick-actions": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0"
+        "@spectrum-web-components/asset": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/checkbox": "^0.40.1",
+        "@spectrum-web-components/divider": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/quick-actions": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1"
     },
     "devDependencies": {
-        "@spectrum-css/card": "^6.1.0"
+        "@spectrum-css/card": "^6.2.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/card/src/spectrum-card.css b/packages/card/src/spectrum-card.css
index d8977d3342e..bb9454ceec8 100644
--- a/packages/card/src/spectrum-card.css
+++ b/packages/card/src/spectrum-card.css
@@ -155,12 +155,13 @@ governing permissions and limitations under the License.
     );
     position: absolute;
 }
-:host(:focus),
-:host([focused]) {
+:host(.focus-visible) {
     outline: none;
 }
-:host(:focus):after,
-:host([focused]):after {
+:host(:focus-visible) {
+    outline: none;
+}
+:host(.focus-visible):after {
     border-color: var(
         --mod-card-focus-indicator-color,
         var(--spectrum-card-focus-indicator-color)
@@ -170,10 +171,35 @@ governing permissions and limitations under the License.
         var(--spectrum-card-focus-indicator-width)
     );
 }
-:host(:focus) #cover-photo,
-:host(:focus) #preview,
-:host([focused]) #cover-photo,
-:host([focused]) #preview {
+:host(:focus-visible):after {
+    border-color: var(
+        --mod-card-focus-indicator-color,
+        var(--spectrum-card-focus-indicator-color)
+    );
+    border-width: var(
+        --mod-card-focus-indicator-width,
+        var(--spectrum-card-focus-indicator-width)
+    );
+}
+:host(.focus-visible) #cover-photo,
+:host(.focus-visible) #preview {
+    border-start-end-radius: calc(
+        var(--mod-card-corner-radius, var(--spectrum-card-corner-radius)) -
+            var(
+                --mod-card-focus-indicator-width,
+                var(--spectrum-card-focus-indicator-width)
+            )
+    );
+    border-start-start-radius: calc(
+        var(--mod-card-corner-radius, var(--spectrum-card-corner-radius)) -
+            var(
+                --mod-card-focus-indicator-width,
+                var(--spectrum-card-focus-indicator-width)
+            )
+    );
+}
+:host(:focus-visible) #cover-photo,
+:host(:focus-visible) #preview {
     border-start-end-radius: calc(
         var(--mod-card-corner-radius, var(--spectrum-card-corner-radius)) -
             var(
diff --git a/packages/checkbox/CHANGELOG.md b/packages/checkbox/CHANGELOG.md
index 7e3491aba99..8e1d3a5c95d 100644
--- a/packages/checkbox/CHANGELOG.md
+++ b/packages/checkbox/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Performance Improvements
+
+-   **checkbox:** refactor architecture for more rendering perf and DOM element count ([7c2277f](https://github.com/adobe/spectrum-web-components/commit/7c2277f1a21e2e886678c3a3ad1d454cbd6637e0))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Features
diff --git a/packages/checkbox/package.json b/packages/checkbox/package.json
index f287fc9af50..b87a71142fd 100644
--- a/packages/checkbox/package.json
+++ b/packages/checkbox/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/checkbox",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -33,6 +33,10 @@
             "development": "./src/CheckboxBase.dev.js",
             "default": "./src/CheckboxBase.js"
         },
+        "./src/CheckboxMixin.js": {
+            "development": "./src/CheckboxMixin.dev.js",
+            "default": "./src/CheckboxMixin.js"
+        },
         "./src/checkbox.css.js": "./src/checkbox.css.js",
         "./src/index.js": {
             "development": "./src/index.dev.js",
@@ -61,10 +65,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/checkbox": "^7.0.11"
diff --git a/packages/checkbox/src/Checkbox.ts b/packages/checkbox/src/Checkbox.ts
index 3db6bf20b25..f024d3a22dd 100644
--- a/packages/checkbox/src/Checkbox.ts
+++ b/packages/checkbox/src/Checkbox.ts
@@ -16,10 +16,12 @@ import {
     html,
     PropertyValues,
     SizedMixin,
+    SpectrumElement,
     TemplateResult,
 } from '@spectrum-web-components/base';
 import { property } from '@spectrum-web-components/base/src/decorators.js';
-import { CheckboxBase } from './CheckboxBase.js';
+import { CheckboxMixin } from './CheckboxMixin.js';
+import checkboxStyles from './checkbox.css.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-checkmark75.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-checkmark100.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-checkmark200.js';
@@ -28,62 +30,77 @@ import '@spectrum-web-components/icons-ui/icons/sp-icon-dash75.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-dash100.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-dash200.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-dash300.js';
-import checkboxStyles from './checkbox.css.js';
 import checkmarkSmallStyles from '@spectrum-web-components/icon/src/spectrum-icon-checkmark.css.js';
 import dashSmallStyles from '@spectrum-web-components/icon/src/spectrum-icon-dash.css.js';
 
 const checkmarkIcon = {
-    s: html`
-        <sp-icon-checkmark75
-            id="checkmark"
-            class="spectrum-Icon spectrum-UIIcon-Checkmark75"
-        ></sp-icon-checkmark75>
-    `,
-    m: html`
-        <sp-icon-checkmark100
-            id="checkmark"
-            class="spectrum-Icon spectrum-UIIcon-Checkmark100"
-        ></sp-icon-checkmark100>
-    `,
-    l: html`
-        <sp-icon-checkmark200
-            id="checkmark"
-            class="spectrum-Icon spectrum-UIIcon-Checkmark200"
-        ></sp-icon-checkmark200>
-    `,
-    xl: html`
-        <sp-icon-checkmark300
-            id="checkmark"
-            class="spectrum-Icon spectrum-UIIcon-Checkmark300"
-        ></sp-icon-checkmark300>
-    `,
+    s: () => {
+        return html`
+            <sp-icon-checkmark75
+                id="checkmark"
+                class="spectrum-Icon spectrum-UIIcon-Checkmark75"
+            ></sp-icon-checkmark75>
+        `;
+    },
+    m: () => {
+        return html`
+            <sp-icon-checkmark100
+                id="checkmark"
+                class="spectrum-Icon spectrum-UIIcon-Checkmark100"
+            ></sp-icon-checkmark100>
+        `;
+    },
+    l: () => {
+        return html`
+            <sp-icon-checkmark200
+                id="checkmark"
+                class="spectrum-Icon spectrum-UIIcon-Checkmark200"
+            ></sp-icon-checkmark200>
+        `;
+    },
+    xl: () => {
+        return html`
+            <sp-icon-checkmark300
+                id="checkmark"
+                class="spectrum-Icon spectrum-UIIcon-Checkmark300"
+            ></sp-icon-checkmark300>
+        `;
+    },
 };
 
 const dashIcon = {
-    s: html`
-        <sp-icon-dash75
-            id="partialCheckmark"
-            class="spectrum-Icon spectrum-UIIcon-Dash75"
-        ></sp-icon-dash75>
-    `,
-    m: html`
-        <sp-icon-dash100
-            id="partialCheckmark"
-            class="spectrum-Icon spectrum-UIIcon-Dash100"
-        ></sp-icon-dash100>
-    `,
-    l: html`
-        <sp-icon-dash200
-            id="partialCheckmark"
-            class="spectrum-Icon spectrum-UIIcon-Dash200"
-        ></sp-icon-dash200>
-    `,
-    xl: html`
-        <sp-icon-dash300
-            id="partialCheckmark"
-            class="spectrum-Icon spectrum-UIIcon-Dash300"
-        ></sp-icon-dash300>
-    `,
+    s: () => {
+        return html`
+            <sp-icon-dash75
+                id="partialCheckmark"
+                class="spectrum-Icon spectrum-UIIcon-Dash75"
+            ></sp-icon-dash75>
+        `;
+    },
+    m: () => {
+        return html`
+            <sp-icon-dash100
+                id="partialCheckmark"
+                class="spectrum-Icon spectrum-UIIcon-Dash100"
+            ></sp-icon-dash100>
+        `;
+    },
+    l: () => {
+        return html`
+            <sp-icon-dash200
+                id="partialCheckmark"
+                class="spectrum-Icon spectrum-UIIcon-Dash200"
+            ></sp-icon-dash200>
+        `;
+    },
+    xl: () => {
+        return html`
+            <sp-icon-dash300
+                id="partialCheckmark"
+                class="spectrum-Icon spectrum-UIIcon-Dash300"
+            ></sp-icon-dash300>
+        `;
+    },
 };
 
 /**
@@ -91,9 +108,20 @@ const dashIcon = {
  * @slot - content to display as the label for the Checkbox
  * @fires change - Announces a change in the `checked` property of a Checkbox
  */
-export class Checkbox extends SizedMixin(CheckboxBase, {
+export class Checkbox extends SizedMixin(CheckboxMixin(SpectrumElement), {
     noDefaultSize: true,
 }) {
+    static override shadowRootOptions = {
+        ...SpectrumElement.shadowRootOptions,
+        delegatesFocus: true,
+    };
+
+    /**
+     * Disable this control. It will not receive focus or events
+     */
+    @property({ type: Boolean, reflect: true })
+    public disabled = false;
+
     @property({ type: Boolean, reflect: true })
     public indeterminate = false;
 
@@ -103,10 +131,30 @@ export class Checkbox extends SizedMixin(CheckboxBase, {
     @property({ type: Boolean, reflect: true })
     public emphasized = false;
 
+    @property({ reflect: true, type: Number, attribute: 'tabindex' })
+    public override tabIndex = 0;
+
+    public override connectedCallback(): void {
+        super.connectedCallback();
+        if (this.hasAttribute('autofocus')) {
+            this.updateComplete.then(() => {
+                this.focus();
+            });
+        }
+    }
+
     public static override get styles(): CSSResultArray {
         return [checkboxStyles, checkmarkSmallStyles, dashSmallStyles];
     }
 
+    public override click(): void {
+        if (this.disabled) {
+            return;
+        }
+
+        this.inputElement?.click();
+    }
+
     public override handleChange(): void {
         this.indeterminate = false;
         super.handleChange();
@@ -116,8 +164,12 @@ export class Checkbox extends SizedMixin(CheckboxBase, {
         return html`
             ${super.render()}
             <span id="box">
-                ${checkmarkIcon[this.size as DefaultElementSize]}
-                ${dashIcon[this.size as DefaultElementSize]}
+                ${this.checked
+                    ? checkmarkIcon[this.size as DefaultElementSize]()
+                    : html``}
+                ${this.indeterminate
+                    ? dashIcon[this.size as DefaultElementSize]()
+                    : html``}
             </span>
             <label id="label" for="input"><slot></slot></label>
         `;
@@ -125,6 +177,22 @@ export class Checkbox extends SizedMixin(CheckboxBase, {
 
     protected override updated(changes: PropertyValues): void {
         super.updated(changes);
+        if (
+            changes.has('disabled') &&
+            (typeof changes.get('disabled') !== 'undefined' || this.disabled)
+        ) {
+            if (this.disabled) {
+                this.inputElement.tabIndex = this.tabIndex;
+                this.tabIndex = -1;
+            } else {
+                this.tabIndex = this.inputElement.tabIndex;
+                this.inputElement.removeAttribute('tabindex');
+            }
+            this.inputElement.disabled = this.disabled;
+        }
+        if (changes.has('indeterminate')) {
+            this.inputElement.indeterminate = this.indeterminate;
+        }
         if (changes.has('invalid')) {
             if (this.invalid) {
                 this.inputElement.setAttribute('aria-invalid', 'true');
@@ -132,8 +200,5 @@ export class Checkbox extends SizedMixin(CheckboxBase, {
                 this.inputElement.removeAttribute('aria-invalid');
             }
         }
-        if (changes.has('indeterminate')) {
-            this.inputElement.indeterminate = this.indeterminate;
-        }
     }
 }
diff --git a/packages/checkbox/src/CheckboxBase.ts b/packages/checkbox/src/CheckboxBase.ts
index 09e4298a197..03748bbaf96 100644
--- a/packages/checkbox/src/CheckboxBase.ts
+++ b/packages/checkbox/src/CheckboxBase.ts
@@ -9,61 +9,11 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-
-import { html, TemplateResult } from '@spectrum-web-components/base';
-import {
-    property,
-    query,
-} from '@spectrum-web-components/base/src/decorators.js';
-import { ifDefined } from '@spectrum-web-components/base/src/directives.js';
 import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
+import { CheckboxMixin } from './CheckboxMixin.js';
 
-export class CheckboxBase extends Focusable {
-    @property({ type: Boolean, reflect: true })
-    public checked = false;
-
-    @property({ type: Boolean, reflect: true })
-    public readonly = false;
-
-    @property({ type: String, reflect: true })
-    public name: string | undefined;
-
-    @query('#input')
-    protected inputElement!: HTMLInputElement;
-
+export class CheckboxBase extends CheckboxMixin(Focusable) {
     public override get focusElement(): HTMLElement {
         return this.inputElement;
     }
-
-    public handleChange(): void {
-        if (this.readonly) {
-            this.inputElement.checked = this.checked;
-            return;
-        }
-        this.checked = this.inputElement.checked;
-
-        const changeEvent = new CustomEvent('change', {
-            bubbles: true,
-            cancelable: true,
-            composed: true,
-        });
-        const applyDefault = this.dispatchEvent(changeEvent);
-
-        if (!applyDefault) {
-            this.checked = !this.inputElement.checked;
-            this.inputElement.checked = this.checked;
-        }
-    }
-
-    protected override render(): TemplateResult {
-        return html`
-            <input
-                name=${ifDefined(this.name || undefined)}
-                id="input"
-                type="checkbox"
-                .checked=${this.checked}
-                @change=${this.handleChange}
-            />
-        `;
-    }
 }
diff --git a/packages/checkbox/src/CheckboxMixin.ts b/packages/checkbox/src/CheckboxMixin.ts
new file mode 100644
index 00000000000..ad22c2f2d41
--- /dev/null
+++ b/packages/checkbox/src/CheckboxMixin.ts
@@ -0,0 +1,83 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+
+import { ReactiveElement } from 'lit';
+import { html, TemplateResult } from '@spectrum-web-components/base';
+import {
+    property,
+    query,
+} from '@spectrum-web-components/base/src/decorators.js';
+import { ifDefined } from '@spectrum-web-components/base/src/directives.js';
+
+type Constructor<T = Record<string, unknown>> = {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    new (...args: any[]): T;
+    prototype: T;
+};
+
+export interface CheckboxElement {
+    checked: boolean;
+    handleChange(): void;
+    inputElement: HTMLInputElement;
+    name?: string;
+}
+
+export function CheckboxMixin<T extends Constructor<ReactiveElement>>(
+    constructor: T
+): T & Constructor<CheckboxElement> {
+    class MixedElement extends constructor {
+        @property({ type: Boolean, reflect: true })
+        public checked = false;
+
+        @property({ type: String, reflect: true })
+        public name: string | undefined;
+
+        @property({ type: Boolean, reflect: true })
+        public readonly = false;
+
+        @query('#input')
+        inputElement!: HTMLInputElement;
+
+        public handleChange(): void {
+            if (this.readonly) {
+                this.inputElement.checked = this.checked;
+                return;
+            }
+            this.checked = this.inputElement.checked;
+
+            const changeEvent = new CustomEvent('change', {
+                bubbles: true,
+                cancelable: true,
+                composed: true,
+            });
+            const applyDefault = this.dispatchEvent(changeEvent);
+
+            if (!applyDefault) {
+                this.checked = !this.inputElement.checked;
+                this.inputElement.checked = this.checked;
+            }
+        }
+
+        protected render(): TemplateResult {
+            return html`
+                <input
+                    id="input"
+                    name=${ifDefined(this.name || undefined)}
+                    type="checkbox"
+                    .checked=${this.checked}
+                    @change=${this.handleChange}
+                />
+            `;
+        }
+    }
+    return MixedElement;
+}
diff --git a/packages/checkbox/test/benchmark/test-basic.ts b/packages/checkbox/test/benchmark/test-basic.ts
index 47bb3d782e3..2529b46c01f 100644
--- a/packages/checkbox/test/benchmark/test-basic.ts
+++ b/packages/checkbox/test/benchmark/test-basic.ts
@@ -15,5 +15,7 @@ import { html } from 'lit';
 import { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';
 
 measureFixtureCreation(html`
-    <sp-checkbox id="checkbox0" tabindex="5">Component</sp-checkbox>
+    <sp-checkbox id="checkbox1">Component</sp-checkbox>
+    <sp-checkbox id="checkbox2" checked>Component</sp-checkbox>
+    <sp-checkbox id="checkbox3" indeterminate>Component</sp-checkbox>
 `);
diff --git a/packages/clear-button/CHANGELOG.md b/packages/clear-button/CHANGELOG.md
index 56c3d885133..d5502651da4 100644
--- a/packages/clear-button/CHANGELOG.md
+++ b/packages/clear-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/clear-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/clear-button
diff --git a/packages/clear-button/package.json b/packages/clear-button/package.json
index da24761eb84..0a512593f10 100644
--- a/packages/clear-button/package.json
+++ b/packages/clear-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/clear-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -42,7 +42,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/clearbutton": "^5.0.5"
diff --git a/packages/close-button/CHANGELOG.md b/packages/close-button/CHANGELOG.md
index b91ab117826..98a73dd8d2d 100644
--- a/packages/close-button/CHANGELOG.md
+++ b/packages/close-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/close-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/close-button
diff --git a/packages/close-button/package.json b/packages/close-button/package.json
index efb3fbfb9c4..3afef5a7380 100644
--- a/packages/close-button/package.json
+++ b/packages/close-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/close-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -42,7 +42,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/closebutton": "^4.0.7"
diff --git a/packages/coachmark/CHANGELOG.md b/packages/coachmark/CHANGELOG.md
index d9f98125e49..fbc0018feb1 100644
--- a/packages/coachmark/CHANGELOG.md
+++ b/packages/coachmark/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/coachmark
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/coachmark
diff --git a/packages/coachmark/package.json b/packages/coachmark/package.json
index f38c9e40951..5865f246d5b 100644
--- a/packages/coachmark/package.json
+++ b/packages/coachmark/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/coachmark",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/coachmark": "^5.0.67"
diff --git a/packages/color-area/CHANGELOG.md b/packages/color-area/CHANGELOG.md
index 2308693d162..618b4981fa8 100644
--- a/packages/color-area/CHANGELOG.md
+++ b/packages/color-area/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/color-area
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/color-area
diff --git a/packages/color-area/package.json b/packages/color-area/package.json
index 771ad5a7d25..acaf5cca1ae 100644
--- a/packages/color-area/package.json
+++ b/packages/color-area/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/color-area",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -62,11 +62,11 @@
     ],
     "dependencies": {
         "@ctrl/tinycolor": "^3.3.3",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/color-handle": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/color-handle": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/colorarea": "^4.0.41"
diff --git a/packages/color-handle/CHANGELOG.md b/packages/color-handle/CHANGELOG.md
index c0051288aca..ff14fdf3736 100644
--- a/packages/color-handle/CHANGELOG.md
+++ b/packages/color-handle/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/color-handle
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/color-handle
diff --git a/packages/color-handle/package.json b/packages/color-handle/package.json
index 89613f2ab56..517bda7e587 100644
--- a/packages/color-handle/package.json
+++ b/packages/color-handle/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/color-handle",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,9 +57,9 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/color-loupe": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/color-loupe": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/colorhandle": "^7.0.7"
diff --git a/packages/color-loupe/CHANGELOG.md b/packages/color-loupe/CHANGELOG.md
index f55d61ed814..669d0902b93 100644
--- a/packages/color-loupe/CHANGELOG.md
+++ b/packages/color-loupe/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/color-loupe
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/color-loupe
diff --git a/packages/color-loupe/package.json b/packages/color-loupe/package.json
index 5411183bf01..1b784adb2ad 100644
--- a/packages/color-loupe/package.json
+++ b/packages/color-loupe/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/color-loupe",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/colorloupe": "^4.1.18"
diff --git a/packages/color-slider/CHANGELOG.md b/packages/color-slider/CHANGELOG.md
index 06b15c30f3b..9351d3a4400 100644
--- a/packages/color-slider/CHANGELOG.md
+++ b/packages/color-slider/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/color-slider
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/color-slider
diff --git a/packages/color-slider/package.json b/packages/color-slider/package.json
index 1e9f50cf9fc..a9ca0fc022e 100644
--- a/packages/color-slider/package.json
+++ b/packages/color-slider/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/color-slider",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -62,11 +62,11 @@
     ],
     "dependencies": {
         "@ctrl/tinycolor": "^3.3.3",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/color-handle": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/color-handle": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/colorslider": "^5.0.4"
diff --git a/packages/color-wheel/CHANGELOG.md b/packages/color-wheel/CHANGELOG.md
index 331ca9dfdf4..23be72cfdfa 100644
--- a/packages/color-wheel/CHANGELOG.md
+++ b/packages/color-wheel/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/color-wheel
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/color-wheel
diff --git a/packages/color-wheel/package.json b/packages/color-wheel/package.json
index 7911c14b8f3..2b48f23a238 100644
--- a/packages/color-wheel/package.json
+++ b/packages/color-wheel/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/color-wheel",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -62,10 +62,10 @@
     ],
     "dependencies": {
         "@ctrl/tinycolor": "^3.3.3",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/color-handle": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/color-handle": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/colorwheel": "^3.0.41"
diff --git a/packages/date-time-picker/README.md b/packages/date-time-picker/README.md
new file mode 100644
index 00000000000..a216ad27d58
--- /dev/null
+++ b/packages/date-time-picker/README.md
@@ -0,0 +1,35 @@
+## Description
+
+### Usage
+
+[![See it on NPM!](https://img.shields.io/npm/v/@spectrum-web-components/date-time-picker?style=for-the-badge)](https://www.npmjs.com/package/@spectrum-web-components/date-time-picker)
+[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@spectrum-web-components/date-time-picker?style=for-the-badge)](https://bundlephobia.com/result?p=@spectrum-web-components/date-time-picker)
+
+```
+yarn add @spectrum-web-components/date-time-picker
+```
+
+Import the side effectful registration of `<sp-date-time-picker>` via:
+
+```
+import '@spectrum-web-components/date-time-picker/sp-date-time-picker.js';
+```
+
+When looking to leverage the `DateTimePicker` base class as a type and/or for extension purposes, do so via:
+
+```
+import { DateTimePicker } from '@spectrum-web-components/date-time-picker';
+```
+
+## Example
+
+```html
+<sp-date-time-picker></sp-date-time-picker>
+```
+
+## To-do list
+
+-   Enable "receives-focus" when calendar is navigable via keyboard
+-   Review border applied to `<sp-picker-button>` when field is invalid
+-   Complete documentation
+-   Add/Review unit tests
diff --git a/packages/date-time-picker/exports.json b/packages/date-time-picker/exports.json
new file mode 100644
index 00000000000..b97b68e0fc0
--- /dev/null
+++ b/packages/date-time-picker/exports.json
@@ -0,0 +1,4 @@
+{
+    "./src/*": "./src/*.js",
+    "./sp-date-time-picker.js": "./sp-date-time-picker.js"
+}
diff --git a/packages/time-field/package.json b/packages/date-time-picker/package.json
similarity index 58%
rename from packages/time-field/package.json
rename to packages/date-time-picker/package.json
index 9f3b7b6d9da..55de70fcb65 100644
--- a/packages/time-field/package.json
+++ b/packages/date-time-picker/package.json
@@ -1,18 +1,18 @@
 {
-    "name": "@spectrum-web-components/time-field",
+    "name": "@spectrum-web-components/date-time-picker",
     "version": "0.0.1",
     "publishConfig": {
         "access": "public"
     },
-    "description": "Web component implementation of a Spectrum design TimeField",
+    "description": "Web component implementation of a Spectrum design DateTimePicker",
     "license": "Apache-2.0",
     "repository": {
         "type": "git",
         "url": "https://github.com/adobe/spectrum-web-components.git",
-        "directory": "packages/time-field"
+        "directory": "packages/date-time-picker"
     },
     "author": "",
-    "homepage": "https://adobe.github.io/spectrum-web-components/components/time-field",
+    "homepage": "https://adobe.github.io/spectrum-web-components/components/date-time-picker",
     "bugs": {
         "url": "https://github.com/adobe/spectrum-web-components/issues"
     },
@@ -25,18 +25,18 @@
             "default": "./src/index.js"
         },
         "./package.json": "./package.json",
-        "./src/TimeField.js": {
-            "development": "./src/TimeField.dev.js",
-            "default": "./src/TimeField.js"
+        "./src/DateTimePicker.js": {
+            "development": "./src/DateTimePicker.dev.js",
+            "default": "./src/DateTimePicker.js"
         },
+        "./src/date-time-picker.css.js": "./src/date-time-picker.css.js",
         "./src/index.js": {
             "development": "./src/index.dev.js",
             "default": "./src/index.js"
         },
-        "./src/time-field.css.js": "./src/time-field.css.js",
-        "./sp-time-field.js": {
-            "development": "./sp-time-field.dev.js",
-            "default": "./sp-time-field.js"
+        "./sp-date-time-picker.js": {
+            "development": "./sp-date-time-picker.dev.js",
+            "default": "./sp-date-time-picker.js"
         }
     },
     "scripts": {
@@ -57,7 +57,16 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/input-segments": "^0.0.1"
+        "@spectrum-web-components/calendar": "^0.0.1",
+        "@spectrum-web-components/field-label": "^0.40.0",
+        "@spectrum-web-components/icons-workflow": "^0.40.0",
+        "@spectrum-web-components/input-segments": "^0.0.1",
+        "@spectrum-web-components/overlay": "^0.40.0",
+        "@spectrum-web-components/picker-button": "^0.40.0",
+        "@spectrum-web-components/popover": "^0.40.0"
+    },
+    "devDependencies": {
+        "@spectrum-web-components/story-decorator": "^0.40.0"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/time-field/sp-time-field.ts b/packages/date-time-picker/sp-date-time-picker.ts
similarity index 79%
rename from packages/time-field/sp-time-field.ts
rename to packages/date-time-picker/sp-date-time-picker.ts
index 5f998e4506e..b8909a8951d 100644
--- a/packages/time-field/sp-time-field.ts
+++ b/packages/date-time-picker/sp-date-time-picker.ts
@@ -9,12 +9,12 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-import { TimeField } from './src/TimeField.js';
+import { DateTimePicker } from './src/DateTimePicker.js';
 
-customElements.define('sp-time-field', TimeField);
+customElements.define('sp-date-time-picker', DateTimePicker);
 
 declare global {
     interface HTMLElementTagNameMap {
-        'sp-time-field': TimeField;
+        'sp-date-time-picker': DateTimePicker;
     }
 }
diff --git a/packages/date-time-picker/src/DateTimePicker.ts b/packages/date-time-picker/src/DateTimePicker.ts
new file mode 100644
index 00000000000..c091561e70f
--- /dev/null
+++ b/packages/date-time-picker/src/DateTimePicker.ts
@@ -0,0 +1,158 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import {
+    CSSResultArray,
+    html,
+    TemplateResult,
+} from '@spectrum-web-components/base';
+import {
+    property,
+    state,
+} from '@spectrum-web-components/base/src/decorators.js';
+import { InputSegments } from '@spectrum-web-components/input-segments';
+
+import styles from './date-time-picker.css.js';
+
+import '@spectrum-web-components/calendar/sp-calendar.js';
+import '@spectrum-web-components/field-label/sp-field-label.js';
+import '@spectrum-web-components/icons-workflow/icons/sp-icon-calendar.js';
+import '@spectrum-web-components/overlay/sp-overlay.js';
+import '@spectrum-web-components/picker-button/sp-picker-button.js';
+import '@spectrum-web-components/popover/sp-popover.js';
+
+/**
+ * @element sp-date-time-picker
+ *
+ * @event change - Announces when a new date/time is defined by emitting a `Date` object
+ *
+ * @slot calendar-icon - The icon used in the calendar button
+ * @slot help-text - Default or non-negative help text to associate to your form element
+ * @slot negative-help-text - Negative help text to associate to your form element when `invalid`
+ */
+export class DateTimePicker extends InputSegments {
+    public static override get styles(): CSSResultArray {
+        return [...super.styles, styles];
+    }
+
+    /**
+     * Indicates whether the picker should be displayed or not
+     */
+    @property({ type: Boolean, reflect: true })
+    public open = false;
+
+    @state()
+    override includeDate = true;
+
+    @state()
+    override includeTime = true;
+
+    @state()
+    private pickerDate?: Date;
+
+    protected override renderField(): TemplateResult {
+        return html`
+            ${super.renderInputContent()} ${this.renderPicker()}
+        `;
+    }
+
+    public renderPicker(): TemplateResult {
+        const isDisabled = super.disabled || super.readonly;
+
+        return html`
+            <div class="picker">
+                ${super.renderStateIcons()}
+
+                <sp-picker-button
+                    ?open=${this.open}
+                    ?quiet=${super.quiet}
+                    ?invalid=${super.invalid}
+                    ?disabled=${isDisabled}
+                    @click=${this.openPicker}
+                >
+                    <slot name="calendar-icon" slot="icon">
+                        <sp-icon-calendar></sp-icon-calendar>
+                    </slot>
+                </sp-picker-button>
+
+                <!-- TODO: Enable "receives-focus" when calendar is navigable via keyboard -->
+                <sp-overlay
+                    placement="bottom-start"
+                    receives-focus="false"
+                    .triggerElement=${this as HTMLElement}
+                    ?open=${this.open}
+                    @sp-closed=${this.closePicker}
+                >
+                    <sp-popover class="popover">
+                        <div class="popover-content">
+                            <sp-calendar
+                                .selectedDate=${this.pickerDate}
+                                @change=${this.handleDate}
+                            ></sp-calendar>
+                        </div>
+                    </sp-popover>
+                </sp-overlay>
+            </div>
+        `;
+    }
+
+    public openPicker(): void {
+        this.pickerDate = super.getDateFromSegments();
+        this.open = true;
+    }
+
+    public closePicker(): void {
+        super.setNewDateTime();
+        super.emitNewDateTime();
+
+        this.pickerDate = undefined;
+        this.open = false;
+    }
+
+    /**
+     * Updates the value of the internal property used to define the date used by the calendar with the value received
+     *
+     * @param event - Event with the value emitted by the calendar
+     */
+    public handleDate(event: CustomEvent<Date | undefined>): void {
+        event.stopPropagation();
+
+        const dateTime = event.detail;
+
+        if (dateTime) {
+            this.updateCurrentDate(dateTime);
+        }
+    }
+
+    /**
+     * Updates the segments using the `Date` object emitted by the calendar inside the picker
+     */
+    private updateCurrentDate(dateTime: Date): void {
+        this.pickerDate = dateTime;
+
+        const { year, month, day } = this.dateToCalendarDateTime(dateTime);
+
+        if (!super.yearSegment || !super.monthSegment || !super.daySegment) {
+            return;
+        }
+
+        super.yearSegment.value = year;
+        super.formatValue(super.yearSegment);
+
+        super.monthSegment.value = month;
+        super.formatValue(super.monthSegment);
+
+        super.daySegment.value = day;
+        super.formatValue(super.daySegment);
+
+        super.requestUpdate();
+    }
+}
diff --git a/packages/date-time-picker/src/date-time-picker.css b/packages/date-time-picker/src/date-time-picker.css
new file mode 100644
index 00000000000..27770aaee62
--- /dev/null
+++ b/packages/date-time-picker/src/date-time-picker.css
@@ -0,0 +1,58 @@
+/*
+Copyright 2023 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+:host {
+    --datetime-picker-spacing: calc(
+        var(
+                --mod-textfield-spacing-inline,
+                var(--spectrum-textfield-spacing-inline)
+            ) -
+            var(
+                --mod-textfield-border-width,
+                var(--spectrum-textfield-border-width)
+            )
+    );
+
+    inline-size: calc(
+        20ch +
+            (
+                var(
+                        --mod-textfield-icon-size-invalid,
+                        var(--spectrum-textfield-icon-size-invalid)
+                    ) * 3
+            ) + var(--mod-textfield-height, var(--spectrum-textfield-height))
+    );
+}
+
+:host([valid]) #textfield .icon,
+:host([invalid]) #textfield .icon {
+    position: relative;
+    inset: initial;
+}
+
+.picker {
+    position: absolute;
+    inset-block-start: 0;
+    inset-inline-end: 0;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    height: 100%;
+    gap: var(--datetime-picker-spacing);
+}
+
+.popover {
+    overflow-y: auto;
+}
+
+.popover-content {
+    padding: var(--spectrum-spacing-300);
+}
diff --git a/packages/time-field/src/index.ts b/packages/date-time-picker/src/index.ts
similarity index 94%
rename from packages/time-field/src/index.ts
rename to packages/date-time-picker/src/index.ts
index 2c5490778da..543d0a07f8b 100644
--- a/packages/time-field/src/index.ts
+++ b/packages/date-time-picker/src/index.ts
@@ -9,4 +9,4 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-export * from './TimeField.js';
+export * from './DateTimePicker.js';
diff --git a/packages/time-field/stories/time-field.stories.ts b/packages/date-time-picker/stories/date-time-picker.stories.ts
similarity index 52%
rename from packages/time-field/stories/time-field.stories.ts
rename to packages/date-time-picker/stories/date-time-picker.stories.ts
index a176b56ec3f..fba2338f355 100644
--- a/packages/time-field/stories/time-field.stories.ts
+++ b/packages/date-time-picker/stories/date-time-picker.stories.ts
@@ -9,182 +9,92 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-import { html, nothing, TemplateResult } from '@spectrum-web-components/base';
+import {
+    html,
+    nothing,
+    render,
+    TemplateResult,
+} from '@spectrum-web-components/base';
 import { TimeGranularity } from '@spectrum-web-components/input-segments/src/types.js';
+import { defaultLocale } from '@spectrum-web-components/story-decorator/src/StoryDecorator.js';
 
 import { spreadProps } from '../../../test/lit-helpers.js';
 
+import '@spectrum-web-components/date-time-picker/sp-date-time-picker.js';
 import '@spectrum-web-components/help-text/sp-help-text.js';
-import '@spectrum-web-components/time-field/sp-time-field.js';
+import '@spectrum-web-components/icons-workflow/icons/sp-icon-alert.js';
 import '@spectrum-web-components/theme/sp-theme.js';
 
-const locales = [
-    'cs-CZ',
-    'cy-GB',
-    'da-DK',
-    'de-DE',
-    'en-GB',
-    'en-US',
-    'es-ES',
-    'fi-FI',
-    'fr-FR',
-    'hu-HU',
-    'it-IT',
-    'ja-JP',
-    'ko-KR',
-    'nb-NO',
-    'nl-NL',
-    'pl-PL',
-    'pt-BR',
-    'ru-RU',
-    'sv-SE',
-    'tr-TR',
-    'uk-UA',
-    'zh-Hans-CN',
-    'zh-Hans-CN-u-nu-hanidec',
-    'zh-Hant-TW',
-    'zz-ZY',
-    'zz-ZZ',
-] as const;
-
-const defaultLocale = 'en-US';
-
-const timeGranularities: TimeGranularity[] = ['hour', 'minute', 'second'];
-
-const hiddenProperty = {
-    table: {
-        disable: true,
-    },
-};
-
 export default {
-    title: 'Time Field',
-    component: 'sp-time-field',
-
-    argTypes: {
-        lang: {
-            options: locales,
-            control: {
-                type: 'select',
-            },
-            table: {
-                defaultValue: {
-                    summary: defaultLocale,
-                },
-            },
-        },
-
-        // Don't render private properties and getters in the Storybook UI
-        firstEditableSegment: { ...hiddenProperty },
-        includeDate: { ...hiddenProperty },
-        includeTime: { ...hiddenProperty },
-        previousLocale: { ...hiddenProperty },
-        currentDateTime: { ...hiddenProperty },
-        newDateTime: { ...hiddenProperty },
-        segments: { ...hiddenProperty },
-        createSegments: { ...hiddenProperty },
-        languageResolver: { ...hiddenProperty },
-        timeZone: { ...hiddenProperty },
-        formatter: { ...hiddenProperty },
-        locale: { ...hiddenProperty },
-        daySegment: { ...hiddenProperty },
-        monthSegment: { ...hiddenProperty },
-        yearSegment: { ...hiddenProperty },
-        hourSegment: { ...hiddenProperty },
-        minuteSegment: { ...hiddenProperty },
-        secondSegment: { ...hiddenProperty },
-        dayPeriodSegment: { ...hiddenProperty },
-        is12HourClock: { ...hiddenProperty },
-
-        // Inherited
-        _dirParent: { ...hiddenProperty },
-        shadowRoot: { ...hiddenProperty },
-        dir: { ...hiddenProperty },
-        isLTR: { ...hiddenProperty },
-        'allowed-keys': { ...hiddenProperty },
-        allowedKeys: { ...hiddenProperty },
-        autocomplete: { ...hiddenProperty },
-        displayValue: { ...hiddenProperty },
-        focused: { ...hiddenProperty },
-        focusElement: { ...hiddenProperty },
-        grows: { ...hiddenProperty },
-        inputElement: { ...hiddenProperty },
-        label: { ...hiddenProperty },
-        maxlength: { ...hiddenProperty },
-        minlength: { ...hiddenProperty },
-        multiline: { ...hiddenProperty },
-        pattern: { ...hiddenProperty },
-        placeholder: { ...hiddenProperty },
-        renderInput: { ...hiddenProperty },
-        renderMultiline: { ...hiddenProperty },
-        type: { ...hiddenProperty },
-        value: { ...hiddenProperty },
-        _type: { ...hiddenProperty },
-        _value: { ...hiddenProperty },
-        input: { ...hiddenProperty },
-    },
-
-    args: {
-        lang: defaultLocale,
-    },
-
+    title: 'Date∕Time Picker',
+    component: 'sp-date-time-picker',
     parameters: {
-        controls: {
-            // Hide "This story is not configured to handle controls" warning
-            hideNoControlsWarning: true,
-        },
         actions: {
             handles: ['onChange'],
         },
     },
 };
 
-interface StoryArgs {
-    lang?: string;
+const timeGranularities: TimeGranularity[] = ['hour', 'minute', 'second'];
 
+type ComponentArgs = {
     selectedDateTime?: Date;
     timeGranularity?: TimeGranularity;
     quiet?: boolean;
     disabled?: boolean;
     readonly?: boolean;
+    autofocus?: boolean;
     valid?: boolean;
     invalid?: boolean;
+};
 
+type StoryArgs = ComponentArgs & {
     onChange?: (dateTime: Date) => void;
+};
 
+interface SpreadStoryArgs {
     [prop: string]: unknown;
 }
 
-const renderTimeField = (
+const renderDateTimePicker = (
     title: string,
     args: StoryArgs = {},
     content: TemplateResult | typeof nothing = nothing
 ): TemplateResult => {
+    const story = html`
+        <h1>${title}</h1>
+        <hr />
+        <sp-date-time-picker
+            ...=${spreadProps(args as SpreadStoryArgs)}
+            @change=${args.onChange}
+        >
+            ${content}
+        </sp-date-time-picker>
+    `;
+
+    const randomId = String(Math.floor(Math.random() * 99999));
+
+    requestAnimationFrame(() => {
+        const container = document.querySelector(
+            `.story-container-${randomId}`
+        );
+
+        if (container) {
+            render(story, container as HTMLElement);
+        }
+    });
+
     return html`
-        <style>
-            .demo-title,
-            .demo-subtitle {
-                line-height: 1.25;
-            }
-        </style>
-
-        <sp-theme lang=${args.lang ?? defaultLocale}>
-            <h1 class="demo-title">${title}</h1>
-            <h2 class="demo-subtitle">Locale: ${args.lang}</h2>
-            <hr />
-            <sp-time-field ...=${spreadProps(args)} @change=${args.onChange}>
-                ${content}
-            </sp-time-field>
-        </sp-theme>
+        <div class="story-container-${randomId}"></div>
     `;
 };
 
 export const Default = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField('Default', args);
+    return renderDateTimePicker('Default', args);
 };
 
 export const selectedDateTime = (args: StoryArgs = {}): TemplateResult[] => {
-    const formatter = Intl.DateTimeFormat(args.lang ?? defaultLocale, {
+    const formatter = Intl.DateTimeFormat(defaultLocale, {
         day: 'numeric',
         month: 'short',
         year: 'numeric',
@@ -205,7 +115,7 @@ export const selectedDateTime = (args: StoryArgs = {}): TemplateResult[] => {
             selectedDateTime: dateTime,
         };
 
-        return renderTimeField(title, args);
+        return renderDateTimePicker(title, args);
     });
 };
 
@@ -215,7 +125,10 @@ export const timeGranularity = (args: StoryArgs = {}): TemplateResult => {
         timeGranularity: args.timeGranularity,
     };
 
-    return renderTimeField(`Time Granularity: ${args.timeGranularity}`, args);
+    return renderDateTimePicker(
+        `Time Granularity: ${args.timeGranularity}`,
+        args
+    );
 };
 
 timeGranularity.argTypes = {
@@ -237,7 +150,7 @@ timeGranularity.args = {
 };
 
 export const disabled = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField(`Disabled? ${args.disabled}`, args);
+    return renderDateTimePicker(`Disabled? ${args.disabled}`, args);
 };
 
 disabled.argTypes = {
@@ -256,7 +169,7 @@ disabled.args = {
 };
 
 export const quiet = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField(`Quiet? ${args.quiet}`, args);
+    return renderDateTimePicker(`Quiet? ${args.quiet}`, args);
 };
 
 quiet.argTypes = {
@@ -275,7 +188,7 @@ quiet.args = {
 };
 
 export const readonly = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField(`Read only? ${args.readonly}`, args);
+    return renderDateTimePicker(`Read only? ${args.readonly}`, args);
 };
 
 readonly.argTypes = {
@@ -299,11 +212,11 @@ export const autoFocus = (args: StoryArgs = {}): TemplateResult => {
         autofocus: true,
     };
 
-    return renderTimeField('Auto focus', args);
+    return renderDateTimePicker('Auto focus', args);
 };
 
 export const valid = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField(`Is valid? ${args.valid}`, args);
+    return renderDateTimePicker(`Is valid? ${args.valid}`, args);
 };
 
 valid.argTypes = {
@@ -322,7 +235,7 @@ valid.args = {
 };
 
 export const invalid = (args: StoryArgs = {}): TemplateResult => {
-    return renderTimeField(`Is invalid? ${args.invalid}`, args);
+    return renderDateTimePicker(`Is invalid? ${args.invalid}`, args);
 };
 
 invalid.argTypes = {
@@ -345,7 +258,7 @@ export const helpText = (args: StoryArgs = {}): TemplateResult => {
         <sp-help-text slot="help-text">My default help text</sp-help-text>
     `;
 
-    return renderTimeField(`With help text`, args, content);
+    return renderDateTimePicker(`With help text`, args, content);
 };
 
 export const negativeHelpText = (args: StoryArgs = {}): TemplateResult => {
@@ -358,7 +271,7 @@ export const negativeHelpText = (args: StoryArgs = {}): TemplateResult => {
         </sp-help-text>
     `;
 
-    return renderTimeField(`With negative help text`, args, content);
+    return renderDateTimePicker('With negative help text', args, content);
 };
 
 negativeHelpText.argTypes = {
@@ -375,3 +288,11 @@ negativeHelpText.argTypes = {
 negativeHelpText.args = {
     invalid: true,
 };
+
+export const customIcon = (args: StoryArgs = {}): TemplateResult => {
+    const content = html`
+        <sp-icon-alert slot="calendar-icon"></sp-icon-alert>
+    `;
+
+    return renderDateTimePicker('Custom icon', args, content);
+};
diff --git a/packages/time-field/test/benchmark/basic-test.ts b/packages/date-time-picker/test/benchmark/basic-test.ts
similarity index 86%
rename from packages/time-field/test/benchmark/basic-test.ts
rename to packages/date-time-picker/test/benchmark/basic-test.ts
index 5192687fdc7..68adff096f8 100644
--- a/packages/time-field/test/benchmark/basic-test.ts
+++ b/packages/date-time-picker/test/benchmark/basic-test.ts
@@ -9,10 +9,10 @@ the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTA
 OF ANY KIND, either express or implied. See the License for the specific language
 governing permissions and limitations under the License.
 */
-import '@spectrum-web-components/time-field/sp-time-field.js';
+import '@spectrum-web-components/date-time-picker/sp-date-time-picker.js';
 import { html } from '@spectrum-web-components/base';
 import { measureFixtureCreation } from '../../../../test/benchmark/helpers.js';
 
 measureFixtureCreation(html`
-    <sp-time-field></sp-time-field>
+    <sp-date-time-picker></sp-date-time-picker>
 `);
diff --git a/packages/time-field/test/time-field.test.ts b/packages/date-time-picker/test/date-time-picker.test.ts
similarity index 71%
rename from packages/time-field/test/time-field.test.ts
rename to packages/date-time-picker/test/date-time-picker.test.ts
index 56127d9e2bb..f1b6245eb5f 100644
--- a/packages/time-field/test/time-field.test.ts
+++ b/packages/date-time-picker/test/date-time-picker.test.ts
@@ -11,23 +11,23 @@ governing permissions and limitations under the License.
 */
 import { elementUpdated, expect, fixture, html } from '@open-wc/testing';
 
-import '../sp-time-field.js';
-import { TimeField } from '..';
+import '../sp-date-time-picker.js';
+import { DateTimePicker } from '..';
 import { testForLitDevWarnings } from '../../../test/testing-helpers.js';
 
-describe('TimeField', () => {
+describe('DateTimePicker', () => {
     testForLitDevWarnings(
         async () =>
-            await fixture<TimeField>(
+            await fixture<DateTimePicker>(
                 html`
-                    <sp-time-field></sp-time-field>
+                    <sp-date-time-picker></sp-date-time-picker>
                 `
             )
     );
-    it('loads default time-field accessibly', async () => {
-        const el = await fixture<TimeField>(
+    it('loads default date-time-picker accessibly', async () => {
+        const el = await fixture<DateTimePicker>(
             html`
-                <sp-time-field></sp-time-field>
+                <sp-date-time-picker></sp-date-time-picker>
             `
         );
 
diff --git a/packages/time-field/tsconfig.json b/packages/date-time-picker/tsconfig.json
similarity index 100%
rename from packages/time-field/tsconfig.json
rename to packages/date-time-picker/tsconfig.json
diff --git a/packages/dialog/CHANGELOG.md b/packages/dialog/CHANGELOG.md
index c54861911f3..f95640b4907 100644
--- a/packages/dialog/CHANGELOG.md
+++ b/packages/dialog/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/dialog
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/dialog
diff --git a/packages/dialog/package.json b/packages/dialog/package.json
index 78d087e383c..a487fa8380e 100644
--- a/packages/dialog/package.json
+++ b/packages/dialog/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/dialog",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -73,15 +73,15 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/alert-dialog": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/button-group": "^0.40.0",
-        "@spectrum-web-components/divider": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/modal": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/underlay": "^0.40.0"
+        "@spectrum-web-components/alert-dialog": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/button-group": "^0.40.1",
+        "@spectrum-web-components/divider": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/modal": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/underlay": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/dialog": "^6.0.68"
diff --git a/packages/divider/CHANGELOG.md b/packages/divider/CHANGELOG.md
index c76405a713b..1f45d7cc3de 100644
--- a/packages/divider/CHANGELOG.md
+++ b/packages/divider/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/divider
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/divider
diff --git a/packages/divider/package.json b/packages/divider/package.json
index ee218cca623..7141de15d8e 100644
--- a/packages/divider/package.json
+++ b/packages/divider/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/divider",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/divider": "^2.1.25"
diff --git a/packages/dropzone/CHANGELOG.md b/packages/dropzone/CHANGELOG.md
index 5cfe2c38df8..60a9552cc87 100644
--- a/packages/dropzone/CHANGELOG.md
+++ b/packages/dropzone/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/dropzone
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/dropzone
diff --git a/packages/dropzone/package.json b/packages/dropzone/package.json
index 70b7c1ed3bc..03b847fc967 100644
--- a/packages/dropzone/package.json
+++ b/packages/dropzone/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/dropzone",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,10 +57,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
-        "@spectrum-css/dropzone": "^5.0.29"
+        "@spectrum-css/dropzone": "^5.0.30"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/dropzone/src/spectrum-dropzone.css b/packages/dropzone/src/spectrum-dropzone.css
index 67d3be0f816..da5adb2300f 100644
--- a/packages/dropzone/src/spectrum-dropzone.css
+++ b/packages/dropzone/src/spectrum-dropzone.css
@@ -236,8 +236,18 @@ governing permissions and limitations under the License.
 :host([dragged]) .is-filled {
     --mod-drop-zone-content-display: flex;
 }
-:host(:focus),
-:host:focus-within {
+:host(.focus-visible) {
+    --mod-drop-zone-border-style: solid;
+    --spectrum-drop-zone-border-color: var(
+        --highcontrast-drop-zone-border-color-hover,
+        var(
+            --mod-drop-zone-border-color-hover,
+            var(--spectrum-drop-zone-border-color-hover)
+        )
+    );
+    outline: 0;
+}
+:host(:focus-visible) {
     --mod-drop-zone-border-style: solid;
     --spectrum-drop-zone-border-color: var(
         --highcontrast-drop-zone-border-color-hover,
diff --git a/packages/field-group/CHANGELOG.md b/packages/field-group/CHANGELOG.md
index 9af17fcac11..80440f5b3fa 100644
--- a/packages/field-group/CHANGELOG.md
+++ b/packages/field-group/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/field-group
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/field-group/package.json b/packages/field-group/package.json
index c994a43f745..c6b5be56a37 100644
--- a/packages/field-group/package.json
+++ b/packages/field-group/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/field-group",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/help-text": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/help-text": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/fieldgroup": "^4.0.72"
diff --git a/packages/field-label/CHANGELOG.md b/packages/field-label/CHANGELOG.md
index 61640ac743d..c4418dc07fd 100644
--- a/packages/field-label/CHANGELOG.md
+++ b/packages/field-label/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/field-label
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/field-label
diff --git a/packages/field-label/package.json b/packages/field-label/package.json
index 5b2dfcda9c4..ffdd08b63fc 100644
--- a/packages/field-label/package.json
+++ b/packages/field-label/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/field-label",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/fieldlabel": "^7.0.33"
diff --git a/packages/help-text/CHANGELOG.md b/packages/help-text/CHANGELOG.md
index eeac4345702..0c8eabb5184 100644
--- a/packages/help-text/CHANGELOG.md
+++ b/packages/help-text/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/help-text
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/help-text
diff --git a/packages/help-text/package.json b/packages/help-text/package.json
index 3240f0ac5c2..c3683635211 100644
--- a/packages/help-text/package.json
+++ b/packages/help-text/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/help-text",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -77,8 +77,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/helptext": "^4.0.54"
diff --git a/packages/icon/CHANGELOG.md b/packages/icon/CHANGELOG.md
index 4140e9fcc2d..606ea67698b 100644
--- a/packages/icon/CHANGELOG.md
+++ b/packages/icon/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/icon
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/icon
diff --git a/packages/icon/package.json b/packages/icon/package.json
index d5078ba8655..d3b0427f503 100644
--- a/packages/icon/package.json
+++ b/packages/icon/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/icon",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -71,8 +71,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/iconset": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/iconset": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/icon": "^4.0.3"
diff --git a/packages/icons-ui/CHANGELOG.md b/packages/icons-ui/CHANGELOG.md
index 9e3af61d056..24f61b65e40 100644
--- a/packages/icons-ui/CHANGELOG.md
+++ b/packages/icons-ui/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/icons-ui
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/icons-ui
diff --git a/packages/icons-ui/package.json b/packages/icons-ui/package.json
index 91d056ce58b..4e94c9dfc6b 100644
--- a/packages/icons-ui/package.json
+++ b/packages/icons-ui/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/icons-ui",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -44,9 +44,9 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/iconset": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/iconset": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/icon": "^4.0.3",
diff --git a/packages/icons-workflow/CHANGELOG.md b/packages/icons-workflow/CHANGELOG.md
index 7c32e756122..d4f214ada80 100644
--- a/packages/icons-workflow/CHANGELOG.md
+++ b/packages/icons-workflow/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/icons-workflow
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/icons-workflow
diff --git a/packages/icons-workflow/package.json b/packages/icons-workflow/package.json
index 017c6fb6846..bd379b43ceb 100644
--- a/packages/icons-workflow/package.json
+++ b/packages/icons-workflow/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/icons-workflow",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -44,8 +44,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1"
     },
     "devDependencies": {
         "@adobe/spectrum-css-workflow-icons": "^1.5.4",
diff --git a/packages/icons/CHANGELOG.md b/packages/icons/CHANGELOG.md
index d579bbb4e87..bb6e81483ea 100644
--- a/packages/icons/CHANGELOG.md
+++ b/packages/icons/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/icons
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/icons
diff --git a/packages/icons/package.json b/packages/icons/package.json
index ceb818525fc..dd4803e5ad8 100644
--- a/packages/icons/package.json
+++ b/packages/icons/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/icons",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -72,8 +72,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/iconset": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/iconset": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/iconset/CHANGELOG.md b/packages/iconset/CHANGELOG.md
index 259e6c6eec3..9237253887c 100644
--- a/packages/iconset/CHANGELOG.md
+++ b/packages/iconset/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/iconset
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/iconset
diff --git a/packages/iconset/package.json b/packages/iconset/package.json
index 074f44e2635..eff6ed7d9dc 100644
--- a/packages/iconset/package.json
+++ b/packages/iconset/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/iconset",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -59,7 +59,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/illustrated-message/CHANGELOG.md b/packages/illustrated-message/CHANGELOG.md
index 9cd1ddef4a6..a475b50e78d 100644
--- a/packages/illustrated-message/CHANGELOG.md
+++ b/packages/illustrated-message/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/illustrated-message
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/illustrated-message
diff --git a/packages/illustrated-message/package.json b/packages/illustrated-message/package.json
index 183396ea71a..e089ff1c848 100644
--- a/packages/illustrated-message/package.json
+++ b/packages/illustrated-message/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/illustrated-message",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/illustratedmessage": "^6.0.29"
diff --git a/packages/infield-button/CHANGELOG.md b/packages/infield-button/CHANGELOG.md
index 514cf0229b9..38e4a57a910 100644
--- a/packages/infield-button/CHANGELOG.md
+++ b/packages/infield-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/infield-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/infield-button
diff --git a/packages/infield-button/package.json b/packages/infield-button/package.json
index bc253f749a3..577d815781f 100644
--- a/packages/infield-button/package.json
+++ b/packages/infield-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/infield-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/infieldbutton": "^4.0.1"
diff --git a/packages/link/CHANGELOG.md b/packages/link/CHANGELOG.md
index d6e794fa310..5b3ddb733ee 100644
--- a/packages/link/CHANGELOG.md
+++ b/packages/link/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/link
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/link
diff --git a/packages/link/package.json b/packages/link/package.json
index 8abae1936f5..246d55dc65d 100644
--- a/packages/link/package.json
+++ b/packages/link/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/link",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/link": "^4.0.65"
diff --git a/packages/menu/CHANGELOG.md b/packages/menu/CHANGELOG.md
index ebec4d322b5..bee4320196f 100644
--- a/packages/menu/CHANGELOG.md
+++ b/packages/menu/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/menu
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/menu
diff --git a/packages/menu/package.json b/packages/menu/package.json
index 206025bc061..2481a99ab20 100644
--- a/packages/menu/package.json
+++ b/packages/menu/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/menu",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -85,14 +85,14 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/action-button": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/divider": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0",
-        "@spectrum-web-components/popover": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/action-button": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/divider": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1",
+        "@spectrum-web-components/popover": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/menu": "^5.0.10"
diff --git a/packages/meter/CHANGELOG.md b/packages/meter/CHANGELOG.md
index 12c5a404f17..c1028210fe6 100644
--- a/packages/meter/CHANGELOG.md
+++ b/packages/meter/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/meter
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/meter
diff --git a/packages/meter/package.json b/packages/meter/package.json
index c120b196ccf..615b51f3bd3 100644
--- a/packages/meter/package.json
+++ b/packages/meter/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/meter",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,10 +57,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/progressbar": "^3.0.73"
diff --git a/packages/modal/CHANGELOG.md b/packages/modal/CHANGELOG.md
index ec1ff57c571..d5c7159a5e9 100644
--- a/packages/modal/CHANGELOG.md
+++ b/packages/modal/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/modal
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/modal
diff --git a/packages/modal/package.json b/packages/modal/package.json
index a0929f0ee6c..a37fca18cc0 100644
--- a/packages/modal/package.json
+++ b/packages/modal/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/modal",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -43,7 +43,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/modal": "^3.1.0"
diff --git a/packages/number-field/CHANGELOG.md b/packages/number-field/CHANGELOG.md
index 1114da54e47..b02cc2b4db9 100644
--- a/packages/number-field/CHANGELOG.md
+++ b/packages/number-field/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/number-field
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/number-field/package.json b/packages/number-field/package.json
index 6bfe59a7687..5b163d9fe1a 100644
--- a/packages/number-field/package.json
+++ b/packages/number-field/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/number-field",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -58,13 +58,13 @@
     ],
     "dependencies": {
         "@internationalized/number": "^3.1.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/infield-button": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/textfield": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/infield-button": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/textfield": "^0.40.1"
     },
     "devDependencies": {
         "@formatjs/intl-numberformat": "^8.3.5",
diff --git a/packages/overlay/CHANGELOG.md b/packages/overlay/CHANGELOG.md
index 6f23477b671..9079a0be6b9 100644
--- a/packages/overlay/CHANGELOG.md
+++ b/packages/overlay/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **overlay:** ensure events are only bound once ([abe57ce](https://github.com/adobe/spectrum-web-components/commit/abe57cedcc18a309f3acf1b664bfa561f13b4f8f))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/overlay/package.json b/packages/overlay/package.json
index a7f330f688c..3fc95cc6e66 100644
--- a/packages/overlay/package.json
+++ b/packages/overlay/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/overlay",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -128,11 +128,11 @@
     "dependencies": {
         "@floating-ui/dom": "^1.5.3",
         "@floating-ui/utils": "^0.1.6",
-        "@spectrum-web-components/action-button": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/theme": "^0.40.0"
+        "@spectrum-web-components/action-button": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/theme": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/overlay/src/Overlay.ts b/packages/overlay/src/Overlay.ts
index a2f5d960841..3639c277f1e 100644
--- a/packages/overlay/src/Overlay.ts
+++ b/packages/overlay/src/Overlay.ts
@@ -504,6 +504,8 @@ export class Overlay extends OverlayFeatures {
 
     protected bindEvents(): void {
         if (!this.hasNonVirtualTrigger) return;
+        // Clean up listeners if they've already been bound
+        this.abortController?.abort();
         this.abortController = new AbortController();
         const nextTriggerElement = this.triggerElement as HTMLElement;
         switch (this.triggerInteraction) {
@@ -583,7 +585,9 @@ export class Overlay extends OverlayFeatures {
         );
     }
 
-    protected manageTriggerElement(triggerElement: HTMLElement | null): void {
+    protected manageTriggerElement(
+        triggerElement: HTMLElement | undefined
+    ): void {
         if (triggerElement) {
             this.unbindEvents();
             this.releaseAriaDescribedby();
@@ -928,13 +932,17 @@ export class Overlay extends OverlayFeatures {
                 | 'hover'
                 | undefined;
         }
-        const oldTrigger = this.triggerElement as HTMLElement;
+        // Merge multiple possible calls to manageTriggerElement().
+        let oldTrigger: HTMLElement | false | undefined = false;
         if (changes.has(elementResolverUpdatedSymbol)) {
+            oldTrigger = this.triggerElement as HTMLElement;
             this.triggerElement = this.elementResolver.element;
-            this.manageTriggerElement(oldTrigger);
         }
         if (changes.has('triggerElement')) {
-            this.manageTriggerElement(changes.get('triggerElement'));
+            oldTrigger = changes.get('triggerElement');
+        }
+        if (oldTrigger !== false) {
+            this.manageTriggerElement(oldTrigger);
         }
     }
 
diff --git a/packages/overlay/stories/overlay-element.stories.ts b/packages/overlay/stories/overlay-element.stories.ts
index 7dc6b4a0c9c..429bb02259c 100644
--- a/packages/overlay/stories/overlay-element.stories.ts
+++ b/packages/overlay/stories/overlay-element.stories.ts
@@ -26,6 +26,7 @@ import '@spectrum-web-components/icons-workflow/icons/sp-icon-rect-select.js';
 import { Placement } from '@floating-ui/dom';
 import { OverlayTypes } from '../src/overlay-types.js';
 import { notAgain } from '../../dialog/stories/dialog-base.stories.js';
+import './overlay-story-components.js';
 
 export default {
     title: 'Overlay Element',
@@ -587,3 +588,11 @@ export const actionGroupWithFilters = ({
         </sp-overlay>
     `;
 };
+
+// Test #3795 in browser
+export const transientHover = (): TemplateResult => html`
+    <transient-hover></transient-hover>
+`;
+transientHover.swc_vrt = {
+    skip: true,
+};
diff --git a/packages/overlay/stories/overlay-story-components.ts b/packages/overlay/stories/overlay-story-components.ts
index e08149c73ae..afc6e07b5cc 100644
--- a/packages/overlay/stories/overlay-story-components.ts
+++ b/packages/overlay/stories/overlay-story-components.ts
@@ -344,3 +344,35 @@ declare global {
         'popover-content': PopoverContent;
     }
 }
+
+export default class TransientHover extends LitElement {
+    @property()
+    open = false;
+
+    protected override render(): TemplateResult {
+        return html`
+            <sp-button variant="primary" id="triggerButton">
+                Button popover
+            </sp-button>
+            <sp-overlay
+                type="auto"
+                trigger="triggerButton@click"
+                @sp-opened=${() => {
+                    this.open = true;
+                }}
+            >
+                <sp-popover>My Popover</sp-popover>
+            </sp-overlay>
+
+            ${!this.open
+                ? html`
+                      <sp-overlay trigger="triggerButton@hover" type="hint">
+                          <sp-tooltip placement="right">My tooltip</sp-tooltip>
+                      </sp-overlay>
+                  `
+                : html``}
+        `;
+    }
+}
+
+customElements.define('transient-hover', TransientHover);
diff --git a/packages/overlay/test/index.ts b/packages/overlay/test/index.ts
index 90d9c8008b4..4220932f8dc 100644
--- a/packages/overlay/test/index.ts
+++ b/packages/overlay/test/index.ts
@@ -628,7 +628,7 @@ export const runOverlayTriggerTests = (type: string): void => {
                 expect(await isOnTopLayer(this.hoverContent)).to.be.false;
 
                 const rect = this.outerTrigger.getBoundingClientRect();
-                const close = oneEvent(this.outerTrigger, 'sp-closed');
+                const open = oneEvent(this.outerTrigger, 'sp-opened');
                 await sendMouse({
                     steps: [
                         {
@@ -640,10 +640,12 @@ export const runOverlayTriggerTests = (type: string): void => {
                         },
                     ],
                 });
-                await nextFrame();
-                await nextFrame();
-                await nextFrame();
-                await nextFrame();
+                await open;
+                const close = oneEvent(this.outerTrigger, 'sp-closed');
+                expect(
+                    await isOnTopLayer(this.hoverContent),
+                    'hover content is available at point'
+                ).to.be.true;
                 await sendMouse({
                     steps: [
                         {
diff --git a/packages/overlay/test/overlay-update.test.ts b/packages/overlay/test/overlay-update.test.ts
index 0015c827578..78fefa477dc 100644
--- a/packages/overlay/test/overlay-update.test.ts
+++ b/packages/overlay/test/overlay-update.test.ts
@@ -23,6 +23,9 @@ describe('sp-update-overlays event', () => {
             '[label="Other things"]'
         ) as AccordionItem;
 
+        el.content = 'click';
+        await elementUpdated(el);
+
         const height0 = container.getBoundingClientRect().height;
 
         const opened = oneEvent(el, 'sp-opened');
diff --git a/packages/picker-button/CHANGELOG.md b/packages/picker-button/CHANGELOG.md
index c5c32ca8e59..494b1938c84 100644
--- a/packages/picker-button/CHANGELOG.md
+++ b/packages/picker-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/picker-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/picker-button
diff --git a/packages/picker-button/package.json b/packages/picker-button/package.json
index a3a85f790f8..8a74ed4db6a 100644
--- a/packages/picker-button/package.json
+++ b/packages/picker-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/picker-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -52,11 +52,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/pickerbutton": "^4.0.12"
diff --git a/packages/picker-button/src/PickerButton.ts b/packages/picker-button/src/PickerButton.ts
index 9fa2e11305a..ea795ab2a56 100644
--- a/packages/picker-button/src/PickerButton.ts
+++ b/packages/picker-button/src/PickerButton.ts
@@ -45,6 +45,9 @@ export class PickerButton extends SizedMixin(
     @property({ type: Boolean, reflect: true })
     invalid = false;
 
+    @property({ type: Boolean, reflect: true })
+    quiet = false;
+
     @property({ reflect: true })
     position: 'left' | 'right' = 'right';
 
@@ -57,6 +60,7 @@ export class PickerButton extends SizedMixin(
             root: true,
             uiicononly: !this.hasText,
             textuiicon: this.hasText,
+            'spectrum-PickerButton--quiet': this.quiet,
         };
         return html`
             <div class=${classMap(rootClasses)}>
diff --git a/packages/picker-button/stories/picker-button-sizes.stories.ts b/packages/picker-button/stories/picker-button-sizes.stories.ts
index 92adeac55e2..15459cbdbf2 100644
--- a/packages/picker-button/stories/picker-button-sizes.stories.ts
+++ b/packages/picker-button/stories/picker-button-sizes.stories.ts
@@ -12,7 +12,8 @@ governing permissions and limitations under the License.
 import { TemplateResult } from '@spectrum-web-components/base';
 
 import { argTypes, StoryArgs, Template } from './index.js';
-import '../sp-picker-button.js';
+
+import '@spectrum-web-components/picker-button/sp-picker-button.js';
 
 export default {
     title: 'Picker Button/Sizes',
diff --git a/packages/picker-button/stories/picker-button.stories.ts b/packages/picker-button/stories/picker-button.stories.ts
index 614e30aac1b..5510287005f 100644
--- a/packages/picker-button/stories/picker-button.stories.ts
+++ b/packages/picker-button/stories/picker-button.stories.ts
@@ -13,9 +13,9 @@ governing permissions and limitations under the License.
 import { html, TemplateResult } from '@spectrum-web-components/base';
 
 import { argTypes, StoryArgs, Template } from './index.js';
-import '../sp-picker-button.js';
 
 import '@spectrum-web-components/icons-workflow/icons/sp-icon-add.js';
+import '@spectrum-web-components/picker-button/sp-picker-button.js';
 
 export default {
     title: 'Picker Button',
@@ -39,6 +39,9 @@ customIcon.args = {
 export const invalid = (args: StoryArgs): TemplateResult => Template(args);
 invalid.args = { invalid: true };
 
+export const quiet = (args: StoryArgs): TemplateResult => Template(args);
+quiet.args = { quiet: true };
+
 export const label = (args: StoryArgs): TemplateResult => Template(args);
 label.args = { label: true };
 
diff --git a/packages/picker/CHANGELOG.md b/packages/picker/CHANGELOG.md
index 70288ce2c43..10906dba0a1 100644
--- a/packages/picker/CHANGELOG.md
+++ b/packages/picker/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **picker:** ensure menu placement in mobile ([#3835](https://github.com/adobe/spectrum-web-components/issues/3835)) ([4aba1c6](https://github.com/adobe/spectrum-web-components/commit/4aba1c6094e45481dec428fcc95fb4148f62dbc9))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/picker
diff --git a/packages/picker/package.json b/packages/picker/package.json
index 2f7ca4b9874..af24e523778 100644
--- a/packages/picker/package.json
+++ b/packages/picker/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/picker",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -65,17 +65,17 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/menu": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0",
-        "@spectrum-web-components/popover": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/tray": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/menu": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1",
+        "@spectrum-web-components/popover": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/tray": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/picker": "^7.0.8"
diff --git a/packages/picker/src/Picker.ts b/packages/picker/src/Picker.ts
index b7f54e8973d..cfc0455178d 100644
--- a/packages/picker/src/Picker.ts
+++ b/packages/picker/src/Picker.ts
@@ -393,7 +393,7 @@ export class PickerBase extends SizedMixin(Focusable, { noDefaultSize: true }) {
                 .offset=${0}
                 ?open=${this.open}
                 .placement=${this.isMobile.matches ? undefined : this.placement}
-                type="auto"
+                .type=${this.isMobile.matches ? 'modal' : 'auto'}
                 .receivesFocus=${'true'}
                 @beforetoggle=${(
                     event: Event & {
diff --git a/packages/picker/stories/picker.stories.ts b/packages/picker/stories/picker.stories.ts
index 7a1ab445c93..4ecf2ad9cca 100644
--- a/packages/picker/stories/picker.stories.ts
+++ b/packages/picker/stories/picker.stories.ts
@@ -459,6 +459,58 @@ export const readonly = (args: StoryArgs): TemplateResult => {
     `;
 };
 
+function nextFrame(): Promise<void> {
+    return new Promise((res) => requestAnimationFrame(() => res()));
+}
+
+class CustomPickerReady extends HTMLElement {
+    ready!: (value: boolean | PromiseLike<boolean>) => void;
+
+    constructor() {
+        super();
+        this.readyPromise = new Promise((res) => {
+            this.ready = res;
+            this.setup();
+        });
+    }
+
+    async setup(): Promise<void> {
+        await nextFrame();
+    }
+
+    handleTriggerOpened = async (): Promise<void> => {
+        await nextFrame();
+
+        const picker = document.querySelector('#picker-state') as Picker;
+        picker.addEventListener('sp-opened', this.handlePickerOpen);
+        picker.open = true;
+    };
+
+    handlePickerOpen = async (): Promise<void> => {
+        const picker = document.querySelector('#picker-state') as Picker;
+        const actions = [nextFrame, picker.updateComplete];
+
+        await Promise.all(actions);
+
+        this.ready(true);
+    };
+
+    private readyPromise: Promise<boolean> = Promise.resolve(false);
+
+    get updateComplete(): Promise<boolean> {
+        return this.readyPromise;
+    }
+}
+
+customElements.define('complex-picker-ready', CustomPickerReady);
+
+const customPickerDecorator = (story: () => TemplateResult): TemplateResult => {
+    return html`
+        ${story()}
+        <custom-picker-ready></custom-picker-ready>
+    `;
+};
+
 export const custom = (args: StoryArgs): TemplateResult => {
     const initialState = 'lb1-mo';
     return html`
@@ -495,6 +547,8 @@ export const custom = (args: StoryArgs): TemplateResult => {
     `;
 };
 
+custom.decorators = [customPickerDecorator];
+
 custom.args = {
     open: true,
 };
diff --git a/packages/popover/CHANGELOG.md b/packages/popover/CHANGELOG.md
index 55698fadaa4..a4189a84b2d 100644
--- a/packages/popover/CHANGELOG.md
+++ b/packages/popover/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/popover
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/popover
diff --git a/packages/popover/package.json b/packages/popover/package.json
index 9e8505f4747..8c8e8ea0b90 100644
--- a/packages/popover/package.json
+++ b/packages/popover/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/popover",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/popover": "^6.0.74"
diff --git a/packages/progress-bar/CHANGELOG.md b/packages/progress-bar/CHANGELOG.md
index 42e8fad5268..e4bd57c16c8 100644
--- a/packages/progress-bar/CHANGELOG.md
+++ b/packages/progress-bar/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/progress-bar
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/progress-bar
diff --git a/packages/progress-bar/package.json b/packages/progress-bar/package.json
index 1b3b40ea740..8e4bc9ed22a 100644
--- a/packages/progress-bar/package.json
+++ b/packages/progress-bar/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/progress-bar",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,10 +57,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/progressbar": "^3.0.73"
diff --git a/packages/progress-circle/CHANGELOG.md b/packages/progress-circle/CHANGELOG.md
index daaa5dad8f8..ffc5c41ae29 100644
--- a/packages/progress-circle/CHANGELOG.md
+++ b/packages/progress-circle/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/progress-circle
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/progress-circle
diff --git a/packages/progress-circle/package.json b/packages/progress-circle/package.json
index 0200e84d7fc..34c6e1f06e0 100644
--- a/packages/progress-circle/package.json
+++ b/packages/progress-circle/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/progress-circle",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/progresscircle": "^2.0.65"
diff --git a/packages/quick-actions/CHANGELOG.md b/packages/quick-actions/CHANGELOG.md
index 76157637bfb..f82abe500b8 100644
--- a/packages/quick-actions/CHANGELOG.md
+++ b/packages/quick-actions/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/quick-actions
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/quick-actions
diff --git a/packages/quick-actions/package.json b/packages/quick-actions/package.json
index e5588175e11..f298521627c 100644
--- a/packages/quick-actions/package.json
+++ b/packages/quick-actions/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/quick-actions",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/quickaction": "^3.0.83"
diff --git a/packages/radio/CHANGELOG.md b/packages/radio/CHANGELOG.md
index f439040e7f1..244969bd304 100644
--- a/packages/radio/CHANGELOG.md
+++ b/packages/radio/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/radio
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/radio
diff --git a/packages/radio/package.json b/packages/radio/package.json
index e20827065e6..be81faf7c10 100644
--- a/packages/radio/package.json
+++ b/packages/radio/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/radio",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -65,11 +65,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-group": "^0.40.0",
-        "@spectrum-web-components/help-text": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-group": "^0.40.1",
+        "@spectrum-web-components/help-text": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/radio": "^8.0.8"
diff --git a/packages/search/CHANGELOG.md b/packages/search/CHANGELOG.md
index 06d0a4d02c6..8fdcb5a2657 100644
--- a/packages/search/CHANGELOG.md
+++ b/packages/search/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/search
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/search
diff --git a/packages/search/package.json b/packages/search/package.json
index a1638bcc687..e7554ddf899 100644
--- a/packages/search/package.json
+++ b/packages/search/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/search",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/textfield": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/textfield": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/search": "^6.0.20"
diff --git a/packages/sidenav/CHANGELOG.md b/packages/sidenav/CHANGELOG.md
index d190a32a160..d0d35587418 100644
--- a/packages/sidenav/CHANGELOG.md
+++ b/packages/sidenav/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/sidenav
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/sidenav
diff --git a/packages/sidenav/package.json b/packages/sidenav/package.json
index 89772244179..9d991373c3c 100644
--- a/packages/sidenav/package.json
+++ b/packages/sidenav/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/sidenav",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -75,9 +75,9 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/sidenav": "^4.0.17"
diff --git a/packages/sidenav/test/sidenav.test.ts b/packages/sidenav/test/sidenav.test.ts
index c3147e6b38d..dea165f97be 100644
--- a/packages/sidenav/test/sidenav.test.ts
+++ b/packages/sidenav/test/sidenav.test.ts
@@ -25,6 +25,7 @@ import {
     expect,
     fixture,
     html,
+    nextFrame,
     waitUntil,
 } from '@open-wc/testing';
 import { LitElement, TemplateResult } from '@spectrum-web-components/base';
@@ -393,6 +394,11 @@ describe('Sidenav', () => {
     it('focuses the child anchor not the root when [tabindex=-1]', async () => {
         const el = await fixture<SideNav>(manageTabIndex());
 
+        await nextFrame();
+        await nextFrame();
+        await nextFrame();
+        await nextFrame();
+
         await elementUpdated(el);
         const firstItem = el.querySelector(
             '[value="Section 0"]'
@@ -405,17 +411,21 @@ describe('Sidenav', () => {
         await sendMouse({
             steps: [
                 {
-                    type: 'move',
-                    position: [firstRect.x + 2, firstRect.y + 2],
-                },
-                {
-                    type: 'down',
+                    type: 'click',
+                    position: [
+                        firstRect.x + firstRect.width / 2,
+                        firstRect.y + firstRect.height / 2,
+                    ],
                 },
             ],
         });
         await elementUpdated(el);
 
-        expect(firstItem.focusElement.matches(':focus')).to.be.true;
+        expect(firstItem.matches(':focus'), 'root has focus').to.be.true;
+        expect(
+            firstItem.focusElement.matches(':focus'),
+            'child has more precise focus'
+        ).to.be.true;
     });
     it('manage tab index through shadow DOM', async () => {
         class SideNavTestEl extends LitElement {
diff --git a/packages/slider/CHANGELOG.md b/packages/slider/CHANGELOG.md
index a8efb35ba8f..0048d1305f1 100644
--- a/packages/slider/CHANGELOG.md
+++ b/packages/slider/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **slider:** align editable slider when no label provided ([#3816](https://github.com/adobe/spectrum-web-components/issues/3816)) ([a5f4900](https://github.com/adobe/spectrum-web-components/commit/a5f49009d4acc1e8c5403a08b127769e18bda56c))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/slider
diff --git a/packages/slider/package.json b/packages/slider/package.json
index 139894d398d..f6bf6ae4fc9 100644
--- a/packages/slider/package.json
+++ b/packages/slider/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/slider",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -75,12 +75,12 @@
     "dependencies": {
         "@internationalized/number": "^3.1.0",
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/number-field": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/theme": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/number-field": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/theme": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/slider": "^4.1.14"
diff --git a/packages/slider/src/HandleController.ts b/packages/slider/src/HandleController.ts
index dbdd88aadac..b457b109927 100644
--- a/packages/slider/src/HandleController.ts
+++ b/packages/slider/src/HandleController.ts
@@ -95,7 +95,7 @@ export class HandleController {
 
     public inputForHandle(handle: SliderHandle): HTMLInputElement | undefined {
         if (this.handles.has(handle.handleName)) {
-            const { input } = this.getHandleElements(handle);
+            const { input } = this.getHandleElements(handle) || {};
             return input;
         }
         /* c8 ignore next 2 */
@@ -161,8 +161,9 @@ export class HandleController {
     public get focusElement(): HTMLElement {
         const { input } = this.getActiveHandleElements();
         if (
-            this.host.editable &&
-            !(input as InputWithModel).model.handle.dragging
+            !input ||
+            (this.host.editable &&
+                !(input as InputWithModel).model.handle.dragging)
         ) {
             return this.host.numberField;
         }
diff --git a/packages/split-button/CHANGELOG.md b/packages/split-button/CHANGELOG.md
index fb01672fed4..57e06fdde49 100644
--- a/packages/split-button/CHANGELOG.md
+++ b/packages/split-button/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/split-button
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/split-button
diff --git a/packages/split-button/package.json b/packages/split-button/package.json
index 905e758a9ab..fc4679486d6 100644
--- a/packages/split-button/package.json
+++ b/packages/split-button/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/split-button",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -61,15 +61,15 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/menu": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0",
-        "@spectrum-web-components/picker": "^0.40.0",
-        "@spectrum-web-components/popover": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/menu": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1",
+        "@spectrum-web-components/picker": "^0.40.1",
+        "@spectrum-web-components/popover": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/splitbutton": "^6.0.8"
diff --git a/packages/split-view/CHANGELOG.md b/packages/split-view/CHANGELOG.md
index 27c5874b76d..4c86c884851 100644
--- a/packages/split-view/CHANGELOG.md
+++ b/packages/split-view/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/split-view
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/split-view/README.md b/packages/split-view/README.md
index 26bdc33aa8e..51a5339a811 100644
--- a/packages/split-view/README.md
+++ b/packages/split-view/README.md
@@ -38,7 +38,13 @@ import { SplitView } from '@spectrum-web-components/split-view';
 ### Horizontal Resizable
 
 ```html
-<sp-split-view resizable primary-min="50" secondary-min="50" primary-size="100">
+<sp-split-view
+    resizable
+    primary-min="50"
+    secondary-min="50"
+    primary-size="100"
+    label="Resize the horizontal panels"
+>
     <div>
         <h1>Left panel</h1>
         <p>
@@ -59,7 +65,7 @@ import { SplitView } from '@spectrum-web-components/split-view';
 ### Horizontal Resizable & Collapsible
 
 ```html
-<sp-split-view resizable>
+<sp-split-view resizable label="Resize the horizontal collapsible panels">
     <div>
         <h1>Left panel</h1>
         <p>
@@ -95,6 +101,7 @@ import { SplitView } from '@spectrum-web-components/split-view';
     primary-min="50"
     primary-max="150"
     secondary-min="50"
+    label="Resize the vertical panels"
 >
     <div>
         <h1>Top panel</h1>
@@ -116,7 +123,12 @@ import { SplitView } from '@spectrum-web-components/split-view';
 ### Vertical Resizable & Collapsible
 
 ```html
-<sp-split-view vertical resizable style="height: 300px;">
+<sp-split-view
+    vertical
+    resizable
+    style="height: 300px;"
+    label="Resize the vertical collapsible panels"
+>
     <div>
         <h1>Top panel</h1>
         <p>
diff --git a/packages/split-view/package.json b/packages/split-view/package.json
index 85199a26d6c..99f08466821 100644
--- a/packages/split-view/package.json
+++ b/packages/split-view/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/split-view",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -61,7 +61,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/splitview": "^4.0.5"
diff --git a/packages/split-view/src/SplitView.ts b/packages/split-view/src/SplitView.ts
index 9214c23c8e1..a2c3997957b 100644
--- a/packages/split-view/src/SplitView.ts
+++ b/packages/split-view/src/SplitView.ts
@@ -184,7 +184,7 @@ export class SplitView extends SpectrumElement {
                     )) as boolean,
         };
         const label =
-            this.label || this.resizable ? 'Resize the panels' : undefined;
+            this.label || (this.resizable ? 'Resize the panels' : undefined);
 
         return html`
             <slot
diff --git a/packages/status-light/CHANGELOG.md b/packages/status-light/CHANGELOG.md
index ed997cc2f29..6f9de5a132f 100644
--- a/packages/status-light/CHANGELOG.md
+++ b/packages/status-light/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/status-light
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/status-light
diff --git a/packages/status-light/package.json b/packages/status-light/package.json
index 0dae30a69f9..39dab2407be 100644
--- a/packages/status-light/package.json
+++ b/packages/status-light/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/status-light",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/statuslight": "^6.0.57"
diff --git a/packages/swatch/CHANGELOG.md b/packages/swatch/CHANGELOG.md
index 8dcd3de76de..fa182b4b6b8 100644
--- a/packages/swatch/CHANGELOG.md
+++ b/packages/swatch/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/swatch
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/swatch
diff --git a/packages/swatch/package.json b/packages/swatch/package.json
index 2ee436dff06..d1ac23008a7 100644
--- a/packages/swatch/package.json
+++ b/packages/swatch/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/swatch",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -67,12 +67,12 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/swatch": "^5.0.12",
diff --git a/packages/switch/CHANGELOG.md b/packages/switch/CHANGELOG.md
index 4a41d64b6ee..0f5c2ddde51 100644
--- a/packages/switch/CHANGELOG.md
+++ b/packages/switch/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Performance Improvements
+
+-   **checkbox:** refactor architecture for more rendering perf and DOM element count ([7c2277f](https://github.com/adobe/spectrum-web-components/commit/7c2277f1a21e2e886678c3a3ad1d454cbd6637e0))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Features
diff --git a/packages/switch/package.json b/packages/switch/package.json
index bf19b5e8bed..bd783070b74 100644
--- a/packages/switch/package.json
+++ b/packages/switch/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/switch",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -58,8 +58,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/checkbox": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/checkbox": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/switch": "^4.0.7"
diff --git a/packages/switch/test/switch.test.ts b/packages/switch/test/switch.test.ts
index dcb35f02623..1d12d2da0cc 100644
--- a/packages/switch/test/switch.test.ts
+++ b/packages/switch/test/switch.test.ts
@@ -88,7 +88,7 @@ describe('Switch', () => {
         `);
         expect(el.checked).to.be.true;
 
-        el.focusElement.click();
+        el.click();
         await elementUpdated(el);
 
         expect(el.checked).to.be.true;
diff --git a/packages/table/CHANGELOG.md b/packages/table/CHANGELOG.md
index f3c057db920..0c3ac7b95f9 100644
--- a/packages/table/CHANGELOG.md
+++ b/packages/table/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/table
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/table
diff --git a/packages/table/package.json b/packages/table/package.json
index f0c22e38fab..fb926f3ec5b 100644
--- a/packages/table/package.json
+++ b/packages/table/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/table",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -117,10 +117,10 @@
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
         "@lit-labs/virtualizer": "^2.0.6",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/checkbox": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/checkbox": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/table": "^5.0.1"
diff --git a/packages/tabs/CHANGELOG.md b/packages/tabs/CHANGELOG.md
index 0fe62687bc5..6c62719e972 100644
--- a/packages/tabs/CHANGELOG.md
+++ b/packages/tabs/CHANGELOG.md
@@ -3,6 +3,12 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+### Bug Fixes
+
+-   **tabs:** prevent vertical scrolling in overflow tabs ([eb0592f](https://github.com/adobe/spectrum-web-components/commit/eb0592f87c1f52fe34745af030331060b3641a59))
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/tabs
diff --git a/packages/tabs/package.json b/packages/tabs/package.json
index 5712ed0757e..0b9e541c0f9 100644
--- a/packages/tabs/package.json
+++ b/packages/tabs/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/tabs",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -86,14 +86,14 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
-        "@spectrum-css/tabs": "^4.0.17"
+        "@spectrum-css/tabs": "^4.0.26"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/tabs/src/spectrum-tab.css b/packages/tabs/src/spectrum-tab.css
index fabef8ef7c5..d23cf4ea150 100644
--- a/packages/tabs/src/spectrum-tab.css
+++ b/packages/tabs/src/spectrum-tab.css
@@ -111,22 +111,19 @@ governing permissions and limitations under the License.
 :host([disabled]) #item-label {
     cursor: default;
 }
-:host(.focus-visible),
-:host(:focus) {
+:host(.focus-visible) {
     color: var(
         --highcontrast-tabs-color-key-focus,
         var(--mod-tabs-color-key-focus, var(--spectrum-tabs-color-key-focus))
     );
 }
-:host(:focus),
 :host(:focus-visible) {
     color: var(
         --highcontrast-tabs-color-key-focus,
         var(--mod-tabs-color-key-focus, var(--spectrum-tabs-color-key-focus))
     );
 }
-:host(.focus-visible):before,
-:host(:focus):before {
+:host(.focus-visible):before {
     border-color: var(
         --highcontrast-tabs-focus-indicator-color,
         var(
@@ -135,7 +132,6 @@ governing permissions and limitations under the License.
         )
     );
 }
-:host(:focus):before,
 :host(:focus-visible):before {
     border-color: var(
         --highcontrast-tabs-focus-indicator-color,
diff --git a/packages/tabs/src/spectrum-tabs.css b/packages/tabs/src/spectrum-tabs.css
index 0c90798aca7..9f706e87d16 100644
--- a/packages/tabs/src/spectrum-tabs.css
+++ b/packages/tabs/src/spectrum-tabs.css
@@ -168,22 +168,19 @@ governing permissions and limitations under the License.
     );
     cursor: default;
 }
-::slotted(:not([slot])).focus-visible,
-::slotted(:not([slot])):focus {
+::slotted(:not([slot])).focus-visible {
     color: var(
         --highcontrast-tabs-color-key-focus,
         var(--mod-tabs-color-key-focus, var(--spectrum-tabs-color-key-focus))
     );
 }
-::slotted(:not([slot])):focus,
 ::slotted(:not([slot])):focus-visible {
     color: var(
         --highcontrast-tabs-color-key-focus,
         var(--mod-tabs-color-key-focus, var(--spectrum-tabs-color-key-focus))
     );
 }
-::slotted(:not([slot])).focus-visible:before,
-::slotted(:not([slot])):focus:before {
+::slotted(:not([slot])).focus-visible:before {
     border-color: var(
         --highcontrast-tabs-focus-indicator-color,
         var(
@@ -192,8 +189,7 @@ governing permissions and limitations under the License.
         )
     );
 }
-::slotted(:not([slot])):focus-visible:before,
-::slotted(:not([slot])):focus:before {
+::slotted(:not([slot])):focus-visible:before {
     border-color: var(
         --highcontrast-tabs-focus-indicator-color,
         var(
diff --git a/packages/tabs/src/tabs.css b/packages/tabs/src/tabs.css
index 5363c7365b2..699464226cb 100644
--- a/packages/tabs/src/tabs.css
+++ b/packages/tabs/src/tabs.css
@@ -40,6 +40,10 @@ governing permissions and limitations under the License.
     justify-content: var(--swc-tabs-list-justify-content);
 }
 
+:host([disabled]) #list {
+    pointer-events: none;
+}
+
 :host([disabled]) #list #selection-indicator {
     background-color: var(
         --mod-tabs-color-disabled,
@@ -51,10 +55,6 @@ governing permissions and limitations under the License.
     color: var(--mod-tabs-color-disabled, var(--spectrum-tabs-color-disabled));
 }
 
-:host([disabled]) #list {
-    pointer-events: none;
-}
-
 /*
  * TODO remove after next tabs release
  * While https://github.com/adobe/spectrum-css/issues/641 goes unaddressed,
@@ -70,8 +70,9 @@ governing permissions and limitations under the License.
 }
 
 :host([dir][direction='horizontal']) #list.scroll {
-    overflow-x: auto;
     scrollbar-width: none;
+    overflow-x: auto;
+    overflow-y: hidden;
 }
 
 :host([dir][direction='horizontal']) #list.scroll::-webkit-scrollbar {
diff --git a/packages/tags/CHANGELOG.md b/packages/tags/CHANGELOG.md
index 883c16fb5ad..1a33e43ce30 100644
--- a/packages/tags/CHANGELOG.md
+++ b/packages/tags/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/tags
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/packages/tags/package.json b/packages/tags/package.json
index 65f2a220f1c..3638e0aab8b 100644
--- a/packages/tags/package.json
+++ b/packages/tags/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/tags",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -66,10 +66,10 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/tag": "^8.0.6",
diff --git a/packages/textfield/CHANGELOG.md b/packages/textfield/CHANGELOG.md
index 36399961458..9615b83e31a 100644
--- a/packages/textfield/CHANGELOG.md
+++ b/packages/textfield/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/textfield
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Features
diff --git a/packages/textfield/package.json b/packages/textfield/package.json
index 11addb06ae9..9975d6dcbae 100644
--- a/packages/textfield/package.json
+++ b/packages/textfield/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/textfield",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,15 +57,15 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/help-text": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-ui": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/help-text": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-ui": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
-        "@spectrum-css/textfield": "^6.0.20"
+        "@spectrum-css/textfield": "^6.0.29"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/textfield/src/spectrum-textfield.css b/packages/textfield/src/spectrum-textfield.css
index 1cc00ec9f4f..a9f2d3318e5 100644
--- a/packages/textfield/src/spectrum-textfield.css
+++ b/packages/textfield/src/spectrum-textfield.css
@@ -48,9 +48,6 @@ governing permissions and limitations under the License.
     --spectrum-textfield-icon-spacing-inline-end-quiet-valid: var(
         --spectrum-field-edge-to-validation-icon-quiet
     );
-    --spectrum-textfield-icon-spacing-inline-end-override: 32px;
-    --spectrum-Textfield-workflow-icon-width: 18px;
-    --spectrum-Textfield-workflow-icon-gap: 6px;
     --spectrum-textfield-font-family: var(--spectrum-sans-font-family-stack);
     --spectrum-textfield-font-weight: var(--spectrum-regular-font-weight);
     --spectrum-textfield-character-count-font-family: var(
@@ -151,6 +148,9 @@ governing permissions and limitations under the License.
     --spectrum-textfield-icon-size-invalid: var(
         --spectrum-workflow-icon-size-75
     );
+    --spectrum-textfield-icon-size-valid: var(
+        --spectrum-checkmark-icon-size-75
+    );
     --spectrum-textfield-icon-spacing-inline-end-invalid: var(
         --spectrum-field-edge-to-alert-icon-small
     );
@@ -200,6 +200,9 @@ governing permissions and limitations under the License.
     --spectrum-textfield-icon-size-invalid: var(
         --spectrum-workflow-icon-size-100
     );
+    --spectrum-textfield-icon-size-valid: var(
+        --spectrum-checkmark-icon-size-100
+    );
     --spectrum-textfield-icon-spacing-inline-end-invalid: var(
         --spectrum-field-edge-to-alert-icon-medium
     );
@@ -249,6 +252,9 @@ governing permissions and limitations under the License.
     --spectrum-textfield-icon-size-invalid: var(
         --spectrum-workflow-icon-size-200
     );
+    --spectrum-textfield-icon-size-valid: var(
+        --spectrum-checkmark-icon-size-200
+    );
     --spectrum-textfield-icon-spacing-inline-end-invalid: var(
         --spectrum-field-edge-to-alert-icon-large
     );
@@ -298,6 +304,9 @@ governing permissions and limitations under the License.
     --spectrum-textfield-icon-size-invalid: var(
         --spectrum-workflow-icon-size-300
     );
+    --spectrum-textfield-icon-size-valid: var(
+        --spectrum-checkmark-icon-size-300
+    );
     --spectrum-textfield-icon-spacing-inline-end-invalid: var(
         --spectrum-field-edge-to-alert-icon-extra-large
     );
@@ -349,7 +358,9 @@ governing permissions and limitations under the License.
         --mod-textfield-focus-indicator-width,
         var(--spectrum-textfield-focus-indicator-width)
     );
-    bottom: calc(
+    content: '';
+    inline-size: 100%;
+    inset-block-end: calc(
         (
                 var(
                         --mod-textfield-focus-indicator-gap,
@@ -361,13 +372,9 @@ governing permissions and limitations under the License.
                     )
             ) * -1
     );
-    content: '';
-    inline-size: 100%;
-    left: 0;
+    inset-inline-start: 0;
     position: absolute;
 }
-:host([quiet]) #textfield.focus-visible:after,
-:host([quiet]) #textfield:focus-within:after,
 :host([quiet][focused]) #textfield:after {
     background-color: var(
         --highcontrast-textfield-focus-indicator-color,
@@ -377,24 +384,37 @@ governing permissions and limitations under the License.
         )
     );
 }
-:host([quiet]) #textfield:focus-visible:after,
-:host([quiet]) #textfield:focus-within:after,
-:host([quiet][focused]) #textfield:after {
-    background-color: var(
-        --highcontrast-textfield-focus-indicator-color,
+:host([quiet][invalid]) #textfield .input {
+    padding-inline-end: calc(
         var(
-            --mod-textfield-focus-indicator-color,
-            var(--spectrum-textfield-focus-indicator-color)
-        )
+                --mod-textfield-icon-spacing-inline-start-invalid,
+                var(--spectrum-textfield-icon-spacing-inline-start-invalid)
+            ) +
+            var(
+                --mod-textfield-icon-size-invalid,
+                var(--spectrum-textfield-icon-size-invalid)
+            )
+    );
+}
+:host([quiet][valid]) #textfield .input {
+    padding-inline-end: calc(
+        var(
+                --mod-textfield-icon-spacing-inline-start-valid,
+                var(--spectrum-textfield-icon-spacing-inline-start-valid)
+            ) +
+            var(
+                --mod-textfield-icon-size-valid,
+                var(--spectrum-textfield-icon-size-valid)
+            )
     );
 }
 :host([invalid]) #textfield .icon,
 :host([valid]) #textfield .icon {
     grid-area: 2/2;
+    inset-block-start: 0;
     margin-inline-start: auto;
     pointer-events: all;
     position: absolute;
-    top: 0;
 }
 :host([valid]) #textfield .icon {
     color: var(
@@ -473,18 +493,13 @@ governing permissions and limitations under the License.
         var(--spectrum-textfield-icon-spacing-inline-end-quiet-invalid)
     );
 }
-.spectrum-InputGroup .icon {
-    margin-inline-end: var(
-        --spectrum-textfield-icon-spacing-inline-end-override
-    );
-}
 #textfield .spectrum-FieldLabel {
     grid-area: 1/1 / auto/span 1;
     margin-block-end: var(
         --mod-textfield-label-spacing-block,
         var(--spectrum-textfield-label-spacing-block)
     );
-    padding-left: calc(
+    padding-inline-start: calc(
         var(
                 --mod-textfield-corner-radius,
                 var(--spectrum-textfield-corner-radius)
@@ -506,7 +521,7 @@ governing permissions and limitations under the License.
         --mod-textfield-helptext-spacing-block,
         var(--spectrum-textfield-helptext-spacing-block)
     );
-    padding-left: calc(
+    padding-inline-start: calc(
         var(
                 --mod-textfield-corner-radius,
                 var(--spectrum-textfield-corner-radius)
@@ -529,6 +544,7 @@ governing permissions and limitations under the License.
         var(--spectrum-textfield-character-count-font-weight)
     );
     grid-area: 1/2 / auto/span 1;
+    inline-size: auto;
     justify-content: flex-end;
     margin-block-end: var(
         --mod-textfield-character-count-spacing-block,
@@ -539,13 +555,12 @@ governing permissions and limitations under the License.
         --mod-textfield-character-count-spacing-inline,
         var(--spectrum-textfield-character-count-spacing-inline)
     );
-    padding-right: calc(
+    padding-inline-end: calc(
         var(
                 --mod-textfield-corner-radius,
                 var(--spectrum-textfield-corner-radius)
             ) / 2
     );
-    width: auto;
 }
 :host([quiet]) .spectrum-Textfield-characterCount {
     margin-block-end: var(
@@ -647,18 +662,6 @@ governing permissions and limitations under the License.
         ease-in-out;
     vertical-align: top;
 }
-:host([quiet]) .icon-workflow ~ .input {
-    padding-inline-start: calc(
-        var(
-                --mod--Textfield-workflow-icon-gap,
-                var(--spectrum-Textfield-workflow-icon-gap)
-            ) +
-            var(
-                --mod-Textfield-workflow-icon-width,
-                var(--spectrum-Textfield-workflow-icon-width)
-            )
-    );
-}
 .input::-ms-clear {
     block-size: 0;
     inline-size: 0;
@@ -790,40 +793,6 @@ governing permissions and limitations under the License.
         )
     );
 }
-.input.focus-visible,
-:host([focused]) .input {
-    border-color: var(
-        --highcontrast-textfield-border-color-keyboard-focus,
-        var(
-            --mod-textfield-border-color-keyboard-focus,
-            var(--spectrum-textfield-border-color-keyboard-focus)
-        )
-    );
-    color: var(
-        --highcontrast-textfield-text-color-keyboard-focus,
-        var(
-            --mod-textfield-text-color-keyboard-focus,
-            var(--spectrum-textfield-text-color-keyboard-focus)
-        )
-    );
-    outline: var(
-            --mod-textfield-focus-indicator-width,
-            var(--spectrum-textfield-focus-indicator-width)
-        )
-        solid;
-    outline-color: var(
-        --highcontrast-textfield-focus-indicator-color,
-        var(
-            --mod-textfield-focus-indicator-color,
-            var(--spectrum-textfield-focus-indicator-color)
-        )
-    );
-    outline-offset: var(
-        --mod-textfield-focus-indicator-gap,
-        var(--spectrum-textfield-focus-indicator-gap)
-    );
-}
-.input:focus-visible,
 :host([focused]) .input {
     border-color: var(
         --highcontrast-textfield-border-color-keyboard-focus,
@@ -856,17 +825,6 @@ governing permissions and limitations under the License.
         var(--spectrum-textfield-focus-indicator-gap)
     );
 }
-.input.focus-visible::placeholder,
-:host([focused]) .input::placeholder {
-    color: var(
-        --highcontrast-textfield-text-color-keyboard-focus,
-        var(
-            --mod-textfield-text-color-keyboard-focus,
-            var(--spectrum-textfield-text-color-keyboard-focus)
-        )
-    );
-}
-.input:focus-visible::placeholder,
 :host([focused]) .input::placeholder {
     color: var(
         --highcontrast-textfield-text-color-keyboard-focus,
@@ -884,6 +842,24 @@ governing permissions and limitations under the License.
             var(--spectrum-textfield-text-color-valid)
         )
     );
+    padding-inline-end: calc(
+        var(
+                --mod-textfield-icon-spacing-inline-start-valid,
+                var(--spectrum-textfield-icon-spacing-inline-start-valid)
+            ) +
+            var(
+                --mod-textfield-icon-size-valid,
+                var(--spectrum-textfield-icon-size-valid)
+            ) +
+            var(
+                --mod-textfield-icon-spacing-inline-end-valid,
+                var(--spectrum-textfield-icon-spacing-inline-end-valid)
+            ) -
+            var(
+                --mod-textfield-border-width,
+                var(--spectrum-textfield-border-width)
+            )
+    );
 }
 :host([invalid]) .input {
     border-color: var(
@@ -900,6 +876,24 @@ governing permissions and limitations under the License.
             var(--spectrum-textfield-text-color-invalid)
         )
     );
+    padding-inline-end: calc(
+        var(
+                --mod-textfield-icon-spacing-inline-start-invalid,
+                var(--spectrum-textfield-icon-spacing-inline-start-invalid)
+            ) +
+            var(
+                --mod-textfield-icon-size-invalid,
+                var(--spectrum-textfield-icon-size-invalid)
+            ) +
+            var(
+                --mod-textfield-icon-spacing-inline-end-invalid,
+                var(--spectrum-textfield-icon-spacing-inline-end-invalid)
+            ) -
+            var(
+                --mod-textfield-border-width,
+                var(--spectrum-textfield-border-width)
+            )
+    );
 }
 :host([invalid]) .input:hover,
 :host([invalid]:hover) .input {
diff --git a/packages/thumbnail/CHANGELOG.md b/packages/thumbnail/CHANGELOG.md
index 8c2cdbbd75e..251ed2661c6 100644
--- a/packages/thumbnail/CHANGELOG.md
+++ b/packages/thumbnail/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/thumbnail
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/thumbnail
diff --git a/packages/thumbnail/package.json b/packages/thumbnail/package.json
index e8bc34a6c0f..4633659076a 100644
--- a/packages/thumbnail/package.json
+++ b/packages/thumbnail/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/thumbnail",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,8 +57,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/opacity-checkerboard": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/opacity-checkerboard": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/thumbnail": "^5.0.7"
diff --git a/packages/time-field/.npmignore b/packages/time-field/.npmignore
deleted file mode 100644
index c50cbe188c0..00000000000
--- a/packages/time-field/.npmignore
+++ /dev/null
@@ -1,2 +0,0 @@
-stories
-test
\ No newline at end of file
diff --git a/packages/time-field/README.md b/packages/time-field/README.md
deleted file mode 100644
index 808d31e2ac8..00000000000
--- a/packages/time-field/README.md
+++ /dev/null
@@ -1,33 +0,0 @@
-## Description
-
-### Usage
-
-[![See it on NPM!](https://img.shields.io/npm/v/@spectrum-web-components/time-field?style=for-the-badge)](https://www.npmjs.com/package/@spectrum-web-components/time-field)
-[![How big is this package in your project?](https://img.shields.io/bundlephobia/minzip/@spectrum-web-components/time-field?style=for-the-badge)](https://bundlephobia.com/result?p=@spectrum-web-components/time-field)
-
-```
-yarn add @spectrum-web-components/time-field
-```
-
-Import the side effectful registration of `<sp-time-field>` via:
-
-```
-import '@spectrum-web-components/time-field/sp-time-field.js';
-```
-
-When looking to leverage the `TimeField` base class as a type and/or for extension purposes, do so via:
-
-```
-import { TimeField } from '@spectrum-web-components/time-field';
-```
-
-## Example
-
-```html
-<sp-time-field></sp-time-field>
-```
-
-## To-do list
-
--   Complete documentation
--   Add/Review unit tests
diff --git a/packages/time-field/exports.json b/packages/time-field/exports.json
deleted file mode 100644
index 925298d825a..00000000000
--- a/packages/time-field/exports.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-    "./src/*": "./src/*.js",
-    "./sp-time-field.js": "./sp-time-field.js"
-}
diff --git a/packages/time-field/src/TimeField.ts b/packages/time-field/src/TimeField.ts
deleted file mode 100644
index 6847b2dbc3c..00000000000
--- a/packages/time-field/src/TimeField.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-/*
-Copyright 2023 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
-import { CSSResultArray } from '@spectrum-web-components/base';
-import { state } from '@spectrum-web-components/base/src/decorators.js';
-import { InputSegments } from '@spectrum-web-components/input-segments';
-
-import styles from './time-field.css.js';
-
-/**
- * @element sp-time-field
- *
- * @event change - Announces when a new time is defined by emitting a `Date` object
- *
- * @slot help-text - Default or non-negative help text to associate to your form element
- * @slot negative-help-text - Negative help text to associate to your form element when `invalid`
- */
-export class TimeField extends InputSegments {
-    public static override get styles(): CSSResultArray {
-        return [...super.styles, styles];
-    }
-
-    @state()
-    override includeTime = true;
-}
diff --git a/packages/time-field/src/time-field.css b/packages/time-field/src/time-field.css
deleted file mode 100644
index 26ef92385f0..00000000000
--- a/packages/time-field/src/time-field.css
+++ /dev/null
@@ -1,11 +0,0 @@
-/*
-Copyright 2023 Adobe. All rights reserved.
-This file is licensed to you under the Apache License, Version 2.0 (the "License");
-you may not use this file except in compliance with the License. You may obtain a copy
-of the License at http://www.apache.org/licenses/LICENSE-2.0
-
-Unless required by applicable law or agreed to in writing, software distributed under
-the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
-OF ANY KIND, either express or implied. See the License for the specific language
-governing permissions and limitations under the License.
-*/
diff --git a/packages/toast/CHANGELOG.md b/packages/toast/CHANGELOG.md
index 9c9dfcaee72..008ec8f80f8 100644
--- a/packages/toast/CHANGELOG.md
+++ b/packages/toast/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/toast
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/toast
diff --git a/packages/toast/package.json b/packages/toast/package.json
index 66fbbf32402..e82fd5000f0 100644
--- a/packages/toast/package.json
+++ b/packages/toast/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/toast",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/icon": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/icon": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/toast": "^9.1.9"
diff --git a/packages/tooltip/CHANGELOG.md b/packages/tooltip/CHANGELOG.md
index 87bd8972be8..c15883339f8 100644
--- a/packages/tooltip/CHANGELOG.md
+++ b/packages/tooltip/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/tooltip
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/tooltip
diff --git a/packages/tooltip/README.md b/packages/tooltip/README.md
index 00ce86e7c20..7a6882a41d6 100644
--- a/packages/tooltip/README.md
+++ b/packages/tooltip/README.md
@@ -46,8 +46,7 @@ Tooltips can be top, bottom, left, or right.
 By default, Tooltip provides styling without behavior.
 You must combine it with an [Overlay Trigger](https://opensource.adobe.com/spectrum-web-components/components/overlay-trigger/#%22hover%22-content-only) in order to manage its overlay behavior.
 
-You can instead apply the `self-managed` attribute for this common case,
-which automaticaly binds to the parent element's hover interaction:
+You can use the tooltip as the descendant of an interactive element, such as [Action Button](https://opensource.adobe.com/spectrum-web-components/components/action-button/), by applying the `self-managed` attribute which automatically binds the Tooltip to its first interactive ancestor element's focus/hover interactions:
 
 ```html
 <sp-action-button>
@@ -59,6 +58,21 @@ which automaticaly binds to the parent element's hover interaction:
 This is especially useful when inserting an intermediate `<overlay-trigger>` would interfere with
 parent/child relationships, such as between `<sp-action-group>` and `<sp-action-button>`.
 
+Note that an interactive element is an element that can receive focus during tab navigation, such as `sp-action-button`, `sp-action-menu`, `sp-field-label` etc.
+
+Given that tooltip is not focusable by itself, it would not show up during tab navigation. Thus a tooltip would not be accessible if used with a non-interactive element, such as `<sp-icon-*>`.
+
+The correct way to make it accessible would be to wrap it under an interactive element, such as `sp-action-button`:
+
+```html
+<sp-action-button size="s">
+    <sp-icon-info></sp-icon-info>
+    <sp-tooltip self-managed placement="right">
+        Display something here
+    </sp-tooltip>
+</sp-action-button>
+```
+
 ## Variants
 
 ### Informative
diff --git a/packages/tooltip/package.json b/packages/tooltip/package.json
index d9d4faac691..58fa67f0ebc 100644
--- a/packages/tooltip/package.json
+++ b/packages/tooltip/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/tooltip",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,9 +57,9 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/tooltip": "^5.1.11"
diff --git a/packages/top-nav/CHANGELOG.md b/packages/top-nav/CHANGELOG.md
index ea4b1e7071a..56056b138e2 100644
--- a/packages/top-nav/CHANGELOG.md
+++ b/packages/top-nav/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/top-nav
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/top-nav
diff --git a/packages/top-nav/package.json b/packages/top-nav/package.json
index c84f33abc77..81350bfcfec 100644
--- a/packages/top-nav/package.json
+++ b/packages/top-nav/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/top-nav",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -66,9 +66,9 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/tabs": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/tabs": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/packages/tray/CHANGELOG.md b/packages/tray/CHANGELOG.md
index 90998454c81..4c0d240be43 100644
--- a/packages/tray/CHANGELOG.md
+++ b/packages/tray/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/tray
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/tray
diff --git a/packages/tray/package.json b/packages/tray/package.json
index 3c2ffa23cfd..9c17886603c 100644
--- a/packages/tray/package.json
+++ b/packages/tray/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/tray",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,11 +57,11 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/modal": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/underlay": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/modal": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/underlay": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/tray": "^2.1.12"
diff --git a/packages/underlay/CHANGELOG.md b/packages/underlay/CHANGELOG.md
index 8e3b75c9fb6..bfbb5786b92 100644
--- a/packages/underlay/CHANGELOG.md
+++ b/packages/underlay/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/underlay
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/underlay
diff --git a/packages/underlay/package.json b/packages/underlay/package.json
index a6fa1bb7fb2..1c07062d565 100644
--- a/packages/underlay/package.json
+++ b/packages/underlay/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/underlay",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/underlay": "^3.0.3"
diff --git a/projects/css-custom-vars-viewer/CHANGELOG.md b/projects/css-custom-vars-viewer/CHANGELOG.md
index e43c9295088..62b4f99cf0a 100644
--- a/projects/css-custom-vars-viewer/CHANGELOG.md
+++ b/projects/css-custom-vars-viewer/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/custom-vars-viewer
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/custom-vars-viewer
diff --git a/projects/css-custom-vars-viewer/package.json b/projects/css-custom-vars-viewer/package.json
index a8963417fa1..fa6ac310cf0 100644
--- a/projects/css-custom-vars-viewer/package.json
+++ b/projects/css-custom-vars-viewer/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/custom-vars-viewer",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": "true",
     "description": "Demo app created with Spectrum Web Components, following open-wc guidelines",
     "license": "Apache-2.0",
@@ -32,17 +32,17 @@
     },
     "dependencies": {
         "@rollup/plugin-json": "^6.0.1",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/link": "^0.40.0",
-        "@spectrum-web-components/menu": "^0.40.0",
-        "@spectrum-web-components/picker": "^0.40.0",
-        "@spectrum-web-components/story-decorator": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0",
-        "@spectrum-web-components/swatch": "^0.40.0",
-        "@spectrum-web-components/table": "^0.40.0",
-        "@spectrum-web-components/theme": "^0.40.0",
-        "@spectrum-web-components/toast": "^0.40.0",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/link": "^0.40.1",
+        "@spectrum-web-components/menu": "^0.40.1",
+        "@spectrum-web-components/picker": "^0.40.1",
+        "@spectrum-web-components/story-decorator": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1",
+        "@spectrum-web-components/swatch": "^0.40.1",
+        "@spectrum-web-components/table": "^0.40.1",
+        "@spectrum-web-components/theme": "^0.40.1",
+        "@spectrum-web-components/toast": "^0.40.1",
         "@web/dev-server-rollup": "^0.5.4",
         "lit": "^2.5.0"
     },
diff --git a/projects/documentation/CHANGELOG.md b/projects/documentation/CHANGELOG.md
index 000caa8ca12..10f00129008 100644
--- a/projects/documentation/CHANGELOG.md
+++ b/projects/documentation/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package documentation
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package documentation
diff --git a/projects/documentation/package.json b/projects/documentation/package.json
index f70f658e58d..deee7a6e567 100644
--- a/projects/documentation/package.json
+++ b/projects/documentation/package.json
@@ -1,6 +1,6 @@
 {
     "name": "documentation",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "description": "The documentation site for Spectrum Web Components",
     "license": "Apache-2.0",
@@ -22,8 +22,8 @@
         "watch": "yarn serve --watch"
     },
     "dependencies": {
-        "@spectrum-web-components/bundle": "^0.40.0",
-        "@spectrum-web-components/custom-vars-viewer": "^0.40.0"
+        "@spectrum-web-components/bundle": "^0.40.1",
+        "@spectrum-web-components/custom-vars-viewer": "^0.40.1"
     },
     "devDependencies": {
         "@11ty/eleventy": "^2.0.1",
diff --git a/projects/documentation/src/components/layout.ts b/projects/documentation/src/components/layout.ts
index 687758d571c..d5d6f08d660 100644
--- a/projects/documentation/src/components/layout.ts
+++ b/projects/documentation/src/components/layout.ts
@@ -14,6 +14,7 @@ import {
     CSSResultArray,
     html,
     LitElement,
+    nothing,
     PropertyValues,
     TemplateResult,
 } from '@spectrum-web-components/base';
@@ -45,7 +46,6 @@ import './code-example.js';
 import { copyText } from './copy-to-clipboard.js';
 
 import layoutStyles from './layout.css';
-import { nothing } from 'lit-html';
 import {
     DARK_MODE,
     IS_MOBILE,
diff --git a/projects/documentation/src/utils/templates.ts b/projects/documentation/src/utils/templates.ts
index aa7684769d9..7e79655d9f3 100644
--- a/projects/documentation/src/utils/templates.ts
+++ b/projects/documentation/src/utils/templates.ts
@@ -10,7 +10,12 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-import { css, CSSResultGroup, html, TemplateResult } from 'lit';
+import {
+    css,
+    type CSSResultGroup,
+    html,
+    type TemplateResult,
+} from '@spectrum-web-components/base';
 
 export function toHtmlTemplateString(code: string): TemplateResult {
     const stringArray = [`${code}`] as any;
diff --git a/projects/example-project-rollup/CHANGELOG.md b/projects/example-project-rollup/CHANGELOG.md
index 135a69637d1..678877e59c1 100644
--- a/projects/example-project-rollup/CHANGELOG.md
+++ b/projects/example-project-rollup/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package example-project-rollup
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package example-project-rollup
diff --git a/projects/example-project-rollup/package.json b/projects/example-project-rollup/package.json
index 8763ad06af7..b7379c2752d 100644
--- a/projects/example-project-rollup/package.json
+++ b/projects/example-project-rollup/package.json
@@ -1,6 +1,6 @@
 {
   "name": "example-project-rollup",
-  "version": "0.40.0",
+  "version": "0.40.1",
   "private": true,
   "description": "An example project that uses the web components and gives an example of how to bundle them minimally with rollup.",
   "license": "Apache-2.0",
@@ -21,11 +21,11 @@
     "tsc:watch": "tsc --watch"
   },
   "dependencies": {
-    "@spectrum-web-components/button": "^0.40.0",
-    "@spectrum-web-components/field-label": "^0.40.0",
-    "@spectrum-web-components/menu": "^0.40.0",
-    "@spectrum-web-components/picker": "^0.40.0",
-    "@spectrum-web-components/styles": "^0.40.0"
+    "@spectrum-web-components/button": "^0.40.1",
+    "@spectrum-web-components/field-label": "^0.40.1",
+    "@spectrum-web-components/menu": "^0.40.1",
+    "@spectrum-web-components/picker": "^0.40.1",
+    "@spectrum-web-components/styles": "^0.40.1"
   },
   "devDependencies": {
     "@open-wc/building-rollup": "^3.0.2",
diff --git a/projects/example-project-webpack/CHANGELOG.md b/projects/example-project-webpack/CHANGELOG.md
index 48ca2e6a216..4f06c12a999 100644
--- a/projects/example-project-webpack/CHANGELOG.md
+++ b/projects/example-project-webpack/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package example-project-webpack
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package example-project-webpack
diff --git a/projects/example-project-webpack/package.json b/projects/example-project-webpack/package.json
index 789ca5474e5..9a5bd8196f7 100644
--- a/projects/example-project-webpack/package.json
+++ b/projects/example-project-webpack/package.json
@@ -1,6 +1,6 @@
 {
     "name": "example-project-webpack",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "description": "An example project that uses the web components and gives an example of how to bundle them minimally with webpack.",
     "license": "Apache-2.0",
@@ -13,11 +13,11 @@
         "serve": "webpack serve"
     },
     "dependencies": {
-        "@spectrum-web-components/button": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/menu": "^0.40.0",
-        "@spectrum-web-components/picker": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0",
+        "@spectrum-web-components/button": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/menu": "^0.40.1",
+        "@spectrum-web-components/picker": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1",
         "lit": "^2.5.0"
     },
     "devDependencies": {
diff --git a/projects/story-decorator/CHANGELOG.md b/projects/story-decorator/CHANGELOG.md
index 6ba9d6c8113..f7eabb476e5 100644
--- a/projects/story-decorator/CHANGELOG.md
+++ b/projects/story-decorator/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/story-decorator
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/story-decorator
diff --git a/projects/story-decorator/package.json b/projects/story-decorator/package.json
index 66278dfff5a..cfe6dcbfd33 100644
--- a/projects/story-decorator/package.json
+++ b/projects/story-decorator/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/story-decorator",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -65,14 +65,14 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/field-label": "^0.40.0",
-        "@spectrum-web-components/menu": "^0.40.0",
-        "@spectrum-web-components/overlay": "^0.40.0",
-        "@spectrum-web-components/picker": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
-        "@spectrum-web-components/switch": "^0.40.0",
-        "@spectrum-web-components/theme": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/field-label": "^0.40.1",
+        "@spectrum-web-components/menu": "^0.40.1",
+        "@spectrum-web-components/overlay": "^0.40.1",
+        "@spectrum-web-components/picker": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
+        "@spectrum-web-components/switch": "^0.40.1",
+        "@spectrum-web-components/theme": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/projects/story-decorator/src/StoryDecorator.ts b/projects/story-decorator/src/StoryDecorator.ts
index 0e4874173ae..4447f074302 100644
--- a/projects/story-decorator/src/StoryDecorator.ts
+++ b/projects/story-decorator/src/StoryDecorator.ts
@@ -92,6 +92,34 @@ const reduceMotionProperties = css`
     --swc-test-duration: 1ms;
 `;
 
+export const locales = [
+    'cs-CZ',
+    'cy-GB',
+    'da-DK',
+    'de-DE',
+    'en-GB',
+    'en-US',
+    'es-ES',
+    'fi-FI',
+    'fr-FR',
+    'hu-HU',
+    'it-IT',
+    'ja-JP',
+    'ko-KR',
+    'nb-NO',
+    'nl-NL',
+    'pl-PL',
+    'pt-BR',
+    'ru-RU',
+    'sv-SE',
+    'tr-TR',
+    'uk-UA',
+    'zh-Hans-CN',
+    'zh-Hant-TW',
+] as const;
+
+export const defaultLocale = 'en-US';
+
 export class StoryDecorator extends SpectrumElement {
     static override get styles() {
         return [
@@ -187,6 +215,9 @@ export class StoryDecorator extends SpectrumElement {
     @property({ type: Boolean, reflect: true })
     public screenshot = false;
 
+    @property()
+    public locale: typeof locales[number] = defaultLocale;
+
     @queryAsync('sp-theme')
     private themeRoot!: Theme;
 
@@ -239,6 +270,10 @@ export class StoryDecorator extends SpectrumElement {
         }
     }
 
+    private updateLocale({ target }: Event & { target: Picker }): void {
+        this.locale = target.value as typeof locales[number];
+    }
+
     protected handleKeydown(event: KeyboardEvent): void {
         const path = event.composedPath();
         const hasInput = path.some(
@@ -259,6 +294,7 @@ export class StoryDecorator extends SpectrumElement {
                 color=${this.color}
                 scale=${this.scale}
                 dir=${this.direction}
+                lang=${this.locale}
                 part="container"
                 @keydown=${this.handleKeydown}
             >
@@ -303,7 +339,8 @@ export class StoryDecorator extends SpectrumElement {
         return html`
             <div class="manage-theme" part="controls">
                 ${this.themeControl} ${this.colorControl} ${this.scaleControl}
-                ${this.dirControl} ${this.reduceMotionControl}
+                ${this.dirControl} ${this.localeControl}
+                ${this.reduceMotionControl}
             </div>
         `;
     }
@@ -376,6 +413,26 @@ export class StoryDecorator extends SpectrumElement {
         `;
     }
 
+    private get localeControl(): TemplateResult {
+        return html`
+            <sp-field-label for="locale">Locale</sp-field-label>
+            <sp-picker
+                id="locale"
+                label="Locale"
+                placement="top"
+                quiet
+                .value=${this.locale}
+                @change=${this.updateLocale}
+            >
+                ${locales.map(
+                    (locale) => html`
+                        <sp-menu-item value=${locale}>${locale}</sp-menu-item>
+                    `
+                )}
+            </sp-picker>
+        `;
+    }
+
     private get reduceMotionControl(): TemplateResult {
         return html`
             <sp-switch
diff --git a/projects/templates/CHANGELOG.md b/projects/templates/CHANGELOG.md
index 125ed6a3aa2..f3602f8c911 100644
--- a/projects/templates/CHANGELOG.md
+++ b/projects/templates/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package swc-templates
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package swc-templates
diff --git a/projects/templates/package.json b/projects/templates/package.json
index 26c56a20176..29bbc452226 100644
--- a/projects/templates/package.json
+++ b/projects/templates/package.json
@@ -1,6 +1,6 @@
 {
     "name": "swc-templates",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "description": "Templates for generating a Spectrum Web Component package.",
     "license": "Apache-2.0",
diff --git a/projects/types/CHANGELOG.md b/projects/types/CHANGELOG.md
index 8226efec47d..01dd187d8d4 100644
--- a/projects/types/CHANGELOG.md
+++ b/projects/types/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @types/swc
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @types/swc
diff --git a/projects/types/package.json b/projects/types/package.json
index f4de6d8c131..75395f169e5 100644
--- a/projects/types/package.json
+++ b/projects/types/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@types/swc",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "private": true,
     "main": "",
     "types": "./global.d.ts",
diff --git a/projects/vrt-compare/CHANGELOG.md b/projects/vrt-compare/CHANGELOG.md
index 4a80c03154a..4ee987aa113 100644
--- a/projects/vrt-compare/CHANGELOG.md
+++ b/projects/vrt-compare/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/vrt-compare
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/vrt-compare
diff --git a/projects/vrt-compare/package.json b/projects/vrt-compare/package.json
index 2cc842d1b4b..3f419b7d9fe 100644
--- a/projects/vrt-compare/package.json
+++ b/projects/vrt-compare/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/vrt-compare",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -60,15 +60,15 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/action-bar": "^0.40.0",
-        "@spectrum-web-components/action-button": "^0.40.0",
-        "@spectrum-web-components/action-group": "^0.40.0",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/icons-workflow": "^0.40.0",
-        "@spectrum-web-components/shared": "^0.40.0",
-        "@spectrum-web-components/split-view": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0",
-        "@spectrum-web-components/theme": "^0.40.0"
+        "@spectrum-web-components/action-bar": "^0.40.1",
+        "@spectrum-web-components/action-button": "^0.40.1",
+        "@spectrum-web-components/action-group": "^0.40.1",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/icons-workflow": "^0.40.1",
+        "@spectrum-web-components/shared": "^0.40.1",
+        "@spectrum-web-components/split-view": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1",
+        "@spectrum-web-components/theme": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/tools/base/CHANGELOG.md b/tools/base/CHANGELOG.md
index 1485500dff8..c259db5cc95 100644
--- a/tools/base/CHANGELOG.md
+++ b/tools/base/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/base
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/base
diff --git a/tools/base/package.json b/tools/base/package.json
index 06f25134c45..432dff626c2 100644
--- a/tools/base/package.json
+++ b/tools/base/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/base",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
diff --git a/tools/base/src/directives.ts b/tools/base/src/directives.ts
index 16780ee6e9b..9c6c44e820c 100644
--- a/tools/base/src/directives.ts
+++ b/tools/base/src/directives.ts
@@ -19,3 +19,5 @@ export type { StyleInfo } from 'lit/directives/style-map.js';
 export { until } from 'lit/directives/until.js';
 export { live } from 'lit/directives/live.js';
 export { when } from 'lit/directives/when.js';
+export { join } from 'lit/directives/join.js';
+export { unsafeHTML } from 'lit/directives/unsafe-html.js';
diff --git a/tools/base/src/sizedMixin.ts b/tools/base/src/sizedMixin.ts
index 85f2dee9407..296c51b209f 100644
--- a/tools/base/src/sizedMixin.ts
+++ b/tools/base/src/sizedMixin.ts
@@ -47,7 +47,7 @@ export function SizedMixin<T extends Constructor<ReactiveElement>>(
     } = {}
 ): T & Constructor<SizedElementInterface> {
     class SizedElement extends constructor {
-        @property({ type: String, reflect: true })
+        @property({ type: String })
         public get size(): ElementSize {
             return this._size || defaultSize;
         }
diff --git a/tools/base/src/version.js b/tools/base/src/version.js
index 1321c129b42..be9c73546a9 100644
--- a/tools/base/src/version.js
+++ b/tools/base/src/version.js
@@ -1,2 +1,2 @@
 // Generated by genversion.
-export const version = '0.40.0';
+export const version = '0.40.1';
diff --git a/tools/base/test/define-element.test.ts b/tools/base/test/define-element.test.ts
index 94b6e184bd5..d359f341c62 100644
--- a/tools/base/test/define-element.test.ts
+++ b/tools/base/test/define-element.test.ts
@@ -206,7 +206,9 @@ describe('define-element', function () {
             const spyCall = this.warn.getCall(0);
             expect(
                 (spyCall.args.at(0) as string).includes('redefine'),
-                'message should warn about redefining an element'
+                `message should warn about redefining an element, instead got "${spyCall.args.at(
+                    0
+                )}"`
             ).to.be.true;
         })
     );
diff --git a/tools/bundle/CHANGELOG.md b/tools/bundle/CHANGELOG.md
index a197772edb2..21303321ab2 100644
--- a/tools/bundle/CHANGELOG.md
+++ b/tools/bundle/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/bundle
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/bundle
diff --git a/tools/bundle/elements.ts b/tools/bundle/elements.ts
index 6d9044a4472..918c45cad40 100644
--- a/tools/bundle/elements.ts
+++ b/tools/bundle/elements.ts
@@ -32,6 +32,7 @@ import '@spectrum-web-components/color-handle/sp-color-handle.js';
 import '@spectrum-web-components/color-loupe/sp-color-loupe.js';
 import '@spectrum-web-components/color-slider/sp-color-slider.js';
 import '@spectrum-web-components/color-wheel/sp-color-wheel.js';
+import '@spectrum-web-components/date-time-picker/sp-date-time-picker.js';
 import '@spectrum-web-components/dialog/sp-dialog.js';
 import '@spectrum-web-components/dialog/sp-dialog-base.js';
 import '@spectrum-web-components/dialog/sp-dialog-wrapper.js';
@@ -90,7 +91,6 @@ import '@spectrum-web-components/textfield/sp-textfield.js';
 import '@spectrum-web-components/theme/sp-theme.js';
 import '@spectrum-web-components/theme/src/themes.js';
 import '@spectrum-web-components/thumbnail/sp-thumbnail.js';
-import '@spectrum-web-components/time-field/sp-time-field.js';
 import '@spectrum-web-components/toast/sp-toast.js';
 import '@spectrum-web-components/tooltip/sp-tooltip.js';
 import '@spectrum-web-components/top-nav/sp-top-nav.js';
diff --git a/tools/bundle/package.json b/tools/bundle/package.json
index 783be38191e..756738baf2d 100644
--- a/tools/bundle/package.json
+++ b/tools/bundle/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/bundle",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -83,6 +83,7 @@
         "@spectrum-web-components/color-loupe": "^0.40.0",
         "@spectrum-web-components/color-slider": "^0.40.0",
         "@spectrum-web-components/color-wheel": "^0.40.0",
+        "@spectrum-web-components/date-time-picker": "^0.0.1",
         "@spectrum-web-components/dialog": "^0.40.0",
         "@spectrum-web-components/divider": "^0.40.0",
         "@spectrum-web-components/dropzone": "^0.40.0",
@@ -127,7 +128,6 @@
         "@spectrum-web-components/textfield": "^0.40.0",
         "@spectrum-web-components/theme": "^0.40.0",
         "@spectrum-web-components/thumbnail": "^0.40.0",
-        "@spectrum-web-components/time-field": "^0.0.1",
         "@spectrum-web-components/toast": "^0.40.0",
         "@spectrum-web-components/tooltip": "^0.40.0",
         "@spectrum-web-components/top-nav": "^0.40.0",
diff --git a/tools/bundle/src/index.ts b/tools/bundle/src/index.ts
index 4c9bdd0f5c7..23a02c28085 100644
--- a/tools/bundle/src/index.ts
+++ b/tools/bundle/src/index.ts
@@ -29,6 +29,7 @@ export * from '@spectrum-web-components/color-handle';
 export * from '@spectrum-web-components/color-loupe';
 export * from '@spectrum-web-components/color-slider';
 export * from '@spectrum-web-components/color-wheel';
+export * from '@spectrum-web-components/date-time-picker';
 export * from '@spectrum-web-components/dialog';
 export * from '@spectrum-web-components/divider';
 export * from '@spectrum-web-components/dropzone';
@@ -63,7 +64,6 @@ export * from '@spectrum-web-components/tags';
 export * from '@spectrum-web-components/textfield';
 export * from '@spectrum-web-components/theme';
 export * from '@spectrum-web-components/thumbnail';
-export * from '@spectrum-web-components/time-field';
 export * from '@spectrum-web-components/toast';
 export * from '@spectrum-web-components/tooltip';
 export * from '@spectrum-web-components/top-nav';
diff --git a/tools/bundle/tsconfig.json b/tools/bundle/tsconfig.json
index fa49e45ed11..b095362451e 100644
--- a/tools/bundle/tsconfig.json
+++ b/tools/bundle/tsconfig.json
@@ -27,6 +27,7 @@
         { "path": "../../packages/color-loupe" },
         { "path": "../../packages/color-slider" },
         { "path": "../../packages/color-wheel" },
+        { "path": "../../packages/date-time-picker" },
         { "path": "../../packages/dialog" },
         { "path": "../../packages/divider" },
         { "path": "../../packages/dropzone" },
@@ -65,7 +66,6 @@
         { "path": "../../packages/textfield" },
         { "path": "../theme" },
         { "path": "../../packages/thumbnail" },
-        { "path": "../../packages/time-field" },
         { "path": "../../packages/toast" },
         { "path": "../../packages/tooltip" },
         { "path": "../../packages/top-nav" },
diff --git a/tools/grid/CHANGELOG.md b/tools/grid/CHANGELOG.md
index 8c8a98d73f9..2af63ddff47 100644
--- a/tools/grid/CHANGELOG.md
+++ b/tools/grid/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/grid
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/grid
diff --git a/tools/grid/package.json b/tools/grid/package.json
index dd893d1de80..d9adcd7fe1d 100644
--- a/tools/grid/package.json
+++ b/tools/grid/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/grid",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -64,8 +64,8 @@
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
         "@lit-labs/virtualizer": "^2.0.6",
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/reactive-controllers": "^0.40.0",
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/reactive-controllers": "^0.40.1",
         "lit": "^2.5.0"
     },
     "types": "./src/index.d.ts",
diff --git a/tools/input-segments/README.md b/tools/input-segments/README.md
index fd4177d5364..b711a31c4cd 100644
--- a/tools/input-segments/README.md
+++ b/tools/input-segments/README.md
@@ -21,10 +21,8 @@ export class MyInput extends InputSegments {
 
 ## To-do list
 
--   Include ARIA attributes for editable segments
--   Use `@input`/`@beforeinput` events to handle data input/content cleanup
--   Move `handleKeydown()` call to a cache so that it doesn't cycle on the binding in each render pass
--   Rename `handleKeydown()` to match the new events used
+-   Include/review ARIA attributes for editable segments
+-   Move `handle` functions call to a cache so that it doesn't cycle on the binding in each render pass
 -   Define/revise list of locales and include them in the VRT process to ensure long-term delivery
 -   Complete documentation
 -   Add/Review unit tests
diff --git a/tools/input-segments/package.json b/tools/input-segments/package.json
index 354f220b684..7362e036c46 100644
--- a/tools/input-segments/package.json
+++ b/tools/input-segments/package.json
@@ -57,7 +57,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@internationalized/date": "^3.2.1",
+        "@internationalized/date": "^3.5.0",
         "@internationalized/number": "^3.1.0",
         "@spectrum-web-components/base": "^0.40.0",
         "@spectrum-web-components/reactive-controllers": "^0.40.0",
diff --git a/tools/input-segments/src/InputSegments.ts b/tools/input-segments/src/InputSegments.ts
index 59567a9b63f..db0529f1608 100644
--- a/tools/input-segments/src/InputSegments.ts
+++ b/tools/input-segments/src/InputSegments.ts
@@ -205,8 +205,12 @@ export class InputSegments extends TextfieldBase {
 
     protected override renderField(): TemplateResult {
         return html`
-            ${this.renderStateIcons()}
+            ${this.renderStateIcons()} ${this.renderInputContent()}
+        `;
+    }
 
+    public renderInputContent(): TemplateResult {
+        return html`
             <div class="input">
                 <div
                     role="presentation"
@@ -243,11 +247,11 @@ export class InputSegments extends TextfieldBase {
 
     public renderEditableSegment(segment: Segment): TemplateResult {
         const isActive = !this.disabled && !this.readonly;
-
-        const isPlaceholderVisible = segment.value === undefined;
+        const usePlaceholder = segment.value === undefined;
 
         const segmentClasses: ClassInfo = {
-            'is-placeholder': isPlaceholderVisible,
+            'editable-segment': true,
+            'is-placeholder': usePlaceholder,
         };
 
         const segmentStyles: StyleInfo = {
@@ -257,10 +261,8 @@ export class InputSegments extends TextfieldBase {
         };
 
         /**
-         * TODO: Include ARIA attributes for editable segments
-         * TODO: Use `@input`/`@beforeinput` events to handle data input/content cleanup
-         * TODO: Move `handleKeydown()` call to a cache so that it doesn't cycle on the binding in each render pass
-         * TODO: Rename `handleKeydown()` to match the new events used
+         * TODO: Include/review ARIA attributes for editable segments
+         * TODO: Move `handle` functions call to a cache so that it doesn't cycle on the binding in each render pass
          */
         return html`
             <div
@@ -268,52 +270,54 @@ export class InputSegments extends TextfieldBase {
                 contenteditable=${ifDefined(isActive ? true : undefined)}
                 inputmode=${ifDefined(isActive ? 'numeric' : undefined)}
                 tabindex=${ifDefined(isActive ? '0' : undefined)}
-                class="editable-segment ${classMap(segmentClasses)}"
+                aria-hidden=${ifDefined(usePlaceholder ? 'true' : undefined)}
+                class=${classMap(segmentClasses)}
                 style=${styleMap(segmentStyles)}
                 data-testid=${segment.type}
                 @keydown=${(event: KeyboardEvent) => {
                     this.handleKeydown(segment, event);
                 }}
-            >
-                ${when(
-                    isPlaceholderVisible,
-                    () => html`
-                        <span aria-hidden="true" class="placeholder">
-                            ${segment.placeholder}
-                        </span>
-                    `,
-                    () => segment.formatted
+                @beforeinput=${(event: InputEvent) => {
+                    this.handleBeforeInput(segment, event);
+                }}
+                @input=${(event: InputEvent) => {
+                    this.handleInputEvent(segment, event);
+                }}
+                .innerText=${when(
+                    usePlaceholder,
+                    () => segment.placeholder ?? '',
+                    () => segment.formatted ?? ''
                 )}
-            </div>
+            ></div>
         `;
     }
 
     /**
-     * Indicates the parent component when a segment is focused, this way we can apply all styles to the "fake" input
+     * Indicates the parent component when a segment is focused, this way we can apply all styles to the “fake” input
      * (wrapper) as if it were a standard input
      */
-    public handleFocusIn(): void {
+    protected handleFocusIn(): void {
         super.onFocus();
     }
 
     /**
      * Indicates the parent component when a segment is blurred, this way we can remove all styles that were applied to
-     * the "fake" input (wrapper) while one of the segments was focused
+     * the “fake” input (wrapper) while one of the segments was focused
      */
-    public handleFocusOut(): void {
+    protected handleFocusOut(): void {
         super.onBlur();
     }
 
     /**
      * Detects the pressed key and performs the correct action accordingly
      *
-     * @param segment - Segment on which the event was fired
-     * @param event - Event details
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
      */
-    public handleKeydown(segment: Segment, event: KeyboardEvent): void {
+    protected handleKeydown(segment: Segment, event: KeyboardEvent): void {
         switch (event.code) {
             case 'ArrowUp': {
-                this.incrementValue(segment);
+                this.incrementValue(segment, event);
                 break;
             }
             case 'ArrowRight': {
@@ -321,65 +325,154 @@ export class InputSegments extends TextfieldBase {
                 break;
             }
             case 'ArrowDown': {
-                this.decrementValue(segment);
+                this.decrementValue(segment, event);
                 break;
             }
             case 'ArrowLeft': {
                 this.focusPreviousSegment(event);
                 break;
             }
-            default: {
-                // To determine what character corresponds with the key event, we use the `KeyboardEvent.key` property
-                const key = event.key;
-                const isNumberKey = this.numberParser.isValidPartialNumber(key);
-                const isClearKey = ['Backspace', 'Delete'].includes(key);
-                const isAllowedKey = ['Tab'].includes(key);
-
-                if (isNumberKey) {
-                    this.handleTypedValue(segment, event);
-                }
+        }
 
-                if (isClearKey) {
-                    this.handleClear(segment);
-                }
+        // The “AM/PM” segment value can be changed by pressing the “A” (for “AM”) or “P” (for “PM”) keys
+        if (segment.type === 'dayPeriod') {
+            if (event.code === 'KeyA') {
+                this.setAmPmSegmentValue(AM);
+                this.valueChanged(segment, event);
+            }
 
-                if (isNumberKey || isClearKey || !isAllowedKey) {
-                    event.preventDefault();
-                    event.stopPropagation();
-                }
+            if (event.code === 'KeyP') {
+                this.setAmPmSegmentValue(PM);
+                this.valueChanged(segment, event);
             }
         }
     }
 
     /**
-     * Sets new segment value after user types some number
+     * When the `input` event is triggered, we can use the `beforeinput` event to execute some things before
+     *
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
+     */
+    protected handleBeforeInput(segment: Segment, event: InputEvent): void {
+        switch (event.inputType) {
+            case 'deleteContentBackward':
+            case 'deleteContentForward':
+                event.preventDefault();
+                this.clearContent(segment, event);
+                break;
+
+            case 'insertParagraph': // “Enter” key
+            case 'insertLineBreak': // Shift + “Enter” keys
+                event.preventDefault();
+                break;
+        }
+    }
+
+    /**
+     * Sets new segment value after the user types something
      *
-     * @param segment - The segment being changed
-     * @param event - Event details
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
      */
-    public handleTypedValue(segment: Segment, event: KeyboardEvent): void {
+    protected handleInputEvent(segment: Segment, event: InputEvent): void {
         const details = this.extractDetails(segment);
+        const data: string | null = event.data;
 
-        if (details === undefined) {
+        if (details === undefined || data === null) {
             return;
         }
 
-        const typedValue = this.numberParser.parse(event.key);
+        if (
+            data === ' ' || // Space is considered “valid number” by the following validations... 🤦🏻‍♂️
+            !this.numberParser.isValidPartialNumber(data) ||
+            isNaN(Number(data))
+        ) {
+            this.updateContent(segment, event);
+            return;
+        }
+
+        const isDate = dateSegmentTypes.includes(segment.type);
+        const typedValue = this.numberParser.parse(data);
         const isAmPmHour = this.is12HourClock && segment.type === 'hour';
 
         segment.value = isAmPmHour
             ? this.getNewValueForAmPmHourSegment(details, typedValue)
-            : this.getNewValueForOtherSegments(details, typedValue);
+            : this.getNewValueForOtherSegments(details, typedValue, isDate);
+
+        this.valueChanged(segment, event);
+    }
+
+    /**
+     * Increments the segment value respecting the minimum and maximum limits
+     *
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
+     */
+    protected incrementValue(segment: Segment, event: KeyboardEvent): void {
+        const min = segment.minValue;
+        const max = segment.maxValue;
+
+        if (min === undefined || max === undefined) {
+            return;
+        }
+
+        if (segment.value === undefined) {
+            segment.value =
+                segment.type === 'year' ? this.currentDateTime.year : min;
+        } else if (segment.type === 'dayPeriod') {
+            segment.value = this.toggleAmPm(segment.value);
+        } else {
+            segment.value += 1;
+
+            if (segment.value > max) {
+                segment.value = min;
+            }
+        }
+
+        this.valueChanged(segment, event);
+    }
+
+    /**
+     * Decrements the segment value respecting the minimum and maximum limits
+     *
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
+     */
+    protected decrementValue(segment: Segment, event: KeyboardEvent): void {
+        const min = segment.minValue;
+        const max = segment.maxValue;
+
+        if (min === undefined || max === undefined) {
+            return;
+        }
+
+        if (segment.value === undefined) {
+            segment.value =
+                segment.type === 'year' ? this.currentDateTime.year : max;
+        } else if (segment.type === 'dayPeriod') {
+            segment.value = this.toggleAmPm(segment.value);
+        } else {
+            segment.value -= 1;
+
+            if (segment.value < min) {
+                segment.value = max;
+            }
+        }
 
-        this.valueChanged(segment);
+        this.valueChanged(segment, event);
     }
 
     /**
      * Sets the new segment value after the user clears the content
      *
-     * @param segment - The segment being changed
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
      */
-    public handleClear(segment: Segment): void {
+    protected clearContent(
+        segment: Segment,
+        event: InputEvent | KeyboardEvent
+    ): void {
         const details = this.extractDetails(segment);
 
         if (details?.value === undefined) {
@@ -415,140 +508,375 @@ export class InputSegments extends TextfieldBase {
             (newValue !== undefined && this.numberParser.parse(newValue)) ||
             undefined;
 
-        this.valueChanged(segment);
+        this.valueChanged(segment, event);
     }
 
     /**
-     * Returns data from the editable segment that corresponds to the given type
+     * After defining the new segment value, it formats the values that will be displayed on the screen and prepares the
+     * object that will be emitted by the component, if it is ready/defined
      *
-     * @param type - Segment type
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
      */
-    protected segment(type: EditableSegmentType): Segment | undefined {
-        return this.segments.find((segment) => segment.type === type);
+    protected valueChanged(
+        segment: Segment,
+        event: InputEvent | KeyboardEvent
+    ): void {
+        if (this.is12HourClock) {
+            if (segment.type === 'hour') {
+                this.updateAmPm();
+            } else if (segment.type === 'dayPeriod') {
+                this.updateHour();
+            }
+        }
+
+        const hasDay = isNumber(this.daySegment?.value);
+        const hasMonth = isNumber(this.monthSegment?.value);
+
+        if (
+            segment.type === 'month' ||
+            (segment.type === 'day' && hasMonth) ||
+            (segment.type === 'year' && hasDay && hasMonth)
+        ) {
+            this.updateDay();
+        }
+
+        this.formatValue(segment);
+        this.updateContent(segment, event);
+        this.setNewDateTime();
+        this.emitNewDateTime();
     }
 
     /**
-     * Defines the formatter that will be used in the creation of segments
+     * Sets the new date/time object according to the configuration parameters and if the minimum required values for
+     * each type (date only, time only or date and time together) were defined
      */
-    private setFormatter(): void {
-        let dateOptions: Intl.DateTimeFormatOptions = {};
-        let timeOptions: Intl.DateTimeFormatOptions = {};
+    protected setNewDateTime(): void {
+        this.newDateTime = undefined;
 
-        if (this.includeDate) {
-            dateOptions = {
-                day: '2-digit',
-                month: '2-digit',
-                year: 'numeric',
-            };
+        // If none of the date/time segments are being used, there is nothing to do here
+        if (!this.includeDate && !this.includeTime) {
+            return;
         }
 
-        if (this.includeTime) {
-            const useMinutes: TimeGranularity[] = ['minute', 'second'];
+        const date = this.getDateFromSegments();
+        const time = this.getTimeFromSegments();
 
-            const includeMinutes = useMinutes.includes(this.timeGranularity);
-            const includeSeconds = this.timeGranularity === 'second';
+        // When only date segments are being used
+        if (this.includeDate && !this.includeTime) {
+            if (date !== undefined) {
+                this.newDateTime = this.dateToCalendarDateTime(date);
+            }
 
-            timeOptions = {
-                hour: '2-digit',
-                ...(includeMinutes && { minute: '2-digit' }),
-                ...(includeSeconds && { second: '2-digit' }),
-            };
+            return;
         }
 
-        this.formatter = new DateFormatter(this.locale, {
-            ...dateOptions,
-            ...timeOptions,
-        });
+        if (time !== undefined) {
+            this.newDateTime = this.dateToCalendarDateTime(time);
+        }
+
+        // If date segments are being used, we need to change the date part to use the value of these segments
+        if (this.includeDate && date !== undefined) {
+            const dateCalendar = this.dateToCalendarDateTime(date);
+
+            this.newDateTime = this.newDateTime?.set({
+                year: dateCalendar.year,
+                month: dateCalendar.month,
+                day: dateCalendar.day,
+            });
+        }
     }
 
     /**
-     * * Defines the number parser using the defined locale
+     * Emits the new value for date/time if it is already defined
      */
-    private setNumberParser(): void {
-        this.numberParser = new NumberParser(this.locale, {
-            maximumFractionDigits: 0,
-        });
+    protected emitNewDateTime(): void {
+        const dateTime = this.newDateTime
+            ? this.newDateTime.toDate(this.timeZone)
+            : undefined;
+
+        this.dispatchEvent(
+            new CustomEvent('change', {
+                bubbles: true,
+                composed: true,
+                detail: dateTime,
+            })
+        );
     }
 
     /**
-     * If a datetime is received by the component via property, it will use it as the current datetime to render the
-     * input
+     * The parts returned by the `formatToParts()` function of `Intl.DateTimeFormat` have only two properties, `type`
+     * and `value`, but we need more information for each segment, so we convert it to the type we need
+     *
+     * @param part - Part/segment to be “translated” (mapped)
      */
-    private setCurrentDateTime(): void {
-        if (!this.selectedDateTime) {
-            return;
+    protected mapToSegment(part: Intl.DateTimeFormatPart): Segment {
+        const type = part.type;
+        const formatted = part.value;
+
+        if (type === 'literal') {
+            return {
+                type,
+                formatted,
+            };
         }
 
-        this.selectedDateTime = new Date(this.selectedDateTime);
+        const { value, minValue, maxValue } = this.getValueAndLimits(type);
+        const placeholder = this.getPlaceholder(type, part.value);
 
-        if (!this.isValidTime(this.selectedDateTime)) {
-            this.selectedDateTime = undefined;
-            return;
+        const segment: Segment = {
+            type,
+            formatted,
+            ...(value !== undefined && { value }),
+            ...(minValue !== undefined && { minValue }),
+            ...(maxValue !== undefined && { maxValue }),
+            ...(placeholder !== undefined && { placeholder }),
+        };
+
+        this.formatValue(segment);
+
+        return segment;
+    }
+
+    /**
+     * Extracts the segment details, validating that the limits have been defined. The value currently assigned to the
+     * segment remains optional
+     *
+     * @param segment - The segment to extract the details
+     */
+    protected extractDetails(segment: Segment): SegmentDetails | undefined {
+        const min = segment.minValue;
+        const max = segment.maxValue;
+
+        if (min === undefined || max === undefined) {
+            return undefined;
         }
 
-        this.currentDateTime = this.dateToCalendarDateTime(
-            this.selectedDateTime
+        return {
+            value: segment.value,
+            minValue: min,
+            maxValue: max,
+        };
+    }
+
+    /**
+     * For the hour segment whose clock format is 12 hours, we need to perform some checks before defining what will be
+     * the new value associated with the segment. This is necessary because the time the user sees might not match the
+     * value we need to store in the segment
+     *
+     * For example, if “10” is the value displayed in the field, the actual value could be “22” if it's PM, so we need
+     * to identify when we have to change the “actual value”
+     *
+     * @param details - Segment value and limits
+     * @param typedValue - The value typed by the user
+     */
+    protected getNewValueForAmPmHourSegment(
+        details: SegmentDetails,
+        typedValue: number
+    ): number {
+        const isAmPmHour = true;
+
+        let newValue = this.mergePreviousValueWithTypedValue(
+            details,
+            typedValue,
+            isAmPmHour
         );
+
+        const min = details.minValue;
+        const max = details.maxValue;
+        const isPM = this.isPM(min);
+
+        if (isPM && newValue !== min && newValue > maxHourAM) {
+            newValue = this.numberParser.parse(String(newValue).slice(1));
+        } else if (newValue > max) {
+            const useMinHourAM = !isPM && newValue === PM;
+
+            newValue = useMinHourAM
+                ? minHourAM
+                : this.useTypedValueOrMax(typedValue, max);
+        }
+
+        if (isPM && newValue !== min) {
+            newValue += PM;
+        }
+
+        return newValue;
     }
 
     /**
-     * Sets the new date/time object according to the configuration parameters and if the minimum required values for
-     * each type (date only, time only or date and time together) were defined
+     * Defines the new value that will be associated with the segment, with the exception of the hour segment for
+     * 12-hour clocks, whose value is defined in another method
+     *
+     * @param details - Segment value and limits
+     * @param typedValue - The value typed by the user
+     * @param isDateSegment - Indicates if it is a date segment
      */
-    private setNewDateTime(): void {
-        this.newDateTime = undefined;
+    protected getNewValueForOtherSegments(
+        details: SegmentDetails,
+        typedValue: number,
+        isDateSegment: boolean
+    ): number | undefined {
+        let newValue = this.mergePreviousValueWithTypedValue(
+            details,
+            typedValue
+        );
 
-        // If none of the date/time segments are being used, there is nothing to do here
-        if (!this.includeDate && !this.includeTime) {
+        if (isDateSegment && newValue === 0) {
+            return undefined;
+        }
+
+        const min = details.minValue;
+        const max = details.maxValue;
+
+        if (String(newValue).length > String(max).length) {
+            newValue = this.numberParser.parse(String(newValue).slice(1));
+        }
+
+        if (newValue < min) {
+            newValue = this.useTypedValueOrMin(typedValue, min);
+        } else if (newValue > max) {
+            newValue = this.useTypedValueOrMax(typedValue, max);
+        }
+
+        return newValue;
+    }
+
+    /**
+     * If the segment has a `value`, it defines the text used in the UI formatted according to the locale. At this
+     * moment we are formatting the value of a specific segment, but it is not possible to generate a valid Date object
+     * with just one piece of information (day, month, year, etc.), so we need to define a "base date" to be used
+     * together with the value of the segment.
+     *
+     * For example, if the current segment is the day segment, but the month and year segment have not yet been defined,
+     * we need to choose a month and a year to be used in composing the date that will be used in formatting, after all,
+     * there is no day without a month and a year.
+     *
+     * @param segment - Segment to format the value
+     */
+    protected formatValue(segment: Segment): void {
+        if (segment.value === undefined) {
             return;
         }
 
-        let year = this.yearSegment?.value;
-        let month = this.monthSegment?.value;
-        let day = this.daySegment?.value;
+        // We always use the first day of a month unless a specific day is specified
+        let day = this.daySegment?.value ?? 1;
 
-        // When only date segments are being used
-        if (this.includeDate && !this.includeTime) {
-            if (isNumber(year) && isNumber(month) && isNumber(day)) {
-                this.newDateTime = new CalendarDateTime(year, month, day);
-            }
+        // We always use the first month of the year unless a specific month is specified
+        let month =
+            this.monthSegment?.value ??
+            getMinimumMonthInYear(this.currentDateTime);
 
+        let year = this.yearSegment?.value ?? this.currentDateTime.year;
+        let hour = this.hourSegment?.value ?? this.currentDateTime.hour;
+        let minute = this.minuteSegment?.value ?? this.currentDateTime.minute;
+        let second = this.secondSegment?.value ?? this.currentDateTime.second;
+
+        switch (segment.type) {
+            case 'day':
+                day = segment.value;
+                break;
+            case 'month':
+                month = segment.value;
+                break;
+            case 'year':
+                year = segment.value;
+                break;
+            case 'hour':
+                hour = segment.value;
+                break;
+            case 'minute':
+                minute = segment.value;
+                break;
+            case 'second':
+                second = segment.value;
+                break;
+            case 'dayPeriod':
+                hour = (segment.value ?? 0) + 1;
+                break;
+        }
+
+        /**
+         * For the year we do not use the value returned by the formatter, to avoid that the typed year is displayed in
+         * an unexpected way. For example, when typing “2”, the year would be formatted as “1902”, but we keep it as it
+         * is being displayed on the screen. If the user wants to enter the year “1902”, he will enter number by number
+         */
+        if (segment.type === 'year') {
+            segment.formatted = String(year);
             return;
         }
 
-        // When only time segments are being used, we need to set the date based on the current date
-        if (!this.includeDate) {
-            year = this.currentDateTime.year;
-            month = this.currentDateTime.month;
-            day = this.currentDateTime.day;
+        /**
+         * If the day being formatted is February 29th but the year segment has not yet been filled, we need to use a
+         * leap year to allow the 29th to remain, otherwise, if we use the current year and it is not a leap year, the
+         * day that would be displayed would be March 1st, as February 29th would not exist and JavaScript “moves” the
+         * day to the next day. As this year is only used to format the day and month, we use the year 2000 as the "base
+         * year" for formatting
+         */
+        if (
+            !this.yearSegment?.value &&
+            (['day', 'month'] as typeof dateSegmentTypes).includes(segment.type)
+        ) {
+            year = 2000;
+        }
+
+        const date = this.getDate(year, month, day);
+
+        if (!date) {
+            return;
         }
 
-        const hour = this.hourSegment?.value;
-        const minute = this.minuteSegment?.value;
-        const second = this.secondSegment?.value;
+        const options: Intl.DateTimeFormatOptions = {
+            month: '2-digit',
+            day: '2-digit',
+            hour: 'numeric',
+            minute: '2-digit',
+            second: '2-digit',
+        };
 
-        const isHour = this.timeGranularity === 'hour';
-        const isMinute = this.timeGranularity === 'minute';
-        const isSecond = this.timeGranularity === 'second';
+        date.setHours(hour);
+        date.setMinutes(minute);
+        date.setSeconds(second);
 
-        const hasTime =
-            (isHour && isNumber(hour)) ||
-            (isMinute && isNumber(hour) && isNumber(minute)) ||
-            (isSecond &&
-                isNumber(hour) &&
-                isNumber(minute) &&
-                isNumber(second));
-
-        if (isNumber(year) && isNumber(month) && isNumber(day) && hasTime) {
-            this.newDateTime = new CalendarDateTime(
-                year,
-                month,
-                day,
-                hour,
-                minute,
-                second
-            );
+        const formatted = new DateFormatter(this.locale, options)
+            .formatToParts(date)
+            .find((part) => part.type === segment.type)?.value;
+
+        let padMaxLength = 2;
+
+        if (segment.type === 'hour' && this.is12HourClock) {
+            padMaxLength = 1;
+        } else if (segment.type === 'dayPeriod') {
+            padMaxLength = 0;
         }
+
+        segment.formatted = formatted?.padStart(padMaxLength, '0');
+    }
+
+    /**
+     * Returns data from the editable segment that corresponds to the given type
+     *
+     * @param type - Type of segment
+     */
+    protected segment(type: EditableSegmentType): Segment | undefined {
+        return this.segments.find((segment) => segment.type === type);
+    }
+
+    /**
+     * Indicates whether the hour entered is PM or not
+     *
+     * @param hour - The hour to check
+     */
+    protected isPM(hour: number): boolean {
+        return hour >= PM;
+    }
+
+    /**
+     * Returns the corresponding “modifier” (0 for “AM” and 12 for “PM”) for the given hour
+     *
+     * @param hour - The hour to identify the modifier
+     */
+    protected getAmPmModifier(hour: number): typeof AM | typeof PM {
+        return this.isPM(hour) ? PM : AM;
     }
 
     /**
@@ -556,22 +884,40 @@ export class InputSegments extends TextfieldBase {
      *
      * @param date - `Date` object to validate
      */
-    private isValidTime(date: Date): boolean {
+    protected isValidTime(date: Date): boolean {
         return !isNaN(date.getTime());
     }
 
     /**
-     * Converts an object of type `Date` to `CalendarDateTime`
+     * Checks if the time has been defined according to the granularity type
+     */
+    protected hasTime(): boolean {
+        const hour = this.hourSegment?.value;
+        const minute = this.minuteSegment?.value;
+        const second = this.secondSegment?.value;
+
+        const isHour = this.timeGranularity === 'hour';
+        const isMinute = this.timeGranularity === 'minute';
+        const isSecond = this.timeGranularity === 'second';
+
+        return (
+            (isHour && isNumber(hour)) ||
+            (isMinute && isNumber(hour) && isNumber(minute)) ||
+            (isSecond && isNumber(hour) && isNumber(minute) && isNumber(second))
+        );
+    }
+
+    /**
+     * Converts an object of type `Date` to `CalendarDateTime`. The month must be incremented by 1 to create a new
+     * `CalendarDateTime`, as it uses months ranging from 1 (January) to 12 (December), as opposed to `Date`, whose
+     * months range from 0 (January) to 11 ( December)
      *
-     * @param date - `Date` object to "convert"
+     * @param date - `Date` object to “convert”
      */
-    private dateToCalendarDateTime(date: Date): CalendarDateTime {
+    protected dateToCalendarDateTime(date: Date): CalendarDateTime {
         return new CalendarDateTime(
             date.getFullYear(),
-
-            // The month to create a new `CalendarDateTime` cannot be a zero-based index, unlike `Date`
             date.getMonth() + 1,
-
             date.getDate(),
             date.getHours(),
             date.getMinutes(),
@@ -580,127 +926,144 @@ export class InputSegments extends TextfieldBase {
     }
 
     /**
-     * Creates the segments that will be used by the input
+     * Returns a `Date` type object using information extracted from a `CalendarDateTime` type object. The month must be
+     * decremented by 1 because the `Date` object uses months ranging from 0 (January) to 11 (December)
+     *
+     * @param year - Year that will be used to create the new `Date`
+     * @param month - Month (1 to 12) that will be used to create the new `Date`
+     * @param day - Day that will be used to create the new `Date`
      */
-    private setSegments(): void {
+    protected getDate(
+        year: number | undefined,
+        month: number | undefined,
+        day: number | undefined
+    ): Date | undefined {
+        return isNumber(year) && isNumber(month) && isNumber(day)
+            ? new Date(year, month - 1, day)
+            : undefined;
+    }
+
+    /**
+     * Returns a `Date` object using the current values of the segments that make up the date, if they are filled
+     */
+    protected getDateFromSegments(): Date | undefined {
+        return this.getDate(
+            this.yearSegment?.value,
+            this.monthSegment?.value,
+            this.daySegment?.value
+        );
+    }
+
+    /**
+     * Returns a `Date` object using the current values of the segments that make up the time, if they are filled. As it
+     * is not possible to have a `Date` object without an associated date, we use the current date defined internally
+     * instead of using the date defined in the date segments
+     */
+    protected getTimeFromSegments(): Date | undefined {
+        if (!this.hasTime()) {
+            return undefined;
+        }
+
+        const hour = this.hourSegment?.value;
+        const minute = this.minuteSegment?.value;
+        const second = this.secondSegment?.value;
+
         const dateTime = this.currentDateTime.toDate(this.timeZone);
 
-        const segmentTypes = [
-            ...(this.includeDate ? dateSegmentTypes : []),
-            ...(this.includeTime ? timeSegmentTypes : []),
-        ];
+        if (isNumber(hour)) {
+            dateTime.setHours(hour);
+        }
 
-        this.segments = this.formatter
-            .formatToParts(dateTime)
-            .filter((part) => segmentTypes.includes(part.type))
-            .map((part) => this.mapToSegment(part));
+        if (isNumber(minute)) {
+            dateTime.setMinutes(minute);
+        }
+
+        if (isNumber(second)) {
+            dateTime.setSeconds(second);
+        }
+
+        return dateTime;
     }
 
     /**
-     * The parts returned by the `formatToParts()` function have only two properties, `type` and `value`, but we need
-     * more information for each segment, so we convert it to the type we need
-     *
-     * @param part - Part/segment to be "translated" (mapped)
+     * Defines the formatter that will be used in the creation of segments
      */
-    private mapToSegment(part: Intl.DateTimeFormatPart): Segment {
-        const type = part.type;
-        const formatted = part.value;
-        const placeholder = this.getPlaceholder(type, part.value);
-        const { value, minValue, maxValue } = this.getValueAndLimits(type);
+    private setFormatter(): void {
+        let dateOptions: Intl.DateTimeFormatOptions = {};
+        let timeOptions: Intl.DateTimeFormatOptions = {};
 
-        const segment: Segment = {
-            type,
-            formatted,
-            ...(placeholder !== undefined && { placeholder }),
-            ...(value !== undefined && { value }),
-            ...(minValue !== undefined && { minValue }),
-            ...(maxValue !== undefined && { maxValue }),
-        };
+        if (this.includeDate) {
+            dateOptions = {
+                day: '2-digit',
+                month: '2-digit',
+                year: 'numeric',
+            };
+        }
+
+        if (this.includeTime) {
+            const useMinutes: TimeGranularity[] = ['minute', 'second'];
 
-        if (part.type !== 'literal') {
-            this.formatValue(segment);
+            const includeMinutes = useMinutes.includes(this.timeGranularity);
+            const includeSeconds = this.timeGranularity === 'second';
+
+            timeOptions = {
+                hour: '2-digit',
+                ...(includeMinutes && { minute: '2-digit' }),
+                ...(includeSeconds && { second: '2-digit' }),
+            };
         }
 
-        return segment;
+        this.formatter = new DateFormatter(this.locale, {
+            ...dateOptions,
+            ...timeOptions,
+        });
+    }
+
+    /**
+     * Defines the number parser using the defined locale
+     */
+    private setNumberParser(): void {
+        this.numberParser = new NumberParser(this.locale, {
+            maximumFractionDigits: 0,
+        });
     }
 
     /**
-     * If the segment has a `value`, it defines the text used in the UI formatted according to the locale
-     *
-     * @param segment - Segment to be updated
+     * If a datetime is received by the component via property, it will use it as the current datetime to render the
+     * input
      */
-    private formatValue(segment: Segment): void {
-        if (segment.value === undefined) {
+    private setCurrentDateTime(): void {
+        if (!this.selectedDateTime) {
             return;
         }
 
-        const options: Intl.DateTimeFormatOptions = {};
-
-        const year = this.yearSegment?.value ?? this.currentDateTime.year;
-        const month = this.monthSegment?.value ?? this.currentDateTime.month;
-        const day = this.daySegment?.value ?? this.currentDateTime.day;
-
-        // The hour can be changed if we are formatting the "dayPeriod" segment
-        let hour = this.hourSegment?.value ?? this.currentDateTime.hour;
-
-        const minute = this.minuteSegment?.value ?? this.currentDateTime.minute;
-        const second = this.secondSegment?.value ?? this.currentDateTime.second;
+        this.selectedDateTime = new Date(this.selectedDateTime);
 
-        /**
-         * For the year we do not use the value returned by the formatter, to avoid that the typed year is displayed in
-         * an unexpected way. For example, when typing "2", the year would be formatted as "1902", but we keep it as it
-         * is being displayed on the screen. If the user wants to enter the year "1902", he will enter number by number
-         */
-        if (segment.type === 'year') {
-            segment.formatted = String(year);
+        if (!this.isValidTime(this.selectedDateTime)) {
+            this.selectedDateTime = undefined;
             return;
         }
 
-        let padMaxLength = 2;
-
-        switch (segment.type) {
-            case 'month': {
-                options.month = '2-digit';
-                break;
-            }
-            case 'day': {
-                options.day = '2-digit';
-                break;
-            }
-            case 'hour': {
-                if (this.is12HourClock) {
-                    padMaxLength = 1;
-                }
+        this.currentDateTime = this.dateToCalendarDateTime(
+            this.selectedDateTime
+        );
+    }
 
-                options.hour = 'numeric';
-                break;
-            }
-            case 'minute': {
-                options.minute = '2-digit';
-                break;
-            }
-            case 'second': {
-                options.second = '2-digit';
-                break;
-            }
-            case 'dayPeriod': {
-                hour = (segment.value || 0) + 1;
-                options.hour = 'numeric';
-                padMaxLength = 0;
-                break;
-            }
-        }
+    /**
+     * Creates the segments that will be used by the input
+     */
+    private setSegments(): void {
+        const dateTime = this.currentDateTime.toDate(this.timeZone);
 
-        /**
-         * As we use `CalendarDateTime`, we need to subtract 1 from the month before creating a new `Date` object,
-         * as this uses zero-based months, and `CalendarDateTime` does not
-         */
-        const date = new Date(year, month - 1, day, hour, minute, second);
-        const formatted = new DateFormatter(this.locale, options)
-            .formatToParts(date)
-            .find((part) => part.type === segment.type)?.value;
+        const segmentTypes = [
+            ...(this.includeDate ? dateSegmentTypes : []),
+            ...(this.includeTime ? timeSegmentTypes : []),
+        ];
 
-        segment.formatted = formatted?.padStart(padMaxLength, '0');
+        this.segments = this.formatter
+            .formatToParts(dateTime)
+            .filter((part) => segmentTypes.includes(part.type))
+            .map((part) => this.mapToSegment(part));
     }
 
     /**
@@ -726,42 +1089,13 @@ export class InputSegments extends TextfieldBase {
     }
 
     /**
-     * Extracts the segment details, validating that the limits have been defined. The value currently assigned to the
-     * segment remains optional
-     *
-     * @param segment - The segment to extract the details
-     */
-    private extractDetails(segment: Segment): SegmentDetails | undefined {
-        const min = segment.minValue;
-        const max = segment.maxValue;
-
-        if (min === undefined || max === undefined) {
-            return undefined;
-        }
-
-        return {
-            value: segment.value,
-            minValue: min,
-            maxValue: max,
-        };
-    }
-
-    /**
-     * Indicates whether the hour entered is PM or not
-     *
-     * @param hour - The hour to check
-     */
-    private isPM(hour: number): boolean {
-        return hour >= PM;
-    }
-
-    /**
-     * Returns the corresponding "modifier" (0 for "AM" and 12 for "PM") for the given hour
-     *
-     * @param hour - The hour to identify the modifier
+     * If the defined month is February but we don't yet have the year defined, we use 29 as the max limit, as we have
+     * no way of knowing whether it is a leap year or not until the year segment is filled
      */
-    private getAmPmModifier(hour: number): typeof AM | typeof PM {
-        return this.isPM(hour) ? PM : AM;
+    private getFebruaryMaxValue(): number | undefined {
+        return this.monthSegment?.value === 2 && !this.yearSegment?.value
+            ? 29
+            : undefined;
     }
 
     /**
@@ -810,7 +1144,7 @@ export class InputSegments extends TextfieldBase {
                 currentValue = this.currentDateTime[type];
                 break;
             case 'dayPeriod':
-                // To identify the current value of "AM/PM", we use the value of the hour, not the day period itself
+                // To identify the current value of “AM/PM”, we use the value of the hour, not the day period itself
                 previousValue =
                     this.hourSegment?.value &&
                     this.getAmPmModifier(this.hourSegment.value);
@@ -852,15 +1186,34 @@ export class InputSegments extends TextfieldBase {
                     ),
                     value,
                 };
-            case 'day':
+            case 'day': {
+                let max = this.currentDateTime.calendar.getDaysInMonth(
+                    this.currentDateTime
+                );
+
+                /**
+                 * If we do not yet have a month defined by the user, we use the highest possible number as a maximum
+                 * limit. When the month is set, if the day is outside the allowed range, it will be corrected
+                 * automatically
+                 */
+                if (!this.monthSegment?.value) {
+                    max = 31;
+                }
+
+                // Check whether the maximum possible limit for the month of February should be used
+                const febMaxValue = this.getFebruaryMaxValue();
+
+                if (isNumber(febMaxValue)) {
+                    max = febMaxValue;
+                }
+
                 return {
                     minValue: getMinimumDayInMonth(this.currentDateTime),
-                    maxValue: this.currentDateTime.calendar.getDaysInMonth(
-                        this.currentDateTime
-                    ),
+                    maxValue: max,
                     value,
                 };
-            case 'hour':
+            }
+            case 'hour': {
                 let min = 0;
                 let max = 23;
 
@@ -878,6 +1231,7 @@ export class InputSegments extends TextfieldBase {
                     maxValue: max,
                     value,
                 };
+            }
             case 'minute':
             case 'second':
                 return {
@@ -897,70 +1251,40 @@ export class InputSegments extends TextfieldBase {
     }
 
     /**
-     * Increments the segment value respecting the minimum and maximum limits
+     * Switches the value of the AM/PM segment from `AM` to `PM` or vice versa
      *
-     * @param segment - The segment being changed
+     * @param value - Current value of segment `dayPeriod`
      */
-    private incrementValue(segment: Segment): void {
-        const min = segment.minValue;
-        const max = segment.maxValue;
-
-        if (min === undefined || max === undefined) {
-            return;
-        }
-
-        if (segment.value === undefined) {
-            segment.value =
-                segment.type === 'year' ? this.currentDateTime.year : min;
-        } else if (segment.type === 'dayPeriod') {
-            segment.value = this.toggleDayPeriod(segment.value);
-        } else {
-            segment.value += 1;
-
-            if (segment.value > max) {
-                segment.value = min;
-            }
-        }
-
-        this.valueChanged(segment);
+    private toggleAmPm(value: number): typeof AM | typeof PM {
+        return value === AM ? PM : AM;
     }
 
     /**
-     * Decrements the segment value respecting the minimum and maximum limits
+     * Changes the value of the AM/PM segment to use the new value
      *
-     * @param segment - The segment being changed
+     * @param newValue - New value for the segment `dayPeriod`
      */
-    private decrementValue(segment: Segment): void {
-        const min = segment.minValue;
-        const max = segment.maxValue;
+    private setAmPmSegmentValue(newValue: typeof AM | typeof PM): void {
+        if (this.amPmSegment) {
+            this.amPmSegment.value = newValue;
+        }
+    }
 
-        if (min === undefined || max === undefined) {
+    private updateAmPm(): void {
+        if (!this.hourSegment || !this.amPmSegment) {
+            this.resetHourAndAmPm();
             return;
         }
 
-        if (segment.value === undefined) {
-            segment.value =
-                segment.type === 'year' ? this.currentDateTime.year : max;
-        } else if (segment.type === 'dayPeriod') {
-            segment.value = this.toggleDayPeriod(segment.value);
-        } else {
-            segment.value -= 1;
-
-            if (segment.value < min) {
-                segment.value = max;
-            }
+        // If there is no hour or if AM/PM is already set, there is nothing to do
+        if (
+            this.hourSegment.value === undefined ||
+            this.amPmSegment.value !== undefined
+        ) {
+            return;
         }
 
-        this.valueChanged(segment);
-    }
-
-    /**
-     * Switches the value of the `dayPeriod` segment from `AM` to `PM` or vice versa
-     *
-     * @param value - Current value of segment `dayPeriod`
-     */
-    private toggleDayPeriod(value: number): typeof AM | typeof PM {
-        return value === AM ? PM : AM;
+        this.amPmSegment.value = this.getAmPmModifier(this.hourSegment.value);
     }
 
     /**
@@ -969,7 +1293,7 @@ export class InputSegments extends TextfieldBase {
      */
     private updateHour(): void {
         if (!this.hourSegment || !this.amPmSegment) {
-            this.resetHourAndDayPeriod();
+            this.resetHourAndAmPm();
             return;
         }
 
@@ -995,16 +1319,16 @@ export class InputSegments extends TextfieldBase {
     }
 
     /**
-     * When the day period is cleared, we need to reset the min and max values of the day period and hour segments to
-     * their initial values
+     * When the “AM/PM” is cleared, we need to reset the min and max values of the AM/PM and hour segments to their
+     * initial values
      */
-    private resetHourAndDayPeriod(): void {
+    private resetHourAndAmPm(): void {
         if (this.amPmSegment) {
-            const dayPeriod = this.getValueAndLimits('dayPeriod');
+            const amPm = this.getValueAndLimits('dayPeriod');
 
-            this.amPmSegment.value = dayPeriod.value;
-            this.amPmSegment.minValue = dayPeriod.minValue;
-            this.amPmSegment.maxValue = dayPeriod.maxValue;
+            this.amPmSegment.value = amPm.value;
+            this.amPmSegment.minValue = amPm.minValue;
+            this.amPmSegment.maxValue = amPm.maxValue;
 
             if (this.amPmSegment.value === undefined) {
                 this.amPmSegment.formatted = this.amPmSegment.placeholder;
@@ -1049,6 +1373,13 @@ export class InputSegments extends TextfieldBase {
 
         this.daySegment.maxValue = lastDayOfMonth.day;
 
+        // Check whether the maximum possible limit for the month of February should be used
+        const febMaxValue = this.getFebruaryMaxValue();
+
+        if (isNumber(febMaxValue)) {
+            this.daySegment.maxValue = febMaxValue;
+        }
+
         if (
             isNumber(this.daySegment.value) &&
             this.daySegment.value > this.daySegment.maxValue
@@ -1058,44 +1389,6 @@ export class InputSegments extends TextfieldBase {
         }
     }
 
-    /**
-     * After defining the new segment value, it formats the values that will be displayed on the screen and prepares the
-     * object that will be emitted by the component, if it is ready/defined
-     *
-     * @param segment - The segment that was changed
-     */
-    private valueChanged(segment: Segment): void {
-        if (this.is12HourClock && segment.type === 'dayPeriod') {
-            this.updateHour();
-        }
-
-        const hasDay = isNumber(this.daySegment?.value);
-        const hasMonth = isNumber(this.monthSegment?.value);
-
-        if (
-            segment.type === 'month' ||
-            (segment.type === 'day' && hasMonth) ||
-            (segment.type === 'year' && hasDay && hasMonth)
-        ) {
-            this.updateDay();
-        }
-
-        this.formatValue(segment);
-        this.setNewDateTime();
-        this.requestUpdate();
-
-        if (this.newDateTime) {
-            this.dispatchEvent(
-                new CustomEvent('change', {
-                    bubbles: true,
-                    composed: true,
-                    cancelable: true,
-                    detail: this.newDateTime.toDate(this.timeZone),
-                })
-            );
-        }
-    }
-
     /**
      * Returns the value to be used if the typed value is less than the minimum allowed
      *
@@ -1148,85 +1441,34 @@ export class InputSegments extends TextfieldBase {
     }
 
     /**
-     * For the hour segment whose clock format is 12 hours, we need to perform some checks before defining what will be
-     * the new value associated with the segment. This is necessary because the time the user sees might not match the
-     * value we need to store in the segment
-     *
-     * For example, if "10" is the value displayed in the field, the actual value could be "22" if it's PM, so we need
-     * to identify when we have to change the "actual value"
-     *
-     * @param details - Segment value and limits
-     * @param typedValue - The value typed by the user
-     */
-    private getNewValueForAmPmHourSegment(
-        details: SegmentDetails,
-        typedValue: number
-    ): number {
-        const isAmPmHour = true;
-
-        let newValue = this.mergePreviousValueWithTypedValue(
-            details,
-            typedValue,
-            isAmPmHour
-        );
-
-        const min = details.minValue;
-        const max = details.maxValue;
-        const isPM = this.isPM(min);
-
-        if (isPM && newValue !== min && newValue > maxHourAM) {
-            newValue = this.numberParser.parse(String(newValue).slice(1));
-        } else if (newValue > max) {
-            const useMinHourAM = !isPM && newValue === PM;
-
-            newValue = useMinHourAM
-                ? minHourAM
-                : this.useTypedValueOrMax(typedValue, max);
-        }
-
-        if (isPM && newValue !== min) {
-            newValue += PM;
-        }
-
-        return newValue;
-    }
-
-    /**
-     * Defines the new value that will be associated with the segment, with the exception of the hour segment for
-     * 12-hour clocks, whose value is defined in another method
+     * To define the content of elements with the `contenteditable` attribute with Lit we bind to the `.innerText`
+     * property of the element instead of using string interpolation
      *
-     * @param details - Segment value and limits
-     * @param typedValue - The value typed by the user
+     * @param segment - Segment on which the event was triggered (the segment being changed)
+     * @param event - Triggered event details
      */
-    private getNewValueForOtherSegments(
-        details: SegmentDetails,
-        typedValue: number
-    ): number {
-        let newValue = this.mergePreviousValueWithTypedValue(
-            details,
-            typedValue
-        );
+    private updateContent(
+        segment: Segment,
+        event: InputEvent | KeyboardEvent
+    ): void {
+        const segmentEl = event.target as HTMLElement;
 
-        const min = details.minValue;
-        const max = details.maxValue;
+        if (segmentEl) {
+            const content =
+                segment.value !== undefined
+                    ? segment.formatted
+                    : segment.placeholder;
 
-        if (String(newValue).length > String(max).length) {
-            newValue = this.numberParser.parse(String(newValue).slice(1));
-        }
+            segmentEl.innerText = content ?? '';
 
-        if (newValue < min) {
-            newValue = this.useTypedValueOrMin(typedValue, min);
-        } else if (newValue > max) {
-            newValue = this.useTypedValueOrMax(typedValue, max);
+            this.requestUpdate();
         }
-
-        return newValue;
     }
 
     /**
      * Focuses on the next editable segment, if any
      *
-     * @param event - Event details
+     * @param event - Triggered event details
      */
     private focusNextSegment(event: KeyboardEvent): void {
         this.focusSegment(event.target as HTMLDivElement, 'next');
@@ -1235,7 +1477,7 @@ export class InputSegments extends TextfieldBase {
     /**
      * Focuses on the previous editable segment, if any
      *
-     * @param event - Event details
+     * @param event - Triggered event details
      */
     private focusPreviousSegment(event: KeyboardEvent): void {
         this.focusSegment(event.target as HTMLDivElement, 'previous');
@@ -1244,7 +1486,7 @@ export class InputSegments extends TextfieldBase {
     /**
      * Focuses the segment according to the direction, if there is one to focus on
      *
-     * @param segment - Segment that is currently focused
+     * @param segment - Segment on which the event was triggered (the segment being changed)
      * @param elementToFocus - Defines which element will be focused: is it the previous one or the next one?
      */
     private focusSegment(
diff --git a/tools/input-segments/src/input-segments.css b/tools/input-segments/src/input-segments.css
index 891e7f3ae72..85fd8ee097c 100644
--- a/tools/input-segments/src/input-segments.css
+++ b/tools/input-segments/src/input-segments.css
@@ -50,14 +50,8 @@ governing permissions and limitations under the License.
     text-align: start;
 }
 
-.placeholder {
-    display: block;
-    width: 100%;
-    height: 0;
-    visibility: hidden;
+.editable-segment.is-placeholder {
     font-style: italic;
-    text-align: center;
-    pointer-events: none;
 }
 
 .editable-segment.is-placeholder,
diff --git a/tools/input-segments/src/types.ts b/tools/input-segments/src/types.ts
index 0567b241f2b..5c77880c5ab 100644
--- a/tools/input-segments/src/types.ts
+++ b/tools/input-segments/src/types.ts
@@ -9,14 +9,14 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-export const dateSegmentTypes: Intl.DateTimeFormatPartTypes[] = [
+export const dateSegmentTypes: ReadonlyArray<Intl.DateTimeFormatPartTypes> = [
     'day',
     'month',
     'year',
     'literal',
 ];
 
-export const timeSegmentTypes: Intl.DateTimeFormatPartTypes[] = [
+export const timeSegmentTypes: ReadonlyArray<Intl.DateTimeFormatPartTypes> = [
     'hour',
     'minute',
     'second',
diff --git a/tools/opacity-checkerboard/CHANGELOG.md b/tools/opacity-checkerboard/CHANGELOG.md
index 79e3edb1308..8c2547c0557 100644
--- a/tools/opacity-checkerboard/CHANGELOG.md
+++ b/tools/opacity-checkerboard/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/opacity-checkerboard
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/opacity-checkerboard
diff --git a/tools/opacity-checkerboard/package.json b/tools/opacity-checkerboard/package.json
index 43d8ab9473d..c8d9056959a 100644
--- a/tools/opacity-checkerboard/package.json
+++ b/tools/opacity-checkerboard/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/opacity-checkerboard",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -43,7 +43,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/opacitycheckerboard": "^1.0.4"
diff --git a/tools/reactive-controllers/CHANGELOG.md b/tools/reactive-controllers/CHANGELOG.md
index ab2fd296196..10c92848ac0 100644
--- a/tools/reactive-controllers/CHANGELOG.md
+++ b/tools/reactive-controllers/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/reactive-controllers
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/reactive-controllers
diff --git a/tools/reactive-controllers/package.json b/tools/reactive-controllers/package.json
index d6a807ef171..5938eb4e9cb 100644
--- a/tools/reactive-controllers/package.json
+++ b/tools/reactive-controllers/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/reactive-controllers",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
diff --git a/tools/shared/CHANGELOG.md b/tools/shared/CHANGELOG.md
index bd279b1f1e9..5d7e6875967 100644
--- a/tools/shared/CHANGELOG.md
+++ b/tools/shared/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/shared
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/shared
diff --git a/tools/shared/package.json b/tools/shared/package.json
index 624f8697a99..4426ab43e60 100644
--- a/tools/shared/package.json
+++ b/tools/shared/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/shared",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -97,7 +97,7 @@
     ],
     "dependencies": {
         "@lit-labs/observers": "^2.0.0",
-        "@spectrum-web-components/base": "^0.40.0",
+        "@spectrum-web-components/base": "^0.40.1",
         "focus-visible": "^5.1.0"
     },
     "types": "./src/index.d.ts",
diff --git a/tools/shared/src/focusable.ts b/tools/shared/src/focusable.ts
index bc2a4d85ff0..5e0a74b6704 100644
--- a/tools/shared/src/focusable.ts
+++ b/tools/shared/src/focusable.ts
@@ -127,8 +127,12 @@ export class Focusable extends FocusVisiblePolyfillMixin(SpectrumElement) {
 
     private onPointerdownManagementOfTabIndex(): void {
         if (this.tabIndex === -1) {
-            this.tabIndex = 0;
-            this.focus({ preventScroll: true });
+            setTimeout(() => {
+                // Ensure this happens _after_ WebKit attempts to focus the :host.
+                this.tabIndex = 0;
+                this.focus({ preventScroll: true });
+                this.tabIndex = -1;
+            });
         }
     }
 
diff --git a/tools/styles/CHANGELOG.md b/tools/styles/CHANGELOG.md
index 1a7d8e8e56d..06727c8fd82 100644
--- a/tools/styles/CHANGELOG.md
+++ b/tools/styles/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/styles
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 ### Bug Fixes
diff --git a/tools/styles/package.json b/tools/styles/package.json
index e8007809553..6e7be2b398d 100644
--- a/tools/styles/package.json
+++ b/tools/styles/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/styles",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -104,7 +104,7 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1"
     },
     "devDependencies": {
         "@spectrum-css/commons": "^8.0.0",
diff --git a/tools/theme/CHANGELOG.md b/tools/theme/CHANGELOG.md
index 1c86524c32b..f5def4621b6 100644
--- a/tools/theme/CHANGELOG.md
+++ b/tools/theme/CHANGELOG.md
@@ -3,6 +3,10 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.40.1](https://github.com/adobe/spectrum-web-components/compare/v0.40.0...v0.40.1) (2023-12-05)
+
+**Note:** Version bump only for package @spectrum-web-components/theme
+
 # [0.40.0](https://github.com/adobe/spectrum-web-components/compare/v0.39.4...v0.40.0) (2023-11-16)
 
 **Note:** Version bump only for package @spectrum-web-components/theme
diff --git a/tools/theme/package.json b/tools/theme/package.json
index e70a0456938..0e38a7ad504 100644
--- a/tools/theme/package.json
+++ b/tools/theme/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/theme",
-    "version": "0.40.0",
+    "version": "0.40.1",
     "publishConfig": {
         "access": "public"
     },
@@ -133,8 +133,8 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.0",
-        "@spectrum-web-components/styles": "^0.40.0"
+        "@spectrum-web-components/base": "^0.40.1",
+        "@spectrum-web-components/styles": "^0.40.1"
     },
     "types": "./src/index.d.ts",
     "customElements": "custom-elements.json",
diff --git a/tsconfig-all.json b/tsconfig-all.json
index 1173193ec34..8dc31118a5a 100644
--- a/tsconfig-all.json
+++ b/tsconfig-all.json
@@ -39,6 +39,7 @@
         { "path": "packages/color-loupe" },
         { "path": "packages/color-slider" },
         { "path": "packages/color-wheel" },
+        { "path": "packages/date-time-picker" },
         { "path": "packages/dialog" },
         { "path": "packages/divider" },
         { "path": "packages/dropzone" },
@@ -78,7 +79,6 @@
         { "path": "packages/tags" },
         { "path": "packages/textfield" },
         { "path": "packages/thumbnail" },
-        { "path": "packages/time-field" },
         { "path": "packages/toast" },
         { "path": "packages/tooltip" },
         { "path": "packages/top-nav" },
diff --git a/yarn.lock b/yarn.lock
index 3b0e5d4677b..767cef92c53 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -146,7 +146,22 @@
     "@babel/highlight" "^7.22.13"
     chalk "^2.4.2"
 
-"@babel/code-frame@^7.22.5", "@babel/code-frame@^7.23.4", "@babel/code-frame@^7.23.5":
+"@babel/code-frame@^7.22.5":
+  version "7.22.5"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.22.5.tgz#234d98e1551960604f1246e6475891a570ad5658"
+  integrity sha512-Xmwn266vad+6DAqEB2A6V/CcZVp62BbwVmcOJc2RPuwih1kw02TjQvWVWlcKGbBPd+8/0V5DEkOcizRGYsspYQ==
+  dependencies:
+    "@babel/highlight" "^7.22.5"
+
+"@babel/code-frame@^7.23.4":
+  version "7.23.4"
+  resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.23.4.tgz#03ae5af150be94392cb5c7ccd97db5a19a5da6aa"
+  integrity sha512-r1IONyb6Ia+jYR2vvIDhdWdlTGhqbBoFqLTQidzZ4kepUFH15ejXvFHxCVbtl7BOXIudsIubf4E81xeA3h3IXA==
+  dependencies:
+    "@babel/highlight" "^7.23.4"
+    chalk "^2.4.2"
+
+"@babel/code-frame@^7.23.5":
   version "7.23.5"
   resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.23.5.tgz#9009b69a8c602293476ad598ff53e4562e15c244"
   integrity sha512-CgH3s1a96LipHCmSUmYFPwY7MNx8C3avkq7i4Wl3cfa662ldtUe4VM1TPXX70pfmrlWTb6jLqTYrZyT2ZTJBgA==
@@ -1001,13 +1016,13 @@
     "@babel/traverse" "^7.23.5"
     "@babel/types" "^7.23.5"
 
-"@babel/highlight@^7.16.7", "@babel/highlight@^7.23.4":
-  version "7.23.4"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.23.4.tgz#edaadf4d8232e1a961432db785091207ead0621b"
-  integrity sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==
+"@babel/highlight@^7.16.7":
+  version "7.16.7"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.7.tgz#81a01d7d675046f0d96f82450d9d9578bdfd6b0b"
+  integrity sha512-aKpPMfLvGO3Q97V0qhw/V2SWNWlwfJknuwAunU7wZLSfrM4xTBvg7E5opUVi1kJTBKihE38CPg4nBiqX83PWYw==
   dependencies:
-    "@babel/helper-validator-identifier" "^7.22.20"
-    chalk "^2.4.2"
+    "@babel/helper-validator-identifier" "^7.16.7"
+    chalk "^2.0.0"
     js-tokens "^4.0.0"
 
 "@babel/highlight@^7.22.13":
@@ -1019,6 +1034,15 @@
     chalk "^2.4.2"
     js-tokens "^4.0.0"
 
+"@babel/highlight@^7.22.5", "@babel/highlight@^7.23.4":
+  version "7.23.4"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.23.4.tgz#edaadf4d8232e1a961432db785091207ead0621b"
+  integrity sha512-acGdbYSfp2WheJoJm/EBBBLh/ID8KDc64ISZ9DYtBmC8/Q204PZJLHyzeB5qMzJ5trcOkybd78M4x2KWsUq++A==
+  dependencies:
+    "@babel/helper-validator-identifier" "^7.22.20"
+    chalk "^2.4.2"
+    js-tokens "^4.0.0"
+
 "@babel/parser@^7.1.0", "@babel/parser@^7.14.7", "@babel/parser@^7.20.7", "@babel/parser@^7.21.8", "@babel/parser@^7.22.5", "@babel/parser@^7.22.7":
   version "7.22.7"
   resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.22.7.tgz#df8cf085ce92ddbdbf668a7f186ce848c9036cae"
@@ -4086,10 +4110,10 @@
   resolved "https://registry.yarnpkg.com/@import-maps/resolve/-/resolve-1.0.1.tgz#1e9fcadcf23aa0822256a329aabca241879d37c9"
   integrity sha512-tWZNBIS1CoekcwlMuyG2mr0a1Wo5lb5lEHwwWvZo+5GLgr3e9LLDTtmgtCWEwBpXMkxn9D+2W9j2FY6eZQq0tA==
 
-"@internationalized/date@^3.2.1":
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/@internationalized/date/-/date-3.3.0.tgz#90386d4b4e707f28507d1a1b3cc0e162ad5ee038"
-  integrity sha512-qfRd7jCIgUjabI8RxeAsxhLDRS1u8eUPX96GB5uBp1Tpm6YY6dVveE7YwsTEV6L4QOp5LKFirFHHGsL/XQwJIA==
+"@internationalized/date@^3.5.0":
+  version "3.5.0"
+  resolved "https://registry.yarnpkg.com/@internationalized/date/-/date-3.5.0.tgz#67f1dd62355f05140cc80e324842e9bfb4553abe"
+  integrity sha512-nw0Q+oRkizBWMioseI8+2TeUPEyopJVz5YxoYVzR0W1v+2YytiYah7s/ot35F149q/xAg4F1gT/6eTd+tsUpFQ==
   dependencies:
     "@swc/helpers" "^0.5.0"
 
@@ -6836,14 +6860,14 @@
   integrity sha512-RG5kSuZtDwh01HcaBD2N541sXdMcd18sTbU13EQpMtoWCi5YwWMqmz1JnfVUx6FwQZZY1ys3KdRY4tL+MMC+lw==
 
 "@spectrum-css/calendar@^4.0.9":
-  version "4.0.20"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/calendar/-/calendar-4.0.20.tgz#e3abe39f796ec11020af68d1e19cc2c5e2ade46a"
-  integrity sha512-HLG2F2ZZrn4YKUnsZ5ce862XBwBJb5wXGRti0nZNj8sy+jHESSCsl91HEjdVfZnsStGehVMgFe/avUD/+me//w==
+  version "4.0.9"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/calendar/-/calendar-4.0.9.tgz#56674edc9567625a89fac1d8f17af1810c01ae54"
+  integrity sha512-E7OcOEeGuq9f3ie37j5gflh0k0aG7128QZY9g3LN0LoWp+c63h9q+e6Pm/Z7TlaSgCATT4p84g5/8lHwv+WX2A==
 
-"@spectrum-css/card@^6.1.0":
-  version "6.2.0"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/card/-/card-6.2.0.tgz#b207b0f61a940618f06b76f3e0fb608f939b28af"
-  integrity sha512-vY4BJpuDBr8IF7GlrQU5WqYttH8MaxSc7M/bCEJNC4SM/pFkLOLTb6jtXf8S2oSo8JYGcW/+GEIDuaed5sjjkA==
+"@spectrum-css/card@^6.2.1":
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/card/-/card-6.2.1.tgz#8a6d5906483e9b2fd5e3debbc9d61ffee0ec53a0"
+  integrity sha512-piawqolhedkdudq6TOB1PopRvFtFkaOWiDGlscPaHLGD4DsmLSmlFp6YRl/AmmD6vnPQs+mq/EUmNFamzUroAQ==
 
 "@spectrum-css/checkbox@^7.0.11":
   version "7.0.11"
@@ -6905,10 +6929,10 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/divider/-/divider-2.1.25.tgz#9d15c4f9cac1837499bec3a57e41c7ea44a5f831"
   integrity sha512-9eXYHLGLSSL1c7d9IbxN0irBA3qqfqygilw+wuaOuIhg0V7gBzH5fw6h81Zev3nWNZnOW2eAjfOXi+QJde0lXg==
 
-"@spectrum-css/dropzone@^5.0.29":
-  version "5.0.29"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/dropzone/-/dropzone-5.0.29.tgz#009554fc8290271d5f65685b748914839da1f6cb"
-  integrity sha512-RsdQNRiZWMuswfH8jDsFJ92qHQemcNaLaDhqvOqGyjI8zSrijPL6TEDpfUWjuLDqtr95foAQJv1bbjXTYCKZEg==
+"@spectrum-css/dropzone@^5.0.30":
+  version "5.0.30"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/dropzone/-/dropzone-5.0.30.tgz#ff541a3dce29b1172a1975ae9ab3bb4886746d70"
+  integrity sha512-2nV9/YfRoCnImMx2fthiZByg3F+rITr012s/RhyAXnWm+BNEYssCW4q7kWEhQjRouIu5bD4jvv0CavtKYATdmA==
 
 "@spectrum-css/expressvars@^3.0.9":
   version "3.0.9"
@@ -6981,9 +7005,9 @@
   integrity sha512-Ddb0Q+0dszhCn3bNsNTjeY6sp+IuPPBuSW+CdNdJGibIej1vE98jRYBSPDs4gyFDY0hINMhD8EnyTWuVaSWu8g==
 
 "@spectrum-css/progressbar@^3.0.73":
-  version "3.0.76"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/progressbar/-/progressbar-3.0.76.tgz#f2da2dc1a1dfd36c7f974f2615c27f680a1d300b"
-  integrity sha512-eUQ4oVud0FXO5OguxSmrUQRa+RLl7AKW5q8iKp9k5DrLks7Kk2T9n/UonewPbh2/k+IJw7RxitQ0J1SmvSO+Bw==
+  version "3.0.80"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/progressbar/-/progressbar-3.0.80.tgz#dffb84d27485788dc2c3fc3683c7a135adaeac4e"
+  integrity sha512-0gWstKiRHkFPMK5djemxCiANE/UBIFrzX7D/w/P1S0Rw3n0SA5fklog5iYJE6OvN0TsXebHi3Uu1A6KkEPZYFA==
 
 "@spectrum-css/progresscircle@^2.0.65":
   version "2.0.70"
@@ -7055,10 +7079,10 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/table/-/table-5.0.5.tgz#8940fc28dcb1af3c4dbab3c4da1dad04068a3852"
   integrity sha512-AZ4OiNTIwlwgK1p79SFAH2CR+l5s/LUJ0FrrnQHj2UCbTtF5ZPfMedKMevVf39jnBMDv9YjU6bNAKaO0v+ykeg==
 
-"@spectrum-css/tabs@^4.0.17":
-  version "4.0.17"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/tabs/-/tabs-4.0.17.tgz#e3b3d37b2e808f7ebf0f614e861c87fba60d41e2"
-  integrity sha512-tqsdJyqJX7EB+6nCY7gp4OMh/EpSKPWfCkDKY9hfbsxcpF4Zm9U4ZeVFGICJzlrWyd7ltlwN+JRmjF0fbV+HCg==
+"@spectrum-css/tabs@^4.0.26":
+  version "4.0.26"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/tabs/-/tabs-4.0.26.tgz#334cb3335a0bb84b20547145cc24cb5c4f8e0cb0"
+  integrity sha512-gBcOcV1jFY2ZSsz7Z5woYBSCC62oUbZLElLyG/wy4p7XnvfUvQqfMn1Jt1YV7b4HizMTwfrSUNmhW9Ym4JIsaQ==
 
 "@spectrum-css/tag@^8.0.6":
   version "8.0.6"
@@ -7070,10 +7094,10 @@
   resolved "https://registry.yarnpkg.com/@spectrum-css/taggroup/-/taggroup-4.0.9.tgz#a25e83dfca8d5c8dd9cc452638bb876f5a63d16f"
   integrity sha512-K7Scw8NbW+nzLCkKjf1sIWZLjYbfMwJ3OP7Xi1zbpqtXBX3x/nX0oH1GzgUoR7Pdc4PAIKLOPpNThhxVj60O0Q==
 
-"@spectrum-css/textfield@^6.0.20":
-  version "6.0.20"
-  resolved "https://registry.yarnpkg.com/@spectrum-css/textfield/-/textfield-6.0.20.tgz#627e926faf73b1da0de8d35a1453e8e272299ff0"
-  integrity sha512-eBU3bolIz690JLmf8a3M4Fo5dDPNFNowY1rIEeovZYCR6T4WMl3fqFpRpRuWC2Y9+X3OGoKYExfTog/FF+wIlg==
+"@spectrum-css/textfield@^6.0.29":
+  version "6.0.29"
+  resolved "https://registry.yarnpkg.com/@spectrum-css/textfield/-/textfield-6.0.29.tgz#65f8dbfc526c78d26358af1c2336ebdc8db80dd5"
+  integrity sha512-3dtWWyOCTb0TIwtDw9urVQYBX05uXMrfupU+odigcKbT+IuQIlYAJgagZWeTSCdZH4mA+C/P6YGRvgVh4Z7K4Q==
 
 "@spectrum-css/thumbnail@^5.0.7":
   version "5.0.7"
@@ -7116,7 +7140,7 @@
   integrity sha512-rGfd7jqXOdR69bEjrRP58ynuIeJU0czPfwQvzhtCzg7jKVukV+efNHqrs086sC6xutB3W4TF71K/dZMr3oyTyg==
 
 "@spectrum-web-components/eslint-plugin@file:./linters/eslint":
-  version "0.40.0"
+  version "0.40.1"
 
 "@storybook/addon-a11y@^7.5.0":
   version "7.5.0"
@@ -10989,11 +11013,6 @@ axobject-query@^2.2.0:
   resolved "https://registry.yarnpkg.com/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
   integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==
 
-b4a@^1.6.1:
-  version "1.6.1"
-  resolved "https://registry.yarnpkg.com/b4a/-/b4a-1.6.1.tgz#9effac93a469a868d024e16fd77162c653544cbd"
-  integrity sha512-AsKjNhz72yxteo/0EtQEiwkMUgk/tGmycXlbG4g3Ard2/ULtNLUykGOkeK0egmN27h0xMAhb76jYccW+XTBExA==
-
 b4a@^1.6.4:
   version "1.6.4"
   resolved "https://registry.yarnpkg.com/b4a/-/b4a-1.6.4.tgz#ef1c1422cae5ce6535ec191baeed7567443f36c9"
@@ -11310,15 +11329,6 @@ bl@^5.0.0:
     inherits "^2.0.4"
     readable-stream "^3.4.0"
 
-bl@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/bl/-/bl-6.0.0.tgz#1f10c18a3289d412053add35cca09019075cff2d"
-  integrity sha512-Ik9BVIMdcWzSOCpzDv2XpQ4rJ4oZBuk3ck6MgiOv0EopdgtohN2uSCrrLlkH1Jf0KnpZZMBA3D0bUMbCdj/jgA==
-  dependencies:
-    buffer "^6.0.3"
-    inherits "^2.0.4"
-    readable-stream "^4.2.0"
-
 bluebird@~3.4.1:
   version "3.4.7"
   resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.4.7.tgz#f72d760be09b7f76d08ed8fae98b289a8d05fab3"
@@ -11452,7 +11462,17 @@ browserify-zlib@^0.1.4:
   dependencies:
     pako "~0.2.0"
 
-browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.16.3, browserslist@^4.16.5, browserslist@^4.16.6, browserslist@^4.17.5, browserslist@^4.19.1, browserslist@^4.21.10, browserslist@^4.21.4, browserslist@^4.21.9:
+browserslist@^4.0.0, browserslist@^4.14.5, browserslist@^4.16.3, browserslist@^4.16.5, browserslist@^4.16.6, browserslist@^4.17.5, browserslist@^4.19.1, browserslist@^4.21.4, browserslist@^4.21.9:
+  version "4.21.9"
+  resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.9.tgz#e11bdd3c313d7e2a9e87e8b4b0c7872b13897635"
+  integrity sha512-M0MFoZzbUrRU4KNfCrDLnvyE7gub+peetoTid3TBIqtunaDJyXlwhakT+/VkvSXcfIzFfK/nkCs4nmyTmxdNSg==
+  dependencies:
+    caniuse-lite "^1.0.30001503"
+    electron-to-chromium "^1.4.431"
+    node-releases "^2.0.12"
+    update-browserslist-db "^1.0.11"
+
+browserslist@^4.21.10:
   version "4.21.10"
   resolved "https://registry.yarnpkg.com/browserslist/-/browserslist-4.21.10.tgz#dbbac576628c13d3b2231332cb2ec5a46e015bb0"
   integrity sha512-bipEBdZfVH5/pwrvqc+Ub0kUPVfGUhlKxbvfD+z1BDnPEO/X98ruXGA1WP5ASpAFKan7Qr6j736IacbZQuAlKQ==
@@ -11837,6 +11857,11 @@ caniuse-lite@^1.0.30001406:
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001482.tgz#8b3fad73dc35b2674a5c96df2d4f9f1c561435de"
   integrity sha512-F1ZInsg53cegyjroxLNW9DmrEQ1SuGRTO1QlpA0o2/6OpQ0gFeDRoq1yFmnr8Sakn9qwwt9DmbxHB6w167OSuQ==
 
+caniuse-lite@^1.0.30001503:
+  version "1.0.30001516"
+  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001516.tgz#621b1be7d85a8843ee7d210fd9d87b52e3daab3a"
+  integrity sha512-Wmec9pCBY8CWbmI4HsjBeQLqDTqV91nFVR83DnZpYyRnPI1wePDsTg0bGLPC5VU/3OIZV1fmxEea1b+tFKe86g==
+
 caniuse-lite@^1.0.30001517:
   version "1.0.30001565"
   resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001565.tgz#a528b253c8a2d95d2b415e11d8b9942acc100c4f"
@@ -11921,7 +11946,7 @@ chalk@^1.0.0, chalk@^1.1.3:
     strip-ansi "^3.0.0"
     supports-color "^2.0.0"
 
-chalk@^2.4.1, chalk@^2.4.2:
+chalk@^2.0.0, chalk@^2.4.1, chalk@^2.4.2:
   version "2.4.2"
   resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
   integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
@@ -12093,7 +12118,7 @@ chrome-trace-event@^1.0.2:
   dependencies:
     tslib "^1.9.0"
 
-chromedriver@119:
+chromedriver@^119.0.1:
   version "119.0.1"
   resolved "https://registry.yarnpkg.com/chromedriver/-/chromedriver-119.0.1.tgz#064f3650790ccea055e9bfd95c600f5ea60295e9"
   integrity sha512-lpCFFLaXPpvElTaUOWKdP74pFb/sJhWtWqMjn7Ju1YriWn8dT5JBk84BGXMPvZQs70WfCYWecxdMmwfIu1Mupg==
@@ -14160,6 +14185,11 @@ ejs@^3.1.6, ejs@^3.1.7, ejs@^3.1.8, ejs@^3.1.9:
   dependencies:
     jake "^10.8.5"
 
+electron-to-chromium@^1.4.431:
+  version "1.4.463"
+  resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.463.tgz#8eb04355f24fef5c8097661d14e143f6d8554055"
+  integrity sha512-fT3hvdUWLjDbaTGzyOjng/CQhQJSQP8ThO3XZAoaxHvHo2kUXiRQVMj9M235l8uDFiNPsPa6KHT1p3RaR6ugRw==
+
 electron-to-chromium@^1.4.477, electron-to-chromium@^1.4.535:
   version "1.4.596"
   resolved "https://registry.yarnpkg.com/electron-to-chromium/-/electron-to-chromium-1.4.596.tgz#6752d1aa795d942d49dfc5d3764d6ea283fab1d7"
@@ -15230,12 +15260,7 @@ fast-equals@^3.0.1:
   resolved "https://registry.yarnpkg.com/fast-equals/-/fast-equals-3.0.3.tgz#8e6cb4e51ca1018d87dd41982ef92758b3e4197f"
   integrity sha512-NCe8qxnZFARSHGztGMZOO/PC1qa5MIFB5Hp66WdzbCRAz8U8US3bx1UTgLS49efBQPcUtO9gf5oVEY8o7y/7Kg==
 
-fast-fifo@^1.1.0:
-  version "1.1.0"
-  resolved "https://registry.yarnpkg.com/fast-fifo/-/fast-fifo-1.1.0.tgz#17d1a3646880b9891dfa0c54e69c5fef33cad779"
-  integrity sha512-Kl29QoNbNvn4nhDsLYjyIAaIqaJB6rBx5p3sL9VjaefJ+eMFBWVZiaoguaoZfzEKr5RhAti0UgM8703akGPJ6g==
-
-fast-fifo@^1.2.0:
+fast-fifo@^1.1.0, fast-fifo@^1.2.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/fast-fifo/-/fast-fifo-1.3.0.tgz#03e381bcbfb29932d7c3afde6e15e83e05ab4d8b"
   integrity sha512-IgfweLvEpwyA4WgiQe9Nx6VV2QkML2NkvZnk1oKnIzXgXdWxuhF7zw4DvLTPZJn6PIUneiAXPF24QmoEqHTjyw==
@@ -22161,7 +22186,7 @@ node-plop@^0.31.0:
     title-case "^3.0.3"
     upper-case "^2.0.2"
 
-node-releases@^2.0.13:
+node-releases@^2.0.12, node-releases@^2.0.13:
   version "2.0.13"
   resolved "https://registry.yarnpkg.com/node-releases/-/node-releases-2.0.13.tgz#d5ed1627c23e3461e819b02e57b75e4899b1c81d"
   integrity sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==
@@ -25665,20 +25690,7 @@ readable-stream@3, readable-stream@^3.0.0, readable-stream@^3.0.2, readable-stre
     string_decoder "^1.1.1"
     util-deprecate "^1.0.1"
 
-readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.1.5, readable-stream@~2.3.6:
-  version "2.3.7"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.7.tgz#1eca1cf711aef814c04f62252a36a62f6cb23b57"
-  integrity sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==
-  dependencies:
-    core-util-is "~1.0.0"
-    inherits "~2.0.3"
-    isarray "~1.0.0"
-    process-nextick-args "~2.0.0"
-    safe-buffer "~5.1.1"
-    string_decoder "~1.1.1"
-    util-deprecate "~1.0.1"
-
-readable-stream@^2.2.2:
+readable-stream@^2.0.0, readable-stream@^2.0.1, readable-stream@^2.0.2, readable-stream@^2.0.5, readable-stream@^2.1.5, readable-stream@^2.2.2, readable-stream@~2.3.6:
   version "2.3.8"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-2.3.8.tgz#91125e8042bba1b9887f49345f6277027ce8be9b"
   integrity sha512-8p0AUk4XODgIewSi0l8Epjs+EVnWiK7NoDIEGU0HhE7+ZyY8D1IMY7odu5lRrFXGg71L15KG8QrPmum45RTtdA==
@@ -25691,17 +25703,7 @@ readable-stream@^2.2.2:
     string_decoder "~1.1.1"
     util-deprecate "~1.0.1"
 
-readable-stream@^4.0.0, readable-stream@^4.2.0:
-  version "4.3.0"
-  resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-4.3.0.tgz#0914d0c72db03b316c9733bb3461d64a3cc50cba"
-  integrity sha512-MuEnA0lbSi7JS8XM+WNJlWZkHAAdm7gETHdFK//Q/mChGyj2akEFtdLZh32jSdkWGbRwCW9pn6g3LWDdDeZnBQ==
-  dependencies:
-    abort-controller "^3.0.0"
-    buffer "^6.0.3"
-    events "^3.3.0"
-    process "^0.11.10"
-
-readable-stream@^4.1.0:
+readable-stream@^4.0.0, readable-stream@^4.1.0:
   version "4.4.2"
   resolved "https://registry.yarnpkg.com/readable-stream/-/readable-stream-4.4.2.tgz#e6aced27ad3b9d726d8308515b9a1b98dc1b9d13"
   integrity sha512-Lk/fICSyIhodxy1IDK2HazkeGjSmezAWX2egdtJnYhtzKEsBPJowlI6F6LPb5tqIQILrMbx22S5o3GuJavPusA==
@@ -27436,14 +27438,6 @@ streamsearch@^1.1.0:
   resolved "https://registry.yarnpkg.com/streamsearch/-/streamsearch-1.1.0.tgz#404dd1e2247ca94af554e841a8ef0eaa238da764"
   integrity sha512-Mcc5wHehp9aXz1ax6bZUyY5afg9u2rv5cqQI3mRrYkGC8rW2hM02jWuwjtL++LS5qinSyhj2QfLyNsuc+VsExg==
 
-streamx@^2.12.5:
-  version "2.13.0"
-  resolved "https://registry.yarnpkg.com/streamx/-/streamx-2.13.0.tgz#590ad191bf326d76175e1d223ecad3b240256d46"
-  integrity sha512-9jD4uoX0juNSIcv4PazT+97FpM4Mww3cp7PM23HRTLANhgb7K7n1mB45guH/kT5F4enl04kApOM3EeoUXSPfvw==
-  dependencies:
-    fast-fifo "^1.1.0"
-    queue-tick "^1.0.1"
-
 streamx@^2.15.0:
   version "2.15.0"
   resolved "https://registry.yarnpkg.com/streamx/-/streamx-2.15.0.tgz#f58c92e6f726b5390dcabd6dd9094d29a854d698"
@@ -28133,16 +28127,7 @@ tar-stream@^2.1.4, tar-stream@^2.2.0, tar-stream@~2.2.0:
     inherits "^2.0.3"
     readable-stream "^3.1.1"
 
-tar-stream@^3.0.0:
-  version "3.0.0"
-  resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-3.0.0.tgz#43de9f0e8d1bccc0036dbe2731260ca7668406b6"
-  integrity sha512-O6OfUKBbQOqAhh6owTWmA730J/yZCYcpmZ1DBj2YX51ZQrt7d7NgzrR+CnO9wP6nt/viWZW2XeXLavX3/ZEbEg==
-  dependencies:
-    b4a "^1.6.1"
-    bl "^6.0.0"
-    streamx "^2.12.5"
-
-tar-stream@^3.1.4, tar-stream@^3.1.5:
+tar-stream@^3.0.0, tar-stream@^3.1.4, tar-stream@^3.1.5:
   version "3.1.6"
   resolved "https://registry.yarnpkg.com/tar-stream/-/tar-stream-3.1.6.tgz#6520607b55a06f4a2e2e04db360ba7d338cc5bab"
   integrity sha512-B/UyjYwPpMBv+PaFSWAmtYjwdrlEaZQEhMIBFNC5oEG8lpiW8XjcSdmEaClj28ArfKScKHs2nshz3k2le6crsg==