@spectrum-web-components/styles 0.40.3 → 0.40.5

package/express/spectrum-core-global.css

@@ -1533,9 +1533,6 @@
     --spectrum-alias-clearbutton-border-radius: var(
         --spectrum-global-dimension-size-150
     );
-    --spectrum-alias-combobox-quiet-button-offset-x: var(
-        --spectrum-global-dimension-size-50
-    );
     --spectrum-alias-focus-ring-gap-small: var(
         --spectrum-global-dimension-static-size-25
     );

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/styles",
-    "version": "0.40.3",
+    "version": "0.40.5",
     "publishConfig": {
         "access": "public"
     },
@@ -104,13 +104,13 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.40.3"
+        "@spectrum-web-components/base": "^0.40.5"
     },
     "devDependencies": {
-        "@spectrum-css/commons": "^9.0.1",
+        "@spectrum-css/commons": "^9.1.0",
         "@spectrum-css/expressvars": "^3.0.9",
-        "@spectrum-css/tokens": "13.0.5",
-        "@spectrum-css/typography": "^5.0.50",
+        "@spectrum-css/tokens": "^13.1.0",
+        "@spectrum-css/typography": "^5.1.0",
         "@spectrum-css/vars": "^9.0.8"
     },
     "customElements": "custom-elements.json",
@@ -118,5 +118,5 @@
         "./**/*.css"
     ],
     "style": "all-medium-lightest.css",
-    "gitHead": "76467a3470aeafa4beefce1e4fc76341f1d6733f"
+    "gitHead": "2e0006478841b07af63c19a0167a136bf724d064"
 }

package/spectrum-core-global.css

@@ -1497,9 +1497,6 @@
     --spectrum-alias-clearbutton-border-radius: var(
         --spectrum-global-dimension-size-50
     );
-    --spectrum-alias-combobox-quiet-button-offset-x: var(
-        --spectrum-global-dimension-size-100
-    );
     --spectrum-alias-percent-50: 50%;
     --spectrum-alias-percent-70: 70%;
     --spectrum-alias-percent-100: 100%;

package/tokens/express/global-vars.css

@@ -1022,6 +1022,17 @@
     );
 }
 
+:host,
+:root {
+    --system-spectrum-combobox-border-color-default: var(--spectrum-gray-400);
+    --system-spectrum-combobox-border-color-hover: var(--spectrum-gray-500);
+    --system-spectrum-combobox-border-color-focus: var(--spectrum-gray-900);
+    --system-spectrum-combobox-border-color-focus-hover: var(
+        --spectrum-gray-800
+    );
+    --system-spectrum-combobox-border-color-key-focus: var(--spectrum-gray-900);
+}
+
 :host,
 :root {
     --system-spectrum-infieldbutton-spectrum-infield-button-border-width: 0;
@@ -1072,6 +1083,7 @@
     --system-spectrum-picker-border-color-hover-open: transparent;
     --system-spectrum-picker-border-color-active: transparent;
     --system-spectrum-picker-border-color-key-focus: transparent;
+    --system-spectrum-picker-border-width: 0px;
 }
 
 :host,
@@ -1127,6 +1139,7 @@
         --spectrum-accent-color-1000
     );
 }
