diff --git a/.changeset/early-actors-buy.md b/.changeset/early-actors-buy.md
new file mode 100644
index 00000000000..bfde7067eea
--- /dev/null
+++ b/.changeset/early-actors-buy.md
@@ -0,0 +1,5 @@
+---
+"@spectrum-css/tokens": patch
+---
+
+Uses the latest releases from Spectrum Tokens (13.0.0-beta.55)
diff --git a/tokens/dist/css/global-vars.css b/tokens/dist/css/global-vars.css
index 4c884da8f99..d1b12beb7b9 100644
--- a/tokens/dist/css/global-vars.css
+++ b/tokens/dist/css/global-vars.css
@@ -128,6 +128,12 @@
--spectrum-bar-panel-gripper-color:var(--spectrum-gray-200);
--spectrum-bar-panel-gripper-color-drag:var(--spectrum-gray-800);
--spectrum-select-box-selected-border-color:var(--spectrum-gray-800);
+ --spectrum-tree-view-row-background-hover:var(--spectrum-gray-100);
+ --spectrum-tree-view-selected-row-background-color-emphasized:var(--spectrum-informative-background-color-default);
+ --spectrum-tree-view-selected-row-background-default:var(--spectrum-gray-100);
+ --spectrum-tree-view-selected-row-background-hover:var(--spectrum-gray-100);
+ --spectrum-color-wheel-border-color:var(--spectrum-gray-1000);
+ --spectrum-color-wheel-border-opacity:0.1;
--spectrum-white-rgb:255, 255, 255;
--spectrum-white:rgba(var(--spectrum-white-rgb));
--spectrum-transparent-white-25-rgb:255, 255, 255;
@@ -548,6 +554,13 @@
--spectrum-number-field-minimum-width-multiplier:1.25;
--spectrum-takeover-dialog-height:100%;
--spectrum-takeover-dialog-width:100%;
+ --spectrum-tree-view-header-to-item:-1px;
+ --spectrum-tree-view-item-to-item:-1px;
+ --spectrum-tree-view-item-to-item-detached:2px;
+ --spectrum-tree-view-selected-row-background-opacity-emphasized:0.1;
+ --spectrum-tree-view-selected-row-background-opacity-emphasized-hover:0.15;
+ --spectrum-action-bar-minimum-width:176px;
+ --spectrum-action-bar-label-to-action-group-area:var(--spectrum-spacing-300);
--spectrum-corner-radius-0:0px;
--spectrum-corner-radius-75:3px;
--spectrum-corner-radius-100:4px;
diff --git a/tokens/dist/css/large-vars.css b/tokens/dist/css/large-vars.css
index d1c5432fc1d..ab38709bc2a 100644
--- a/tokens/dist/css/large-vars.css
+++ b/tokens/dist/css/large-vars.css
@@ -12,14 +12,14 @@
*/
.spectrum--large{
- --spectrum-checkbox-control-size-small:16px;
- --spectrum-checkbox-control-size-medium:18px;
- --spectrum-checkbox-control-size-large:20px;
- --spectrum-checkbox-control-size-extra-large:22px;
- --spectrum-checkbox-top-to-control-small:7px;
- --spectrum-checkbox-top-to-control-medium:11px;
- --spectrum-checkbox-top-to-control-large:15px;
- --spectrum-checkbox-top-to-control-extra-large:19px;
+ --spectrum-checkbox-control-size-small:18px;
+ --spectrum-checkbox-control-size-medium:20px;
+ --spectrum-checkbox-control-size-large:22px;
+ --spectrum-checkbox-control-size-extra-large:26px;
+ --spectrum-checkbox-top-to-control-small:6px;
+ --spectrum-checkbox-top-to-control-medium:10px;
+ --spectrum-checkbox-top-to-control-large:14px;
+ --spectrum-checkbox-top-to-control-extra-large:17px;
--spectrum-switch-control-width-small:30px;
--spectrum-switch-control-width-medium:34px;
--spectrum-switch-control-width-large:38px;
@@ -524,6 +524,24 @@
--spectrum-number-field-visual-to-in-field-stepper-medium:8px;
--spectrum-number-field-visual-to-in-field-stepper-large:9px;
--spectrum-number-field-visual-to-in-field-stepper-extra-large:10px;
+ --spectrum-tree-view-disclosure-indicator-height:40px;
+ --spectrum-tree-view-disclosure-indicator-width:42px;
+ --spectrum-tree-view-minimum-height:50px;
+ --spectrum-tree-view-minimum-width:200px;
+ --spectrum-tree-view-bottom-to-label:16px;
+ --spectrum-tree-view-drag-handle-to-checkbox:10px;
+ --spectrum-tree-view-edge-to-checkbox:15px;
+ --spectrum-tree-view-edge-to-drag-handle:5px;
+ --spectrum-tree-view-end-edge-to-action-area:7px;
+ --spectrum-tree-view-item-to-header:30px;
+ --spectrum-tree-view-label-to-action-area:8px;
+ --spectrum-tree-view-level-increment:20px;
+ --spectrum-tree-view-minimum-top-to-context-area:10px;
+ --spectrum-tree-view-top-to-action-button:5px;
+ --spectrum-tree-view-top-to-checkbox:5px;
+ --spectrum-tree-view-top-to-disclosure-indicator:19px;
+ --spectrum-tree-view-top-to-drag-handle:19px;
+ --spectrum-tree-view-top-to-label:13px;
--spectrum-workflow-icon-size-50:16px;
--spectrum-workflow-icon-size-75:18px;
--spectrum-workflow-icon-size-100:24px;
diff --git a/tokens/dist/css/medium-vars.css b/tokens/dist/css/medium-vars.css
index e1f0e19e9c7..db8a07f30a8 100644
--- a/tokens/dist/css/medium-vars.css
+++ b/tokens/dist/css/medium-vars.css
@@ -12,14 +12,14 @@
*/
.spectrum--medium{
- --spectrum-checkbox-control-size-small:12px;
- --spectrum-checkbox-control-size-medium:14px;
- --spectrum-checkbox-control-size-large:16px;
- --spectrum-checkbox-control-size-extra-large:18px;
- --spectrum-checkbox-top-to-control-small:6px;
- --spectrum-checkbox-top-to-control-medium:9px;
- --spectrum-checkbox-top-to-control-large:12px;
- --spectrum-checkbox-top-to-control-extra-large:15px;
+ --spectrum-checkbox-control-size-small:14px;
+ --spectrum-checkbox-control-size-medium:16px;
+ --spectrum-checkbox-control-size-large:18px;
+ --spectrum-checkbox-control-size-extra-large:20px;
+ --spectrum-checkbox-top-to-control-small:5px;
+ --spectrum-checkbox-top-to-control-medium:8px;
+ --spectrum-checkbox-top-to-control-large:11px;
+ --spectrum-checkbox-top-to-control-extra-large:14px;
--spectrum-switch-control-width-small:22px;
--spectrum-switch-control-width-medium:26px;
--spectrum-switch-control-width-large:30px;
@@ -524,6 +524,24 @@
--spectrum-number-field-visual-to-in-field-stepper-medium:6px;
--spectrum-number-field-visual-to-in-field-stepper-large:7px;
--spectrum-number-field-visual-to-in-field-stepper-extra-large:8px;
+ --spectrum-tree-view-disclosure-indicator-height:32px;
+ --spectrum-tree-view-disclosure-indicator-width:34px;
+ --spectrum-tree-view-minimum-height:40px;
+ --spectrum-tree-view-minimum-width:160px;
+ --spectrum-tree-view-bottom-to-label:12px;
+ --spectrum-tree-view-drag-handle-to-checkbox:8px;
+ --spectrum-tree-view-edge-to-checkbox:12px;
+ --spectrum-tree-view-edge-to-drag-handle:4px;
+ --spectrum-tree-view-end-edge-to-action-area:6px;
+ --spectrum-tree-view-item-to-header:24px;
+ --spectrum-tree-view-label-to-action-area:6px;
+ --spectrum-tree-view-level-increment:16px;
+ --spectrum-tree-view-minimum-top-to-context-area:8px;
+ --spectrum-tree-view-top-to-action-button:4px;
+ --spectrum-tree-view-top-to-checkbox:4px;
+ --spectrum-tree-view-top-to-disclosure-indicator:15px;
+ --spectrum-tree-view-top-to-drag-handle:15px;
+ --spectrum-tree-view-top-to-label:10px;
--spectrum-workflow-icon-size-50:14px;
--spectrum-workflow-icon-size-75:16px;
--spectrum-workflow-icon-size-100:20px;
diff --git a/tokens/dist/index.css b/tokens/dist/index.css
index e36e769368a..2cf083d1f32 100644
--- a/tokens/dist/index.css
+++ b/tokens/dist/index.css
@@ -951,6 +951,12 @@
--spectrum-bar-panel-gripper-color: var(--spectrum-gray-200);
--spectrum-bar-panel-gripper-color-drag: var(--spectrum-gray-800);
--spectrum-select-box-selected-border-color: var(--spectrum-gray-800);
+ --spectrum-tree-view-row-background-hover: var(--spectrum-gray-100);
+ --spectrum-tree-view-selected-row-background-color-emphasized: var(--spectrum-informative-background-color-default);
+ --spectrum-tree-view-selected-row-background-default: var(--spectrum-gray-100);
+ --spectrum-tree-view-selected-row-background-hover: var(--spectrum-gray-100);
+ --spectrum-color-wheel-border-color: var(--spectrum-gray-1000);
+ --spectrum-color-wheel-border-opacity: 0.1;
--spectrum-white-rgb: 255, 255, 255;
--spectrum-white: rgba(var(--spectrum-white-rgb));
--spectrum-transparent-white-25-rgb: 255, 255, 255;
@@ -1371,6 +1377,13 @@
--spectrum-number-field-minimum-width-multiplier: 1.25;
--spectrum-takeover-dialog-height: 100%;
--spectrum-takeover-dialog-width: 100%;
+ --spectrum-tree-view-header-to-item: -1px;
+ --spectrum-tree-view-item-to-item: -1px;
+ --spectrum-tree-view-item-to-item-detached: 2px;
+ --spectrum-tree-view-selected-row-background-opacity-emphasized: 0.1;
+ --spectrum-tree-view-selected-row-background-opacity-emphasized-hover: 0.15;
+ --spectrum-action-bar-minimum-width: 176px;
+ --spectrum-action-bar-label-to-action-group-area: var(--spectrum-spacing-300);
--spectrum-corner-radius-0: 0px;
--spectrum-corner-radius-75: 3px;
--spectrum-corner-radius-100: 4px;
@@ -1862,14 +1875,14 @@
--spectrum-corner-radius-1000: 9999px;
}
.spectrum--large {
- --spectrum-checkbox-control-size-small: 16px;
- --spectrum-checkbox-control-size-medium: 18px;
- --spectrum-checkbox-control-size-large: 20px;
- --spectrum-checkbox-control-size-extra-large: 22px;
- --spectrum-checkbox-top-to-control-small: 7px;
- --spectrum-checkbox-top-to-control-medium: 11px;
- --spectrum-checkbox-top-to-control-large: 15px;
- --spectrum-checkbox-top-to-control-extra-large: 19px;
+ --spectrum-checkbox-control-size-small: 18px;
+ --spectrum-checkbox-control-size-medium: 20px;
+ --spectrum-checkbox-control-size-large: 22px;
+ --spectrum-checkbox-control-size-extra-large: 26px;
+ --spectrum-checkbox-top-to-control-small: 6px;
+ --spectrum-checkbox-top-to-control-medium: 10px;
+ --spectrum-checkbox-top-to-control-large: 14px;
+ --spectrum-checkbox-top-to-control-extra-large: 17px;
--spectrum-switch-control-width-small: 30px;
--spectrum-switch-control-width-medium: 34px;
--spectrum-switch-control-width-large: 38px;
@@ -2374,6 +2387,24 @@
--spectrum-number-field-visual-to-in-field-stepper-medium: 8px;
--spectrum-number-field-visual-to-in-field-stepper-large: 9px;
--spectrum-number-field-visual-to-in-field-stepper-extra-large: 10px;
+ --spectrum-tree-view-disclosure-indicator-height: 40px;
+ --spectrum-tree-view-disclosure-indicator-width: 42px;
+ --spectrum-tree-view-minimum-height: 50px;
+ --spectrum-tree-view-minimum-width: 200px;
+ --spectrum-tree-view-bottom-to-label: 16px;
+ --spectrum-tree-view-drag-handle-to-checkbox: 10px;
+ --spectrum-tree-view-edge-to-checkbox: 15px;
+ --spectrum-tree-view-edge-to-drag-handle: 5px;
+ --spectrum-tree-view-end-edge-to-action-area: 7px;
+ --spectrum-tree-view-item-to-header: 30px;
+ --spectrum-tree-view-label-to-action-area: 8px;
+ --spectrum-tree-view-level-increment: 20px;
+ --spectrum-tree-view-minimum-top-to-context-area: 10px;
+ --spectrum-tree-view-top-to-action-button: 5px;
+ --spectrum-tree-view-top-to-checkbox: 5px;
+ --spectrum-tree-view-top-to-disclosure-indicator: 19px;
+ --spectrum-tree-view-top-to-drag-handle: 19px;
+ --spectrum-tree-view-top-to-label: 13px;
--spectrum-workflow-icon-size-50: 16px;
--spectrum-workflow-icon-size-75: 18px;
--spectrum-workflow-icon-size-100: 24px;
@@ -3455,14 +3486,14 @@
--spectrum-treeview-item-background-color-selected: rgba(var(--spectrum-blue-900-rgb), 0.1);
}
.spectrum--medium {
- --spectrum-checkbox-control-size-small: 12px;
- --spectrum-checkbox-control-size-medium: 14px;
- --spectrum-checkbox-control-size-large: 16px;
- --spectrum-checkbox-control-size-extra-large: 18px;
- --spectrum-checkbox-top-to-control-small: 6px;
- --spectrum-checkbox-top-to-control-medium: 9px;
- --spectrum-checkbox-top-to-control-large: 12px;
- --spectrum-checkbox-top-to-control-extra-large: 15px;
+ --spectrum-checkbox-control-size-small: 14px;
+ --spectrum-checkbox-control-size-medium: 16px;
+ --spectrum-checkbox-control-size-large: 18px;
+ --spectrum-checkbox-control-size-extra-large: 20px;
+ --spectrum-checkbox-top-to-control-small: 5px;
+ --spectrum-checkbox-top-to-control-medium: 8px;
+ --spectrum-checkbox-top-to-control-large: 11px;
+ --spectrum-checkbox-top-to-control-extra-large: 14px;
--spectrum-switch-control-width-small: 22px;
--spectrum-switch-control-width-medium: 26px;
--spectrum-switch-control-width-large: 30px;
@@ -3967,6 +3998,24 @@
--spectrum-number-field-visual-to-in-field-stepper-medium: 6px;
--spectrum-number-field-visual-to-in-field-stepper-large: 7px;
--spectrum-number-field-visual-to-in-field-stepper-extra-large: 8px;
+ --spectrum-tree-view-disclosure-indicator-height: 32px;
+ --spectrum-tree-view-disclosure-indicator-width: 34px;
+ --spectrum-tree-view-minimum-height: 40px;
+ --spectrum-tree-view-minimum-width: 160px;
+ --spectrum-tree-view-bottom-to-label: 12px;
+ --spectrum-tree-view-drag-handle-to-checkbox: 8px;
+ --spectrum-tree-view-edge-to-checkbox: 12px;
+ --spectrum-tree-view-edge-to-drag-handle: 4px;
+ --spectrum-tree-view-end-edge-to-action-area: 6px;
+ --spectrum-tree-view-item-to-header: 24px;
+ --spectrum-tree-view-label-to-action-area: 6px;
+ --spectrum-tree-view-level-increment: 16px;
+ --spectrum-tree-view-minimum-top-to-context-area: 8px;
+ --spectrum-tree-view-top-to-action-button: 4px;
+ --spectrum-tree-view-top-to-checkbox: 4px;
+ --spectrum-tree-view-top-to-disclosure-indicator: 15px;
+ --spectrum-tree-view-top-to-drag-handle: 15px;
+ --spectrum-tree-view-top-to-label: 10px;
--spectrum-workflow-icon-size-50: 14px;
--spectrum-workflow-icon-size-75: 16px;
--spectrum-workflow-icon-size-100: 20px;
diff --git a/tokens/package.json b/tokens/package.json
index 059ad5cf669..ae0f7b06bc5 100644
--- a/tokens/package.json
+++ b/tokens/package.json
@@ -36,7 +36,7 @@
"package.json"
],
"devDependencies": {
- "@adobe/spectrum-tokens": "13.0.0-beta.52",
+ "@adobe/spectrum-tokens": "13.0.0-beta.55",
"@nxkit/style-dictionary": "^6.0.0",
"postcss": "^8.4.49",
"postcss-cli": "^11.0.0",
diff --git a/yarn.lock b/yarn.lock
index f542389f5f6..d76248ffbd6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -121,6 +121,13 @@ __metadata:
languageName: node
linkType: hard
+"@adobe/spectrum-tokens@npm:13.0.0-beta.55":
+ version: 13.0.0-beta.55
+ resolution: "@adobe/spectrum-tokens@npm:13.0.0-beta.55"
+ checksum: 10c0/5130982ee293c3865aa94a93bbcac28775e9a79f3382c66a68f72c0a29315a5c5c7724d5b0bd8ad5ed7b5ad9276be09795b3bc99d439083c1698f8541abf166a
+ languageName: node
+ linkType: hard
+
"@ampproject/remapping@npm:^2.2.0":
version: 2.3.0
resolution: "@ampproject/remapping@npm:2.3.0"
@@ -3886,7 +3893,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "@spectrum-css/tokens@workspace:tokens"
dependencies:
- "@adobe/spectrum-tokens": "npm:13.0.0-beta.52"
+ "@adobe/spectrum-tokens": "npm:13.0.0-beta.55"
"@nxkit/style-dictionary": "npm:^6.0.0"
postcss: "npm:^8.4.49"
postcss-cli: "npm:^11.0.0"