@spectrum-web-components/styles 0.15.1-devmode.0 → 0.15.2-devmode.0

package/express/spectrum-scale-large.css

@@ -307,15 +307,6 @@ governing permissions and limitations under the License.
     --spectrum-dialog-confirm-padding: var(
         --spectrum-global-dimension-static-size-300
     );
-    --spectrum-helptext-s-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-85
-    );
-    --spectrum-helptext-m-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-85
-    );
-    --spectrum-helptext-xl-neutral-textonly-text-padding-top: var(
-        --spectrum-global-dimension-static-size-150
-    );
     --spectrum-listitem-m-texticon-padding-left: var(
         --spectrum-global-dimension-static-size-150
     );

package/express/spectrum-scale-medium.css

@@ -315,15 +315,6 @@ governing permissions and limitations under the License.
     --spectrum-dialog-confirm-padding: var(
         --spectrum-global-dimension-static-size-500
     );
-    --spectrum-helptext-s-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-65
-    );
-    --spectrum-helptext-m-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-65
-    );
-    --spectrum-helptext-xl-neutral-textonly-text-padding-top: var(
-        --spectrum-global-dimension-size-115
-    );
     --spectrum-listitem-m-texticon-padding-left: var(
         --spectrum-global-dimension-size-125
     );

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@spectrum-web-components/styles",
-    "version": "0.15.1-devmode.0+07474d44f",
+    "version": "0.15.2-devmode.0+1a8b29491",
     "publishConfig": {
         "access": "public"
     },
@@ -108,19 +108,19 @@
         "lit-html"
     ],
     "dependencies": {
-        "@spectrum-web-components/base": "^0.5.9-devmode.24+07474d44f"
+        "@spectrum-web-components/base": "^0.6.1-devmode.0+1a8b29491"
     },
     "devDependencies": {
         "@spectrum-css/commons": "^3.0.6",
         "@spectrum-css/expressvars": "^2.0.0",
-        "@spectrum-css/tokens": "^1.0.1",
+        "@spectrum-css/tokens": "^1.0.4",
         "@spectrum-css/typography": "^4.0.20",
         "@spectrum-css/vars": "^8.0.0"
     },
     "customElements": "custom-elements.json",
     "sideEffects": [
-        "./*.css"
+        "./**/*.css"
     ],
     "style": "all-medium-lightest.css",
-    "gitHead": "07474d44f6cee1db241b9ccf3dc812514ffbe7fa"
+    "gitHead": "1a8b294911ab377fa4f07e16eb016f1e3bf7b517"
 }

package/spectrum-scale-large.css

@@ -318,15 +318,6 @@ governing permissions and limitations under the License.
     --spectrum-dialog-confirm-padding: var(
         --spectrum-global-dimension-static-size-300
     );
-    --spectrum-helptext-s-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-85
-    );
-    --spectrum-helptext-m-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-85
-    );
-    --spectrum-helptext-xl-neutral-textonly-text-padding-top: var(
-        --spectrum-global-dimension-static-size-150
-    );
     --spectrum-listitem-m-texticon-padding-left: var(
         --spectrum-global-dimension-static-size-150
     );

package/spectrum-scale-medium.css

@@ -320,15 +320,6 @@ governing permissions and limitations under the License.
     --spectrum-dialog-confirm-padding: var(
         --spectrum-global-dimension-static-size-500
     );
-    --spectrum-helptext-s-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-65
-    );
-    --spectrum-helptext-m-neutral-textonly-text-padding-bottom: var(
-        --spectrum-global-dimension-static-size-65
-    );
-    --spectrum-helptext-xl-neutral-textonly-text-padding-top: var(
-        --spectrum-global-dimension-size-115
-    );
     --spectrum-listitem-m-texticon-padding-left: var(
         --spectrum-global-dimension-size-125
     );

package/tokens/dark-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-neutral-background-color-default: var(--spectrum-gray-400);
     --spectrum-neutral-background-color-hover: var(--spectrum-gray-300);
     --spectrum-neutral-background-color-down: var(--spectrum-gray-200);

