@spectrum-web-components/table 0.0.2-table.2609

package/src/table.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table.css.js","sourceRoot":"","sources":["table.css.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,GAAG,EAAE,MAAM,+BAA+B,CAAC;AACpD,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAghBjB,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{border-collapse:separate;border-spacing:0}:host([size=s]){--spectrum-table-compact-quiet-border-radius:var(\n--spectrum-table-s-compact-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-compact-header-border-radius:var(\n--spectrum-table-s-compact-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-compact-cell-border-radius-key-focus:var(\n--spectrum-table-s-compact-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-compact-divider-border-size:var(\n--spectrum-table-s-compact-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-compact-header-text-size:var(\n--spectrum-table-s-compact-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-compact-header-text-font-weight:var(\n--spectrum-table-s-compact-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-compact-header-text-letter-spacing:var(\n--spectrum-table-s-compact-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-compact-header-text-line-height:var(\n--spectrum-table-s-compact-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-compact-header-sort-icon-gap:var(\n--spectrum-table-s-compact-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-compact-header-min-height:var(\n--spectrum-table-s-compact-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-compact-header-padding-top:var(\n--spectrum-table-s-compact-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-compact-header-padding-bottom:var(\n--spectrum-table-s-compact-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-compact-header-padding-left:var(\n--spectrum-table-s-compact-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-header-padding-right:var(\n--spectrum-table-s-compact-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-text-size:var(\n--spectrum-table-s-compact-cell-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-table-compact-cell-text-font-weight:var(\n--spectrum-table-s-compact-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-compact-cell-text-line-height:var(\n--spectrum-table-s-compact-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-compact-cell-checkbox-padding-right:var(\n--spectrum-table-s-compact-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-compact-cell-checkbox-vertical-alignment:var(\n--spectrum-table-s-compact-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-compact-cell-min-height:var(\n--spectrum-table-s-compact-cell-min-height,var(--spectrum-global-dimension-size-300)\n);--spectrum-table-compact-cell-padding-top:var(\n--spectrum-table-s-compact-cell-padding-top,var(--spectrum-global-dimension-size-50)\n);--spectrum-table-compact-cell-padding-bottom:var(\n--spectrum-table-s-compact-cell-padding-bottom,var(--spectrum-global-dimension-size-50)\n);--spectrum-table-compact-cell-padding-left:var(\n--spectrum-table-s-compact-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-padding-right:var(\n--spectrum-table-s-compact-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-vertical-alignment:var(\n--spectrum-table-s-compact-cell-vertical-alignment,top\n);--spectrum-table-compact-border-radius:var(\n--spectrum-table-s-compact-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-compact-border-size:var(\n--spectrum-table-s-compact-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-regular-quiet-border-radius:var(\n--spectrum-table-s-regular-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-regular-header-border-radius:var(\n--spectrum-table-s-regular-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-regular-cell-border-radius-key-focus:var(\n--spectrum-table-s-regular-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-regular-divider-border-size:var(\n--spectrum-table-s-regular-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-regular-header-text-size:var(\n--spectrum-table-s-regular-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-regular-header-text-font-weight:var(\n--spectrum-table-s-regular-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-regular-header-text-letter-spacing:var(\n--spectrum-table-s-regular-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-regular-header-text-line-height:var(\n--spectrum-table-s-regular-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-regular-header-sort-icon-gap:var(\n--spectrum-table-s-regular-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-regular-header-min-height:var(\n--spectrum-table-s-regular-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-regular-header-padding-top:var(\n--spectrum-table-s-regular-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-regular-header-padding-bottom:var(\n--spectrum-table-s-regular-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-regular-header-padding-left:var(\n--spectrum-table-s-regular-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-header-padding-right:var(\n--spectrum-table-s-regular-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-text-size:var(\n--spectrum-table-s-regular-cell-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-table-regular-cell-text-font-weight:var(\n--spectrum-table-s-regular-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-regular-cell-text-line-height:var(\n--spectrum-table-s-regular-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-regular-cell-checkbox-padding-right:var(\n--spectrum-table-s-regular-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-regular-cell-checkbox-vertical-alignment:var(\n--spectrum-table-s-regular-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-regular-cell-min-height:var(\n--spectrum-table-s-regular-cell-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-regular-cell-padding-top:var(\n--spectrum-table-s-regular-cell-padding-top,var(--spectrum-global-dimension-size-85)\n);--spectrum-table-regular-cell-padding-bottom:var(\n--spectrum-table-s-regular-cell-padding-bottom,var(--spectrum-global-dimension-size-85)\n);--spectrum-table-regular-cell-padding-left:var(\n--spectrum-table-s-regular-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-padding-right:var(\n--spectrum-table-s-regular-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-vertical-alignment:var(\n--spectrum-table-s-regular-cell-vertical-alignment,top\n);--spectrum-table-regular-border-radius:var(\n--spectrum-table-s-regular-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-regular-border-size:var(\n--spectrum-table-s-regular-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-spacious-quiet-border-radius:var(\n--spectrum-table-s-spacious-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-spacious-header-border-radius:var(\n--spectrum-table-s-spacious-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-spacious-cell-border-radius-key-focus:var(\n--spectrum-table-s-spacious-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-spacious-divider-border-size:var(\n--spectrum-table-s-spacious-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-spacious-header-text-size:var(\n--spectrum-table-s-spacious-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-spacious-header-text-font-weight:var(\n--spectrum-table-s-spacious-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-spacious-header-text-letter-spacing:var(\n--spectrum-table-s-spacious-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-spacious-header-text-line-height:var(\n--spectrum-table-s-spacious-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-spacious-header-sort-icon-gap:var(\n--spectrum-table-s-spacious-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-spacious-header-min-height:var(\n--spectrum-table-s-spacious-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-spacious-header-padding-top:var(\n--spectrum-table-s-spacious-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-spacious-header-padding-bottom:var(\n--spectrum-table-s-spacious-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-spacious-header-padding-left:var(\n--spectrum-table-s-spacious-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-header-padding-right:var(\n--spectrum-table-s-spacious-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-text-size:var(\n--spectrum-table-s-spacious-cell-text-size,var(--spectrum-global-dimension-font-size-75)\n);--spectrum-table-spacious-cell-text-font-weight:var(\n--spectrum-table-s-spacious-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-spacious-cell-text-line-height:var(\n--spectrum-table-s-spacious-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-spacious-cell-checkbox-padding-right:var(\n--spectrum-table-s-spacious-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-spacious-cell-checkbox-vertical-alignment:var(\n--spectrum-table-s-spacious-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-spacious-cell-min-height:var(\n--spectrum-table-s-spacious-cell-min-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-table-spacious-cell-padding-top:var(\n--spectrum-table-s-spacious-cell-padding-top,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-spacious-cell-padding-bottom:var(\n--spectrum-table-s-spacious-cell-padding-bottom,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-spacious-cell-padding-left:var(\n--spectrum-table-s-spacious-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-padding-right:var(\n--spectrum-table-s-spacious-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-vertical-alignment:var(\n--spectrum-table-s-spacious-cell-vertical-alignment,top\n);--spectrum-table-spacious-border-radius:var(\n--spectrum-table-s-spacious-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-spacious-border-size:var(\n--spectrum-table-s-spacious-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([size=m]){--spectrum-table-compact-quiet-border-radius:var(\n--spectrum-table-m-compact-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-compact-header-border-radius:var(\n--spectrum-table-m-compact-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-compact-cell-border-radius-key-focus:var(\n--spectrum-table-m-compact-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-compact-divider-border-size:var(\n--spectrum-table-m-compact-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-compact-header-text-size:var(\n--spectrum-table-m-compact-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-compact-header-text-font-weight:var(\n--spectrum-table-m-compact-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-compact-header-text-letter-spacing:var(\n--spectrum-table-m-compact-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-compact-header-text-line-height:var(\n--spectrum-table-m-compact-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-compact-header-sort-icon-gap:var(\n--spectrum-table-m-compact-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-compact-header-min-height:var(\n--spectrum-table-m-compact-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-compact-header-padding-top:var(\n--spectrum-table-m-compact-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-compact-header-padding-bottom:var(\n--spectrum-table-m-compact-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-compact-header-padding-left:var(\n--spectrum-table-m-compact-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-header-padding-right:var(\n--spectrum-table-m-compact-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-text-size:var(\n--spectrum-table-m-compact-cell-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-table-compact-cell-text-font-weight:var(\n--spectrum-table-m-compact-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-compact-cell-text-line-height:var(\n--spectrum-table-m-compact-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-compact-cell-checkbox-padding-right:var(\n--spectrum-table-m-compact-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-compact-cell-checkbox-vertical-alignment:var(\n--spectrum-table-m-compact-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-compact-cell-min-height:var(\n--spectrum-table-m-compact-cell-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-compact-cell-padding-top:var(\n--spectrum-table-m-compact-cell-padding-top,var(--spectrum-global-dimension-size-85)\n);--spectrum-table-compact-cell-padding-bottom:var(\n--spectrum-table-m-compact-cell-padding-bottom,var(--spectrum-global-dimension-size-85)\n);--spectrum-table-compact-cell-padding-left:var(\n--spectrum-table-m-compact-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-padding-right:var(\n--spectrum-table-m-compact-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-compact-cell-vertical-alignment:var(\n--spectrum-table-m-compact-cell-vertical-alignment,top\n);--spectrum-table-compact-border-radius:var(\n--spectrum-table-m-compact-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-compact-border-size:var(\n--spectrum-table-m-compact-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-regular-quiet-border-radius:var(\n--spectrum-table-m-regular-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-regular-header-border-radius:var(\n--spectrum-table-m-regular-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-regular-cell-border-radius-key-focus:var(\n--spectrum-table-m-regular-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-regular-divider-border-size:var(\n--spectrum-table-m-regular-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-regular-header-text-size:var(\n--spectrum-table-m-regular-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-regular-header-text-font-weight:var(\n--spectrum-table-m-regular-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-regular-header-text-letter-spacing:var(\n--spectrum-table-m-regular-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-regular-header-text-line-height:var(\n--spectrum-table-m-regular-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-regular-header-sort-icon-gap:var(\n--spectrum-table-m-regular-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-regular-header-min-height:var(\n--spectrum-table-m-regular-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-regular-header-padding-top:var(\n--spectrum-table-m-regular-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-regular-header-padding-bottom:var(\n--spectrum-table-m-regular-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-regular-header-padding-left:var(\n--spectrum-table-m-regular-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-header-padding-right:var(\n--spectrum-table-m-regular-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-text-size:var(\n--spectrum-table-m-regular-cell-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-table-regular-cell-text-font-weight:var(\n--spectrum-table-m-regular-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-regular-cell-text-line-height:var(\n--spectrum-table-m-regular-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-regular-cell-checkbox-padding-right:var(\n--spectrum-table-m-regular-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-regular-cell-checkbox-vertical-alignment:var(\n--spectrum-table-m-regular-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-regular-cell-min-height:var(\n--spectrum-table-m-regular-cell-min-height,var(--spectrum-global-dimension-size-500)\n);--spectrum-table-regular-cell-padding-top:var(\n--spectrum-table-m-regular-cell-padding-top,var(--spectrum-global-dimension-size-130)\n);--spectrum-table-regular-cell-padding-bottom:var(\n--spectrum-table-m-regular-cell-padding-bottom,var(--spectrum-global-dimension-size-130)\n);--spectrum-table-regular-cell-padding-left:var(\n--spectrum-table-m-regular-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-padding-right:var(\n--spectrum-table-m-regular-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-regular-cell-vertical-alignment:var(\n--spectrum-table-m-regular-cell-vertical-alignment,top\n);--spectrum-table-regular-border-radius:var(\n--spectrum-table-m-regular-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-regular-border-size:var(\n--spectrum-table-m-regular-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-spacious-quiet-border-radius:var(\n--spectrum-table-m-spacious-quiet-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-spacious-header-border-radius:var(\n--spectrum-table-m-spacious-header-border-radius,var(--spectrum-global-dimension-static-size-0)\n);--spectrum-table-spacious-cell-border-radius-key-focus:var(\n--spectrum-table-m-spacious-cell-border-radius-key-focus,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-spacious-divider-border-size:var(\n--spectrum-table-m-spacious-divider-border-size,var(--spectrum-alias-border-size-thin)\n);--spectrum-table-spacious-header-text-size:var(\n--spectrum-table-m-spacious-header-text-size,var(--spectrum-global-dimension-font-size-50)\n);--spectrum-table-spacious-header-text-font-weight:var(\n--spectrum-table-m-spacious-header-text-font-weight,var(--spectrum-alias-detail-text-font-weight-regular)\n);--spectrum-table-spacious-header-text-letter-spacing:var(\n--spectrum-table-m-spacious-header-text-letter-spacing,var(--spectrum-global-font-letter-spacing-medium)\n);--spectrum-table-spacious-header-text-line-height:var(\n--spectrum-table-m-spacious-header-text-line-height,var(--spectrum-alias-heading-text-line-height)\n);--spectrum-table-spacious-header-sort-icon-gap:var(\n--spectrum-table-m-spacious-header-sort-icon-gap,var(--spectrum-global-dimension-size-125)\n);--spectrum-table-spacious-header-min-height:var(\n--spectrum-table-m-spacious-header-min-height,var(--spectrum-global-dimension-size-400)\n);--spectrum-table-spacious-header-padding-top:var(\n--spectrum-table-m-spacious-header-padding-top,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-spacious-header-padding-bottom:var(\n--spectrum-table-m-spacious-header-padding-bottom,var(--spectrum-global-dimension-static-size-125)\n);--spectrum-table-spacious-header-padding-left:var(\n--spectrum-table-m-spacious-header-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-header-padding-right:var(\n--spectrum-table-m-spacious-header-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-text-size:var(\n--spectrum-table-m-spacious-cell-text-size,var(--spectrum-global-dimension-font-size-100)\n);--spectrum-table-spacious-cell-text-font-weight:var(\n--spectrum-table-m-spacious-cell-text-font-weight,var(--spectrum-alias-body-text-font-weight)\n);--spectrum-table-spacious-cell-text-line-height:var(\n--spectrum-table-m-spacious-cell-text-line-height,var(--spectrum-alias-component-text-line-height)\n);--spectrum-table-spacious-cell-checkbox-padding-right:var(\n--spectrum-table-m-spacious-cell-checkbox-padding-right,var(--spectrum-global-dimension-size-100)\n);--spectrum-table-spacious-cell-checkbox-vertical-alignment:var(\n--spectrum-table-m-spacious-cell-checkbox-vertical-alignment,middle\n);--spectrum-table-spacious-cell-min-height:var(\n--spectrum-table-m-spacious-cell-min-height,var(--spectrum-global-dimension-size-600)\n);--spectrum-table-spacious-cell-padding-top:var(\n--spectrum-table-m-spacious-cell-padding-top,var(--spectrum-global-dimension-size-185)\n);--spectrum-table-spacious-cell-padding-bottom:var(\n--spectrum-table-m-spacious-cell-padding-bottom,var(--spectrum-global-dimension-size-185)\n);--spectrum-table-spacious-cell-padding-left:var(\n--spectrum-table-m-spacious-cell-padding-left,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-padding-right:var(\n--spectrum-table-m-spacious-cell-padding-right,var(--spectrum-global-dimension-static-size-200)\n);--spectrum-table-spacious-cell-vertical-alignment:var(\n--spectrum-table-m-spacious-cell-vertical-alignment,top\n);--spectrum-table-spacious-border-radius:var(\n--spectrum-table-m-spacious-border-radius,var(--spectrum-alias-border-radius-regular)\n);--spectrum-table-spacious-border-size:var(\n--spectrum-table-m-spacious-border-size,var(--spectrum-alias-border-size-thin)\n)}:host([dir=ltr]) .spectrum-Table-headCell{text-align:left}:host([dir=rtl]) .spectrum-Table-headCell{text-align:right}:host([dir=ltr]) .spectrum-Table-headCell{padding-left:var(\n--spectrum-table-regular-header-padding-left\n);padding-right:var(--spectrum-table-regular-header-padding-right)}:host([dir=rtl]) .spectrum-Table-headCell{padding-left:var(--spectrum-table-regular-header-padding-right);padding-right:var(\n--spectrum-table-regular-header-padding-left\n)}.spectrum-Table-headCell{border-radius:var(--spectrum-table-regular-header-border-radius);box-sizing:border-box;cursor:default;font-size:var(--spectrum-table-regular-header-text-size);font-weight:var(--spectrum-table-regular-header-text-font-weight);letter-spacing:var(--spectrum-table-regular-header-text-letter-spacing);line-height:var(--spectrum-table-regular-header-text-line-height);min-height:var(--spectrum-table-regular-header-min-height);outline:0;padding-bottom:var(--spectrum-table-regular-header-padding-bottom);padding-top:var(--spectrum-table-regular-header-padding-top);text-transform:uppercase;transition:color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}.spectrum-Table-headCell.is-sortable{cursor:pointer}.spectrum-Table-cell--alignCenter{text-align:center}:host([dir=ltr]) .spectrum-Table-cell--alignRight{text-align:right}:host([dir=rtl]) .spectrum-Table-cell--alignRight{text-align:left}:host([dir=ltr]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}:host([dir=rtl]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=ltr]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=rtl]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}.spectrum-Table-row.is-drop-target:before,:host([density=compact]) .spectrum-Table-row.is-drop-target:before,:host([density=spacious]) .spectrum-Table-row.is-drop-target:before{bottom:0;content:\"\";position:absolute;top:0;z-index:1}::slotted(sp-table-body){border-radius:var(--spectrum-table-regular-border-radius);border-width:var(--spectrum-table-regular-border-size);overflow:auto;position:relative;vertical-align:var(--spectrum-table-regular-cell-vertical-alignment)}:host(:not(.spectrum-Table--quiet)) tbody::slotted(sp-table-body){border-radius:var(--spectrum-table-regular-border-radius);border-width:var(\n--spectrum-table-regular-border-size\n)}:host([dir=ltr]) .spectrum-Table-cell{padding-left:var(\n--spectrum-table-regular-cell-padding-left\n);padding-right:var(--spectrum-table-regular-cell-padding-right)}:host([dir=rtl]) .spectrum-Table-cell{padding-left:var(--spectrum-table-regular-cell-padding-right);padding-right:var(\n--spectrum-table-regular-cell-padding-left\n)}.spectrum-Table-cell{box-sizing:border-box;font-size:var(--spectrum-table-regular-cell-text-size);font-weight:var(--spectrum-table-regular-cell-text-font-weight);line-height:var(--spectrum-table-regular-cell-text-line-height);min-height:calc(var(--spectrum-table-regular-cell-min-height) - var(--spectrum-table-regular-cell-padding-top) - var(--spectrum-table-regular-cell-padding-bottom));padding-bottom:var(--spectrum-table-regular-cell-padding-bottom);padding-top:var(--spectrum-table-regular-cell-padding-top)}.spectrum-Table-cell,.spectrum-Table-headCell{position:relative}.spectrum-Table-cell.focus-visible,.spectrum-Table-cell.is-focused,.spectrum-Table-headCell.focus-visible,.spectrum-Table-headCell.is-focused{outline:none}.spectrum-Table-cell.is-focused,.spectrum-Table-cell:focus-visible,.spectrum-Table-headCell.is-focused,.spectrum-Table-headCell:focus-visible{outline:none}:host([dir=ltr]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=ltr]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell:focus-visible:before{right:0}:host([dir=rtl]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=rtl]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=ltr]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=ltr]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=rtl]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=rtl]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell:focus-visible:before{right:0}.spectrum-Table-cell.focus-visible:before,.spectrum-Table-cell.is-focused:before,.spectrum-Table-headCell.focus-visible:before,.spectrum-Table-headCell.is-focused:before{border-radius:calc(var(--spectrum-table-regular-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}.spectrum-Table-cell.is-focused:before,.spectrum-Table-cell:focus-visible:before,.spectrum-Table-headCell.is-focused:before,.spectrum-Table-headCell:focus-visible:before{border-radius:calc(var(--spectrum-table-regular-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([dir=ltr]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-regular-border-size\n)}:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-regular-border-size\n)}:host([dir=rtl]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-regular-border-size\n)}:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-regular-border-size\n)}:host([dir=ltr]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-regular-border-size\n)}:host([dir=ltr]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-regular-border-size\n)}:host([dir=rtl]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-regular-border-size\n)}:host([dir=rtl]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-regular-border-size\n)}.spectrum-Table-headCell.focus-visible:before,.spectrum-Table-headCell.is-focused:before{bottom:var(--spectrum-table-regular-border-size);top:var(\n--spectrum-table-regular-border-size\n)}.spectrum-Table-headCell.is-focused:before,.spectrum-Table-headCell:focus-visible:before{bottom:var(--spectrum-table-regular-border-size);top:var(\n--spectrum-table-regular-border-size\n)}:host([dir=ltr]) .spectrum-Table-cell--divider{border-right-width:var(\n--spectrum-table-regular-divider-border-size\n)}:host([dir=rtl]) .spectrum-Table-cell--divider{border-left-width:var(\n--spectrum-table-regular-divider-border-size\n)}.spectrum-Table-row{cursor:pointer;position:relative;transition:background-color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}.spectrum-Table-row:focus{outline:0}.spectrum-Table--quiet ::slotted(sp-table-body){border-radius:var(\n--spectrum-table-regular-quiet-border-radius\n)}.spectrum-Table--quiet .spectrum-Table-row.is-drop-target:before{border-radius:var(\n--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50)\n)}:host([dir=ltr]) .spectrum-Table-checkboxCell{padding-right:var(\n--spectrum-table-regular-cell-checkbox-padding-right\n)}:host([dir=rtl]) .spectrum-Table-checkboxCell{padding-left:var(\n--spectrum-table-regular-cell-checkbox-padding-right\n)}.spectrum-Table-checkboxCell{padding-bottom:0;padding-top:0;vertical-align:var(\n--spectrum-table-regular-cell-checkbox-vertical-alignment\n)}.spectrum-Table-checkbox{vertical-align:super}:host([dir=ltr][density=compact]) .spectrum-Table-headCell{text-align:left}:host([dir=rtl][density=compact]) .spectrum-Table-headCell{text-align:right}:host([dir=ltr][density=compact]) .spectrum-Table-headCell{padding-left:var(\n--spectrum-table-compact-header-padding-left\n);padding-right:var(--spectrum-table-compact-header-padding-right)}:host([dir=rtl][density=compact]) .spectrum-Table-headCell{padding-left:var(--spectrum-table-compact-header-padding-right);padding-right:var(\n--spectrum-table-compact-header-padding-left\n)}:host([density=compact]) .spectrum-Table-headCell{border-radius:var(--spectrum-table-compact-header-border-radius);box-sizing:border-box;cursor:default;font-size:var(--spectrum-table-compact-header-text-size);font-weight:var(--spectrum-table-compact-header-text-font-weight);letter-spacing:var(--spectrum-table-compact-header-text-letter-spacing);line-height:var(--spectrum-table-compact-header-text-line-height);min-height:var(--spectrum-table-compact-header-min-height);outline:0;padding-bottom:var(--spectrum-table-compact-header-padding-bottom);padding-top:var(--spectrum-table-compact-header-padding-top);text-transform:uppercase;transition:color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}:host([density=compact]) .spectrum-Table-headCell.is-sortable{cursor:pointer}:host([density=compact]) .spectrum-Table-cell--alignCenter{text-align:center}:host([dir=ltr][density=compact]) .spectrum-Table-cell--alignRight{text-align:right}:host([dir=rtl][density=compact]) .spectrum-Table-cell--alignRight{text-align:left}:host([dir=ltr][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}:host([dir=rtl][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=ltr][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=compact][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=rtl][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=compact][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}:host([density=compact]) .spectrum-Table-row.is-drop-target:before,:host([density=compact][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([density=compact][density=spacious]) .spectrum-Table-row.is-drop-target:before{bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([density=compact]) ::slotted(sp-table-body){border-radius:var(--spectrum-table-compact-border-radius);border-width:var(--spectrum-table-compact-border-size);overflow:auto;position:relative;vertical-align:var(--spectrum-table-compact-cell-vertical-alignment)}:host([density=compact]) .spectrum-Table:not(.spectrum-Table--quiet) tbody::slotted(sp-table-body){border-radius:var(--spectrum-table-compact-border-radius);border-width:var(\n--spectrum-table-compact-border-size\n)}:host([dir=ltr][density=compact]) .spectrum-Table-cell{padding-left:var(\n--spectrum-table-compact-cell-padding-left\n);padding-right:var(--spectrum-table-compact-cell-padding-right)}:host([dir=rtl][density=compact]) .spectrum-Table-cell{padding-left:var(--spectrum-table-compact-cell-padding-right);padding-right:var(\n--spectrum-table-compact-cell-padding-left\n)}:host([density=compact]) .spectrum-Table-cell{box-sizing:border-box;font-size:var(--spectrum-table-compact-cell-text-size);font-weight:var(--spectrum-table-compact-cell-text-font-weight);line-height:var(--spectrum-table-compact-cell-text-line-height);min-height:calc(var(--spectrum-table-compact-cell-min-height) - var(--spectrum-table-compact-cell-padding-top) - var(--spectrum-table-compact-cell-padding-bottom));padding-bottom:var(--spectrum-table-compact-cell-padding-bottom);padding-top:var(--spectrum-table-compact-cell-padding-top)}:host([density=compact]) .spectrum-Table-cell,:host([density=compact]) .spectrum-Table-headCell{position:relative}:host([density=compact]) .spectrum-Table-cell.focus-visible,:host([density=compact]) .spectrum-Table-cell.is-focused,:host([density=compact]) .spectrum-Table-headCell.focus-visible,:host([density=compact]) .spectrum-Table-headCell.is-focused{outline:none}:host([density=compact]) .spectrum-Table-cell.is-focused,:host([density=compact]) .spectrum-Table-cell:focus-visible,:host([density=compact]) .spectrum-Table-headCell.is-focused,:host([density=compact]) .spectrum-Table-headCell:focus-visible{outline:none}:host([dir=ltr][density=compact]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=ltr][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell:focus-visible:before{right:0}:host([dir=rtl][density=compact]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=rtl][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=ltr][density=compact]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=ltr][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=rtl][density=compact]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=rtl][density=compact]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell:focus-visible:before{right:0}:host([density=compact]) .spectrum-Table-cell.focus-visible:before,:host([density=compact]) .spectrum-Table-cell.is-focused:before,:host([density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([density=compact]) .spectrum-Table-headCell.is-focused:before{border-radius:calc(var(--spectrum-table-compact-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([density=compact]) .spectrum-Table-cell.is-focused:before,:host([density=compact]) .spectrum-Table-cell:focus-visible:before,:host([density=compact]) .spectrum-Table-headCell.is-focused:before,:host([density=compact]) .spectrum-Table-headCell:focus-visible:before{border-radius:calc(var(--spectrum-table-compact-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([dir=ltr][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-compact-border-size\n)}:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-compact-border-size\n)}:host([dir=rtl][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-compact-border-size\n)}:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-compact-border-size\n)}:host([dir=ltr][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-compact-border-size\n)}:host([dir=ltr][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=compact]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-compact-border-size\n)}:host([dir=rtl][density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-compact-border-size\n)}:host([dir=rtl][density=compact]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=compact]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-compact-border-size\n)}:host([density=compact]) .spectrum-Table-headCell.focus-visible:before,:host([density=compact]) .spectrum-Table-headCell.is-focused:before{bottom:var(--spectrum-table-compact-border-size);top:var(\n--spectrum-table-compact-border-size\n)}:host([density=compact]) .spectrum-Table-headCell.is-focused:before,:host([density=compact]) .spectrum-Table-headCell:focus-visible:before{bottom:var(--spectrum-table-compact-border-size);top:var(\n--spectrum-table-compact-border-size\n)}:host([dir=ltr][density=compact]) .spectrum-Table-cell--divider{border-right-width:var(\n--spectrum-table-compact-divider-border-size\n)}:host([dir=rtl][density=compact]) .spectrum-Table-cell--divider{border-left-width:var(\n--spectrum-table-compact-divider-border-size\n)}:host([density=compact]) .spectrum-Table-row{cursor:pointer;position:relative;transition:background-color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}:host([density=compact]) .spectrum-Table-row:focus{outline:0}:host([density=compact]) .spectrum-Table--quiet ::slotted(sp-table-body){border-radius:var(\n--spectrum-table-compact-quiet-border-radius\n)}:host([density=compact]) .spectrum-Table--quiet .spectrum-Table-row.is-drop-target:before{border-radius:var(\n--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50)\n)}:host([dir=ltr][density=compact]) .spectrum-Table-checkboxCell{padding-right:var(\n--spectrum-table-compact-cell-checkbox-padding-right\n)}:host([dir=rtl][density=compact]) .spectrum-Table-checkboxCell{padding-left:var(\n--spectrum-table-compact-cell-checkbox-padding-right\n)}:host([density=compact]) .spectrum-Table-checkboxCell{padding-bottom:0;padding-top:0;vertical-align:var(\n--spectrum-table-compact-cell-checkbox-vertical-alignment\n)}:host([density=compact]) .spectrum-Table-checkbox{vertical-align:super}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell{text-align:left}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell{text-align:right}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell{padding-left:var(\n--spectrum-table-spacious-header-padding-left\n);padding-right:var(--spectrum-table-spacious-header-padding-right)}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell{padding-left:var(--spectrum-table-spacious-header-padding-right);padding-right:var(\n--spectrum-table-spacious-header-padding-left\n)}:host([density=spacious]) .spectrum-Table-headCell{border-radius:var(--spectrum-table-spacious-header-border-radius);box-sizing:border-box;cursor:default;font-size:var(--spectrum-table-spacious-header-text-size);font-weight:var(--spectrum-table-spacious-header-text-font-weight);letter-spacing:var(--spectrum-table-spacious-header-text-letter-spacing);line-height:var(--spectrum-table-spacious-header-text-line-height);min-height:var(--spectrum-table-spacious-header-min-height);outline:0;padding-bottom:var(--spectrum-table-spacious-header-padding-bottom);padding-top:var(--spectrum-table-spacious-header-padding-top);text-transform:uppercase;transition:color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}:host([density=spacious]) .spectrum-Table-headCell.is-sortable{cursor:pointer}:host([density=spacious]) .spectrum-Table-cell--alignCenter{text-align:center}:host([dir=ltr][density=spacious]) .spectrum-Table-cell--alignRight{text-align:right}:host([dir=rtl][density=spacious]) .spectrum-Table-cell--alignRight{text-align:left}:host([dir=ltr][density=spacious]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}:host([dir=rtl][density=spacious]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=ltr][density=spacious]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=ltr][density=spacious][density=spacious]) .spectrum-Table-row.is-drop-target:before{right:0}:host([dir=rtl][density=spacious]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([dir=rtl][density=spacious][density=spacious]) .spectrum-Table-row.is-drop-target:before{left:0}:host([density=spacious]) .spectrum-Table-row.is-drop-target:before,:host([density=spacious][density=compact]) .spectrum-Table-row.is-drop-target:before,:host([density=spacious][density=spacious]) .spectrum-Table-row.is-drop-target:before{bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([density=spacious]) ::slotted(sp-table-body){border-radius:var(--spectrum-table-spacious-border-radius);border-width:var(--spectrum-table-spacious-border-size);overflow:auto;position:relative;vertical-align:var(--spectrum-table-spacious-cell-vertical-alignment)}:host([density=spacious]) .spectrum-Table:not(.spectrum-Table--quiet) tbody::slotted(sp-table-body){border-radius:var(--spectrum-table-spacious-border-radius);border-width:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-cell{padding-left:var(\n--spectrum-table-spacious-cell-padding-left\n);padding-right:var(--spectrum-table-spacious-cell-padding-right)}:host([dir=rtl][density=spacious]) .spectrum-Table-cell{padding-left:var(--spectrum-table-spacious-cell-padding-right);padding-right:var(\n--spectrum-table-spacious-cell-padding-left\n)}:host([density=spacious]) .spectrum-Table-cell{box-sizing:border-box;font-size:var(--spectrum-table-spacious-cell-text-size);font-weight:var(--spectrum-table-spacious-cell-text-font-weight);line-height:var(--spectrum-table-spacious-cell-text-line-height);min-height:calc(var(--spectrum-table-spacious-cell-min-height) - var(--spectrum-table-spacious-cell-padding-top) - var(--spectrum-table-spacious-cell-padding-bottom));padding-bottom:var(--spectrum-table-spacious-cell-padding-bottom);padding-top:var(--spectrum-table-spacious-cell-padding-top)}:host([density=spacious]) .spectrum-Table-cell,:host([density=spacious]) .spectrum-Table-headCell{position:relative}:host([density=spacious]) .spectrum-Table-cell.focus-visible,:host([density=spacious]) .spectrum-Table-cell.is-focused,:host([density=spacious]) .spectrum-Table-headCell.focus-visible,:host([density=spacious]) .spectrum-Table-headCell.is-focused{outline:none}:host([density=spacious]) .spectrum-Table-cell.is-focused,:host([density=spacious]) .spectrum-Table-cell:focus-visible,:host([density=spacious]) .spectrum-Table-headCell.is-focused,:host([density=spacious]) .spectrum-Table-headCell:focus-visible{outline:none}:host([dir=ltr][density=spacious]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=ltr][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell:focus-visible:before{right:0}:host([dir=rtl][density=spacious]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=rtl][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=ltr][density=spacious]) .spectrum-Table-cell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before{left:0}:host([dir=ltr][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-cell:focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell:focus-visible:before{left:0}:host([dir=rtl][density=spacious]) .spectrum-Table-cell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before{right:0}:host([dir=rtl][density=spacious]) .spectrum-Table-cell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-cell:focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell:focus-visible:before{right:0}:host([density=spacious]) .spectrum-Table-cell.focus-visible:before,:host([density=spacious]) .spectrum-Table-cell.is-focused:before,:host([density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([density=spacious]) .spectrum-Table-headCell.is-focused:before{border-radius:calc(var(--spectrum-table-spacious-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([density=spacious]) .spectrum-Table-cell.is-focused:before,:host([density=spacious]) .spectrum-Table-cell:focus-visible:before,:host([density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([density=spacious]) .spectrum-Table-headCell:focus-visible:before{border-radius:calc(var(--spectrum-table-spacious-cell-border-radius-key-focus) - 1px);bottom:0;content:\"\";position:absolute;top:0;z-index:1}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before{left:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=ltr][density=spacious]) .spectrum-Table-headCell:focus-visible:before{left:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before{right:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([dir=rtl][density=spacious]) .spectrum-Table-headCell:focus-visible:before{right:var(\n--spectrum-table-spacious-border-size\n)}:host([density=spacious]) .spectrum-Table-headCell.focus-visible:before,:host([density=spacious]) .spectrum-Table-headCell.is-focused:before{bottom:var(--spectrum-table-spacious-border-size);top:var(\n--spectrum-table-spacious-border-size\n)}:host([density=spacious]) .spectrum-Table-headCell.is-focused:before,:host([density=spacious]) .spectrum-Table-headCell:focus-visible:before{bottom:var(--spectrum-table-spacious-border-size);top:var(\n--spectrum-table-spacious-border-size\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-cell--divider{border-right-width:var(\n--spectrum-table-spacious-divider-border-size\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-cell--divider{border-left-width:var(\n--spectrum-table-spacious-divider-border-size\n)}:host([density=spacious]) .spectrum-Table-row{cursor:pointer;position:relative;transition:background-color var(--spectrum-global-animation-duration-100,.13s) ease-in-out}:host([density=spacious]) .spectrum-Table-row:focus{outline:0}:host([density=spacious]) .spectrum-Table--quiet ::slotted(sp-table-body){border-radius:var(\n--spectrum-table-spacious-quiet-border-radius\n)}:host([density=spacious]) .spectrum-Table--quiet .spectrum-Table-row.is-drop-target:before{border-radius:var(\n--spectrum-alias-border-radius-regular,var(--spectrum-global-dimension-size-50)\n)}:host([dir=ltr][density=spacious]) .spectrum-Table-checkboxCell{padding-right:var(\n--spectrum-table-spacious-cell-checkbox-padding-right\n)}:host([dir=rtl][density=spacious]) .spectrum-Table-checkboxCell{padding-left:var(\n--spectrum-table-spacious-cell-checkbox-padding-right\n)}:host([density=spacious]) .spectrum-Table-checkboxCell{padding-bottom:0;padding-top:0;vertical-align:var(\n--spectrum-table-spacious-cell-checkbox-vertical-alignment\n)}:host([density=spacious]) .spectrum-Table-checkbox{vertical-align:super}.spectrum-Table-headCell{background-color:var(\n--spectrum-table-m-regular-header-background-color,var(--spectrum-alias-background-color-transparent)\n);color:var(\n--spectrum-table-m-regular-header-text-color,var(--spectrum-alias-label-text-color)\n)}.spectrum-Table-headCell.is-sortable:hover{color:var(\n--spectrum-table-m-regular-header-text-color-hover,var(--spectrum-alias-text-color-hover)\n)}.spectrum-Table-headCell.is-sortable.focus-visible,.spectrum-Table-headCell.is-sortable.is-focused{color:var(\n--spectrum-table-m-regular-header-text-color-key-focus,var(--spectrum-alias-text-color-hover)\n)}.spectrum-Table-headCell.is-sortable.is-focused,.spectrum-Table-headCell.is-sortable:focus-visible{color:var(\n--spectrum-table-m-regular-header-text-color-key-focus,var(--spectrum-alias-text-color-hover)\n)}.spectrum-Table-headCell.is-sortable:active{color:var(\n--spectrum-table-m-regular-header-text-color-down,var(--spectrum-alias-text-color-down)\n)}.spectrum-Table-cell.focus-visible:before,.spectrum-Table-cell.is-focused:before,.spectrum-Table-headCell.focus-visible:before,.spectrum-Table-headCell.is-focused:before{box-shadow:inset 0 0 0 2px var(\n--spectrum-table-m-regular-cell-border-color-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}.spectrum-Table-cell.is-focused:before,.spectrum-Table-cell:focus-visible:before,.spectrum-Table-headCell.is-focused:before,.spectrum-Table-headCell:focus-visible:before{box-shadow:inset 0 0 0 2px var(\n--spectrum-table-m-regular-cell-border-color-key-focus,var(--spectrum-alias-border-color-key-focus)\n)}::slotted(sp-table-body){background-color:var(\n--spectrum-table-m-regular-background-color,var(--spectrum-global-color-gray-50)\n);border-color:var(\n--spectrum-table-m-regular-border-color,var(--spectrum-alias-border-color-mid)\n);border-style:solid}.spectrum-Table-row{background-color:var(\n--spectrum-table-m-regular-row-background-color,var(--spectrum-alias-background-color-transparent)\n);border-bottom:1px solid var(\n--spectrum-table-m-regular-border-color,var(--spectrum-alias-border-color-mid)\n)}.spectrum-Table-row:hover{background-color:var(\n--spectrum-table-m-regular-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table-row.focus-visible,.spectrum-Table-row.is-focused{background-color:var(\n--spectrum-table-m-regular-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table-row.is-focused,.spectrum-Table-row:focus-visible{background-color:var(\n--spectrum-table-m-regular-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table-row:active{background-color:var(\n--spectrum-table-m-regular-row-background-color-down,var(--spectrum-alias-highlight-down)\n)}.spectrum-Table-row.is-selected{background-color:var(\n--spectrum-table-m-regular-row-background-color-selected,var(--spectrum-alias-highlight-selected)\n)}.spectrum-Table-row.is-selected:hover{background-color:var(\n--spectrum-table-m-regular-row-background-color-selected-hover,var(--spectrum-alias-highlight-selected-hover)\n)}.spectrum-Table-row.is-selected.focus-visible,.spectrum-Table-row.is-selected.is-focused{background-color:var(\n--spectrum-table-m-regular-row-background-color-selected-key-focus,var(--spectrum-alias-highlight-selected-hover)\n)}.spectrum-Table-row.is-selected.is-focused,.spectrum-Table-row.is-selected:focus-visible{background-color:var(\n--spectrum-table-m-regular-row-background-color-selected-key-focus,var(--spectrum-alias-highlight-selected-hover)\n)}.spectrum-Table-row.is-drop-target:before{background-color:var(--spectrum-alias-highlight-selected);box-shadow:inset 0 0 0 2px var(\n--spectrum-alias-border-color-key-focus,var(--spectrum-global-color-blue-400)\n)}.spectrum-Table-cell{background-color:var(\n--spectrum-table-m-regular-cell-background-color,var(--spectrum-alias-background-color-transparent)\n);color:var(\n--spectrum-table-m-regular-cell-text-color,var(--spectrum-alias-text-color)\n)}:host([dir=ltr]) .spectrum-Table-cell--divider{border-right-style:solid}:host([dir=rtl]) .spectrum-Table-cell--divider{border-left-style:solid}:host([dir=ltr]) .spectrum-Table-cell--divider{border-right-color:var(\n--spectrum-table-m-regular-divider-border-color,var(--spectrum-alias-border-color-mid)\n)}:host([dir=rtl]) .spectrum-Table-cell--divider{border-left-color:var(\n--spectrum-table-m-regular-divider-border-color,var(--spectrum-alias-border-color-mid)\n)}.spectrum-Table--quiet ::slotted(sp-table-body){background-color:var(\n--spectrum-table-m-regular-quiet-cell-background-color,var(--spectrum-alias-background-color-transparent)\n);border-width:1px 0}.spectrum-Table--quiet .spectrum-Table-row{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color,var(--spectrum-alias-background-color-transparent)\n)}.spectrum-Table--quiet .spectrum-Table-row:hover{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table--quiet .spectrum-Table-row.focus-visible,.spectrum-Table--quiet .spectrum-Table-row.is-focused{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table--quiet .spectrum-Table-row.is-focused,.spectrum-Table--quiet .spectrum-Table-row:focus-visible{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-hover,var(--spectrum-alias-highlight-hover)\n)}.spectrum-Table--quiet .spectrum-Table-row:active{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-down,var(--spectrum-alias-highlight-down)\n)}.spectrum-Table--quiet .spectrum-Table-row.is-selected{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-selected,var(--spectrum-alias-highlight-selected)\n)}.spectrum-Table--quiet .spectrum-Table-row.is-selected:hover{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-selected-hover,var(--spectrum-alias-highlight-selected-hover)\n)}.spectrum-Table--quiet .spectrum-Table-row.is-selected.focus-visible,.spectrum-Table--quiet .spectrum-Table-row.is-selected.is-focused{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-selected-key-focus,var(--spectrum-alias-highlight-selected-hover)\n)}.spectrum-Table--quiet .spectrum-Table-row.is-selected.is-focused,.spectrum-Table--quiet .spectrum-Table-row.is-selected:focus-visible{background-color:var(\n--spectrum-table-m-regular-quiet-row-background-color-selected-key-focus,var(--spectrum-alias-highlight-selected-hover)\n)}:host{display:block}\n`;\nexport default styles;"]}

package/stories/index.js

@@ -0,0 +1,44 @@
+/*
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { html } from '@spectrum-web-components/base';
+export function makeItemsTwo(count) {
+    const total = count;
+    const items = [];
+    while (count) {
+        count--;
+        items.push({
+            name: String(total - count),
+            date: count,
+        });
+    }
+    return items;
+}
+export function makeItems(count) {
+    const total = count;
+    const items = [];
+    while (count) {
+        count--;
+        items.push({
+            name: String(total - count),
+            date: count,
+        });
+    }
+    return items;
+}
+export const renderItem = (item, index) => {
+    return html `
+        <sp-table-cell>Row Item ${item.name}</sp-table-cell>
+        <sp-table-cell>Row Item ${item.date}</sp-table-cell>
+        <sp-table-cell>Row Item ${index}</sp-table-cell>
+    `;
+};
+//# sourceMappingURL=index.js.map

package/stories/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AAEF,OAAO,EAAE,IAAI,EAAkB,MAAM,+BAA+B,CAAC;AAgBrE,MAAM,UAAU,YAAY,CAAC,KAAa;IACtC,MAAM,KAAK,GAAG,KAAK,CAAC;IACpB,MAAM,KAAK,GAAW,EAAE,CAAC;IACzB,OAAO,KAAK,EAAE;QACV,KAAK,EAAE,CAAC;QACR,KAAK,CAAC,IAAI,CAAC;YACP,IAAI,EAAE,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;YAC3B,IAAI,EAAE,KAAK;SACd,CAAC,CAAC;KACN;IACD,OAAO,KAAK,CAAC;AACjB,CAAC;AAED,MAAM,UAAU,SAAS,CAAC,KAAa;IAInC,MAAM,KAAK,GAAG,KAAK,CAAC;IACpB,MAAM,KAAK,GAGL,EAAE,CAAC;IACT,OAAO,KAAK,EAAE;QACV,KAAK,EAAE,CAAC;QACR,KAAK,CAAC,IAAI,CAAC;YACP,IAAI,EAAE,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;YAC3B,IAAI,EAAE,KAAK;SACd,CAAC,CAAC;KACN;IACD,OAAO,KAAK,CAAC;AACjB,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,IAAU,EAAE,KAAa,EAAkB,EAAE;IACpE,OAAO,IAAI,CAAA;kCACmB,IAAI,CAAC,IAAI;kCACT,IAAI,CAAC,IAAI;kCACT,KAAK;KAClC,CAAC;AACN,CAAC,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*/\n\nimport { html, TemplateResult } from '@spectrum-web-components/base';\n\nexport type Properties = {\n    selects?: undefined | 'single' | 'multiple';\n    onChange: (eventData: {\n        first: number;\n        last: number;\n        type: string;\n    }) => void;\n};\n\nexport interface Item extends Record<string, unknown> {\n    name: string;\n    date: number;\n}\n\nexport function makeItemsTwo(count: number): Item[] {\n    const total = count;\n    const items: Item[] = [];\n    while (count) {\n        count--;\n        items.push({\n            name: String(total - count),\n            date: count,\n        });\n    }\n    return items;\n}\n\nexport function makeItems(count: number): {\n    name: string;\n    date: number;\n}[] {\n    const total = count;\n    const items: {\n        name: string;\n        date: number;\n    }[] = [];\n    while (count) {\n        count--;\n        items.push({\n            name: String(total - count),\n            date: count,\n        });\n    }\n    return items;\n}\n\nexport const renderItem = (item: Item, index: number): TemplateResult => {\n    return html`\n        <sp-table-cell>Row Item ${item.name}</sp-table-cell>\n        <sp-table-cell>Row Item ${item.date}</sp-table-cell>\n        <sp-table-cell>Row Item ${index}</sp-table-cell>\n    `;\n};\n"]}

package/stories/table-elements.stories.js

@@ -0,0 +1,237 @@
+/* STORIES
+Copyright 2022 Adobe. All rights reserved.
+This file is licensed to you under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License. You may obtain a copy
+of the License at http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software distributed under
+the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+OF ANY KIND, either express or implied. See the License for the specific language
+governing permissions and limitations under the License.
+*/
+import { html } from '@spectrum-web-components/base';
+import '../sp-table.js';
+import '../sp-table-checkbox-cell.js';
+import '../sp-table-head.js';
+import '../sp-table-head-cell.js';
+import '../sp-table-body.js';
+import '../sp-table-row.js';
+import '../sp-table-cell.js';
+export default {
+    title: 'Table',
+    component: 'sp-table',
+};
+export const elements = () => {
+    return html `
+        <sp-table size="m">
+            <sp-table-head>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+            </sp-table-head>
+            <sp-table-body style="height: 120px">
+                <sp-table-row>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                </sp-table-row>
+            </sp-table-body>
+        </sp-table>
+    `;
+};
+export const selectsSingle = () => {
+    return html `
+        <sp-table
+            size="m"
+            selects="single"
+            .selected=${['row1']}
+            @change=${({ target }) => {
+        const next = target.nextElementSibling;
+        next.textContent = `Selected: ${JSON.stringify(target.selected)}`;
+    }}
+        >
+            <sp-table-head>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+            </sp-table-head>
+            <sp-table-body style="height: 120px">
+                <sp-table-row value="row1">
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row2">
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row3">
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row4">
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row5">
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                </sp-table-row>
+            </sp-table-body>
+        </sp-table>
+        <div>Selected: ["row1"]</div>
+    `;
+};
+export const selectsSingleWeird = () => {
+    return html `
+        <sp-table size="m" .selected=${['row1', 'row2']}>
+            <sp-table-head>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+            </sp-table-head>
+            <sp-table-body style="height: 120px">
+                <sp-table-row value="row1">
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row2">
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row3">
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row4">
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row5">
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                </sp-table-row>
+            </sp-table-body>
+        </sp-table>
+    `;
+};
+export const selectsMultiple = () => {
+    return html `
+        <sp-table
+            size="m"
+            selects="multiple"
+            .selected=${['row1', 'row2']}
+            @change=${({ target }) => {
+        const next = target.nextElementSibling;
+        next.textContent = `Selected: ${JSON.stringify(target.selected, null, ' ')}`;
+        const nextNext = next.nextElementSibling;
+        nextNext.textContent = `Selected Count: ${target.selected.length}`;
+    }}
+        >
+            <sp-table-head>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+                <sp-table-head-cell>Column Title</sp-table-head-cell>
+            </sp-table-head>
+            <sp-table-body style="height: 120px">
+                <sp-table-row value="row1">
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                    <sp-table-cell>Row Item Alpha</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row2">
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                    <sp-table-cell>Row Item Bravo</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row3">
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                    <sp-table-cell>Row Item Charlie</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row4">
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                    <sp-table-cell>Row Item Delta</sp-table-cell>
+                </sp-table-row>
+                <sp-table-row value="row5">
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                    <sp-table-cell>Row Item Echo</sp-table-cell>
+                </sp-table-row>
+            </sp-table-body>
+        </sp-table>
+        <div>Selected: ["row1", "row2"]</div>
+        <div>Selected Count: 2</div>
+    `;
+};
+// export const selectsMultipleAttributes = (): TemplateResult => {
+//     return html`
+//         <sp-table size="m" selects="multiple">
+//             <sp-table-head>
+//                 <sp-table-head-cell>
+//                     Column Title
+//                 </sp-table-head-cell>
+//                 <sp-table-head-cell>Column Title</sp-table-head-cell>
+//                 <sp-table-head-cell>Column Title</sp-table-head-cell>
+//             </sp-table-head>
+//             <sp-table-body style="height: 120px">
+//                 <sp-table-row value="row1" selected>
+//                     <sp-table-cell>Row Item Alpha</sp-table-cell>
+//                     <sp-table-cell>Row Item Alpha</sp-table-cell>
+//                     <sp-table-cell>Row Item Alpha</sp-table-cell>
+//                 </sp-table-row>
+//                 <sp-table-row value="row2">
+//                     <sp-table-cell>Row Item Bravo</sp-table-cell>
+//                     <sp-table-cell>Row Item Bravo</sp-table-cell>
+//                     <sp-table-cell>Row Item Bravo</sp-table-cell>
+//                 </sp-table-row>
+//                 <sp-table-row value="row3" selected>
+//                     <sp-table-cell>Row Item Charlie</sp-table-cell>
+//                     <sp-table-cell>Row Item Charlie</sp-table-cell>
+//                     <sp-table-cell>Row Item Charlie</sp-table-cell>
+//                 </sp-table-row>
+//                 <sp-table-row value="row4">
+//                     <sp-table-cell>Row Item Delta</sp-table-cell>
+//                     <sp-table-cell>Row Item Delta</sp-table-cell>
+//                     <sp-table-cell>Row Item Delta</sp-table-cell>
+//                 </sp-table-row>
+//                 <sp-table-row value="row5">
+//                     <sp-table-cell>Row Item Echo</sp-table-cell>
+//                     <sp-table-cell>Row Item Echo</sp-table-cell>
+//                     <sp-table-cell>Row Item Echo</sp-table-cell>
+//                 </sp-table-row>
+//             </sp-table-body>
+//         </sp-table>
+//     `;
+// };
+//# sourceMappingURL=table-elements.stories.js.map

package/stories/table-elements.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"table-elements.stories.js","sourceRoot":"","sources":["table-elements.stories.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;EAUE;AACF,OAAO,EAAE,IAAI,EAAkB,MAAM,+BAA+B,CAAC;AAErE,OAAO,gBAAgB,CAAC;AACxB,OAAO,8BAA8B,CAAC;AACtC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,0BAA0B,CAAC;AAClC,OAAO,qBAAqB,CAAC;AAC7B,OAAO,oBAAoB,CAAC;AAC5B,OAAO,qBAAqB,CAAC;AAG7B,eAAe;IACX,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,UAAU;CACxB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAmB,EAAE;IACzC,OAAO,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAmCV,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAmB,EAAE;IAC9C,OAAO,IAAI,CAAA;;;;wBAIS,CAAC,MAAM,CAAC;sBACV,CAAC,EAAE,MAAM,EAA6B,EAAE,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,CAAC,kBAAoC,CAAC;QACzD,IAAI,CAAC,WAAW,GAAG,aAAa,IAAI,CAAC,SAAS,CAC1C,MAAM,CAAC,QAAQ,CAClB,EAAE,CAAC;IACR,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoCR,CAAC;AACN,CAAC,CAAC;AACF,MAAM,CAAC,MAAM,kBAAkB,GAAG,GAAmB,EAAE;IACnD,OAAO,IAAI,CAAA;uCACwB,CAAC,MAAM,EAAE,MAAM,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkClD,CAAC;AACN,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAAG,GAAmB,EAAE;IAChD,OAAO,IAAI,CAAA;;;;wBAIS,CAAC,MAAM,EAAE,MAAM,CAAC;sBAClB,CAAC,EAAE,MAAM,EAA6B,EAAE,EAAE;QAChD,MAAM,IAAI,GAAG,MAAM,CAAC,kBAAoC,CAAC;QACzD,IAAI,CAAC,WAAW,GAAG,aAAa,IAAI,CAAC,SAAS,CAC1C,MAAM,CAAC,QAAQ,EACf,IAAI,EACJ,GAAG,CACN,EAAE,CAAC;QACJ,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAoC,CAAC;QAC3D,QAAQ,CAAC,WAAW,GAAG,mBAAmB,MAAM,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;IACvE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqCR,CAAC;AACN,CAAC,CAAC;AAEF,mEAAmE;AACnE,mBAAmB;AACnB,iDAAiD;AACjD,8BAA8B;AAC9B,uCAAuC;AACvC,mCAAmC;AACnC,wCAAwC;AACxC,wEAAwE;AACxE,wEAAwE;AACxE,+BAA+B;AAC/B,oDAAoD;AACpD,uDAAuD;AACvD,oEAAoE;AACpE,oEAAoE;AACpE,oEAAoE;AACpE,kCAAkC;AAClC,8CAA8C;AAC9C,oEAAoE;AACpE,oEAAoE;AACpE,oEAAoE;AACpE,kCAAkC;AAClC,uDAAuD;AACvD,sEAAsE;AACtE,sEAAsE;AACtE,sEAAsE;AACtE,kCAAkC;AAClC,8CAA8C;AAC9C,oEAAoE;AACpE,oEAAoE;AACpE,oEAAoE;AACpE,kCAAkC;AAClC,8CAA8C;AAC9C,mEAAmE;AACnE,mEAAmE;AACnE,mEAAmE;AACnE,kCAAkC;AAClC,+BAA+B;AAC/B,sBAAsB;AACtB,SAAS;AACT,KAAK","sourcesContent":["/* STORIES\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 { html, TemplateResult } from '@spectrum-web-components/base';\n\nimport '../sp-table.js';\nimport '../sp-table-checkbox-cell.js';\nimport '../sp-table-head.js';\nimport '../sp-table-head-cell.js';\nimport '../sp-table-body.js';\nimport '../sp-table-row.js';\nimport '../sp-table-cell.js';\nimport { Table } from '../src/Table.js';\n\nexport default {\n    title: 'Table',\n    component: 'sp-table',\n};\n\nexport const elements = (): TemplateResult => {\n    return html`\n        <sp-table size=\"m\">\n            <sp-table-head>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n            </sp-table-head>\n            <sp-table-body style=\"height: 120px\">\n                <sp-table-row>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                </sp-table-row>\n            </sp-table-body>\n        </sp-table>\n    `;\n};\n\nexport const selectsSingle = (): TemplateResult => {\n    return html`\n        <sp-table\n            size=\"m\"\n            selects=\"single\"\n            .selected=${['row1']}\n            @change=${({ target }: Event & { target: Table }) => {\n                const next = target.nextElementSibling as HTMLDivElement;\n                next.textContent = `Selected: ${JSON.stringify(\n                    target.selected\n                )}`;\n            }}\n        >\n            <sp-table-head>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n            </sp-table-head>\n            <sp-table-body style=\"height: 120px\">\n                <sp-table-row value=\"row1\">\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row2\">\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row3\">\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row4\">\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row5\">\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                </sp-table-row>\n            </sp-table-body>\n        </sp-table>\n        <div>Selected: [\"row1\"]</div>\n    `;\n};\nexport const selectsSingleWeird = (): TemplateResult => {\n    return html`\n        <sp-table size=\"m\" .selected=${['row1', 'row2']}>\n            <sp-table-head>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n            </sp-table-head>\n            <sp-table-body style=\"height: 120px\">\n                <sp-table-row value=\"row1\">\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row2\">\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row3\">\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row4\">\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row5\">\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                </sp-table-row>\n            </sp-table-body>\n        </sp-table>\n    `;\n};\n\nexport const selectsMultiple = (): TemplateResult => {\n    return html`\n        <sp-table\n            size=\"m\"\n            selects=\"multiple\"\n            .selected=${['row1', 'row2']}\n            @change=${({ target }: Event & { target: Table }) => {\n                const next = target.nextElementSibling as HTMLDivElement;\n                next.textContent = `Selected: ${JSON.stringify(\n                    target.selected,\n                    null,\n                    ' '\n                )}`;\n                const nextNext = next.nextElementSibling as HTMLDivElement;\n                nextNext.textContent = `Selected Count: ${target.selected.length}`;\n            }}\n        >\n            <sp-table-head>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n                <sp-table-head-cell>Column Title</sp-table-head-cell>\n            </sp-table-head>\n            <sp-table-body style=\"height: 120px\">\n                <sp-table-row value=\"row1\">\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                    <sp-table-cell>Row Item Alpha</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row2\">\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                    <sp-table-cell>Row Item Bravo</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row3\">\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                    <sp-table-cell>Row Item Charlie</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row4\">\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                    <sp-table-cell>Row Item Delta</sp-table-cell>\n                </sp-table-row>\n                <sp-table-row value=\"row5\">\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                    <sp-table-cell>Row Item Echo</sp-table-cell>\n                </sp-table-row>\n            </sp-table-body>\n        </sp-table>\n        <div>Selected: [\"row1\", \"row2\"]</div>\n        <div>Selected Count: 2</div>\n    `;\n};\n\n// export const selectsMultipleAttributes = (): TemplateResult => {\n//     return html`\n//         <sp-table size=\"m\" selects=\"multiple\">\n//             <sp-table-head>\n//                 <sp-table-head-cell>\n//                     Column Title\n//                 </sp-table-head-cell>\n//                 <sp-table-head-cell>Column Title</sp-table-head-cell>\n//                 <sp-table-head-cell>Column Title</sp-table-head-cell>\n//             </sp-table-head>\n//             <sp-table-body style=\"height: 120px\">\n//                 <sp-table-row value=\"row1\" selected>\n//                     <sp-table-cell>Row Item Alpha</sp-table-cell>\n//                     <sp-table-cell>Row Item Alpha</sp-table-cell>\n//                     <sp-table-cell>Row Item Alpha</sp-table-cell>\n//                 </sp-table-row>\n//                 <sp-table-row value=\"row2\">\n//                     <sp-table-cell>Row Item Bravo</sp-table-cell>\n//                     <sp-table-cell>Row Item Bravo</sp-table-cell>\n//                     <sp-table-cell>Row Item Bravo</sp-table-cell>\n//                 </sp-table-row>\n//                 <sp-table-row value=\"row3\" selected>\n//                     <sp-table-cell>Row Item Charlie</sp-table-cell>\n//                     <sp-table-cell>Row Item Charlie</sp-table-cell>\n//                     <sp-table-cell>Row Item Charlie</sp-table-cell>\n//                 </sp-table-row>\n//                 <sp-table-row value=\"row4\">\n//                     <sp-table-cell>Row Item Delta</sp-table-cell>\n//                     <sp-table-cell>Row Item Delta</sp-table-cell>\n//                     <sp-table-cell>Row Item Delta</sp-table-cell>\n//                 </sp-table-row>\n//                 <sp-table-row value=\"row5\">\n//                     <sp-table-cell>Row Item Echo</sp-table-cell>\n//                     <sp-table-cell>Row Item Echo</sp-table-cell>\n//                     <sp-table-cell>Row Item Echo</sp-table-cell>\n//                 </sp-table-row>\n//             </sp-table-body>\n//         </sp-table>\n//     `;\n// };\n"]}