+
 :host,
 :root {
     --system-spectrum-search-border-radius: calc(

package/tokens/spectrum/custom-large-vars.css

@@ -66,6 +66,9 @@
     --spectrum-well-border-radius: 5px;
 
     --spectrum-icon-chevron-size-50: 8px;
+    /* XXL and XXS icon sizes are not within the design spec and are planned to be deprecated in Spectrum 2. */
+    --spectrum-workflow-icon-size-xxl: 40px;
+    --spectrum-workflow-icon-size-xxs: 15px;
 
     --spectrum-treeview-item-indentation-medium: 20px;
     --spectrum-treeview-item-indentation-small: 15px;
@@ -111,4 +114,7 @@
     --spectrum-assetcard-content-font-size: var(--spectrum-body-size-xs);
 
     --spectrum-tooltip-animation-distance: 5px;
+
+    --spectrum-ui-icon-medium-display: none;
+    --spectrum-ui-icon-large-display: block;
 }

package/tokens/spectrum/custom-medium-vars.css

@@ -65,6 +65,9 @@
     --spectrum-well-border-radius: var(--spectrum-spacing-75);
 
     --spectrum-icon-chevron-size-50: 6px;
+    /* XXL and XXS icon sizes are not within the design spec and are planned to be deprecated in Spectrum 2. */
+    --spectrum-workflow-icon-size-xxl: 32px;
+    --spectrum-workflow-icon-size-xxs: 12px;
 
     --spectrum-treeview-item-indentation-medium: var(--spectrum-spacing-300);
     --spectrum-treeview-item-indentation-small: var(--spectrum-spacing-200);
@@ -112,4 +115,7 @@
     --spectrum-assetcard-content-font-size: var(--spectrum-body-size-s);
 
     --spectrum-tooltip-animation-distance: var(--spectrum-spacing-75);
+
+    --spectrum-ui-icon-medium-display: block;
+    --spectrum-ui-icon-large-display: none;
 }

package/tokens/spectrum/global-vars.css

@@ -263,6 +263,7 @@
     );
     --system-spectrum-actionbutton-staticwhite-selected-mod-actionbutton-border-color-disabled: transparent;
 }
+
 :host,
 :root {
     --system-spectrum-actiongroup-gap-size-compact: 0;
@@ -1022,6 +1023,7 @@
     --system-spectrum-checkbox-control-color-down: var(--spectrum-gray-800);
     --system-spectrum-checkbox-control-color-focus: var(--spectrum-gray-700);
 }
+
 :host,
 :root {
     --system-spectrum-closebutton-background-color-default: transparent;
@@ -1036,6 +1038,17 @@
     );
 }
 
+:host,
+:root {
+    --system-spectrum-combobox-border-color-default: var(--spectrum-gray-500);
+    --system-spectrum-combobox-border-color-hover: var(--spectrum-gray-600);
+    --system-spectrum-combobox-border-color-focus: var(--spectrum-gray-500);
+    --system-spectrum-combobox-border-color-focus-hover: var(
+        --spectrum-gray-600
+    );
+    --system-spectrum-combobox-border-color-key-focus: var(--spectrum-gray-600);
+}
+
 :host,
 :root {
     --system-spectrum-infieldbutton-spectrum-infield-button-border-width: var(
@@ -1088,7 +1101,9 @@
     --system-spectrum-picker-border-color-hover-open: var(--spectrum-gray-600);
     --system-spectrum-picker-border-color-active: var(--spectrum-gray-700);
     --system-spectrum-picker-border-color-key-focus: var(--spectrum-gray-600);
+    --system-spectrum-picker-border-width: var(--spectrum-border-width-100);
 }
+
 :host,
 :root {
     --system-spectrum-pickerbutton-spectrum-picker-button-background-color: var(
@@ -1113,6 +1128,7 @@
         --spectrum-border-width-100
     );
 }
+
 :host,
 :root {
     --system-spectrum-popover-border-width: var(--spectrum-border-width-100);
@@ -1139,6 +1155,7 @@
         --spectrum-accent-color-1000
     );
 }
+
 :host,
 :root {
     --system-spectrum-search-border-radius: var(--spectrum-corner-radius-100);
@@ -1288,6 +1305,7 @@
 :root {
     --system-spectrum-tabs-font-weight: var(--spectrum-default-font-weight);
 }
+
 :host,
 :root {
     --system-spectrum-tag-border-color: var(--spectrum-gray-700);
@@ -1363,6 +1381,7 @@
         --spectrum-component-edge-to-visual-200
     );
 }
+
 :host,
 :root {
     --system-spectrum-textfield-border-color: var(--spectrum-gray-500);
@@ -1383,6 +1402,7 @@
         --spectrum-neutral-subdued-background-color-default
     );
 }
+
 :host,
 :root {
     --system-spectrum-tooltip-backgound-color-default-neutral: var(