package/tokens/darkest-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-neutral-background-color-default: var(--spectrum-gray-400);
     --spectrum-neutral-background-color-hover: var(--spectrum-gray-300);
     --spectrum-neutral-background-color-down: var(--spectrum-gray-200);

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

@@ -12,6 +12,7 @@ governing permissions and limitations under the License.
 
 /* This file contains overrides and additions to core tokens */
 
-:host {
+:host,
+:root {
     /*  */
 }

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

@@ -12,6 +12,7 @@ governing permissions and limitations under the License.
 
 /* This file contains overrides and additions to core tokens */
 
-:host {
+:host,
+:root {
     /*  */
 }

package/tokens/express/custom-vars.css

@@ -12,6 +12,7 @@ governing permissions and limitations under the License.
 
 /* This file contains overrides and additions to core tokens */
 
-:host {
+:host,
+:root {
     --system: express;
 }

package/tokens/express/global-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-accent-color-100: var(--spectrum-indigo-100);
     --spectrum-accent-color-200: var(--spectrum-indigo-200);
     --spectrum-accent-color-300: var(--spectrum-indigo-300);
@@ -27,7 +28,8 @@ governing permissions and limitations under the License.
     --spectrum-accent-color-1400: var(--spectrum-indigo-1400);
     --spectrum-border-width-100: 2px;
 }
-:host {
+:host,
+:root {
     --system-spectrum-actionbutton-background-color-default: var(
         --spectrum-gray-200
     );

package/tokens/express/large-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-checkbox-control-size-small: 18px;
     --spectrum-checkbox-control-size-medium: 20px;
     --spectrum-checkbox-control-size-large: 22px;

package/tokens/express/medium-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-checkbox-control-size-small: 14px;
     --spectrum-checkbox-control-size-medium: 16px;
     --spectrum-checkbox-control-size-large: 18px;

package/tokens/global-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-transparent-white-200: rgba(255, 255, 255, 0.1);
     --spectrum-transparent-white-300: rgba(255, 255, 255, 0.25);
     --spectrum-transparent-white-400: rgba(255, 255, 255, 0.4);
@@ -138,6 +139,8 @@ governing permissions and limitations under the License.
     --spectrum-divider-thickness-medium: 2px;
     --spectrum-divider-thickness-large: 4px;
     --spectrum-radio-button-selection-indicator: 4px;
+    --spectrum-popover-tip-width: 16px;
+    --spectrum-popover-tip-height: 8px;
     --spectrum-android-elevation: 2dp;
     --spectrum-spacing-50: 2px;
     --spectrum-spacing-75: 4px;

package/tokens/large-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-component-pill-edge-to-visual-75: 13px;
     --spectrum-component-pill-edge-to-visual-100: 17px;
     --spectrum-component-pill-edge-to-visual-200: 22px;
@@ -54,12 +55,13 @@ governing permissions and limitations under the License.
     --spectrum-component-top-to-text-200: 12px;
     --spectrum-component-top-to-text-300: 15px;
     --spectrum-component-bottom-to-text-50: 6px;
-    --spectrum-component-bottom-to-text-75: 7px;
+    --spectrum-component-bottom-to-text-75: 6px;
     --spectrum-component-bottom-to-text-100: 11px;
     --spectrum-component-bottom-to-text-200: 14px;
     --spectrum-component-bottom-to-text-300: 18px;
     --spectrum-action-bar-height: 56px;
     --spectrum-action-bar-top-to-item-counter: 16px;
+    --spectrum-action-button-edge-to-hold-icon-extra-small: 3px;
     --spectrum-action-button-edge-to-hold-icon-small: 3px;
     --spectrum-action-button-edge-to-hold-icon-medium: 5px;
     --spectrum-action-button-edge-to-hold-icon-large: 6px;
@@ -77,9 +79,9 @@ governing permissions and limitations under the License.
     --spectrum-field-label-top-margin-large: 5px;
     --spectrum-field-label-top-margin-extra-large: 5px;
     --spectrum-help-text-top-to-workflow-icon-small: 5px;
-    --spectrum-help-text-top-to-workflow-icon-medium: 9px;
-    --spectrum-help-text-top-to-workflow-icon-large: 13px;
-    --spectrum-help-text-top-to-workflow-icon-extra-large: 16px;
+    --spectrum-help-text-top-to-workflow-icon-medium: 4px;
+    --spectrum-help-text-top-to-workflow-icon-large: 8px;
+    --spectrum-help-text-top-to-workflow-icon-extra-large: 11px;
     --spectrum-in-line-alert-minimum-width: 360px;
     --spectrum-progress-bar-minimum-width: 48px;
     --spectrum-progress-bar-maximum-width: 768px;
@@ -108,6 +110,13 @@ governing permissions and limitations under the License.
     --spectrum-tooltip-width: 10px;
     --spectrum-tooltip-height: 5px;
     --spectrum-tooltip-maximum-width: 200px;
+    --spectrum-tag-top-to-avatar-small: 5px;
+    --spectrum-tag-top-to-avatar-medium: 9px;
+    --spectrum-tag-top-to-avatar-large: 12px;
+    --spectrum-tag-top-to-cross-icon-small: 10px;
+    --spectrum-tag-top-to-cross-icon-medium: 15px;
+    --spectrum-tag-top-to-cross-icon-large: 19px;
+    --spectrum-popover-top-to-content-area: 5px;
     --spectrum-font-size-50: 13px;
     --spectrum-font-size-75: 15px;
     --spectrum-font-size-100: 17px;

package/tokens/light-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-neutral-background-color-default: var(--spectrum-gray-800);
     --spectrum-neutral-background-color-hover: var(--spectrum-gray-900);
     --spectrum-neutral-background-color-down: var(--spectrum-gray-900);

package/tokens/medium-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-component-pill-edge-to-visual-75: 10px;
     --spectrum-component-pill-edge-to-visual-100: 14px;
     --spectrum-component-pill-edge-to-visual-200: 18px;
@@ -60,6 +61,7 @@ governing permissions and limitations under the License.
     --spectrum-component-bottom-to-text-300: 14px;
     --spectrum-action-bar-height: 48px;
     --spectrum-action-bar-top-to-item-counter: 14px;
+    --spectrum-action-button-edge-to-hold-icon-extra-small: 3px;
     --spectrum-action-button-edge-to-hold-icon-small: 3px;
     --spectrum-action-button-edge-to-hold-icon-medium: 4px;
     --spectrum-action-button-edge-to-hold-icon-large: 5px;
@@ -77,9 +79,9 @@ governing permissions and limitations under the License.
     --spectrum-field-label-top-margin-large: 4px;
     --spectrum-field-label-top-margin-extra-large: 4px;
     --spectrum-help-text-top-to-workflow-icon-small: 4px;
-    --spectrum-help-text-top-to-workflow-icon-medium: 7px;
-    --spectrum-help-text-top-to-workflow-icon-large: 10px;
-    --spectrum-help-text-top-to-workflow-icon-extra-large: 13px;
+    --spectrum-help-text-top-to-workflow-icon-medium: 3px;
+    --spectrum-help-text-top-to-workflow-icon-large: 6px;
+    --spectrum-help-text-top-to-workflow-icon-extra-large: 9px;
     --spectrum-in-line-alert-minimum-width: 320px;
     --spectrum-progress-bar-minimum-width: 48px;
     --spectrum-progress-bar-maximum-width: 768px;
@@ -108,6 +110,13 @@ governing permissions and limitations under the License.
     --spectrum-tooltip-width: 8px;
     --spectrum-tooltip-height: 4px;
     --spectrum-tooltip-maximum-width: 160px;
+    --spectrum-tag-top-to-avatar-small: 4px;
+    --spectrum-tag-top-to-avatar-medium: 6px;
+    --spectrum-tag-top-to-avatar-large: 9px;
+    --spectrum-tag-top-to-cross-icon-small: 8px;
+    --spectrum-tag-top-to-cross-icon-medium: 12px;
+    --spectrum-tag-top-to-cross-icon-large: 15px;
+    --spectrum-popover-top-to-content-area: 4px;
     --spectrum-font-size-50: 11px;
     --spectrum-font-size-75: 12px;
     --spectrum-font-size-100: 14px;

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

@@ -12,10 +12,36 @@ governing permissions and limitations under the License.
 
 /* This file contains overrides and additions to core tokens */
 
-:host {
+:host,
+:root {
     /* edge-to-visual-only is used for icon-only buttons */
     --spectrum-edge-to-visual-only-75: 5px;
     --spectrum-edge-to-visual-only-100: 9px;
     --spectrum-edge-to-visual-only-200: 13px;
     --spectrum-edge-to-visual-only-300: 16px;
+
+    /* tokens for button control size medium, large, extra large are available only as -desktop and -mobile */
+    --spectrum-radio-button-control-size-medium: var(
+        --spectrum-radio-button-control-size-medium-mobile
+    );
+    --spectrum-radio-button-control-size-large: var(
+        --spectrum-radio-button-control-size-large-mobile
+    );
+    --spectrum-radio-button-control-size-extra-large: var(
+        --spectrum-radio-button-control-size-extra-large-mobile
+    );
+
+    /* tokens for button top to control are available only as -desktop and -mobile */
+    --spectrum-radio-button-top-to-control-small: var(
+        --spectrum-radio-button-top-to-control-small-mobile
+    );
+    --spectrum-radio-button-top-to-control-medium: var(
+        --spectrum-radio-button-top-to-control-medium-mobile
+    );
+    --spectrum-radio-button-top-to-control-large: var(
+        --spectrum-radio-button-top-to-control-large-mobile
+    );
+    --spectrum-radio-button-top-to-control-extra-large: var(
+        --spectrum-radio-button-top-to-control-extra-large-mobile
+    );
 }

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

@@ -12,10 +12,36 @@ governing permissions and limitations under the License.
 
 /* This file contains overrides and additions to core tokens */
 
-:host {
+:host,
+:root {
     /* edge-to-visual-only is used for icon-only buttons */
     --spectrum-edge-to-visual-only-75: 4px;
     --spectrum-edge-to-visual-only-100: 7px;
     --spectrum-edge-to-visual-only-200: 10px;
     --spectrum-edge-to-visual-only-300: 13px;
+
+    /* tokens for button control size medium, large, extra large are available only as -desktop and -mobile */
+    --spectrum-radio-button-control-size-medium: var(
+        --spectrum-radio-button-control-size-medium-desktop
+    );
+    --spectrum-radio-button-control-size-large: var(
+        --spectrum-radio-button-control-size-large-desktop
+    );
+    --spectrum-radio-button-control-size-extra-large: var(
+        --spectrum-radio-button-control-size-extra-large-desktop
+    );
+
+    /* tokens for button top to control are available only as -desktop and -mobile */
+    --spectrum-radio-button-top-to-control-small: var(
+        --spectrum-radio-button-top-to-control-small-desktop
+    );
+    --spectrum-radio-button-top-to-control-medium: var(
+        --spectrum-radio-button-top-to-control-medium-desktop
+    );
+    --spectrum-radio-button-top-to-control-large: var(
+        --spectrum-radio-button-top-to-control-large-desktop
+    );
+    --spectrum-radio-button-top-to-control-extra-large: var(
+        --spectrum-radio-button-top-to-control-extra-large-desktop
+    );
 }

package/tokens/spectrum/custom-vars.css

@@ -11,11 +11,13 @@ governing permissions and limitations under the License.
 */
 
 /* This file contains overrides and additions to core tokens */
-:host {
+:host,
+:root {
     --system: spectrum;
 }
 
-:host {
+:host,
+:root {
     --spectrum-animation-duration-100: 130ms;
 
     --spectrum-font-family-base: adobe-clean, 'Source Sans Pro', -apple-system,
@@ -28,4 +30,14 @@ governing permissions and limitations under the License.
     --spectrum-line-height-large: 1.7;
     --spectrum-line-height-medium: 1.5;
     --spectrum-line-height-small: 1.3;
+
+    --spectrum-font-weight-thin: 100;
+    --spectrum-font-weight-ultra-light: 200;
+    --spectrum-font-weight-light: 300;
+    --spectrum-font-weight-regular: 400;
+    --spectrum-font-weight-medium: 500;
+    --spectrum-font-weight-semi-bold: 600;
+    --spectrum-font-weight-bold: 700;
+    --spectrum-font-weight-extra-bold: 800;
+    --spectrum-font-weight-black: 900;
 }

package/tokens/spectrum/global-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-accent-color-100: var(--spectrum-blue-100);
     --spectrum-accent-color-200: var(--spectrum-blue-200);
     --spectrum-accent-color-300: var(--spectrum-blue-300);
@@ -25,23 +26,10 @@ governing permissions and limitations under the License.
     --spectrum-accent-color-1200: var(--spectrum-blue-1200);
     --spectrum-accent-color-1300: var(--spectrum-blue-1300);
     --spectrum-accent-color-1400: var(--spectrum-blue-1400);
-    --spectrum-radio-button-control-size-medium-desktop: 14px;
-    --spectrum-radio-button-control-size-medium-mobile: 18px;
-    --spectrum-radio-button-control-size-large-desktop: 16px;
-    --spectrum-radio-button-control-size-large-mobile: 20px;
-    --spectrum-radio-button-control-size-extra-large-desktop: 18px;
-    --spectrum-radio-button-control-size-extra-large-mobile: 22px;
-    --spectrum-radio-button-top-to-control-small-desktop: 6px;
-    --spectrum-radio-button-top-to-control-small-mobile: 7px;
-    --spectrum-radio-button-top-to-control-medium-desktop: 9px;
-    --spectrum-radio-button-top-to-control-medium-mobile: 11px;
-    --spectrum-radio-button-top-to-control-large-desktop: 12px;
-    --spectrum-radio-button-top-to-control-large-mobile: 15px;
-    --spectrum-radio-button-top-to-control-extra-large-desktop: 15px;
-    --spectrum-radio-button-top-to-control-extra-large-mobile: 19px;
     --spectrum-border-width-100: 1px;
 }
-:host {
+:host,
+:root {
     --system-spectrum-actionbutton-background-color-default: var(
         --spectrum-gray-75
     );

package/tokens/spectrum/large-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-checkbox-control-size-small: 16px;
     --spectrum-checkbox-control-size-medium: 18px;
     --spectrum-checkbox-control-size-large: 20px;
@@ -20,6 +21,13 @@ governing permissions and limitations under the License.
     --spectrum-checkbox-top-to-control-large: 15px;
     --spectrum-checkbox-top-to-control-extra-large: 19px;
     --spectrum-radio-button-control-size-small: 16px;
+    --spectrum-radio-button-control-size-medium: 18px;
+    --spectrum-radio-button-control-size-large: 20px;
+    --spectrum-radio-button-control-size-extra-large: 22px;
+    --spectrum-radio-button-top-to-control-small: 7px;
+    --spectrum-radio-button-top-to-control-medium: 11px;
+    --spectrum-radio-button-top-to-control-large: 15px;
+    --spectrum-radio-button-top-to-control-extra-large: 19px;
     --spectrum-switch-control-width-small: 32px;
     --spectrum-switch-control-width-medium: 36px;
     --spectrum-switch-control-width-large: 41px;

package/tokens/spectrum/medium-vars.css

@@ -10,7 +10,8 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */
 
-:host {
+:host,
+:root {
     --spectrum-checkbox-control-size-small: 12px;
     --spectrum-checkbox-control-size-medium: 14px;
     --spectrum-checkbox-control-size-large: 16px;
@@ -20,6 +21,13 @@ governing permissions and limitations under the License.
     --spectrum-checkbox-top-to-control-large: 12px;
     --spectrum-checkbox-top-to-control-extra-large: 15px;
     --spectrum-radio-button-control-size-small: 12px;
+    --spectrum-radio-button-control-size-medium: 14px;
+    --spectrum-radio-button-control-size-large: 16px;
+    --spectrum-radio-button-control-size-extra-large: 18px;
+    --spectrum-radio-button-top-to-control-small: 6px;
+    --spectrum-radio-button-top-to-control-medium: 9px;
+    --spectrum-radio-button-top-to-control-large: 12px;
+    --spectrum-radio-button-top-to-control-extra-large: 15px;
     --spectrum-switch-control-width-small: 23px;
     --spectrum-switch-control-width-medium: 26px;
     --spectrum-switch-control-width-large: 29px;