From ac548209c2f9bae88a7aab84bcf5448f0f888896 Mon Sep 17 00:00:00 2001
From: Josh Winn <965114+jawinn@users.noreply.github.com>
Date: Thu, 20 Jul 2023 12:23:07 -0400
Subject: [PATCH] feat(tray): use token for top and bottom edge to content area

- Use new token tray-top-to-content-area that applies to both the top
  and the bottom; this adds padding-block to the tray. Tray is changed
  to box-sizing border-box so max-block-size and other size properties
  are not changed by the added padding.
---
 components/tray/index.css        | 3 +++
 components/tray/metadata/mods.md | 2 ++
 2 files changed, 5 insertions(+)

diff --git a/components/tray/index.css b/components/tray/index.css
index 806288c9f8..757d7f0734 100644
--- a/components/tray/index.css
+++ b/components/tray/index.css
@@ -51,6 +51,9 @@ governing permissions and limitations under the License.
   inline-size: 100%;
   max-block-size: calc(100vh - var(--mod-tray-spacing-edge-to-tray-safe-zone, var(--spectrum-tray-spacing-edge-to-tray-safe-zone)));
   margin-block-start: var(--mod-tray-spacing-edge-to-tray-safe-zone, var(--spectrum-tray-spacing-edge-to-tray-safe-zone));
+  padding-block-start: var(--mod-tray-top-to-content-area, var(--spectrum-tray-top-to-content-area));
+  padding-block-end: var(--mod-tray-bottom-to-content-area, var(--spectrum-tray-top-to-content-area));
+  box-sizing: border-box;
   overflow: auto;
   outline: none;
 
diff --git a/components/tray/metadata/mods.md b/components/tray/metadata/mods.md
index 3c6fc261d8..6434041ada 100644
--- a/components/tray/metadata/mods.md
+++ b/components/tray/metadata/mods.md
@@ -1,6 +1,7 @@
 | Modifiable Custom Properties                |
 | ------------------------------------------- |
 | `--mod-tray-background-color`               |
+| `--mod-tray-bottom-to-content-area`         |
 | `--mod-tray-corner-radius`                  |
 | `--mod-tray-entry-animation-delay`          |
 | `--mod-tray-entry-animation-duration`       |
@@ -8,3 +9,4 @@
 | `--mod-tray-exit-animation-duration`        |
 | `--mod-tray-max-inline-size`                |
 | `--mod-tray-spacing-edge-to-tray-safe-zone` |
+| `--mod-tray-top-to-content-area`            |