@spectrum-web-components/tabs 0.8.9 → 0.8.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/custom-elements.json +19 -136
  2. package/package.json +6 -6
  3. package/src/Tab.js.map +1 -1
  4. package/src/TabPanel.js.map +1 -1
  5. package/src/Tabs.d.ts +1 -0
  6. package/src/Tabs.js +4 -0
  7. package/src/Tabs.js.map +1 -1
  8. package/src/spectrum-config.js +14 -7
  9. package/src/spectrum-tab.css.js +2 -2
  10. package/src/spectrum-tab.css.js.map +1 -1
  11. package/src/spectrum-tabs.css.js +10 -6
  12. package/src/spectrum-tabs.css.js.map +1 -1
  13. package/src/tab.css.js +8 -4
  14. package/src/tab.css.js.map +1 -1
  15. package/src/tabs.css.js +10 -6
  16. package/src/tabs.css.js.map +1 -1
  17. package/stories/tabs.stories.js +28 -0
  18. package/stories/tabs.stories.js.map +1 -1
  19. package/test/tabs.test.js.map +1 -1
package/src/tabs.css.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.css.js","sourceRoot":"","sources":["tabs.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8YjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host([size=s]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-s-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-s-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-s-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-s-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-s-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-s-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-s-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-s-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-450)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-s-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-s-compact-textonly-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n)}:host([size=m]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-m-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-m-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-m-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-m-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-m-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-m-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-m-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-m-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-550)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-m-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-m-compact-textonly-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n)}:host([size=l]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-700)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-l-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-l-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-l-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-200)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-l-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-l-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-l-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-l-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-l-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-650)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-l-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-l-compact-textonly-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n)}:host([size=xl]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-800)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-xl-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-xl-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-xl-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-300)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-xl-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-xl-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-xl-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-xl-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-750)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-xl-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-xl-compact-textonly-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n)}:host{--spectrum-tabs-compact-item-height:calc(var(--spectrum-tabs-compact-textonly-height) - var(--spectrum-tabs-compact-textonly-divider-size))}#list{display:flex;margin:0;padding-bottom:0;padding-top:0;position:relative;vertical-align:top;z-index:0}:host([dir=ltr]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) #selection-indicator{left:0}:host([dir=rtl]) #selection-indicator{right:0}#selection-indicator{border-radius:var(--spectrum-tabs-textonly-divider-border-radius);position:absolute;transform-origin:top left;transition:transform var(\n--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration\n) var(--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease);z-index:0}:host([compact]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-item-height\n);line-height:var(--spectrum-tabs-compact-item-height)}:host([direction^=horizontal]) #list{align-items:center;border-bottom:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=horizontal]) ::slotted(:not([slot])){vertical-align:top}:host([dir=ltr][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-left:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([dir=rtl][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-right:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([direction^=horizontal]) #selection-indicator{bottom:0;bottom:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1);height:var(--spectrum-tabs-quiet-textonly-divider-size);position:absolute}:host([direction^=horizontal][compact]) #list{align-items:end;box-sizing:content-box;height:var(--spectrum-tabs-compact-item-height)}:host([quiet]) #list{display:inline-flex}:host([dir=ltr][direction^=vertical]) #list{border-left:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([dir=rtl][direction^=vertical]) #list{border-right:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=vertical]) #list{display:inline-flex;flex-direction:column;padding:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])){margin-left:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])){margin-right:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([direction^=vertical]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-vertical-textonly-tabitem-gap);padding-bottom:0;padding-left:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-right:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-top:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([direction^=vertical]) .spectrum-Icon{height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height)}:host([direction^=vertical][compact]) #list ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-compact-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-compact-vertical-textonly-tabitem-gap)}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:0}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:0}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([direction^=vertical]) #selection-indicator{position:absolute;width:var(--spectrum-tabs-quiet-textonly-divider-size)}#list{border-bottom-color:var(\n--spectrum-tabs-textonly-divider-background-color\n)}:host([dir=ltr][direction^=vertical]) #list{border-left-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical]) #list{border-right-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}#selection-indicator{background-color:var(\n--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected\n)}.spectrum-Tabs--emphasized #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([quiet]) #list{border-bottom-color:var(\n--spectrum-tabs-quiet-textonly-divider-background-color\n)}:host([quiet]) #selection-indicator{background-color:var(\n--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([quiet]) #list.spectrum-Tabs--emphasized #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical][compact]) #list,:host([dir=ltr][direction^=vertical][quiet]) #list{border-left-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical][compact]) #list,:host([dir=rtl][direction^=vertical][quiet]) #list{border-right-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([direction^=vertical][compact]) #list #selection-indicator,:host([direction^=vertical][quiet]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical]) .spectrum-Tabs--emphasized{border-left-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical]) .spectrum-Tabs--emphasized{border-right-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([direction^=vertical]) #list.spectrum-Tabs--emphasized #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}@media (forced-colors:active){#list{--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:HighlightText;--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-icon-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-tabitem-text-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-text-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-text-color:ButtonText;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:Highlight;forced-color-adjust:none}::slotted(:not([slot])):before{background-color:ButtonFace}#list.spectrum-Tabs--emphasized ::slotted(:not([slot])):before{background-color:ButtonFace}#list.spectrum-Tabs--emphasized .is-selected,#list.spectrum-Tabs--emphasized .is-selected .spectrum-Icon{color:HighlightText}#list.spectrum-Tabs--emphasized .is-selected:before{background-color:Highlight;color:HighlightText}#list.spectrum-Tabs--emphasized .is-selected .spectrum-Tabs-itemLabel{color:HighlightText}}.is-selected,.is-selected .spectrum-Icon{color:HighlightText}.is-selected:before{background-color:Highlight;color:HighlightText}.is-selected .spectrum-Tabs-itemLabel{color:HighlightText}:host{--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;display:grid}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([disabled]) #selection-indicator{background-color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}:host([disabled]) ::slotted(sp-tab){color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}#list{justify-content:var(--swc-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([direction=vertical-right]) #selection-indicator,:host([direction=vertical]) #selection-indicator{height:1px;top:0}:host([compact]){--spectrum-tabs-height:var(--spectrum-tabs-quiet-compact-height)}:host([direction=horizontal]:not([quiet])) #list{border-bottom-color:var(\n--spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir][direction=horizontal]) #selection-indicator{width:1px}:host([dir=ltr][direction=vertical-right]) #list{border-left:0;border-right:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-right-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir=rtl][direction=vertical-right]) #list{border-left:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-left-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n);border-right:0}:host([dir=ltr][direction=vertical-right]) #selection-indicator{left:auto;right:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1)}:host([dir=rtl][direction=vertical-right]) #selection-indicator{left:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1);right:auto}#selection-indicator.first-position{transition:none}\n`;\nexport default styles;"]}
1
+ {"version":3,"file":"tabs.css.js","sourceRoot":"","sources":["tabs.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkZjB,CAAC;AACF,eAAe,MAAM,CAAC","sourcesContent":["/*\nCopyright 2022 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport { css } from '@spectrum-web-components/base';\nconst styles = css`\n:host([size=s]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-s-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-s-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-s-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-s-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-s-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-s-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-s-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-s-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-s-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-s-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-s-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-s-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-s-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-450)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-s-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-s-compact-textonly-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-s-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-85)\n)}:host([size=m]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-m-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-m-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-m-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-m-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-m-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-m-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-m-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-m-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-m-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-m-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-m-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-m-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-m-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-550)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-m-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-m-compact-textonly-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-m-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-100)\n)}:host([size=l]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-l-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-700)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-l-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-l-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-l-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-200)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-l-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-l-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-l-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-l-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-l-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-l-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-l-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-l-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-l-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-650)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-l-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-l-compact-textonly-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-l-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-115)\n)}:host([size=xl]){--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-quiet-textonly-tabitem-icon-gap:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-quiet-textonly-tabitem-height:var(\n--spectrum-tabs-xl-quiet-textonly-tabitem-height,var(--spectrum-global-dimension-size-800)\n);--spectrum-tabs-quiet-textonly-divider-size:var(\n--spectrum-tabs-xl-quiet-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-emphasized-selected-default)\n);--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-emphasized-texticon-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-selection-indicator-color-emphasized)\n);--spectrum-tabs-emphasized-textonly-divider-background-color:var(\n--spectrum-tabs-xl-emphasized-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-texticon-tabitem-text-size:var(\n--spectrum-tabs-xl-texticon-tabitem-text-size,var(--spectrum-global-dimension-font-size-300)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-duration,var(--spectrum-global-animation-duration-100)\n);--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease:var(\n--spectrum-tabs-xl-texticon-tabitem-selection-indicator-animation-ease,var(--spectrum-global-animation-ease-in-out)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-selected-key-focus,var(--spectrum-alias-tabitem-icon-color-selected)\n);--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-selected-key-focus,var(--spectrum-alias-tabitem-text-color-selected-key-focus)\n);--spectrum-tabs-textonly-tabitem-icon-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-disabled,var(--spectrum-alias-tabitem-icon-color-disabled)\n);--spectrum-tabs-textonly-tabitem-text-color-disabled:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n);--spectrum-tabs-textonly-tabitem-icon-color:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color,var(--spectrum-alias-tabitem-icon-color-default)\n);--spectrum-tabs-textonly-tabitem-text-color:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color,var(--spectrum-alias-tabitem-text-color-default)\n);--spectrum-tabs-textonly-tabitem-icon-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-icon-color-hover,var(--spectrum-alias-tabitem-icon-color-hover)\n);--spectrum-tabs-textonly-tabitem-text-color-hover:var(\n--spectrum-tabs-xl-textonly-tabitem-text-color-hover,var(--spectrum-alias-tabitem-text-color-hover)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-color-key-focus,var(--spectrum-alias-focus-ring-color)\n);--spectrum-tabs-textonly-divider-background-color:var(\n--spectrum-tabs-xl-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-textonly-tabitem-text-font-weight:var(\n--spectrum-tabs-xl-textonly-tabitem-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-tabs-textonly-tabitem-focus-ring-size:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-size,var(--spectrum-alias-focus-ring-size)\n);--spectrum-tabs-textonly-tabitem-focus-ring-height:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-textonly-tabitem-focus-ring-padding-x:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-padding-x,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-textonly-tabitem-focus-ring-border-radius:var(\n--spectrum-tabs-xl-textonly-tabitem-focus-ring-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-tabs-textonly-tabitem-margin-right:var(\n--spectrum-tabs-xl-textonly-tabitem-margin-right,var(--spectrum-global-dimension-size-300)\n);--spectrum-tabs-textonly-divider-border-radius:var(\n--spectrum-tabs-xl-textonly-divider-border-radius,var(--spectrum-global-dimension-static-size-10)\n);--spectrum-tabs-vertical-quiet-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-quiet-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-quiet)\n);--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-selection-indicator-background-color-selected,var(--spectrum-alias-tabitem-text-color-selected-default)\n);--spectrum-tabs-vertical-textonly-divider-background-color:var(\n--spectrum-tabs-xl-vertical-textonly-divider-background-color,var(--spectrum-alias-tabs-divider-background-color-default)\n);--spectrum-tabs-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-750)\n);--spectrum-tabs-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-tabs-compact-textonly-divider-size:var(\n--spectrum-tabs-xl-compact-textonly-divider-size,var(--spectrum-alias-border-size-thick)\n);--spectrum-tabs-compact-textonly-height:var(\n--spectrum-tabs-xl-compact-textonly-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-height:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-tabs-compact-vertical-textonly-tabitem-gap:var(\n--spectrum-tabs-xl-compact-vertical-textonly-tabitem-gap,var(--spectrum-global-dimension-size-125)\n)}:host{--spectrum-tabs-compact-item-height:calc(var(--spectrum-tabs-compact-textonly-height) - var(--spectrum-tabs-compact-textonly-divider-size))}#list{display:flex;margin:0;padding-bottom:0;padding-top:0;position:relative;vertical-align:top;z-index:0}:host([dir=ltr]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=rtl]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-padding-x)*-1)}:host([dir=ltr]) #selection-indicator{left:0}:host([dir=rtl]) #selection-indicator{right:0}#selection-indicator{border-radius:var(--spectrum-tabs-textonly-divider-border-radius);position:absolute;transform-origin:top left;transition:transform var(\n--spectrum-tabs-texticon-tabitem-selection-indicator-animation-duration\n) var(--spectrum-tabs-texticon-tabitem-selection-indicator-animation-ease);z-index:0}:host([compact]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-item-height\n);line-height:var(--spectrum-tabs-compact-item-height)}:host([direction^=horizontal]) #list{align-items:center;border-bottom:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=horizontal]) ::slotted(:not([slot])){vertical-align:top}:host([dir=ltr][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-left:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([dir=rtl][direction^=horizontal]) ::slotted(:not([slot]):not(:first-child)){margin-right:var(\n--spectrum-tabs-textonly-tabitem-margin-right\n)}:host([direction^=horizontal]) #selection-indicator{bottom:0;bottom:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1);height:var(--spectrum-tabs-quiet-textonly-divider-size);position:absolute}:host([direction^=horizontal][compact]) #list{align-items:end;box-sizing:content-box;height:var(--spectrum-tabs-compact-item-height)}:host([quiet]) #list{display:inline-flex}:host([dir=ltr][direction^=vertical]) #list{border-left:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([dir=rtl][direction^=vertical]) #list{border-right:var(--spectrum-tabs-quiet-textonly-divider-size) solid}:host([direction^=vertical]) #list{display:inline-flex;flex-direction:column;padding:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])){margin-left:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])){margin-right:calc(var(--spectrum-tabs-vertical-textonly-tabitem-gap)/2)}:host([direction^=vertical]) ::slotted(:not([slot])){height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-vertical-textonly-tabitem-gap);padding-bottom:0;padding-left:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-right:var(\n--spectrum-tabs-quiet-textonly-tabitem-focus-ring-padding-x\n);padding-top:0}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=ltr][direction^=vertical]) ::slotted(:not([slot])):before{right:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([dir=rtl][direction^=vertical]) ::slotted(:not([slot])):before{left:calc(var(--spectrum-tabs-textonly-tabitem-focus-ring-size)*-1)}:host([direction^=vertical]) .spectrum-Icon{height:var(\n--spectrum-tabs-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-vertical-textonly-tabitem-height)}:host([direction^=vertical][compact]) #list ::slotted(:not([slot])){height:var(\n--spectrum-tabs-compact-vertical-textonly-tabitem-height\n);line-height:var(--spectrum-tabs-compact-vertical-textonly-tabitem-height);margin-bottom:var(--spectrum-tabs-compact-vertical-textonly-tabitem-gap)}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:0}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:0}:host([dir=ltr][direction^=vertical]) #selection-indicator{left:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([dir=rtl][direction^=vertical]) #selection-indicator{right:calc(var(--spectrum-tabs-quiet-textonly-divider-size)*-1)}:host([direction^=vertical]) #selection-indicator{position:absolute;width:var(--spectrum-tabs-quiet-textonly-divider-size)}#list{border-bottom-color:var(\n--spectrum-tabs-textonly-divider-background-color\n)}:host([dir=ltr][direction^=vertical]) #list{border-left-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical]) #list{border-right-color:var(\n--spectrum-tabs-vertical-textonly-divider-background-color\n)}#selection-indicator{background-color:var(\n--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([emphasized]) #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([emphasized]) ::slotted([selected]:not([slot])){color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected\n)}:host([emphasized]) ::slotted([selected]:not([slot])) .spectrum-Icon{color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected\n)}:host([quiet]) #list{border-bottom-color:var(\n--spectrum-tabs-quiet-textonly-divider-background-color\n)}:host([quiet]) #selection-indicator{background-color:var(\n--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([quiet][emphasized]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical][compact]) #list,:host([dir=ltr][direction^=vertical][quiet]) #list{border-left-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical][compact]) #list,:host([dir=rtl][direction^=vertical][quiet]) #list{border-right-color:var(\n--spectrum-tabs-vertical-quiet-textonly-divider-background-color\n)}:host([direction^=vertical][compact]) #list #selection-indicator,:host([direction^=vertical][quiet]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected\n)}:host([dir=ltr][direction^=vertical][emphasized]) #list{border-left-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([dir=rtl][direction^=vertical][emphasized]) #list{border-right-color:var(\n--spectrum-tabs-emphasized-textonly-divider-background-color\n)}:host([direction^=vertical][emphasized]) #list #selection-indicator{background-color:var(\n--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected\n)}@media (forced-colors:active){#list{--spectrum-tabs-emphasized-texticon-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-emphasized-texticon-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-emphasized-texticon-tabitem-text-color-selected:HighlightText;--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-tabitem-focus-ring-border-color-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-icon-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-icon-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-selection-indicator-background-color-selected:Highlight;--spectrum-tabs-textonly-tabitem-text-color-disabled:GrayText;--spectrum-tabs-textonly-tabitem-text-color-hover:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected-key-focus:ButtonText;--spectrum-tabs-textonly-tabitem-text-color-selected:HighlightText;--spectrum-tabs-textonly-tabitem-text-color:ButtonText;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-tabitem-selection-indicator-background-color-selected:Highlight;forced-color-adjust:none}::slotted(:not([slot])):before{background-color:ButtonFace}::slotted([selected]:not([slot])){color:HighlightText}::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}:host([emphasized]) #list ::slotted(:not([slot])):before{background-color:ButtonFace}:host([emphasized]) #list ::slotted([selected]:not([slot])){color:HighlightText}:host([emphasized]) #list ::slotted([selected]:not([slot])):before{background-color:Highlight;color:HighlightText}}:host{--spectrum-tabs-emphasized-textonly-divider-background-color:transparent;--spectrum-tabs-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-quiet-textonly-divider-background-color:transparent;--spectrum-tabs-vertical-textonly-divider-background-color:transparent;display:grid}:host([direction^=vertical]){grid-template-columns:auto 1fr}:host([direction=vertical]){gap:var(--spectrum-tabs-textonly-tabitem-focus-ring-size)}#selection-indicator{border-radius:0}:host([disabled]) #selection-indicator{background-color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}:host([disabled]) ::slotted(sp-tab){color:var(\n--spectrum-tabs-m-text-color-disabled,var(--spectrum-alias-text-color-disabled)\n)}#list{justify-content:var(--swc-tabs-list-justify-content)}:host([disabled]) #list{pointer-events:none}:host([direction=vertical-right]) #selection-indicator,:host([direction=vertical]) #selection-indicator{height:1px;top:0}:host([compact]){--spectrum-tabs-height:var(--spectrum-tabs-quiet-compact-height)}:host([direction=horizontal]:not([quiet])) #list{border-bottom-color:var(\n--spectrum-tabs-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir][direction=horizontal]) #selection-indicator{width:1px}:host([dir=ltr][direction=vertical-right]) #list{border-left:0;border-right:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-right-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n)}:host([dir=rtl][direction=vertical-right]) #list{border-left:var(\n--spectrum-tabs-vertical-rule-width,var(--spectrum-alias-border-size-thick)\n) solid;border-left-color:var(\n--spectrum-tabs-vertical-rule-color,var(--spectrum-global-color-gray-200)\n);border-right:0}:host([dir=ltr][direction=vertical-right]) #selection-indicator{left:auto;right:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1)}:host([dir=rtl][direction=vertical-right]) #selection-indicator{left:calc(var(--spectrum-tabs-vertical-rule-width, var(--spectrum-alias-border-size-thick))*-1);right:auto}#selection-indicator.first-position{transition:none}\n`;\nexport default styles;"]}
package/stories/tabs.stories.js CHANGED
@@ -150,6 +150,34 @@ export const disabledTab = (args) => {
150
150
  </sp-tabs>
151
151
  `;
152
152
  };
153
+ export const emphasized = (args) => {
154
+ return html `
155
+ <sp-tabs selected="1" emphasized ?auto=${args.auto} label="Demo Tabs">
156
+ <sp-tab label="Tab 1" value="1"></sp-tab>
157
+ <sp-tab label="Tab 2" value="2"></sp-tab>
158
+ <sp-tab label="Tab 3" value="3"></sp-tab>
159
+ <sp-tab label="Tab 4" value="4"></sp-tab>
160
+ ${panels()}
161
+ </sp-tabs>
162
+ `;
163
+ };
164
+ export const emphasizedQuiet = (args) => {
165
+ return html `
166
+ <sp-tabs
167
+ selected="1"
168
+ emphasized
169
+ quiet
170
+ ?auto=${args.auto}
171
+ label="Demo Tabs"
172
+ >
173
+ <sp-tab label="Tab 1" value="1"></sp-tab>
174
+ <sp-tab label="Tab 2" value="2"></sp-tab>
175
+ <sp-tab label="Tab 3" value="3"></sp-tab>
176
+ <sp-tab label="Tab 4" value="4"></sp-tab>
177
+ ${panels()}
178
+ </sp-tabs>
179
+ `;
180
+ };
153
181
  export const Vertical = (args) => {
154
182
  return html `
155
183
  <sp-tabs
package/stories/tabs.stories.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.stories.js","sourceRoot":"","sources":["tabs.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport '@spectrum-web-components/icon/sp-icon.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-close.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-chevron-down.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-help.js';\nimport '../sp-tabs.js';\nimport '../sp-tab.js';\nimport '../sp-tab-panel.js';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nexport default {\n component: 'sp-tabs',\n title: 'Tabs',\n argTypes: {\n direction: {\n name: 'direction',\n type: { name: 'string', required: false },\n description: 'The direction of the Tabs element',\n table: {\n type: {\n summary: '\"vertical\" | \"vertical-right\" | \"horizontal\"',\n },\n defaultValue: { summary: 'horizontal' },\n },\n control: {\n type: 'text',\n },\n },\n verticalTab: { control: 'boolean' },\n auto: { control: 'boolean' },\n },\n args: {\n direction: 'horizontal',\n type: false,\n verticalTab: false,\n auto: false,\n },\n};\n\ninterface Properties {\n direction?: 'vertical' | 'vertical-right' | 'horizontal';\n verticalTabs?: boolean;\n verticalTab?: boolean;\n auto?: boolean;\n}\n\nconst panels = (): TemplateResult => html`\n <sp-tab-panel value=\"1\">Content for \"Really Long Name\"</sp-tab-panel>\n <sp-tab-panel value=\"2\">Content for tab 2</sp-tab-panel>\n <sp-tab-panel value=\"3\">Content for tab 3</sp-tab-panel>\n <sp-tab-panel value=\"4\">Content for tab 4</sp-tab-panel>\n`;\n\nexport const Default = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n display: grid;\n grid-template-columns: 100%;\n }\n sp-tab-panel {\n grid-area: 2/1/2/1;\n transition: opacity\n var(--spectrum-global-animation-duration-300)\n ease-in-out,\n transform var(--spectrum-global-animation-duration-300)\n ease-in-out;\n }\n sp-tab-panel:not([selected]) {\n display: unset;\n opacity: 0;\n height: 0;\n pointer-events: none;\n transform: translateY(\n var(\n --spectrum-dropdown-flyout-menu-offset-y,\n var(--spectrum-global-dimension-size-75)\n )\n );\n transition: opacity\n var(--spectrum-global-animation-duration-300)\n ease-in-out,\n transform var(--spectrum-global-animation-duration-300)\n ease-in-out,\n height 0s ease var(--spectrum-global-animation-duration-300);\n }\n </style>\n <sp-tabs\n selected=\"1\"\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n direction=${args.direction}\n >\n <sp-tab value=\"2\">Tab 2</sp-tab>\n <sp-tab value=\"3\">Tab 3</sp-tab>\n <sp-tab value=\"4\">Tab 4</sp-tab>\n <sp-tab value=\"1\" selected>Really Long Name</sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Autofocus = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n autofocus\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const disabledTabs = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n disabled\n ?auto=${args.auto}\n label=\"Disabled Tabs\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const disabledTab = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n ?auto=${args.auto}\n label=\"Disabled Tab\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" disabled></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" disabled></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Vertical = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVertical.args = {\n direction: 'vertical',\n};\n\nexport const VerticalSized = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n height: 75vh;\n --swc-tabs-list-justify-content: center;\n }\n </style>\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVerticalSized.args = {\n direction: 'vertical',\n};\n\nexport const VerticalRight = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n height: 75vh;\n --swc-tabs-list-justify-content: center;\n }\n </style>\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVerticalRight.args = {\n direction: 'vertical-right',\n};\n\nexport const Icons = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\" ?vertical=${verticalTab}>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" ?vertical=${verticalTab}>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" ?vertical=${verticalTab}>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\" ?vertical=${verticalTab}>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const IconsWithSlottedLabel = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab value=\"1\" ?vertical=${verticalTab}>\n Tab 1\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab value=\"2\" ?vertical=${verticalTab}>\n Tab 2\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab value=\"3\" ?vertical=${verticalTab}>\n Tab 3\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab value=\"4\" ?vertical=${verticalTab}>\n Tab 4\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const IconsOnly = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab aria-label=\"Tab 1\" value=\"1\" ?vertical=${verticalTab}>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab aria-label=\"Tab 2\" value=\"2\" ?vertical=${verticalTab}>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab aria-label=\"Tab 3\" value=\"3\" ?vertical=${verticalTab}>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab aria-label=\"Tab 4\" value=\"4\" ?vertical=${verticalTab}>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const iconsIi = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\" vertical>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" vertical>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" vertical>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\" vertical>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\niconsIi.args = {\n direction: 'vertical',\n};\niconsIi.story = {\n name: 'Icons II',\n};\n\nexport const iconsIii = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\">\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\">\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\">\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\niconsIii.args = {\n direction: 'vertical',\n};\niconsIii.story = {\n name: 'Icons III',\n};\n\nexport const Quiet = ({ direction, auto }: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" quiet direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Compact = ({ direction, auto }: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" compact direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const quietCompact = ({\n direction,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n quiet\n compact\n direction=${direction}\n ?auto=${auto}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nquietCompact.story = {\n name: 'Quiet Compact',\n};\n"]}
1
+ {"version":3,"file":"tabs.stories.js","sourceRoot":"","sources":["tabs.stories.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport '@spectrum-web-components/icon/sp-icon.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-close.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-chevron-down.js';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-help.js';\nimport '../sp-tabs.js';\nimport '../sp-tab.js';\nimport '../sp-tab-panel.js';\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nexport default {\n component: 'sp-tabs',\n title: 'Tabs',\n argTypes: {\n direction: {\n name: 'direction',\n type: { name: 'string', required: false },\n description: 'The direction of the Tabs element',\n table: {\n type: {\n summary: '\"vertical\" | \"vertical-right\" | \"horizontal\"',\n },\n defaultValue: { summary: 'horizontal' },\n },\n control: {\n type: 'text',\n },\n },\n verticalTab: { control: 'boolean' },\n auto: { control: 'boolean' },\n },\n args: {\n direction: 'horizontal',\n type: false,\n verticalTab: false,\n auto: false,\n },\n};\n\ninterface Properties {\n direction?: 'vertical' | 'vertical-right' | 'horizontal';\n verticalTabs?: boolean;\n verticalTab?: boolean;\n auto?: boolean;\n}\n\nconst panels = (): TemplateResult => html`\n <sp-tab-panel value=\"1\">Content for \"Really Long Name\"</sp-tab-panel>\n <sp-tab-panel value=\"2\">Content for tab 2</sp-tab-panel>\n <sp-tab-panel value=\"3\">Content for tab 3</sp-tab-panel>\n <sp-tab-panel value=\"4\">Content for tab 4</sp-tab-panel>\n`;\n\nexport const Default = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n display: grid;\n grid-template-columns: 100%;\n }\n sp-tab-panel {\n grid-area: 2/1/2/1;\n transition: opacity\n var(--spectrum-global-animation-duration-300)\n ease-in-out,\n transform var(--spectrum-global-animation-duration-300)\n ease-in-out;\n }\n sp-tab-panel:not([selected]) {\n display: unset;\n opacity: 0;\n height: 0;\n pointer-events: none;\n transform: translateY(\n var(\n --spectrum-dropdown-flyout-menu-offset-y,\n var(--spectrum-global-dimension-size-75)\n )\n );\n transition: opacity\n var(--spectrum-global-animation-duration-300)\n ease-in-out,\n transform var(--spectrum-global-animation-duration-300)\n ease-in-out,\n height 0s ease var(--spectrum-global-animation-duration-300);\n }\n </style>\n <sp-tabs\n selected=\"1\"\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n direction=${args.direction}\n >\n <sp-tab value=\"2\">Tab 2</sp-tab>\n <sp-tab value=\"3\">Tab 3</sp-tab>\n <sp-tab value=\"4\">Tab 4</sp-tab>\n <sp-tab value=\"1\" selected>Really Long Name</sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Autofocus = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n autofocus\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const disabledTabs = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n disabled\n ?auto=${args.auto}\n label=\"Disabled Tabs\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const disabledTab = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n ?auto=${args.auto}\n label=\"Disabled Tab\"\n direction=${args.direction}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" disabled></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" disabled></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const emphasized = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" emphasized ?auto=${args.auto} label=\"Demo Tabs\">\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const emphasizedQuiet = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n emphasized\n quiet\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Vertical = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVertical.args = {\n direction: 'vertical',\n};\n\nexport const VerticalSized = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n height: 75vh;\n --swc-tabs-list-justify-content: center;\n }\n </style>\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVerticalSized.args = {\n direction: 'vertical',\n};\n\nexport const VerticalRight = (args: Properties): TemplateResult => {\n return html`\n <style>\n sp-tabs {\n height: 75vh;\n --swc-tabs-list-justify-content: center;\n }\n </style>\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\nVerticalRight.args = {\n direction: 'vertical-right',\n};\n\nexport const Icons = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\" ?vertical=${verticalTab}>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" ?vertical=${verticalTab}>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" ?vertical=${verticalTab}>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\" ?vertical=${verticalTab}>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const IconsWithSlottedLabel = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab value=\"1\" ?vertical=${verticalTab}>\n Tab 1\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab value=\"2\" ?vertical=${verticalTab}>\n Tab 2\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab value=\"3\" ?vertical=${verticalTab}>\n Tab 3\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab value=\"4\" ?vertical=${verticalTab}>\n Tab 4\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const IconsOnly = ({\n direction,\n verticalTab,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" direction=${direction} ?auto=${auto}>\n <sp-tab aria-label=\"Tab 1\" value=\"1\" ?vertical=${verticalTab}>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab aria-label=\"Tab 2\" value=\"2\" ?vertical=${verticalTab}>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab aria-label=\"Tab 3\" value=\"3\" ?vertical=${verticalTab}>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab aria-label=\"Tab 4\" value=\"4\" ?vertical=${verticalTab}>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const iconsIi = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\" vertical>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\" vertical>\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\" vertical>\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\" vertical>\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\niconsIi.args = {\n direction: 'vertical',\n};\niconsIi.story = {\n name: 'Icons II',\n};\n\nexport const iconsIii = (args: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n direction=${args.direction}\n ?auto=${args.auto}\n label=\"Demo Tabs\"\n >\n <sp-tab label=\"Tab 1\" value=\"1\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\">\n <sp-icon-close slot=\"icon\"></sp-icon-close>\n </sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\">\n <sp-icon-chevron-down slot=\"icon\"></sp-icon-chevron-down>\n </sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\">\n <sp-icon-help slot=\"icon\"></sp-icon-help>\n </sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\niconsIii.args = {\n direction: 'vertical',\n};\niconsIii.story = {\n name: 'Icons III',\n};\n\nexport const Quiet = ({ direction, auto }: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" quiet direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const Compact = ({ direction, auto }: Properties): TemplateResult => {\n return html`\n <sp-tabs selected=\"1\" compact direction=${direction} ?auto=${auto}>\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nexport const quietCompact = ({\n direction,\n auto,\n}: Properties): TemplateResult => {\n return html`\n <sp-tabs\n selected=\"1\"\n quiet\n compact\n direction=${direction}\n ?auto=${auto}\n >\n <sp-tab label=\"Tab 1\" value=\"1\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"2\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"3\"></sp-tab>\n <sp-tab label=\"Tab 4\" value=\"4\"></sp-tab>\n ${panels()}\n </sp-tabs>\n `;\n};\n\nquietCompact.story = {\n name: 'Quiet Compact',\n};\n"]}
package/test/tabs.test.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.test.js","sourceRoot":"","sources":["tabs.test.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport '../sp-tabs.js';\nimport '../sp-tab.js';\nimport '../sp-tab-panel.js';\nimport { Tab, TabPanel, Tabs } from '../';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark.js';\nimport {\n elementUpdated,\n expect,\n fixture,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { html } from 'lit/static-html.js';\nimport { LitElement, TemplateResult } from '@spectrum-web-components/base';\nimport {\n arrowDownEvent,\n arrowLeftEvent,\n arrowRightEvent,\n arrowUpEvent,\n enterEvent,\n spaceEvent,\n} from '../../../test/testing-helpers.js';\nimport { sendKeys } from '@web/test-runner-commands';\n\nconst createTabs = async (): Promise<Tabs> => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n <sp-tab-panel value=\"first\">First tab content</sp-tab-panel>\n <sp-tab-panel value=\"second\">Second tab content</sp-tab-panel>\n <sp-tab-panel value=\"third\">Third tab content</sp-tab-panel>\n </sp-tabs>\n `\n );\n await elementUpdated(tabs);\n return tabs;\n};\n\ndescribe('Tabs', () => {\n it('loads accessibly', async () => {\n const tabs = await createTabs();\n\n const tabList = tabs.querySelectorAll('sp-tab');\n\n expect(tabList).to.exist;\n expect(tabList.length).to.equal(3);\n\n await expect(tabs).to.be.accessible();\n });\n\n it('loads accessibly w/o panels', async () => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\">Tab 2</sp-tab>\n <sp-tab value=\"third\">Tab 3</sp-tab>\n </sp-tabs>\n `\n );\n\n const tabList = tabs.querySelectorAll('sp-tab');\n\n expect(tabList).to.exist;\n expect(tabList.length).to.equal(3);\n\n await expect(tabs).to.be.accessible();\n });\n\n it('can be disabled', async () => {\n const tabs = await createTabs();\n const tab = tabs.querySelector('[label=\"Tab 3\"]') as Tab;\n tabs.disabled = true;\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n tab.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n });\n\n it('can have disabled sp-tab children', async () => {\n const tabs = await createTabs();\n const tab2 = tabs.querySelector('[label=\"Tab 2\"]') as Tab;\n const tab3 = tabs.querySelector('[label=\"Tab 3\"]') as Tab;\n tab3.disabled = true;\n await elementUpdated(tab3);\n expect(tabs.selected).to.equal('first');\n tab3.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n tab2.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('second');\n });\n\n it('reflects selected tab with selected property', async () => {\n const tabs = await createTabs();\n\n const firstTab = tabs.querySelector('sp-tab[value=first]') as Tab;\n const secondTab = tabs.querySelector('sp-tab[value=second]') as Tab;\n const thirdTab = tabs.querySelector('sp-tab[value=third]') as Tab;\n const firstPanel = tabs.querySelector(\n 'sp-tab-panel[value=first]'\n ) as TabPanel;\n const secondPanel = tabs.querySelector(\n 'sp-tab-panel[value=second]'\n ) as TabPanel;\n const thirdPanel = tabs.querySelector(\n 'sp-tab-panel[value=third]'\n ) as TabPanel;\n\n expect(firstTab.selected, 'first: 1, selected').to.be.true;\n expect(firstPanel.selected, 'first panel: 1, selected').to.be.true;\n expect(secondTab.selected, 'second: 1, not selected').to.be.false;\n expect(secondPanel.selected, 'second panel: 1, not selected').to.be\n .false;\n expect(thirdTab.selected, 'third: 1, not selected').to.be.false;\n expect(thirdPanel.selected, 'third panel: 1, not selected').to.be.false;\n expect(tabs.selected).to.equal(firstTab.value);\n\n secondTab.click();\n await elementUpdated(tabs);\n\n expect(firstTab.selected, 'first: 2, not selected').to.be.false;\n expect(firstPanel.selected, 'first panel: 2, not selected').to.be.false;\n expect(secondTab.selected, 'second: 2, selected').to.be.true;\n expect(secondTab.selected, 'first panel: 2, selected').to.be.true;\n expect(thirdTab.selected, 'third: 2, not selected').to.be.false;\n expect(thirdTab.selected, 'first panel: 2, not selected').to.be.false;\n expect(tabs.selected).to.equal(secondTab.value);\n\n thirdTab.click();\n await elementUpdated(tabs);\n\n expect(firstTab.selected, 'first: 3, not selected').to.be.false;\n expect(firstPanel.selected, 'first panel: 3, not selected').to.be.false;\n expect(secondTab.selected, 'second: 3, not selected').to.be.false;\n expect(secondPanel.selected, 'second panel: 3, not selected').to.be\n .false;\n expect(thirdTab.selected, 'third: 3, selected').to.be.true;\n expect(thirdTab.selected, 'first panel: 3, selected').to.be.true;\n expect(tabs.selected).to.equal(thirdTab.value);\n });\n\n it('autofocuses', async () => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"second\" autofocus>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `\n );\n\n await elementUpdated(tabs);\n\n const autoElement = tabs.querySelector('[label=\"Tab 2\"]') as Tab;\n\n await waitUntil(\n () => document.activeElement === autoElement,\n 'Autofocused'\n );\n });\n\n it('auto', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"second\" auto>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n el.focus();\n await sendKeys({\n press: 'ArrowLeft',\n });\n expect(el.selected).to.equal('first');\n await sendKeys({\n press: 'ArrowLeft',\n });\n expect(el.selected).to.equal('third');\n await sendKeys({\n press: 'ArrowRight',\n });\n expect(el.selected).to.equal('first');\n });\n\n it('forces only one tab to be selected', async () => {\n const tabs = await createTabs();\n\n const selectedTabs = tabs.querySelectorAll('sp-tab[selected]');\n\n expect(tabs.selected).to.equal('first');\n expect(selectedTabs.length).to.equal(1);\n });\n\n it('de-selects all but first selected tab if multiple selected', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected).to.be.true;\n expect(tab2.selected).to.be.false;\n });\n\n it('ensures setting selection updates selected tab', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n const tab3 = tabs.querySelector('sp-tab[value=third]') as Tab;\n\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n if (!(tab3 instanceof Tab)) throw new Error('tab3 not of type Tab');\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected, 'first: 1, selected').to.be.true;\n expect(tab2.selected, 'second: 1, not selected').to.be.false;\n expect(tab3.selected, 'thurd: 1, not selected').to.be.false;\n\n tabs.selected = 'second';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('second');\n expect(tab1.selected, 'first: 2, not selected').to.be.false;\n expect(tab2.selected, 'second: 2, selected').to.be.true;\n expect(tab3.selected, 'third: 2, not selected').to.be.false;\n\n tabs.selected = 'third';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('third');\n expect(tab1.selected, 'first: 3, not selected').to.be.false;\n expect(tab2.selected, 'second: 3, not selected').to.be.false;\n expect(tab3.selected, 'third: 3, selected').to.be.true;\n });\n\n it('ensures setting selected and clicking on tab both work together', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n const tab3 = tabs.querySelector('sp-tab[value=third]') as Tab;\n\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n if (!(tab3 instanceof Tab)) throw new Error('tab3 not of type Tab');\n\n tab2.click();\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('second');\n expect(tab1.selected).to.be.false;\n expect(tab2.selected).to.be.true;\n expect(tab3.selected).to.be.false;\n\n tabs.selected = 'first';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected).to.be.true;\n expect(tab2.selected).to.be.false;\n expect(tab3.selected).to.be.false;\n });\n it('displays `vertical`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\" direction=\"vertical\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n el.selected = 'first';\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('displays with nothing `selected`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n el.selected = 'first';\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('ignores children with no `value`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <div id=\"other\">Other thing</div>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n const otherThing = el.querySelector('#other') as HTMLDivElement;\n otherThing.click();\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('allows selection to be cancellable', async () => {\n const cancelSelection = (event: Event): void => event.preventDefault();\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\" @change=${cancelSelection}>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n secondTab.click();\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('prevents [tabindex=0] while `focusin`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs>\n <sp-tab label=\"Tab 1\" value=\"first\" selected>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n\n const selected = el.querySelector('[value=\"first\"]') as Tab;\n const toBeSelected = el.querySelector('[value=\"second\"]') as Tab;\n\n await elementUpdated(el);\n await waitUntil(() => el.selected === 'first', 'wait for selection');\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(0);\n\n toBeSelected.dispatchEvent(new Event('focusin', { bubbles: true }));\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(-1);\n\n toBeSelected.dispatchEvent(new Event('focusout', { bubbles: true }));\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(0);\n\n toBeSelected.click();\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n expect(toBeSelected.tabIndex).to.equal(0);\n });\n it('accepts keyboard based selection', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"Unknown\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n const firstTab = el.querySelector('[value=\"first\"]') as Tab;\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === secondTab, 'Focus second tab').to.be\n .true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n\n it('accepts keyboard based selection through shadow DOM', async () => {\n class TabTestEl extends LitElement {\n protected render(): TemplateResult {\n return html`\n <sp-tabs selected=\"Unknown\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `;\n }\n }\n customElements.define('tab-test-el', TabTestEl);\n const el = await fixture<TabTestEl>(\n html`\n <tab-test-el></tab-test-el>\n `\n );\n\n await elementUpdated(el);\n const rootNode = el.shadowRoot as ShadowRoot;\n const tabsEl = rootNode.querySelector('sp-tabs') as Tabs;\n\n await elementUpdated(tabsEl);\n expect(tabsEl.selected).to.be.equal('');\n\n const firstTab = tabsEl.querySelector('[value=\"first\"]') as Tab;\n const secondTab = tabsEl.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n let activeElement = rootNode.activeElement as Tab;\n expect(activeElement === firstTab, 'Focus first tab').to.be.true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n activeElement = rootNode.activeElement as Tab;\n expect(activeElement === secondTab, 'Focus second tab').to.be.true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(tabsEl.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n activeElement = rootNode.activeElement as Tab;\n expect(activeElement === firstTab, 'Focus first tab').to.be.true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(tabsEl.selected).to.be.equal('first');\n });\n it('accepts keyboard based selection - [direction=\"vertical\"]', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"Unknown\" direction=\"vertical\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n const firstTab = el.querySelector('[value=\"first\"]') as Tab;\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === secondTab, 'Focus second tab').to.be\n .true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowDownEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('selects through slotted DOM', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\"><span>Tab 2</span></sp-tab>\n </sp-tabs>\n `\n );\n const span = el.querySelector('span') as HTMLSpanElement;\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n\n span.click();\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n });\n it('updates selection indicator in response to tab updates', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\">Tab 2</sp-tab>\n </sp-tabs>\n `\n );\n const selected = el.querySelector('[value=\"first\"]') as Tab;\n await elementUpdated(el);\n\n const extractScaleX = /scaleX\\((.+)\\)/;\n const initialExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const initialWidth = parseFloat(initialExec[1]);\n let contentchanged = oneEvent(el, 'sp-tab-contentchange');\n selected.textContent = 'WWWWWWWWWWWWWWWWWWWWWWWWW';\n await contentchanged;\n await elementUpdated(el);\n\n const longerExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const longerWidth = parseFloat(longerExec[1]);\n expect(initialWidth).to.be.lessThan(longerWidth);\n contentchanged = oneEvent(el, 'sp-tab-contentchange');\n selected.textContent = 'W';\n await contentchanged;\n await elementUpdated(el);\n\n const shorterExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const shorterWidth = parseFloat(shorterExec[1]);\n expect(initialWidth).to.be.greaterThan(shorterWidth);\n expect(longerWidth).to.be.greaterThan(shorterWidth);\n });\n it('clicks on #list do not throw', async () => {\n const tabs = await createTabs();\n const tabList = (tabs.shadowRoot as ShadowRoot).querySelector(\n '#list'\n ) as HTMLDivElement;\n // exceptions thrown in event listeners do not propagate to caller\n // we must catch them with window.onerror\n let hasError = false;\n const oldOnerror = window.onerror;\n window.onerror = () => {\n hasError = true;\n };\n tabList.dispatchEvent(new MouseEvent('click'));\n expect(hasError, 'it should not error').to.be.false;\n window.onerror = oldOnerror;\n });\n});\n"]}
1
+ {"version":3,"file":"tabs.test.js","sourceRoot":"","sources":["tabs.test.ts"],"names":[],"mappings":"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","sourcesContent":["/*\nCopyright 2020 Adobe. All rights reserved.\nThis file is licensed to you under the Apache License, Version 2.0 (the \"License\");\nyou may not use this file except in compliance with the License. You may obtain a copy\nof the License at http://www.apache.org/licenses/LICENSE-2.0\n\nUnless required by applicable law or agreed to in writing, software distributed under\nthe License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\nOF ANY KIND, either express or implied. See the License for the specific language\ngoverning permissions and limitations under the License.\n*/\nimport '../sp-tabs.js';\nimport '../sp-tab.js';\nimport '../sp-tab-panel.js';\nimport { Tab, TabPanel, Tabs } from '../';\nimport '@spectrum-web-components/icons-workflow/icons/sp-icon-checkmark.js';\nimport {\n elementUpdated,\n expect,\n fixture,\n oneEvent,\n waitUntil,\n} from '@open-wc/testing';\nimport { html } from 'lit/static-html.js';\nimport { LitElement, TemplateResult } from '@spectrum-web-components/base';\nimport {\n arrowDownEvent,\n arrowLeftEvent,\n arrowRightEvent,\n arrowUpEvent,\n enterEvent,\n spaceEvent,\n} from '../../../test/testing-helpers.js';\nimport { sendKeys } from '@web/test-runner-commands';\n\nconst createTabs = async (): Promise<Tabs> => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n <sp-tab-panel value=\"first\">First tab content</sp-tab-panel>\n <sp-tab-panel value=\"second\">Second tab content</sp-tab-panel>\n <sp-tab-panel value=\"third\">Third tab content</sp-tab-panel>\n </sp-tabs>\n `\n );\n await elementUpdated(tabs);\n return tabs;\n};\n\ndescribe('Tabs', () => {\n it('loads accessibly', async () => {\n const tabs = await createTabs();\n\n const tabList = tabs.querySelectorAll('sp-tab');\n\n expect(tabList).to.exist;\n expect(tabList.length).to.equal(3);\n\n await expect(tabs).to.be.accessible();\n });\n\n it('loads accessibly w/o panels', async () => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\">Tab 2</sp-tab>\n <sp-tab value=\"third\">Tab 3</sp-tab>\n </sp-tabs>\n `\n );\n\n const tabList = tabs.querySelectorAll('sp-tab');\n\n expect(tabList).to.exist;\n expect(tabList.length).to.equal(3);\n\n await expect(tabs).to.be.accessible();\n });\n\n it('can be disabled', async () => {\n const tabs = await createTabs();\n const tab = tabs.querySelector('[label=\"Tab 3\"]') as Tab;\n tabs.disabled = true;\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n tab.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n });\n\n it('can have disabled sp-tab children', async () => {\n const tabs = await createTabs();\n const tab2 = tabs.querySelector('[label=\"Tab 2\"]') as Tab;\n const tab3 = tabs.querySelector('[label=\"Tab 3\"]') as Tab;\n tab3.disabled = true;\n await elementUpdated(tab3);\n expect(tabs.selected).to.equal('first');\n tab3.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('first');\n tab2.click();\n await elementUpdated(tabs);\n expect(tabs.selected).to.equal('second');\n });\n\n it('reflects selected tab with selected property', async () => {\n const tabs = await createTabs();\n\n const firstTab = tabs.querySelector('sp-tab[value=first]') as Tab;\n const secondTab = tabs.querySelector('sp-tab[value=second]') as Tab;\n const thirdTab = tabs.querySelector('sp-tab[value=third]') as Tab;\n const firstPanel = tabs.querySelector(\n 'sp-tab-panel[value=first]'\n ) as TabPanel;\n const secondPanel = tabs.querySelector(\n 'sp-tab-panel[value=second]'\n ) as TabPanel;\n const thirdPanel = tabs.querySelector(\n 'sp-tab-panel[value=third]'\n ) as TabPanel;\n\n expect(firstTab.selected, 'first: 1, selected').to.be.true;\n expect(firstPanel.selected, 'first panel: 1, selected').to.be.true;\n expect(secondTab.selected, 'second: 1, not selected').to.be.false;\n expect(secondPanel.selected, 'second panel: 1, not selected').to.be\n .false;\n expect(thirdTab.selected, 'third: 1, not selected').to.be.false;\n expect(thirdPanel.selected, 'third panel: 1, not selected').to.be.false;\n expect(tabs.selected).to.equal(firstTab.value);\n\n secondTab.click();\n await elementUpdated(tabs);\n\n expect(firstTab.selected, 'first: 2, not selected').to.be.false;\n expect(firstPanel.selected, 'first panel: 2, not selected').to.be.false;\n expect(secondTab.selected, 'second: 2, selected').to.be.true;\n expect(secondTab.selected, 'first panel: 2, selected').to.be.true;\n expect(thirdTab.selected, 'third: 2, not selected').to.be.false;\n expect(thirdTab.selected, 'first panel: 2, not selected').to.be.false;\n expect(tabs.selected).to.equal(secondTab.value);\n\n thirdTab.click();\n await elementUpdated(tabs);\n\n expect(firstTab.selected, 'first: 3, not selected').to.be.false;\n expect(firstPanel.selected, 'first panel: 3, not selected').to.be.false;\n expect(secondTab.selected, 'second: 3, not selected').to.be.false;\n expect(secondPanel.selected, 'second panel: 3, not selected').to.be\n .false;\n expect(thirdTab.selected, 'third: 3, selected').to.be.true;\n expect(thirdTab.selected, 'first panel: 3, selected').to.be.true;\n expect(tabs.selected).to.equal(thirdTab.value);\n });\n\n it('autofocuses', async () => {\n const tabs = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"second\" autofocus>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `\n );\n\n await elementUpdated(tabs);\n\n const autoElement = tabs.querySelector('[label=\"Tab 2\"]') as Tab;\n\n await waitUntil(\n () => document.activeElement === autoElement,\n 'Autofocused'\n );\n });\n\n it('auto', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"second\" auto>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `\n );\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n el.focus();\n await sendKeys({\n press: 'ArrowLeft',\n });\n expect(el.selected).to.equal('first');\n await sendKeys({\n press: 'ArrowLeft',\n });\n expect(el.selected).to.equal('third');\n await sendKeys({\n press: 'ArrowRight',\n });\n expect(el.selected).to.equal('first');\n });\n\n it('forces only one tab to be selected', async () => {\n const tabs = await createTabs();\n\n const selectedTabs = tabs.querySelectorAll('sp-tab[selected]');\n\n expect(tabs.selected).to.equal('first');\n expect(selectedTabs.length).to.equal(1);\n });\n\n it('de-selects all but first selected tab if multiple selected', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected).to.be.true;\n expect(tab2.selected).to.be.false;\n });\n\n it('ensures setting selection updates selected tab', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n const tab3 = tabs.querySelector('sp-tab[value=third]') as Tab;\n\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n if (!(tab3 instanceof Tab)) throw new Error('tab3 not of type Tab');\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected, 'first: 1, selected').to.be.true;\n expect(tab2.selected, 'second: 1, not selected').to.be.false;\n expect(tab3.selected, 'thurd: 1, not selected').to.be.false;\n\n tabs.selected = 'second';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('second');\n expect(tab1.selected, 'first: 2, not selected').to.be.false;\n expect(tab2.selected, 'second: 2, selected').to.be.true;\n expect(tab3.selected, 'third: 2, not selected').to.be.false;\n\n tabs.selected = 'third';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('third');\n expect(tab1.selected, 'first: 3, not selected').to.be.false;\n expect(tab2.selected, 'second: 3, not selected').to.be.false;\n expect(tab3.selected, 'third: 3, selected').to.be.true;\n });\n\n it('ensures setting selected and clicking on tab both work together', async () => {\n const tabs = await createTabs();\n\n const tab1 = tabs.querySelector('sp-tab[value=first]') as Tab;\n const tab2 = tabs.querySelector('sp-tab[value=second]') as Tab;\n const tab3 = tabs.querySelector('sp-tab[value=third]') as Tab;\n\n if (!(tab1 instanceof Tab)) throw new Error('tab1 not of type Tab');\n if (!(tab2 instanceof Tab)) throw new Error('tab2 not of type Tab');\n if (!(tab3 instanceof Tab)) throw new Error('tab3 not of type Tab');\n\n tab2.click();\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('second');\n expect(tab1.selected).to.be.false;\n expect(tab2.selected).to.be.true;\n expect(tab3.selected).to.be.false;\n\n tabs.selected = 'first';\n await elementUpdated(tabs);\n\n expect(tabs.selected).to.equal('first');\n expect(tab1.selected).to.be.true;\n expect(tab2.selected).to.be.false;\n expect(tab3.selected).to.be.false;\n });\n it('displays `vertical`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\" direction=\"vertical\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n el.selected = 'first';\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('displays with nothing `selected`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n <sp-tab label=\"Tab 3\" value=\"third\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n el.selected = 'first';\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('ignores children with no `value`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\">\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <div id=\"other\">Other thing</div>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n const otherThing = el.querySelector('#other') as HTMLDivElement;\n otherThing.click();\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('allows selection to be cancellable', async () => {\n const cancelSelection = (event: Event): void => event.preventDefault();\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"first\" @change=${cancelSelection}>\n <sp-tab label=\"Tab 1\" value=\"first\"></sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\"></sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n secondTab.click();\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('prevents [tabindex=0] while `focusin`', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs>\n <sp-tab label=\"Tab 1\" value=\"first\" selected>\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n\n const selected = el.querySelector('[value=\"first\"]') as Tab;\n const toBeSelected = el.querySelector('[value=\"second\"]') as Tab;\n\n await elementUpdated(el);\n await waitUntil(() => el.selected === 'first', 'wait for selection');\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(0);\n\n toBeSelected.dispatchEvent(new Event('focusin', { bubbles: true }));\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(-1);\n\n toBeSelected.dispatchEvent(new Event('focusout', { bubbles: true }));\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n expect(selected.tabIndex).to.equal(0);\n\n toBeSelected.click();\n\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n expect(toBeSelected.tabIndex).to.equal(0);\n });\n it('accepts keyboard based selection', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"Unknown\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n const firstTab = el.querySelector('[value=\"first\"]') as Tab;\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === secondTab, 'Focus second tab').to.be\n .true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n\n it('accepts keyboard based selection through shadow DOM', async () => {\n class TabTestEl extends LitElement {\n protected override render(): TemplateResult {\n return html`\n <sp-tabs selected=\"Unknown\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `;\n }\n }\n customElements.define('tab-test-el', TabTestEl);\n const el = await fixture<TabTestEl>(\n html`\n <tab-test-el></tab-test-el>\n `\n );\n\n await elementUpdated(el);\n const rootNode = el.shadowRoot as ShadowRoot;\n const tabsEl = rootNode.querySelector('sp-tabs') as Tabs;\n\n await elementUpdated(tabsEl);\n expect(tabsEl.selected).to.be.equal('');\n\n const firstTab = tabsEl.querySelector('[value=\"first\"]') as Tab;\n const secondTab = tabsEl.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n let activeElement = rootNode.activeElement as Tab;\n expect(activeElement === firstTab, 'Focus first tab').to.be.true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n activeElement = rootNode.activeElement as Tab;\n expect(activeElement === secondTab, 'Focus second tab').to.be.true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(tabsEl.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowRightEvent());\n\n await elementUpdated(el);\n activeElement = rootNode.activeElement as Tab;\n expect(activeElement === firstTab, 'Focus first tab').to.be.true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(tabsEl.selected).to.be.equal('first');\n });\n it('accepts keyboard based selection - [direction=\"vertical\"]', async () => {\n const el = await fixture<Tabs>(html`\n <sp-tabs selected=\"Unknown\" direction=\"vertical\">\n <sp-tab label=\"Tab 1\" value=\"first\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n <sp-tab label=\"Tab 2\" value=\"second\">\n <sp-icon-checkmark slot=\"icon\"></sp-icon-checkmark>\n </sp-tab>\n </sp-tabs>\n `);\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('');\n\n const firstTab = el.querySelector('[value=\"first\"]') as Tab;\n const secondTab = el.querySelector('[value=\"second\"]') as Tab;\n firstTab.dispatchEvent(new FocusEvent('focusin', { bubbles: true }));\n firstTab.focus();\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(arrowLeftEvent());\n firstTab.dispatchEvent(arrowUpEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === secondTab, 'Focus second tab').to.be\n .true;\n\n secondTab.dispatchEvent(enterEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('second');\n\n secondTab.dispatchEvent(arrowDownEvent());\n\n await elementUpdated(el);\n expect(document.activeElement === firstTab, 'Focus first tab').to.be\n .true;\n\n firstTab.dispatchEvent(spaceEvent());\n\n await elementUpdated(el);\n expect(el.selected).to.be.equal('first');\n });\n it('selects through slotted DOM', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\"><span>Tab 2</span></sp-tab>\n </sp-tabs>\n `\n );\n const span = el.querySelector('span') as HTMLSpanElement;\n await elementUpdated(el);\n\n expect(el.selected).to.equal('first');\n\n span.click();\n await elementUpdated(el);\n\n expect(el.selected).to.equal('second');\n });\n it('updates selection indicator in response to tab updates', async () => {\n const el = await fixture<Tabs>(\n html`\n <sp-tabs selected=\"first\">\n <sp-tab value=\"first\">Tab 1</sp-tab>\n <sp-tab value=\"second\">Tab 2</sp-tab>\n </sp-tabs>\n `\n );\n const selected = el.querySelector('[value=\"first\"]') as Tab;\n await elementUpdated(el);\n\n const extractScaleX = /scaleX\\((.+)\\)/;\n const initialExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const initialWidth = parseFloat(initialExec[1]);\n let contentchanged = oneEvent(el, 'sp-tab-contentchange');\n selected.textContent = 'WWWWWWWWWWWWWWWWWWWWWWWWW';\n await contentchanged;\n await elementUpdated(el);\n\n const longerExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const longerWidth = parseFloat(longerExec[1]);\n expect(initialWidth).to.be.lessThan(longerWidth);\n contentchanged = oneEvent(el, 'sp-tab-contentchange');\n selected.textContent = 'W';\n await contentchanged;\n await elementUpdated(el);\n\n const shorterExec = extractScaleX.exec(\n el.selectionIndicatorStyle\n ) as unknown as [string, string];\n const shorterWidth = parseFloat(shorterExec[1]);\n expect(initialWidth).to.be.greaterThan(shorterWidth);\n expect(longerWidth).to.be.greaterThan(shorterWidth);\n });\n it('clicks on #list do not throw', async () => {\n const tabs = await createTabs();\n const tabList = (tabs.shadowRoot as ShadowRoot).querySelector(\n '#list'\n ) as HTMLDivElement;\n // exceptions thrown in event listeners do not propagate to caller\n // we must catch them with window.onerror\n let hasError = false;\n const oldOnerror = window.onerror;\n window.onerror = () => {\n hasError = true;\n };\n tabList.dispatchEvent(new MouseEvent('click'));\n expect(hasError, 'it should not error').to.be.false;\n window.onerror = oldOnerror;\n });\n});\n"]}