@ds-mo/ui 14.26.0 → 14.27.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.package-ready.json +1 -1
- package/dist/agent-patterns.json +1 -1
- package/dist/agent.json +5 -5
- package/dist/components/ds-card-overview.js +1 -1
- package/dist/components/ds-score.js +1 -1
- package/dist/components/ds-table-group.js +1 -1
- package/dist/components/ds-table-group.js.map +1 -1
- package/dist/components/ds-table.js +1 -1
- package/dist/components/{p-DRyrcR2k.js → p-VT-5XDkB.js} +2 -2
- package/dist/components/p-VT-5XDkB.js.map +1 -0
- package/dist/docs/components.json +3 -3
- package/dist/mcp-data/registry/registry.json +4 -4
- package/dist/mcp-data/registry/score.json +1 -1
- package/dist/mcp-data/registry/table-group.json +5 -5
- package/dist/mcp-data/registry/table.json +1 -1
- package/dist/types/components/Table/table-types.d.ts +2 -0
- package/dist/types/components/TableGroup/TableGroup.d.ts +13 -3
- package/package.json +1 -1
- package/dist/components/p-DRyrcR2k.js.map +0 -1
package/dist/.package-ready.json
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.
|
|
1
|
+
{"schemaVersion":1,"package":"@ds-mo/ui","version":"14.27.0","components":79,"digest":"3f4a2aa3da16b2566ef7fbfbe59b6f6f9c44162f372b7a15ddd5e32a8eec04ff","completedAt":"2026-09-03T01:43:04.704Z"}
|
package/dist/agent-patterns.json
CHANGED
package/dist/agent.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"schemaVersion": "1.0.0",
|
|
3
3
|
"package": "@ds-mo/ui",
|
|
4
|
-
"packageVersion": "14.
|
|
4
|
+
"packageVersion": "14.27.0",
|
|
5
5
|
"kind": "components",
|
|
6
6
|
"entries": [
|
|
7
7
|
{
|
|
@@ -9807,12 +9807,12 @@
|
|
|
9807
9807
|
"tag": "ds-table-group",
|
|
9808
9808
|
"name": "table-group",
|
|
9809
9809
|
"title": "TableGroup",
|
|
9810
|
-
"summary": "Two-panel toolbar control for choosing one table grouping data point and the
|
|
9810
|
+
"summary": "Two-panel toolbar control for choosing one table grouping data point and the order of its group sections.",
|
|
9811
9811
|
"intentStatus": "complete",
|
|
9812
9812
|
"intent": {
|
|
9813
9813
|
"audience": "general",
|
|
9814
9814
|
"status": "stable",
|
|
9815
|
-
"summary": "Two-panel toolbar control for choosing one table grouping data point and the
|
|
9815
|
+
"summary": "Two-panel toolbar control for choosing one table grouping data point and the order of its group sections.",
|
|
9816
9816
|
"useWhen": [
|
|
9817
9817
|
"A table toolbar needs explicit control of one grouping level and its section order.",
|
|
9818
9818
|
"Grouping data-point labels differ from compact table-header labels."
|
|
@@ -9843,8 +9843,8 @@
|
|
|
9843
9843
|
"The right pane remains present before a group is active as one complete empty state without the Order heading, and explains that a group must be selected."
|
|
9844
9844
|
],
|
|
9845
9845
|
"states": [
|
|
9846
|
-
"options and grouping are controlled. dsGroupChange reports a complete TableGroupingState and dsClear requests null grouping without mutating either input.",
|
|
9847
|
-
"Selecting a new data point starts its order
|
|
9846
|
+
"options and grouping are controlled. A data option may supply product-owned orderOptions; otherwise Order defaults to Ascending and Descending. dsGroupChange reports a complete TableGroupingState and dsClear requests null grouping without mutating either input.",
|
|
9847
|
+
"Selecting a new data point starts at its first custom order option, or ascending when it has no custom order options. Re-selecting the active data point preserves its complete order state.",
|
|
9848
9848
|
"Selecting a data point or direction applies immediately and leaves the dialog open so the other pane can be changed."
|
|
9849
9849
|
],
|
|
9850
9850
|
"responsiveBehavior": [
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as r,c as i,f as o,h as s,a as d,t}from"./index.js";import{d as c}from"./p-DRyrcR2k.js";import{d as a}from"./p-Is1lFmwp.js";import{d as n}from"./p-DQQsS9Rx.js";import{d as v}from"./p-DW8ssbfI.js";import{r as l}from"./p-CochmPyg.js";import{T as f}from"./p-CUL5_8JM.js";function h(e){const r=Math.max(1,Math.floor(e.cellCount));const i=Math.max(1,e.minCellWidth);const o=Math.max(1,Math.floor(Math.max(0,e.availableWidth)/i));if(o>=r)return r;for(let e=o;e>=2;e-=1){if(r%e===0)return e}const s=Math.ceil(r/o);return Math.ceil(r/s)}function w(e){const r=Math.max(0,e.compactHeight);const i=Math.max(e.expandedHeight,r);const o=e.variant==="compact"||!Number.isFinite(e.progress)?0:Math.min(1,Math.max(0,e.progress));const s=Math.max(0,i-r);const d=s*o;return{active:o>0&&s>0,expandedHeight:i,offset:d,visibleHeight:i-d}}function u(e,r){const i=e.findIndex((e=>!e.isInactive));if(i<0)return-1;return e[r]&&!e[r].isInactive?r:i}function m(e,r,i){for(let o=1;o<=e.length;o+=1){const s=((r+i*o)%e.length+e.length)%e.length;if(!e[s]?.isInactive)return s}return-1}const p=()=>`@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-card-overview-h,.ds-interaction-fill.sc-ds-card-overview{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before,.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before{z-index:1}.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-card-overview-h,.ds-interaction-fill--bordered.sc-ds-card-overview{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-card-overview-h,.ds-interaction-fill--selected.sc-ds-card-overview{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-card-overview-h::after,.ds-interaction-fill--grouped.sc-ds-card-overview::after,.ds-interaction-fill--grouped.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-card-overview-h,.ds-interaction-fill--grouped.sc-ds-card-overview{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-card-overview-h>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill.sc-ds-card-overview>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill__content.sc-ds-card-overview{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-card-overview-h,.ds-interaction-fill--on-faint.sc-ds-card-overview{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-card-overview-h,.ds-interaction-fill--on-medium.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-card-overview-h,.ds-interaction-fill--on-bold.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-card-overview-h,.ds-interaction-fill--on-strong.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-card-overview-h,.ds-interaction-fill--on-translucent.sc-ds-card-overview{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-card-overview-h,.ds-interaction-fill--on-inverted.sc-ds-card-overview{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-card-overview-h,.ds-interaction-fill--on-media.sc-ds-card-overview{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-card-overview-h,.ds-interaction-fill--on-always-dark.sc-ds-card-overview{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-card-overview-h,.ds-interaction-fill--on-navigation.sc-ds-card-overview{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-card-overview-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-card-overview-h,.ds-focus-ring.sc-ds-card-overview,.ds-focus-ring-inset.sc-ds-card-overview-h,.ds-focus-ring-inset.sc-ds-card-overview{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-card-overview-h:focus-visible,.ds-focus-ring.sc-ds-card-overview:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-card-overview-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.ds-control--lg.sc-ds-card-overview,.ds-control--lg.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview,.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview,.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-card-overview-h,.ds-control--lg.sc-ds-card-overview{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-card-overview{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-card-overview{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-card-overview{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-card-overview{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-card-overview{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-card-overview{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-elevation.sc-ds-card-overview-h,.ds-control-elevation.sc-ds-card-overview{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-card-overview-h::after,.ds-control-elevation.sc-ds-card-overview::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-card-overview-h,.ds-control-elevation--sm.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-card-overview-h,.ds-control-elevation--md.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-card-overview-h,.ds-control-elevation--floating.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-card-overview{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-card-overview,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:none;transition:none}}.sc-ds-card-overview-h{display:block;box-sizing:border-box;container-type:inline-size;-webkit-user-select:none;user-select:none;--ds-card-overview-metric-min:calc(var(--dimension-size-400) * 5);--ds-card-overview-divider-width:var(--dimension-stroke-width-012);--ds-card-overview-divider-color:var(--color-always-dark-border-tertiary);color:var(--color-always-dark-foreground-primary)}.card-overview__surface.sc-ds-card-overview{width:100%;min-width:0;box-sizing:border-box;border-radius:var(--dimension-radius-125);background:var(--color-always-dark-background);color:var(--color-always-dark-foreground-primary);overflow-anchor:none}.card-overview__clip.sc-ds-card-overview{height:100%;min-width:0;border-radius:inherit;background:inherit;overflow:hidden}.card-overview--scroll-collapsing.sc-ds-card-overview-h{height:var(--ds-card-overview-expanded-height);pointer-events:none}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview{height:var(--ds-card-overview-visible-height);pointer-events:auto;will-change:height}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__body.sc-ds-card-overview{transform:translateY(calc(-1 * var(--ds-card-overview-content-offset)));will-change:transform}.card-overview__layout.sc-ds-card-overview{display:flex;flex-direction:column;min-width:0}.card-overview__summary.sc-ds-card-overview{position:relative;z-index:1;flex:0 0 auto;min-width:0;background:var(--color-always-dark-background)}.card-overview__header.sc-ds-card-overview{display:flex;position:relative;align-items:center;gap:0;width:100%;height:var(--dimension-size-600);min-width:0;padding:var(--dimension-space-100);box-sizing:border-box}.card-overview__header.sc-ds-card-overview::after{content:'';position:absolute;inset-inline:0;inset-block-end:0;height:var(--ds-card-overview-divider-width);background:var(--ds-card-overview-divider-color);pointer-events:none}.card-overview__period.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;gap:0;min-width:0;min-height:var(--ds-control-height);overflow:hidden;white-space:nowrap}.card-overview__period-current.sc-ds-card-overview,.card-overview__period-comparison.sc-ds-card-overview{min-width:0;overflow:hidden;text-overflow:ellipsis}.card-overview__period-current.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center}.card-overview__period-fixed.sc-ds-card-overview{flex:0 1 auto;min-width:0}.card-overview__period-comparison.sc-ds-card-overview{flex:0 0 auto}.card-overview__filter.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;min-width:0}.card-overview__body.sc-ds-card-overview{display:flex;position:relative;z-index:0;flex-direction:column;min-width:0;transform:translateY(0)}.card-overview__metrics.sc-ds-card-overview{display:grid;flex:1 1 auto;grid-template-columns:repeat( var(--ds-card-overview-grid-columns, auto-fit), minmax(min(100%, var(--ds-card-overview-metric-min)), 1fr) );align-content:stretch;min-width:0;overflow:clip}.card-overview__score.sc-ds-card-overview,.card-overview__metric.sc-ds-card-overview{display:flex;min-width:0;padding:var(--dimension-space-100);box-shadow:var(--ds-card-overview-divider-width) 0 0 0 var(--ds-card-overview-divider-color), 0 var(--ds-card-overview-divider-width) 0 0 var(--ds-card-overview-divider-color);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview,.card-overview__metric-action.sc-ds-card-overview{display:flex;flex:1 1 auto;min-width:0;padding:var(--dimension-space-075);border-radius:var(--dimension-radius-025);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview{align-items:center;justify-content:flex-start;padding-inline-start:var(--dimension-space-100);gap:var(--dimension-space-100)}.card-overview__score-copy.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--dimension-space-050);min-width:0}.card-overview__score-label-spacer.sc-ds-card-overview{visibility:hidden}.card-overview__score-content--error.sc-ds-card-overview{align-items:center;justify-content:center;padding-inline-start:var(--dimension-space-075);border:var(--ds-card-overview-divider-width) solid var(--color-always-dark-border-tertiary);background:transparent;color:var(--color-always-dark-foreground-negative);text-align:center}.card-overview__metric-action.sc-ds-card-overview{flex-direction:column;justify-content:center;gap:var(--dimension-space-050)}.card-overview__metric-action[role='button'].sc-ds-card-overview{cursor:default}.card-overview__metric-content.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;gap:var(--dimension-space-050);min-width:0}.card-overview__metric-label.sc-ds-card-overview{min-width:0}.card-overview__metric-figure.sc-ds-card-overview{display:flex;align-items:baseline;gap:var(--dimension-space-050);min-width:0}.card-overview__trend.sc-ds-card-overview{flex:0 0 auto;white-space:nowrap}.card-overview--stacked.sc-ds-card-overview-h .card-overview__metrics.sc-ds-card-overview{grid-template-columns:minmax(0, 1fr)}.card-overview--compact.sc-ds-card-overview-h{height:var(--dimension-size-600);min-height:var(--dimension-size-600)}.card-overview--compact.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__clip.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__layout.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__summary.sc-ds-card-overview{width:100%;height:100%}.card-overview--compact.sc-ds-card-overview-h .card-overview__header.sc-ds-card-overview::after{display:none}@media (forced-colors: active){.card-overview__header.sc-ds-card-overview::after{background:var(--ds-forced-color-content)}.card-overview__score-content--error.sc-ds-card-overview{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface);color:var(--ds-forced-color-content)}}`;const g="200px";const b=5;const _=7;const x={positive:"var(--color-always-dark-foreground-positive)",negative:"var(--color-always-dark-foreground-negative)",neutral:"var(--color-always-dark-foreground-secondary)"};const y="var(--color-always-dark-foreground-primary)";const k="var(--color-always-dark-foreground-secondary)";const z=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsMetricSelect=i(this,"dsMetricSelect",7);this.variant="default";this.layout="auto";this.periodLabel="";this.comparisonLabel="";this.metrics=[];this.metricMinWidth=g;this.isLoading=false;this.overviewLabel="Overview";this.scrollCollapseProgress=0;this.focusedMetricIndex=0;this.expandedHeight=0;this.layoutResizeObserver=null;this.handleMetricKeyDown=(e,r)=>{switch(e.key){case"ArrowRight":case"ArrowDown":e.preventDefault();this.moveFocus(r,1);break;case"ArrowLeft":case"ArrowUp":e.preventDefault();this.moveFocus(r,-1);break}}}componentDidLoad(){this.observeLayout()}componentDidRender(){if(!this.layoutResizeObserver||this.observedLayoutEl!==this.layoutEl){this.observeLayout()}else{this.updateLayoutGeometry()}}disconnectedCallback(){this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=null;if(this.layoutResizeFrame!==undefined)cancelAnimationFrame(this.layoutResizeFrame);this.layoutResizeFrame=undefined;this.observedLayoutEl=undefined}get visibleMetrics(){return this.metrics.slice(0,_)}get visibleCellCount(){const e=this.isLoading?this.loadingMetricCount:this.visibleMetrics.length;return 1+e}get loadingMetricCount(){return this.visibleMetrics.length||b}get resolvedScrollCollapseProgress(){if(this.variant==="compact"||!Number.isFinite(this.scrollCollapseProgress))return 0;return Math.min(1,Math.max(0,this.scrollCollapseProgress))}get scrollCollapseGeometry(){const e=l(f.size600,48);return w({variant:this.variant,progress:this.resolvedScrollCollapseProgress,expandedHeight:this.expandedHeight,compactHeight:e})}observeLayout(){const e=this.layoutEl;if(!e)return;const r=e.getBoundingClientRect();this.updateLayoutGeometry(r.width,r.height);if(typeof ResizeObserver==="undefined")return;this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=new ResizeObserver((e=>{const r=e[0]?.contentRect;if(!r)return;if(this.layoutResizeFrame!==undefined)cancelAnimationFrame(this.layoutResizeFrame);this.layoutResizeFrame=requestAnimationFrame((()=>{this.layoutResizeFrame=undefined;this.updateLayoutGeometry(r.width,r.height)}))}));this.layoutResizeObserver.observe(e);this.observedLayoutEl=e}updateLayoutGeometry(e,r){const i=this.layoutEl;if(!i)return;const s=e===undefined||r===undefined?i.getBoundingClientRect():null;const d=e??s?.width??0;const t=r??s?.height??0;let c=false;if(t>0&&Math.abs(t-this.expandedHeight)>=.5){this.expandedHeight=t;c=true}const a=h({cellCount:this.visibleCellCount,availableWidth:d,minCellWidth:l(this.metricMinWidth,g)});if(a!==this.gridColumns){this.gridColumns=a;c=true}if(this.gridColumns){this.el.style.setProperty("--ds-card-overview-grid-columns",String(this.gridColumns))}else{this.el.style.removeProperty("--ds-card-overview-grid-columns")}if(c)o(this)}get rovingIndex(){return u(this.visibleMetrics,this.focusedMetricIndex)}selectMetric(e,r){if(e.isInactive)return;this.focusedMetricIndex=r;this.dsMetricSelect.emit(e)}moveFocus(e,r){const i=this.visibleMetrics;const o=m(i,e,r<0?-1:1);if(o<0)return;this.focusedMetricIndex=o;const s=this.el.querySelectorAll(".card-overview__metric-action");s[o]?.focus()}bar(e,r,i){return s("ds-skeleton",{class:i,variant:"text",textVariant:e,width:r,background:"always-dark"})}renderTrend(e,r){if(!e)return null;return s("ds-text",{as:"span",class:{"card-overview__trend":true,"ds-control-label-box":true,[`card-overview__trend--${e.tone}`]:true},variant:r,color:x[e.tone],fontFeature:"tabular-nums"},e.direction==="up"?"↑":"↓"," ",e.value)}renderScore(){if(this.isLoading){return s("div",{class:"card-overview__score",part:"score"},s("div",{class:"card-overview__score-content"},s("ds-score",{size:"lg",isLoading:true}),s("div",{class:"card-overview__score-copy"},this.bar("text-body-small","64px","card-overview__score-label-spacer"),this.bar("text-body-medium","28px"))))}const e=this.scoreErrorMessage||(!this.score?"Score unavailable":undefined);if(e){return s("div",{class:"card-overview__score",part:"score"},s("ds-text",{as:"span",class:"card-overview__score-content card-overview__score-content--error",variant:"text-body-medium",color:"inherit",role:"alert"},e))}const r=this.score;if(!r)return null;return s("div",{class:"card-overview__score",part:"score"},s("div",{class:"card-overview__score-content"},s("ds-score",{size:"lg",value:r.value,level:r.level,label:"Safety score"}),s("div",{class:"card-overview__score-copy"},s("ds-text",{as:"span",class:"card-overview__score-label-spacer ds-control-label-box",variant:"text-body-small",color:k,"aria-hidden":"true"}," "),this.renderTrend(r.trend,"text-body-medium"))))}renderMetric(e,r){const i=!e.isInactive;const o=s("ds-text",{as:"span",class:"card-overview__metric-label ds-control-label-box",variant:"text-body-small",color:k},e.label);return s("div",{class:"card-overview__metric",part:"metric"},s("div",{class:{"card-overview__metric-action":true,"card-overview__metric-action--inactive":!i,"ds-interaction-fill":i,"ds-interaction-fill--on-always-dark":i,"ds-focus-ring-inset":i},role:i?"button":undefined,tabIndex:i&&r===this.rovingIndex?0:-1,onClick:()=>this.selectMetric(e,r),onKeyDown:e=>this.handleMetricKeyDown(e,r),onFocusin:()=>{if(i)this.focusedMetricIndex=r}},s("div",{class:"ds-interaction-fill__content card-overview__metric-content"},e.labelTooltip?s("ds-tooltip",{label:e.labelTooltip,side:"top",size:"sm"},o):o,s("div",{class:"card-overview__metric-figure"},s("ds-text",{as:"span",class:"card-overview__metric-value ds-control-label-box",variant:"text-body-medium",color:y,fontFeature:"tabular-nums"},e.value),this.renderTrend(e.trend,"text-body-medium")))))}renderMetrics(){if(this.isLoading){return[this.renderScore(),...Array.from({length:this.loadingMetricCount},((e,r)=>s("div",{class:"card-overview__metric",key:`loading-${r}`},s("div",{class:"card-overview__metric-action card-overview__metric-action--inactive"},s("div",{class:"card-overview__metric-content"},this.bar("text-body-small","35%","card-overview__metric-label"),s("div",{class:"card-overview__metric-figure"},this.bar("text-body-medium","40px"),this.bar("text-body-medium","28px")))))))]}return[this.renderScore(),...this.visibleMetrics.map(((e,r)=>this.renderMetric(e,r)))]}render(){const e=this.variant==="compact";const r=this.scrollCollapseGeometry;const i={"--ds-card-overview-metric-min":this.metricMinWidth};if(this.gridColumns){i["--ds-card-overview-grid-columns"]=String(this.gridColumns)}if(r.active){i["--ds-card-overview-expanded-height"]=`${r.expandedHeight}px`;i["--ds-card-overview-visible-height"]=`${r.visibleHeight}px`;i["--ds-card-overview-content-offset"]=`${r.offset}px`}return s(d,{key:"54755c8a6f30d8e20df24970a1bacf2c39645854",class:{"card-overview":true,"card-overview--compact":e,"card-overview--stacked":!e&&this.layout==="stacked","card-overview--scroll-collapsing":r.active},role:"region","aria-label":this.overviewLabel,"aria-busy":this.isLoading?"true":undefined,style:i},s("div",{key:"6e65d7857fcd734b2b83df6cc013bcf2c35e58da",class:{"card-overview__surface":true,"ds-control-elevation":true,"ds-control-elevation--sm":!e,"ds-control-elevation--floating":e}},s("div",{key:"4946137e8d8c2fdc256c54f36a19dd7eee1d6900",class:"card-overview__clip"},s("div",{key:"e9566934457d5ec39e9a8f57de39fbf086c1a3ae",ref:e=>{this.layoutEl=e??undefined},class:{"card-overview__layout":true}},s("div",{key:"f8bd0972b9e8231f0c643b7e53a11d81189b178f",class:"card-overview__summary"},s("div",{key:"3c06af5ba7a89971cacb372b7272452be3749084",class:"card-overview__header ds-control--md"},s("div",{key:"5355f90957577694712d22116cc3a86be9fd8fe4",class:"card-overview__period"},s("div",{key:"37eab4066bd81ee6e49e4468b09d4ce8b851d662",class:"card-overview__period-current"},s("slot",{key:"ab0a338de0cb59063365366136c4a999ed42e249",name:"period"},this.periodLabel&&s("div",{key:"5c99f2247066760c2aec5d120f8da8c24755e2fc",class:"card-overview__period-fixed ds-control-frame"},s("ds-text",{key:"4137061ed1a8e9332950d5cf492a25bd3707869d",as:"span",class:"ds-control-label-box",variant:"text-body-medium",emphasis:true,color:y},this.periodLabel)))),this.comparisonLabel&&s("ds-text",{key:"01d28b067c4bcf7fa96e4ba6371e2e48f776b0d2",as:"span",class:"card-overview__period-comparison ds-control-label-box",variant:"text-body-medium",color:k},this.comparisonLabel)),s("div",{key:"256f485cc9cab20bcd08bead2caa00d404923c7b",class:"card-overview__filter"},s("slot",{key:"ff8adb348cee85b451bf71d31c50afcba237c879",name:"filter"})))),!e&&s("div",{key:"3f063a4950699e098ec5c21979a790d5c3045c8e",class:"card-overview__body"},s("div",{key:"ca995655137c617d9d53838218a282607c2aced9",class:"card-overview__metrics",part:"metrics"},this.renderMetrics()),s("slot",{key:"7db3175528dcf5aaa3104a46b8a65627bc86b719",name:"footer"}))))))}get el(){return this}static get style(){return p()}},[262,"ds-card-overview",{variant:[1],layout:[1],score:[16],periodLabel:[1,"period-label"],comparisonLabel:[1,"comparison-label"],metrics:[16],metricMinWidth:[1,"metric-min-width"],isLoading:[4,"is-loading"],scoreErrorMessage:[1,"score-error-message"],overviewLabel:[1,"overview-label"],scrollCollapseProgress:[2,"scroll-collapse-progress"],focusedMetricIndex:[32],expandedHeight:[32],gridColumns:[32]}]);function M(){if(typeof customElements==="undefined"){return}const e=["ds-card-overview","ds-score","ds-skeleton","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-card-overview":if(!customElements.get(t(e))){customElements.define(t(e),z)}break;case"ds-score":if(!customElements.get(t(e))){c()}break;case"ds-skeleton":if(!customElements.get(t(e))){a()}break;case"ds-text":if(!customElements.get(t(e))){n()}break;case"ds-tooltip":if(!customElements.get(t(e))){v()}break}}))}M();const C=z;const j=M;export{C as DsCardOverview,j as defineCustomElement};
|
|
1
|
+
import{p as e,H as r,c as i,f as o,h as s,a as d,t}from"./index.js";import{d as c}from"./p-VT-5XDkB.js";import{d as a}from"./p-Is1lFmwp.js";import{d as n}from"./p-DQQsS9Rx.js";import{d as v}from"./p-DW8ssbfI.js";import{r as l}from"./p-CochmPyg.js";import{T as f}from"./p-CUL5_8JM.js";function h(e){const r=Math.max(1,Math.floor(e.cellCount));const i=Math.max(1,e.minCellWidth);const o=Math.max(1,Math.floor(Math.max(0,e.availableWidth)/i));if(o>=r)return r;for(let e=o;e>=2;e-=1){if(r%e===0)return e}const s=Math.ceil(r/o);return Math.ceil(r/s)}function w(e){const r=Math.max(0,e.compactHeight);const i=Math.max(e.expandedHeight,r);const o=e.variant==="compact"||!Number.isFinite(e.progress)?0:Math.min(1,Math.max(0,e.progress));const s=Math.max(0,i-r);const d=s*o;return{active:o>0&&s>0,expandedHeight:i,offset:d,visibleHeight:i-d}}function u(e,r){const i=e.findIndex((e=>!e.isInactive));if(i<0)return-1;return e[r]&&!e[r].isInactive?r:i}function m(e,r,i){for(let o=1;o<=e.length;o+=1){const s=((r+i*o)%e.length+e.length)%e.length;if(!e[s]?.isInactive)return s}return-1}const p=()=>`@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-card-overview-h,.ds-interaction-fill.sc-ds-card-overview{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before,.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-card-overview-h::before,.ds-interaction-fill.sc-ds-card-overview::before{z-index:1}.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-card-overview-h,.ds-interaction-fill--bordered.sc-ds-card-overview{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-card-overview-h,.ds-interaction-fill--selected.sc-ds-card-overview{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-card-overview-h::after,.ds-interaction-fill--grouped.sc-ds-card-overview::after,.ds-interaction-fill--grouped.sc-ds-card-overview-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-card-overview:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-card-overview-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-card-overview:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-card-overview-h,.ds-interaction-fill--grouped.sc-ds-card-overview{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-card-overview-h>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill.sc-ds-card-overview>.ds-interaction-fill__content.sc-ds-card-overview,.ds-interaction-fill__content.sc-ds-card-overview{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-card-overview-h,.ds-interaction-fill--on-faint.sc-ds-card-overview{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-card-overview-h,.ds-interaction-fill--on-medium.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-card-overview-h,.ds-interaction-fill--on-bold.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-card-overview-h,.ds-interaction-fill--on-strong.sc-ds-card-overview{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-card-overview-h,.ds-interaction-fill--on-translucent.sc-ds-card-overview{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-card-overview-h,.ds-interaction-fill--on-inverted.sc-ds-card-overview{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-card-overview-h,.ds-interaction-fill--on-media.sc-ds-card-overview{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-card-overview-h,.ds-interaction-fill--on-always-dark.sc-ds-card-overview{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-card-overview-h,.ds-interaction-fill--on-navigation.sc-ds-card-overview{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-card-overview-h::after,.ds-interaction-fill.sc-ds-card-overview::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-card-overview-h::before,.ds-interaction-fill--selected.sc-ds-card-overview::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-card-overview-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-card-overview:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-card-overview:root,.sc-ds-card-overview-h,.ds-forced-colors-scope.sc-ds-card-overview{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-card-overview-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-card-overview-h,.ds-focus-ring.sc-ds-card-overview,.ds-focus-ring-inset.sc-ds-card-overview-h,.ds-focus-ring-inset.sc-ds-card-overview{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-card-overview-h:focus-visible,.ds-focus-ring.sc-ds-card-overview:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-card-overview{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-card-overview-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-card-overview:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-card-overview::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-card-overview-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}.ds-control--lg.sc-ds-card-overview,.ds-control--lg.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview,.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview,.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-card-overview-h,.ds-control--lg.sc-ds-card-overview{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-card-overview-h,.ds-control--md.sc-ds-card-overview{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-card-overview-h,.ds-control--sm.sc-ds-card-overview{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-card-overview-h,.ds-control--xs.sc-ds-card-overview{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-control-frame.sc-ds-card-overview{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-card-overview{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-card-overview{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-card-overview{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-card-overview{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-card-overview{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-control-elevation.sc-ds-card-overview-h,.ds-control-elevation.sc-ds-card-overview{position:relative;overflow:visible;box-shadow:var(--ds-control-elevation-shadow, none)}.ds-control-elevation.sc-ds-card-overview-h::after,.ds-control-elevation.sc-ds-card-overview::after{content:'';position:absolute;inset:0;z-index:4;border-radius:inherit;box-shadow:var(--ds-control-elevation-highlight, none);pointer-events:none}.ds-control-elevation--sm.sc-ds-card-overview-h,.ds-control-elevation--sm.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-sm);--ds-control-elevation-highlight:var(--effect-highlight-elevated-sm)}.ds-control-elevation--md.sc-ds-card-overview-h,.ds-control-elevation--md.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-md);--ds-control-elevation-highlight:var(--effect-highlight-elevated-md)}.ds-control-elevation--floating.sc-ds-card-overview-h,.ds-control-elevation--floating.sc-ds-card-overview{--ds-control-elevation-shadow:var(--effect-shadow-elevated-floating);--ds-control-elevation-highlight:var(--effect-highlight-elevated-floating)}.ds-control-elevation--press-scale.sc-ds-card-overview{--ds-control-press-active-scale:var(--dimension-scale-default);transition:scale var(--effect-motion-short-2)}.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:var(--dimension-scale-subtle)}@media (prefers-reduced-motion: reduce){.ds-control-elevation--press-scale.sc-ds-card-overview,.ds-control-elevation--press-scale[data-ds-press-active].sc-ds-card-overview{scale:none;transition:none}}.sc-ds-card-overview-h{display:block;box-sizing:border-box;container-type:inline-size;-webkit-user-select:none;user-select:none;--ds-card-overview-metric-min:calc(var(--dimension-size-400) * 5);--ds-card-overview-divider-width:var(--dimension-stroke-width-012);--ds-card-overview-divider-color:var(--color-always-dark-border-tertiary);color:var(--color-always-dark-foreground-primary)}.card-overview__surface.sc-ds-card-overview{width:100%;min-width:0;box-sizing:border-box;border-radius:var(--dimension-radius-125);background:var(--color-always-dark-background);color:var(--color-always-dark-foreground-primary);overflow-anchor:none}.card-overview__clip.sc-ds-card-overview{height:100%;min-width:0;border-radius:inherit;background:inherit;overflow:hidden}.card-overview--scroll-collapsing.sc-ds-card-overview-h{height:var(--ds-card-overview-expanded-height);pointer-events:none}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview{height:var(--ds-card-overview-visible-height);pointer-events:auto;will-change:height}.card-overview--scroll-collapsing.sc-ds-card-overview-h .card-overview__body.sc-ds-card-overview{transform:translateY(calc(-1 * var(--ds-card-overview-content-offset)));will-change:transform}.card-overview__layout.sc-ds-card-overview{display:flex;flex-direction:column;min-width:0}.card-overview__summary.sc-ds-card-overview{position:relative;z-index:1;flex:0 0 auto;min-width:0;background:var(--color-always-dark-background)}.card-overview__header.sc-ds-card-overview{display:flex;position:relative;align-items:center;gap:0;width:100%;height:var(--dimension-size-600);min-width:0;padding:var(--dimension-space-100);box-sizing:border-box}.card-overview__header.sc-ds-card-overview::after{content:'';position:absolute;inset-inline:0;inset-block-end:0;height:var(--ds-card-overview-divider-width);background:var(--ds-card-overview-divider-color);pointer-events:none}.card-overview__period.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;gap:0;min-width:0;min-height:var(--ds-control-height);overflow:hidden;white-space:nowrap}.card-overview__period-current.sc-ds-card-overview,.card-overview__period-comparison.sc-ds-card-overview{min-width:0;overflow:hidden;text-overflow:ellipsis}.card-overview__period-current.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center}.card-overview__period-fixed.sc-ds-card-overview{flex:0 1 auto;min-width:0}.card-overview__period-comparison.sc-ds-card-overview{flex:0 0 auto}.card-overview__filter.sc-ds-card-overview{display:flex;flex:0 1 auto;align-items:center;min-width:0}.card-overview__body.sc-ds-card-overview{display:flex;position:relative;z-index:0;flex-direction:column;min-width:0;transform:translateY(0)}.card-overview__metrics.sc-ds-card-overview{display:grid;flex:1 1 auto;grid-template-columns:repeat( var(--ds-card-overview-grid-columns, auto-fit), minmax(min(100%, var(--ds-card-overview-metric-min)), 1fr) );align-content:stretch;min-width:0;overflow:clip}.card-overview__score.sc-ds-card-overview,.card-overview__metric.sc-ds-card-overview{display:flex;min-width:0;padding:var(--dimension-space-100);box-shadow:var(--ds-card-overview-divider-width) 0 0 0 var(--ds-card-overview-divider-color), 0 var(--ds-card-overview-divider-width) 0 0 var(--ds-card-overview-divider-color);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview,.card-overview__metric-action.sc-ds-card-overview{display:flex;flex:1 1 auto;min-width:0;padding:var(--dimension-space-075);border-radius:var(--dimension-radius-025);box-sizing:border-box}.card-overview__score-content.sc-ds-card-overview{align-items:center;justify-content:flex-start;padding-inline-start:var(--dimension-space-100);gap:var(--dimension-space-100)}.card-overview__score-copy.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--dimension-space-050);min-width:0}.card-overview__score-label-spacer.sc-ds-card-overview{visibility:hidden}.card-overview__score-content--error.sc-ds-card-overview{align-items:center;justify-content:center;padding-inline-start:var(--dimension-space-075);border:var(--ds-card-overview-divider-width) solid var(--color-always-dark-border-tertiary);background:transparent;color:var(--color-always-dark-foreground-negative);text-align:center}.card-overview__metric-action.sc-ds-card-overview{flex-direction:column;justify-content:center;gap:var(--dimension-space-050)}.card-overview__metric-action[role='button'].sc-ds-card-overview{cursor:default}.card-overview__metric-content.sc-ds-card-overview{display:flex;flex:1 1 auto;flex-direction:column;justify-content:center;gap:var(--dimension-space-050);min-width:0}.card-overview__metric-label.sc-ds-card-overview{min-width:0}.card-overview__metric-figure.sc-ds-card-overview{display:flex;align-items:baseline;gap:var(--dimension-space-050);min-width:0}.card-overview__trend.sc-ds-card-overview{flex:0 0 auto;white-space:nowrap}.card-overview--stacked.sc-ds-card-overview-h .card-overview__metrics.sc-ds-card-overview{grid-template-columns:minmax(0, 1fr)}.card-overview--compact.sc-ds-card-overview-h{height:var(--dimension-size-600);min-height:var(--dimension-size-600)}.card-overview--compact.sc-ds-card-overview-h .card-overview__surface.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__clip.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__layout.sc-ds-card-overview,.card-overview--compact.sc-ds-card-overview-h .card-overview__summary.sc-ds-card-overview{width:100%;height:100%}.card-overview--compact.sc-ds-card-overview-h .card-overview__header.sc-ds-card-overview::after{display:none}@media (forced-colors: active){.card-overview__header.sc-ds-card-overview::after{background:var(--ds-forced-color-content)}.card-overview__score-content--error.sc-ds-card-overview{border:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);background:var(--ds-forced-color-surface);color:var(--ds-forced-color-content)}}`;const g="200px";const b=5;const _=7;const x={positive:"var(--color-always-dark-foreground-positive)",negative:"var(--color-always-dark-foreground-negative)",neutral:"var(--color-always-dark-foreground-secondary)"};const y="var(--color-always-dark-foreground-primary)";const k="var(--color-always-dark-foreground-secondary)";const z=e(class e extends r{constructor(e){super();if(e!==false){this.__registerHost()}this.dsMetricSelect=i(this,"dsMetricSelect",7);this.variant="default";this.layout="auto";this.periodLabel="";this.comparisonLabel="";this.metrics=[];this.metricMinWidth=g;this.isLoading=false;this.overviewLabel="Overview";this.scrollCollapseProgress=0;this.focusedMetricIndex=0;this.expandedHeight=0;this.layoutResizeObserver=null;this.handleMetricKeyDown=(e,r)=>{switch(e.key){case"ArrowRight":case"ArrowDown":e.preventDefault();this.moveFocus(r,1);break;case"ArrowLeft":case"ArrowUp":e.preventDefault();this.moveFocus(r,-1);break}}}componentDidLoad(){this.observeLayout()}componentDidRender(){if(!this.layoutResizeObserver||this.observedLayoutEl!==this.layoutEl){this.observeLayout()}else{this.updateLayoutGeometry()}}disconnectedCallback(){this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=null;if(this.layoutResizeFrame!==undefined)cancelAnimationFrame(this.layoutResizeFrame);this.layoutResizeFrame=undefined;this.observedLayoutEl=undefined}get visibleMetrics(){return this.metrics.slice(0,_)}get visibleCellCount(){const e=this.isLoading?this.loadingMetricCount:this.visibleMetrics.length;return 1+e}get loadingMetricCount(){return this.visibleMetrics.length||b}get resolvedScrollCollapseProgress(){if(this.variant==="compact"||!Number.isFinite(this.scrollCollapseProgress))return 0;return Math.min(1,Math.max(0,this.scrollCollapseProgress))}get scrollCollapseGeometry(){const e=l(f.size600,48);return w({variant:this.variant,progress:this.resolvedScrollCollapseProgress,expandedHeight:this.expandedHeight,compactHeight:e})}observeLayout(){const e=this.layoutEl;if(!e)return;const r=e.getBoundingClientRect();this.updateLayoutGeometry(r.width,r.height);if(typeof ResizeObserver==="undefined")return;this.layoutResizeObserver?.disconnect();this.layoutResizeObserver=new ResizeObserver((e=>{const r=e[0]?.contentRect;if(!r)return;if(this.layoutResizeFrame!==undefined)cancelAnimationFrame(this.layoutResizeFrame);this.layoutResizeFrame=requestAnimationFrame((()=>{this.layoutResizeFrame=undefined;this.updateLayoutGeometry(r.width,r.height)}))}));this.layoutResizeObserver.observe(e);this.observedLayoutEl=e}updateLayoutGeometry(e,r){const i=this.layoutEl;if(!i)return;const s=e===undefined||r===undefined?i.getBoundingClientRect():null;const d=e??s?.width??0;const t=r??s?.height??0;let c=false;if(t>0&&Math.abs(t-this.expandedHeight)>=.5){this.expandedHeight=t;c=true}const a=h({cellCount:this.visibleCellCount,availableWidth:d,minCellWidth:l(this.metricMinWidth,g)});if(a!==this.gridColumns){this.gridColumns=a;c=true}if(this.gridColumns){this.el.style.setProperty("--ds-card-overview-grid-columns",String(this.gridColumns))}else{this.el.style.removeProperty("--ds-card-overview-grid-columns")}if(c)o(this)}get rovingIndex(){return u(this.visibleMetrics,this.focusedMetricIndex)}selectMetric(e,r){if(e.isInactive)return;this.focusedMetricIndex=r;this.dsMetricSelect.emit(e)}moveFocus(e,r){const i=this.visibleMetrics;const o=m(i,e,r<0?-1:1);if(o<0)return;this.focusedMetricIndex=o;const s=this.el.querySelectorAll(".card-overview__metric-action");s[o]?.focus()}bar(e,r,i){return s("ds-skeleton",{class:i,variant:"text",textVariant:e,width:r,background:"always-dark"})}renderTrend(e,r){if(!e)return null;return s("ds-text",{as:"span",class:{"card-overview__trend":true,"ds-control-label-box":true,[`card-overview__trend--${e.tone}`]:true},variant:r,color:x[e.tone],fontFeature:"tabular-nums"},e.direction==="up"?"↑":"↓"," ",e.value)}renderScore(){if(this.isLoading){return s("div",{class:"card-overview__score",part:"score"},s("div",{class:"card-overview__score-content"},s("ds-score",{size:"lg",isLoading:true}),s("div",{class:"card-overview__score-copy"},this.bar("text-body-small","64px","card-overview__score-label-spacer"),this.bar("text-body-medium","28px"))))}const e=this.scoreErrorMessage||(!this.score?"Score unavailable":undefined);if(e){return s("div",{class:"card-overview__score",part:"score"},s("ds-text",{as:"span",class:"card-overview__score-content card-overview__score-content--error",variant:"text-body-medium",color:"inherit",role:"alert"},e))}const r=this.score;if(!r)return null;return s("div",{class:"card-overview__score",part:"score"},s("div",{class:"card-overview__score-content"},s("ds-score",{size:"lg",value:r.value,level:r.level,label:"Safety score"}),s("div",{class:"card-overview__score-copy"},s("ds-text",{as:"span",class:"card-overview__score-label-spacer ds-control-label-box",variant:"text-body-small",color:k,"aria-hidden":"true"}," "),this.renderTrend(r.trend,"text-body-medium"))))}renderMetric(e,r){const i=!e.isInactive;const o=s("ds-text",{as:"span",class:"card-overview__metric-label ds-control-label-box",variant:"text-body-small",color:k},e.label);return s("div",{class:"card-overview__metric",part:"metric"},s("div",{class:{"card-overview__metric-action":true,"card-overview__metric-action--inactive":!i,"ds-interaction-fill":i,"ds-interaction-fill--on-always-dark":i,"ds-focus-ring-inset":i},role:i?"button":undefined,tabIndex:i&&r===this.rovingIndex?0:-1,onClick:()=>this.selectMetric(e,r),onKeyDown:e=>this.handleMetricKeyDown(e,r),onFocusin:()=>{if(i)this.focusedMetricIndex=r}},s("div",{class:"ds-interaction-fill__content card-overview__metric-content"},e.labelTooltip?s("ds-tooltip",{label:e.labelTooltip,side:"top",size:"sm"},o):o,s("div",{class:"card-overview__metric-figure"},s("ds-text",{as:"span",class:"card-overview__metric-value ds-control-label-box",variant:"text-body-medium",color:y,fontFeature:"tabular-nums"},e.value),this.renderTrend(e.trend,"text-body-medium")))))}renderMetrics(){if(this.isLoading){return[this.renderScore(),...Array.from({length:this.loadingMetricCount},((e,r)=>s("div",{class:"card-overview__metric",key:`loading-${r}`},s("div",{class:"card-overview__metric-action card-overview__metric-action--inactive"},s("div",{class:"card-overview__metric-content"},this.bar("text-body-small","35%","card-overview__metric-label"),s("div",{class:"card-overview__metric-figure"},this.bar("text-body-medium","40px"),this.bar("text-body-medium","28px")))))))]}return[this.renderScore(),...this.visibleMetrics.map(((e,r)=>this.renderMetric(e,r)))]}render(){const e=this.variant==="compact";const r=this.scrollCollapseGeometry;const i={"--ds-card-overview-metric-min":this.metricMinWidth};if(this.gridColumns){i["--ds-card-overview-grid-columns"]=String(this.gridColumns)}if(r.active){i["--ds-card-overview-expanded-height"]=`${r.expandedHeight}px`;i["--ds-card-overview-visible-height"]=`${r.visibleHeight}px`;i["--ds-card-overview-content-offset"]=`${r.offset}px`}return s(d,{key:"54755c8a6f30d8e20df24970a1bacf2c39645854",class:{"card-overview":true,"card-overview--compact":e,"card-overview--stacked":!e&&this.layout==="stacked","card-overview--scroll-collapsing":r.active},role:"region","aria-label":this.overviewLabel,"aria-busy":this.isLoading?"true":undefined,style:i},s("div",{key:"6e65d7857fcd734b2b83df6cc013bcf2c35e58da",class:{"card-overview__surface":true,"ds-control-elevation":true,"ds-control-elevation--sm":!e,"ds-control-elevation--floating":e}},s("div",{key:"4946137e8d8c2fdc256c54f36a19dd7eee1d6900",class:"card-overview__clip"},s("div",{key:"e9566934457d5ec39e9a8f57de39fbf086c1a3ae",ref:e=>{this.layoutEl=e??undefined},class:{"card-overview__layout":true}},s("div",{key:"f8bd0972b9e8231f0c643b7e53a11d81189b178f",class:"card-overview__summary"},s("div",{key:"3c06af5ba7a89971cacb372b7272452be3749084",class:"card-overview__header ds-control--md"},s("div",{key:"5355f90957577694712d22116cc3a86be9fd8fe4",class:"card-overview__period"},s("div",{key:"37eab4066bd81ee6e49e4468b09d4ce8b851d662",class:"card-overview__period-current"},s("slot",{key:"ab0a338de0cb59063365366136c4a999ed42e249",name:"period"},this.periodLabel&&s("div",{key:"5c99f2247066760c2aec5d120f8da8c24755e2fc",class:"card-overview__period-fixed ds-control-frame"},s("ds-text",{key:"4137061ed1a8e9332950d5cf492a25bd3707869d",as:"span",class:"ds-control-label-box",variant:"text-body-medium",emphasis:true,color:y},this.periodLabel)))),this.comparisonLabel&&s("ds-text",{key:"01d28b067c4bcf7fa96e4ba6371e2e48f776b0d2",as:"span",class:"card-overview__period-comparison ds-control-label-box",variant:"text-body-medium",color:k},this.comparisonLabel)),s("div",{key:"256f485cc9cab20bcd08bead2caa00d404923c7b",class:"card-overview__filter"},s("slot",{key:"ff8adb348cee85b451bf71d31c50afcba237c879",name:"filter"})))),!e&&s("div",{key:"3f063a4950699e098ec5c21979a790d5c3045c8e",class:"card-overview__body"},s("div",{key:"ca995655137c617d9d53838218a282607c2aced9",class:"card-overview__metrics",part:"metrics"},this.renderMetrics()),s("slot",{key:"7db3175528dcf5aaa3104a46b8a65627bc86b719",name:"footer"}))))))}get el(){return this}static get style(){return p()}},[262,"ds-card-overview",{variant:[1],layout:[1],score:[16],periodLabel:[1,"period-label"],comparisonLabel:[1,"comparison-label"],metrics:[16],metricMinWidth:[1,"metric-min-width"],isLoading:[4,"is-loading"],scoreErrorMessage:[1,"score-error-message"],overviewLabel:[1,"overview-label"],scrollCollapseProgress:[2,"scroll-collapse-progress"],focusedMetricIndex:[32],expandedHeight:[32],gridColumns:[32]}]);function M(){if(typeof customElements==="undefined"){return}const e=["ds-card-overview","ds-score","ds-skeleton","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-card-overview":if(!customElements.get(t(e))){customElements.define(t(e),z)}break;case"ds-score":if(!customElements.get(t(e))){c()}break;case"ds-skeleton":if(!customElements.get(t(e))){a()}break;case"ds-text":if(!customElements.get(t(e))){n()}break;case"ds-tooltip":if(!customElements.get(t(e))){v()}break}}))}M();const C=z;const j=M;export{C as DsCardOverview,j as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-card-overview.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{S as o,d as s}from"./p-
|
|
1
|
+
import{S as o,d as s}from"./p-VT-5XDkB.js";const t=o;const p=s;export{t as DsScore,p as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-score.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as e,H as o,c as i,h as t,a as s,t as r}from"./index.js";import{A as n,r as a}from"./p-DjF2m7bf.js";import{r as d,A as c}from"./p-etg-Uk1u.js";import{d as l,C as p}from"./p-BEttT0UB.js";import{d as u}from"./p-BMzn2Cmw.js";import{d as g}from"./p-6_CNVbqa.js";import{d as h}from"./p-BVz-r3g0.js";import{d as b}from"./p-Cea7rROU.js";import{d as f}from"./p-to8BxxgT.js";import{d as v}from"./p-0XTyQNRG.js";import{d as m}from"./p-DQQsS9Rx.js";import{d as x}from"./p-DW8ssbfI.js";import{r as w}from"./p-CochmPyg.js";import{a as y,T as _,b as k}from"./p-CUL5_8JM.js";const z=()=>`@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-table-group-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-table-group-h,.ds-focus-ring.sc-ds-table-group,.ds-focus-ring-inset.sc-ds-table-group-h,.ds-focus-ring-inset.sc-ds-table-group{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-table-group-h:focus-visible,.ds-focus-ring.sc-ds-table-group:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-table-group-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-table-group{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-table-group-h:focus-visible,.ds-focus-ring-inset.sc-ds-table-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-table-group-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-table-group:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-table-group-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-table-group-h,.ds-interaction-fill.sc-ds-table-group{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before,.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before{z-index:1}.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-table-group-h,.ds-interaction-fill--bordered.sc-ds-table-group{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-table-group-h,.ds-interaction-fill--selected.sc-ds-table-group{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-table-group-h::after,.ds-interaction-fill--grouped.sc-ds-table-group::after,.ds-interaction-fill--grouped.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-table-group-h,.ds-interaction-fill--grouped.sc-ds-table-group{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-table-group-h>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill.sc-ds-table-group>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill__content.sc-ds-table-group{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-table-group-h,.ds-interaction-fill--on-faint.sc-ds-table-group{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-table-group-h,.ds-interaction-fill--on-medium.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-table-group-h,.ds-interaction-fill--on-bold.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-table-group-h,.ds-interaction-fill--on-strong.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-table-group-h,.ds-interaction-fill--on-translucent.sc-ds-table-group{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-table-group-h,.ds-interaction-fill--on-inverted.sc-ds-table-group{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-table-group-h,.ds-interaction-fill--on-media.sc-ds-table-group{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-table-group-h,.ds-interaction-fill--on-always-dark.sc-ds-table-group{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-table-group-h,.ds-interaction-fill--on-navigation.sc-ds-table-group{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-table-group-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-table-group:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-table-group,.ds-control--lg.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group,.ds-control--sm.sc-ds-table-group-h,.ds-control--sm.sc-ds-table-group,.ds-control--xs.sc-ds-table-group-h,.ds-control--xs.sc-ds-table-group{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-table-group-h,.ds-control--lg.sc-ds-table-group{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-table-group-h,.ds-control--sm.sc-ds-table-group{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-table-group-h,.ds-control--xs.sc-ds-table-group{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-table-group-h,.ds-chrome-space--sm.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-table-group-h,.ds-chrome-space--md.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-table-group-h,.ds-chrome-space--lg.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-table-group-h,.ds-chrome-row.sc-ds-table-group,.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group,.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-table-group-h,.ds-chrome-row.sc-ds-table-group{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group{flex-direction:column}.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{display:grid;align-items:center}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-table-group{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-table-group{padding:var(--dimension-space-200)}.sc-ds-table-group:where(.ds-text-decoration,.ds-text-action).sc-ds-table-group{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-table-group:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-table-group{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-table-group{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--ds-choice-popup-min-inline-size, var(--dimension-menu-width-xs));max-width:min(var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)));max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);color:var(--color-foreground-secondary);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-table-group{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-table-group{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-table-group{opacity:0}}.ds-choice-list.sc-ds-table-group{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-table-group{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-table-group{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-table-group{margin-block-start:var(--dimension-space-050)}.ds-choice-item.sc-ds-table-group{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-table-group:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-table-group{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-table-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-table-group{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-table-group,.ds-choice-item__suffix.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item.ds-interaction-fill--selected.sc-ds-table-group .ds-choice-item__icon.sc-ds-table-group{color:var(--color-foreground-primary)}.ds-choice-item__tag.sc-ds-table-group{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-table-group,.ds-choice-loading.sc-ds-table-group{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-table-group{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-table-group::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-table-group{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group ds-text.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group ds-text.sc-ds-table-group{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-table-group{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-popup.sc-ds-table-group{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-table-group::after{box-shadow:none}.ds-choice-section--divided.sc-ds-table-group{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-table-group::before{background-color:var(--ds-forced-color-content)}}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-table-caption-control.sc-ds-table-group-h{--ds-choice-popup-min-inline-size:var(--dimension-menu-width-xs)}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h{flex:0 0 auto;width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400));max-width:var(--ds-control-height, var(--dimension-size-400));inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger.sc-ds-table-group{justify-content:center;inline-size:100%;min-inline-size:100%;height:100%;padding-inline:0}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger--has-value.sc-ds-table-group{--ds-select-prefix-fg:var(--ds-select-fg-active)}@container ds-table (max-width: 899px){.sc-ds-table-group-h.ds-table-caption-control{flex:0 0 auto;inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.sc-ds-table-group-h.ds-table-caption-control .trigger{justify-content:center;inline-size:100%;min-inline-size:100%;padding-inline:0}.sc-ds-table-group-h.ds-table-caption-control .trigger--has-value{--ds-select-prefix-fg:var(--ds-select-fg-active)}}.sc-ds-table-group-h{display:inline-flex;min-inline-size:0;max-inline-size:var(--dimension-menu-width-xs)}[hidden].sc-ds-table-group-h{display:none}.table-group__body.sc-ds-table-group{display:grid;grid-template-columns:var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);min-height:calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));max-height:calc(100vh - var(--dimension-size-800) - var(--dimension-size-600))}.table-group__data-pane.sc-ds-table-group,.table-group__order-pane.sc-ds-table-group{display:flex;min-width:0;min-height:0;flex-direction:column}.table-group__data-pane.sc-ds-table-group{border-inline-end:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.table-group__list.sc-ds-table-group{flex:1 1 auto}.table-group__empty.sc-ds-table-group{flex:1 1 auto}.table-group__footer.sc-ds-table-group{flex:0 0 auto}.table-group__footer.sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{justify-content:flex-start}.table-group__footer[aria-hidden='true'].sc-ds-table-group::before{visibility:hidden}.table-group__footer[aria-hidden='true'].sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{visibility:hidden}@media (forced-colors: active){.table-group__data-pane.sc-ds-table-group{border-inline-end-color:var(--ds-forced-color-content)}}`;let C=0;const T=e(class e extends o{constructor(e){super();if(e!==false){this.__registerHost()}this.dsGroupChange=i(this,"dsGroupChange",7);this.dsClear=i(this,"dsClear",7);this.dsOpenChange=i(this,"dsOpenChange",7);this.options=[];this.grouping=null;this.ariaLabel=null;this.open=false;this.emptyMessage="Select a group to choose its order.";this.clearLabel="Clear";this.shouldRender=false;this.closing=false;this.positionReady=false;this.pos={x:0,y:0};this.focusRingVisible=false;this.componentId=`ds-table-group-${++C}`;this.triggerId=`${this.componentId}-trigger`;this.popupId=`${this.componentId}-popup`;this.triggerElement=null;this.pendingInitialFocusVisible=false;this.closeTimer=null;this.position=new n({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,measure:(e,o)=>{if(!this.open)return null;const i=w(_.space050,_.space050);return{anchorRect:e.getBoundingClientRect(),popupWidth:o.offsetWidth||this.popupFallbackWidth,popupHeight:o.offsetHeight||this.popupFallbackHeight,side:"bottom",align:"end",sideOffsetPx:w(k.space050,_.space050),alignOffsetPx:d({align:"end",alignOffsetPx:0,sectionInsetPx:i}),viewportPadPx:w(_.space050,_.space050),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:a(e)}},apply:({x:e,y:o})=>{this.pos={x:e,y:o}},onReady:()=>{this.positionReady=true},liveUpdate:"double-frame",observeResize:true,topLayer:true});this.interaction=new c({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,onOutsideActivation:()=>this.close()})}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer)clearTimeout(this.closeTimer)}onOpenChange(e){if(e){this.teardown();this.shouldRender=true;this.closing=false;this.positionReady=false;this.focusRingVisible=this.pendingInitialFocusVisible;this.interaction.connect();this.position.observe();this.position.schedule((()=>this.focusInitialDataPoint()));return}if(!this.shouldRender)return;this.position.cancel();this.closing=true;this.interaction.disconnect();this.position.unobserve();const o=y(_.motionShort2,_.animationDurationShort3);if(o<=0)this.finishClose();else this.closeTimer=setTimeout((()=>this.finishClose()),o)}handleKeyDown(e){if(!this.shouldRender||this.closing)return;if(e.key==="Escape"){e.preventDefault();this.close();return}if(e.key!=="Tab"||!this.interaction.tabLeavesPopup(e))return;e.preventDefault();this.close(false);this.interaction.moveFocusAfterTab(e.shiftKey)}get popupFallbackWidth(){return w(_.menuWidthLg,_.menuWidthLg)}get popupFallbackHeight(){return w(_.menuFallbackHeight,_.menuFallbackHeight)}teardown(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}toggle(e=false){if(this.open){this.close();return}this.pendingInitialFocusVisible=e;this.open=true;this.dsOpenChange.emit(true);this.onOpenChange(true)}close(e=true){if(e)this.interaction.focusAnchor();this.open=false;this.dsOpenChange.emit(false);this.onOpenChange(false)}finishClose(){const e=this.el.querySelector(".table-group-popup");if(e?.matches(":popover-open"))e.hidePopover();this.shouldRender=false;this.closing=false;this.closeTimer=null}focusInitialDataPoint(){requestAnimationFrame((()=>{const e=this.grouping?this.el.querySelector(`[data-group-value="${CSS.escape(this.grouping.columnId)}"] [role="option"]`):null;const o=e??this.el.querySelector('[data-group-value] [role="option"]:not([aria-disabled="true"])');o?.focus();this.pendingInitialFocusVisible=false}))}selectData(e){if(e.isInactive)return;this.dsGroupChange.emit({columnId:e.value,direction:this.grouping?.columnId===e.value?this.grouping.direction:"asc"})}selectDirection(e){if(!this.grouping||this.grouping.direction===e)return;this.dsGroupChange.emit({...this.grouping,direction:e})}moveFocus(e,o,i,t){if(t&&(e.key==="ArrowLeft"||e.key==="ArrowRight")){e.preventDefault();this.focusRingVisible=true;this.el.querySelector(t)?.focus();return}if(!["ArrowDown","ArrowUp","Home","End"].includes(e.key))return;e.preventDefault();const s=Array.from(this.el.querySelectorAll(o)).filter((e=>e.getAttribute("aria-disabled")!=="true"));if(!s.length)return;let r;if(e.key==="Home")r=0;else if(e.key==="End")r=s.length-1;else r=(i+(e.key==="ArrowDown"?1:-1)+s.length)%s.length;this.focusRingVisible=true;s[r]?.focus()}renderDataOption(e,o){const i=e.value===this.grouping?.columnId;return t(p,{id:`${this.componentId}-data-${o}`,option:{...e},selected:i,active:i,focusRingVisible:this.focusRingVisible,usesSubtext:Boolean(e.description),tabIndex:i||!this.grouping&&o===0?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectData(e),onKeyDown:o=>{if(o.key==="Enter"||o.key===" "){o.preventDefault();this.selectData(e);return}this.moveFocus(o,'[data-group-value] [role="option"]',this.options.filter((e=>!e.isInactive)).findIndex((o=>o.value===e.value)),this.grouping?`[data-group-direction="${this.grouping.direction}"] [role="option"]`:undefined)}})}renderDirection(e,o,i){const s=e===this.grouping?.direction;return t(p,{id:`${this.componentId}-direction-${e}`,option:{label:o,value:e},selected:s,active:s,focusRingVisible:this.focusRingVisible,usesSubtext:false,tabIndex:s?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectDirection(e),onKeyDown:o=>{if(o.key==="Enter"||o.key===" "){o.preventDefault();this.selectDirection(e);return}this.moveFocus(o,'[data-group-direction] [role="option"]',i,`[data-group-value="${CSS.escape(this.grouping?.columnId??"")}"] [role="option"]`)}})}render(){const e=this.ariaLabel?.trim()||"Group table";const o={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};return t(s,{key:"01e2cd1b5f6877d5a8fc4c8468ebbaf39bb11df9",hidden:this.options.length===0?true:undefined},this.options.length?t("ds-button-unfilled",{ref:e=>{this.triggerElement=e??null},id:this.triggerId,variant:"icon-label",size:"md",icon:"SectionList",label:"Group",labelEmphasis:false,pressScale:false,"aria-label":e,hasMenu:true,collapseLabel:true,expanded:this.open,controls:this.popupId,onDsClick:e=>this.toggle(e.detail.detail===0)}):null,this.shouldRender?t("div",{id:this.popupId,popover:"manual",class:{"table-group-popup":true,"ds-choice-popup":true,"ds-choice-popup--closing":this.closing},style:o,role:"dialog","aria-label":e},t("div",{class:"table-group__body"},t("div",{class:"table-group__data-pane"},t(l,{heading:"Data",ariaLabel:"Group data",className:"table-group__list"},this.options.map(((e,o)=>t("div",{"data-group-value":e.value},this.renderDataOption(e,o))))),t("div",{class:"table-group__footer ds-choice-footer","aria-hidden":!this.grouping?"true":undefined},t("div",{class:"ds-choice-footer__content ds-control--md"},this.grouping?t("button",{class:"ds-choice-footer__clear ds-text-action ds-focus-ring",type:"button",onClick:()=>this.dsClear.emit()},t("ds-text",{as:"span",variant:"text-body-medium",color:"inherit"},this.clearLabel)):null))),t("div",{class:"table-group__order-pane"},this.grouping?t(l,{heading:"Order",ariaLabel:"Group order",className:"table-group__list"},t("div",{"data-group-direction":"asc"},this.renderDirection("asc","Ascending",0)),t("div",{"data-group-direction":"desc"},this.renderDirection("desc","Descending",1))):t("div",{class:"table-group__empty ds-choice-empty ds-empty-region"},t("ds-empty-state",{body:this.emptyMessage}))))):null)}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return z()}},[2,"ds-table-group",{options:[16],grouping:[16],ariaLabel:[1,"aria-label"],open:[1028],emptyMessage:[1,"empty-message"],clearLabel:[1,"clear-label"],shouldRender:[32],closing:[32],positionReady:[32],pos:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}]}]);function j(){if(typeof customElements==="undefined"){return}const e=["ds-table-group","ds-badge","ds-button-unfilled","ds-empty-state","ds-icon","ds-input","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-table-group":if(!customElements.get(r(e))){customElements.define(r(e),T)}break;case"ds-badge":if(!customElements.get(r(e))){u()}break;case"ds-button-unfilled":if(!customElements.get(r(e))){g()}break;case"ds-empty-state":if(!customElements.get(r(e))){h()}break;case"ds-icon":if(!customElements.get(r(e))){b()}break;case"ds-input":if(!customElements.get(r(e))){f()}break;case"ds-loader":if(!customElements.get(r(e))){v()}break;case"ds-text":if(!customElements.get(r(e))){m()}break;case"ds-tooltip":if(!customElements.get(r(e))){x()}break}}))}j();const D=T;const E=j;export{D as DsTableGroup,E as defineCustomElement};
|
|
1
|
+
import{p as e,H as o,c as i,h as t,a as s,t as r}from"./index.js";import{A as n,r as a}from"./p-DjF2m7bf.js";import{r as d,A as c}from"./p-etg-Uk1u.js";import{d as l,C as p}from"./p-BEttT0UB.js";import{d as u}from"./p-BMzn2Cmw.js";import{d as g}from"./p-6_CNVbqa.js";import{d as h}from"./p-BVz-r3g0.js";import{d as b}from"./p-Cea7rROU.js";import{d as f}from"./p-to8BxxgT.js";import{d as v}from"./p-0XTyQNRG.js";import{d as m}from"./p-DQQsS9Rx.js";import{d as x}from"./p-DW8ssbfI.js";import{r as w}from"./p-CochmPyg.js";import{a as y,T as _,b as k}from"./p-CUL5_8JM.js";const z=()=>`@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.sc-ds-table-group-h{--ds-focus-ring-width:var(--dimension-stroke-width-025, 2px);--ds-focus-ring-offset:var(--dimension-space-025, 2px);--ds-focus-ring-color:var(--color-interaction-focus)}.ds-focus-ring.sc-ds-table-group-h,.ds-focus-ring.sc-ds-table-group,.ds-focus-ring-inset.sc-ds-table-group-h,.ds-focus-ring-inset.sc-ds-table-group{outline:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.ds-focus-ring.sc-ds-table-group-h:focus-visible,.ds-focus-ring.sc-ds-table-group:focus-visible{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring.ds-focus-ring--visible.sc-ds-table-group-h,.ds-focus-ring.ds-focus-ring--visible.sc-ds-table-group{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:var(--ds-focus-ring-offset)}.ds-focus-ring-inset.sc-ds-table-group-h:focus-visible,.ds-focus-ring-inset.sc-ds-table-group:focus-visible{outline:none}.ds-focus-ring-inset.sc-ds-table-group-h:focus-visible::after,.ds-focus-ring-inset.sc-ds-table-group:focus-visible::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group-h,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group{outline:none}.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group-h::after,.ds-focus-ring-inset.ds-focus-ring--visible.sc-ds-table-group::after{outline:var(--ds-focus-ring-width) solid var(--ds-focus-ring-color);outline-offset:calc(-1 * var(--ds-focus-ring-width))}@media (forced-colors: active){.sc-ds-table-group-h{--ds-focus-ring-color:var(--ds-forced-color-selected)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-interaction-fill.sc-ds-table-group-h,.ds-interaction-fill.sc-ds-table-group{position:var(--ds-interaction-position, relative);z-index:var(--ds-interaction-z-index, 0);cursor:default;--ds-interaction-hover:var(--color-interaction-hover);--ds-interaction-pressed:var(--color-interaction-pressed);--ds-interaction-active:var(--color-interaction-active-brand);--ds-interaction-border-width:0px;--ds-interaction-border-color:transparent;--ds-interaction-divider-width:0px;--ds-interaction-divider-color:transparent;--ds-interaction-divider-inline-start-width:0px;--ds-interaction-divider-inline-start-color:transparent;--ds-interaction-divider-inline-end-width:0px;--ds-interaction-divider-inline-end-color:transparent}.ds-interaction-fill.sc-ds-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before,.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;background:transparent;pointer-events:none;cursor:inherit;transition:none}.ds-interaction-fill.sc-ds-table-group-h::before,.ds-interaction-fill.sc-ds-table-group::before{z-index:1}.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{z-index:3;box-shadow:inset 0 calc(-1 * var(--ds-interaction-divider-width)) 0 var(--ds-interaction-divider-color), inset var(--ds-interaction-divider-inline-start-width) 0 0 var(--ds-interaction-divider-inline-start-color), inset calc(-1 * var(--ds-interaction-divider-inline-end-width)) 0 0 var(--ds-interaction-divider-inline-end-color), inset 0 0 0 var(--ds-interaction-border-width) var(--ds-interaction-border-color)}.ds-interaction-fill--bordered.sc-ds-table-group-h,.ds-interaction-fill--bordered.sc-ds-table-group{--ds-interaction-border-width:var(--dimension-stroke-width-012);--ds-interaction-border-color:var(--color-border-secondary)}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::before{background:var(--ds-interaction-active)}.ds-interaction-fill--selected.sc-ds-table-group-h,.ds-interaction-fill--selected.sc-ds-table-group{--ds-interaction-dot-ring:var(--ds-interaction-active)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-hover)}}.ds-interaction-fill.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-pressed)}.ds-interaction-fill--grouped.sc-ds-table-group-h::after,.ds-interaction-fill--grouped.sc-ds-table-group::after,.ds-interaction-fill--grouped.sc-ds-table-group-h:active:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:active:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}@media (hover: hover) and (pointer: fine){.ds-interaction-fill--grouped.sc-ds-table-group-h:hover:not(:disabled)::after,.ds-interaction-fill--grouped.sc-ds-table-group:hover:not(:disabled)::after{background:var(--ds-interaction-group-fill, transparent)}}.ds-interaction-fill--grouped.sc-ds-table-group-h,.ds-interaction-fill--grouped.sc-ds-table-group{--ds-interaction-divider-width:var(--ds-interaction-group-divider-width, 0px);--ds-interaction-divider-color:var(--ds-interaction-group-divider-color, transparent);--ds-interaction-divider-inline-start-width:var( --ds-interaction-group-divider-inline-start-width, 0px );--ds-interaction-divider-inline-start-color:var( --ds-interaction-group-divider-inline-start-color, transparent );--ds-interaction-divider-inline-end-width:var( --ds-interaction-group-divider-inline-end-width, 0px );--ds-interaction-divider-inline-end-color:var( --ds-interaction-group-divider-inline-end-color, transparent )}.ds-interaction-fill.sc-ds-table-group-h>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill.sc-ds-table-group>.ds-interaction-fill__content.sc-ds-table-group,.ds-interaction-fill__content.sc-ds-table-group{position:relative;z-index:2;cursor:inherit}.ds-interaction-fill--on-faint.sc-ds-table-group-h,.ds-interaction-fill--on-faint.sc-ds-table-group{--ds-interaction-active:var(--color-interaction-active)}.ds-interaction-fill--on-medium.sc-ds-table-group-h,.ds-interaction-fill--on-medium.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-medium-background-hover);--ds-interaction-pressed:var(--color-interaction-on-medium-background-pressed);--ds-interaction-active:var(--color-interaction-on-medium-background-active);--ds-focus-ring-color:var(--color-interaction-on-medium-background-focus)}.ds-interaction-fill--on-bold.sc-ds-table-group-h,.ds-interaction-fill--on-bold.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-bold-background-hover);--ds-interaction-pressed:var(--color-interaction-on-bold-background-pressed);--ds-interaction-active:var(--color-interaction-on-bold-background-active);--ds-focus-ring-color:var(--color-interaction-on-bold-background-focus)}.ds-interaction-fill--on-strong.sc-ds-table-group-h,.ds-interaction-fill--on-strong.sc-ds-table-group{--ds-interaction-hover:var(--color-interaction-on-strong-background-hover);--ds-interaction-pressed:var(--color-interaction-on-strong-background-pressed);--ds-interaction-active:var(--color-interaction-on-strong-background-active);--ds-focus-ring-color:var(--color-interaction-on-strong-background-focus)}.ds-interaction-fill--on-translucent.sc-ds-table-group-h,.ds-interaction-fill--on-translucent.sc-ds-table-group{--ds-interaction-hover:var(--color-translucent-interaction-hover);--ds-interaction-pressed:var(--color-translucent-interaction-pressed);--ds-interaction-active:var(--color-translucent-interaction-active-brand);--ds-focus-ring-color:var(--color-translucent-interaction-focus)}.ds-interaction-fill--on-inverted.sc-ds-table-group-h,.ds-interaction-fill--on-inverted.sc-ds-table-group{--ds-interaction-hover:var(--color-inverted-interaction-hover);--ds-interaction-pressed:var(--color-inverted-interaction-pressed);--ds-interaction-active:var(--color-inverted-interaction-active-brand);--ds-focus-ring-color:var(--color-inverted-interaction-focus)}.ds-interaction-fill--on-media.sc-ds-table-group-h,.ds-interaction-fill--on-media.sc-ds-table-group{--ds-interaction-hover:var(--color-media-interaction-hover);--ds-interaction-pressed:var(--color-media-interaction-pressed);--ds-interaction-active:var(--color-media-interaction-active);--ds-focus-ring-color:var(--color-media-interaction-focus)}.ds-interaction-fill--on-always-dark.sc-ds-table-group-h,.ds-interaction-fill--on-always-dark.sc-ds-table-group{--ds-interaction-hover:var(--color-always-dark-interaction-hover);--ds-interaction-pressed:var(--color-always-dark-interaction-pressed);--ds-interaction-active:var(--color-always-dark-interaction-active-brand);--ds-focus-ring-color:var(--color-always-dark-interaction-focus)}.ds-interaction-fill--on-navigation.sc-ds-table-group-h,.ds-interaction-fill--on-navigation.sc-ds-table-group{--ds-interaction-hover:var(--color-navigation-interaction-hover);--ds-interaction-pressed:var(--color-navigation-interaction-pressed);--ds-interaction-active:var(--color-navigation-interaction-active);--ds-focus-ring-color:var(--color-navigation-interaction-focus)}@media (forced-colors: active){.ds-interaction-fill.sc-ds-table-group-h::after,.ds-interaction-fill.sc-ds-table-group::after{box-shadow:none;outline:var(--ds-interaction-border-width) solid var(--ds-forced-color-control-boundary);outline-offset:calc(-1 * var(--ds-interaction-border-width))}.ds-interaction-fill--selected.sc-ds-table-group-h::before,.ds-interaction-fill--selected.sc-ds-table-group::before{background:transparent;outline:var(--dimension-stroke-width-025) solid var(--ds-forced-color-selected);outline-offset:calc(-1 * var(--dimension-stroke-width-025))}}@media (forced-colors: active) and (hover: hover) and (pointer: fine){.ds-interaction-fill.sc-ds-table-group-h:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after,.ds-interaction-fill.sc-ds-table-group:hover:not(:disabled):not(:focus-visible):not(:focus-within):not(.ds-focus-ring--visible)::after{outline-color:var(--ds-forced-color-selected);outline-width:var(--dimension-stroke-width-012)}}@media (forced-colors: active){.sc-ds-table-group:root,.sc-ds-table-group-h,.ds-forced-colors-scope.sc-ds-table-group{--ds-forced-color-surface:Canvas;--ds-forced-color-content:CanvasText;--ds-forced-color-control-boundary:ButtonText;--ds-forced-color-selected:Highlight;--ds-forced-color-on-selected:HighlightText;--ds-forced-color-disabled:GrayText}}.ds-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{opacity:var(--effect-opacity-medium);pointer-events:none;cursor:not-allowed}@media (forced-colors: active){.ds-control-inactive.sc-ds-table-group-h,.ds-control-inactive.sc-ds-table-group{color:var(--ds-forced-color-disabled);opacity:1}}.ds-control--lg.sc-ds-table-group,.ds-control--lg.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group,.ds-control--sm.sc-ds-table-group-h,.ds-control--sm.sc-ds-table-group,.ds-control--xs.sc-ds-table-group-h,.ds-control--xs.sc-ds-table-group{--ds-control-radius:var(--dimension-radius-025)}.ds-control--lg.sc-ds-table-group-h,.ds-control--lg.sc-ds-table-group{--ds-control-height:var(--dimension-size-500);--ds-control-icon:var(--dimension-iconography-lg);--ds-control-padding-inline:var(--dimension-space-100);--ds-control-label-inset:var(--dimension-space-050);--ds-control-gap:var(--dimension-space-050)}.ds-control--md.sc-ds-table-group-h,.ds-control--md.sc-ds-table-group{--ds-control-height:var(--dimension-size-400);--ds-control-icon:var(--dimension-iconography-md);--ds-control-padding-inline:var(--dimension-space-075);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-050)}.ds-control--sm.sc-ds-table-group-h,.ds-control--sm.sc-ds-table-group{--ds-control-height:var(--dimension-size-300);--ds-control-icon:var(--dimension-iconography-sm);--ds-control-padding-inline:var(--dimension-space-050);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:var(--dimension-space-025)}.ds-control--xs.sc-ds-table-group-h,.ds-control--xs.sc-ds-table-group{--ds-control-height:var(--dimension-size-200);--ds-control-icon:var(--dimension-iconography-xs);--ds-control-padding-inline:var(--dimension-space-025);--ds-control-label-inset:var(--dimension-space-025);--ds-control-gap:0}.ds-chrome-space--sm.sc-ds-table-group-h,.ds-chrome-space--sm.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-050);--ds-chrome-gap:var(--dimension-space-050)}.ds-chrome-space--md.sc-ds-table-group-h,.ds-chrome-space--md.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-100);--ds-chrome-gap:var(--dimension-space-100)}.ds-chrome-space--lg.sc-ds-table-group-h,.ds-chrome-space--lg.sc-ds-table-group{--ds-chrome-padding:var(--dimension-space-200);--ds-chrome-gap:var(--dimension-space-200)}.ds-chrome-row.sc-ds-table-group-h,.ds-chrome-row.sc-ds-table-group,.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group,.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{display:flex;box-sizing:border-box;gap:var(--ds-chrome-gap, var(--dimension-space-100));padding:var(--ds-chrome-padding, var(--dimension-space-100))}.ds-chrome-row.sc-ds-table-group-h,.ds-chrome-row.sc-ds-table-group{flex-direction:row;align-items:center}.ds-chrome-column.sc-ds-table-group-h,.ds-chrome-column.sc-ds-table-group{flex-direction:column}.ds-chrome-grid.sc-ds-table-group-h,.ds-chrome-grid.sc-ds-table-group{display:grid;align-items:center}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-empty-region.sc-ds-table-group{display:flex;flex:1 1 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;min-height:0}.ds-empty-region--padded.sc-ds-table-group{padding:var(--dimension-space-200)}.sc-ds-table-group:where(.ds-text-decoration,.ds-text-action).sc-ds-table-group{text-decoration-color:var(--ds-text-decoration-color, var(--color-foreground-tertiary));text-decoration-thickness:var(--ds-text-decoration-thickness, var(--dimension-stroke-width-012));text-underline-offset:var(--ds-text-decoration-offset, var(--dimension-space-025))}.ds-text-action.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-bold-brand);--ds-text-decoration-color:var(--ds-text-action-foreground);color:var(--ds-text-action-foreground);text-decoration-line:none}.ds-text-action--on-medium.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-medium-background-primary);--ds-text-decoration-color:var(--color-foreground-on-medium-background-secondary);text-decoration-line:underline}.ds-text-action--on-strong.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-strong-background-primary);--ds-text-decoration-color:var(--color-foreground-on-strong-background-secondary);text-decoration-line:underline}.ds-text-action--on-bold.sc-ds-table-group{--ds-text-action-foreground:var(--color-foreground-on-bold-background-primary);--ds-text-decoration-color:var(--color-foreground-on-bold-background-secondary);text-decoration-line:underline}@media (hover: hover) and (pointer: fine){.ds-text-action.sc-ds-table-group:hover{text-decoration-line:underline}}@media (forced-colors: active){.ds-text-action.sc-ds-table-group{text-decoration-line:underline;text-decoration-color:currentcolor}}.ds-choice-popup.sc-ds-table-group{box-sizing:border-box;display:flex;flex-direction:column;min-width:var(--ds-choice-popup-min-inline-size, var(--dimension-menu-width-xs));max-width:min(var(--dimension-panel-width-lg), calc(100vw - var(--dimension-space-200)));max-height:calc(100vh - var(--dimension-space-200));overflow:hidden;inset:auto;margin:0;padding:0;border:0;background-color:var(--color-background-primary);border-radius:var(--dimension-radius-075);box-shadow:var(--effect-shadow-elevated-floating);color:var(--color-foreground-secondary);animation:dsChoiceFadeIn var(--effect-motion-short-2) forwards;backface-visibility:hidden;will-change:transform;text-align:start}.ds-choice-popup.sc-ds-table-group::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;box-shadow:var(--effect-highlight-elevated-floating)}.ds-choice-popup--closing.sc-ds-table-group{animation:dsChoiceFadeOut var(--effect-motion-short-2) forwards}@keyframes dsChoiceFadeIn{from{opacity:0;transform:inherit scale(0.97)}to{opacity:1}}@keyframes dsChoiceFadeOut{from{opacity:1}to{opacity:0}}@media (prefers-reduced-motion: reduce){.ds-choice-popup.sc-ds-table-group{animation:none;opacity:1}.ds-choice-popup--closing.sc-ds-table-group{opacity:0}}.ds-choice-list.sc-ds-table-group{display:flex;flex-direction:column;min-height:0;overflow-y:auto;overscroll-behavior:contain}.ds-choice-section--divided.sc-ds-table-group{border-bottom:var(--dimension-stroke-width-015) solid var(--color-border-tertiary)}ds-text.ds-choice-section__header.sc-ds-table-group{text-align:start;-webkit-user-select:none;user-select:none}.ds-choice-section--headed-after-first.sc-ds-table-group{margin-block-start:var(--dimension-space-050)}.ds-choice-item.sc-ds-table-group{width:100%;border:none;border-radius:var(--ds-control-radius, var(--dimension-radius-025));background:transparent;cursor:default;-webkit-user-select:none;user-select:none;text-align:left;color:inherit}.ds-choice-item.sc-ds-table-group:has(.ds-choice-item__subtext){height:auto;min-height:var(--ds-control-height, var(--dimension-size-400));padding-block:var(--ds-control-padding-inline, var(--dimension-space-075));align-items:flex-start}.ds-choice-item__content.sc-ds-table-group{display:flex;flex:1;flex-direction:column;gap:var(--dimension-space-025);min-width:0}ds-text.ds-choice-item__label.sc-ds-table-group{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}ds-text.ds-choice-item__subtext.sc-ds-table-group{display:-webkit-box;overflow:hidden;white-space:normal;-webkit-box-orient:vertical;-webkit-line-clamp:2}.ds-choice-item__icon.sc-ds-table-group,.ds-choice-item__suffix.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md));pointer-events:none}.ds-choice-item.ds-interaction-fill--selected.sc-ds-table-group .ds-choice-item__icon.sc-ds-table-group{color:var(--color-foreground-primary)}.ds-choice-item__tag.sc-ds-table-group{flex-shrink:0;pointer-events:none}.ds-choice-empty.sc-ds-table-group,.ds-choice-loading.sc-ds-table-group{min-height:var(--dimension-size-600);padding:var(--dimension-space-100)}.ds-choice-footer.sc-ds-table-group{position:relative;box-sizing:border-box;padding-block:var(--dimension-space-050)}.ds-choice-footer.sc-ds-table-group::before{content:'';position:absolute;inset:0 0 auto;height:var(--dimension-stroke-width-012);background-color:var(--color-border-tertiary);pointer-events:none}.ds-choice-footer__content.sc-ds-table-group{display:flex;align-items:center;justify-content:space-between;column-gap:var(--dimension-space-050);box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400))}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group ds-text.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group ds-text.sc-ds-table-group{padding-inline:calc( var(--dimension-space-050) + var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-choice-footer__summary.sc-ds-table-group,.ds-choice-footer__summary-measure.sc-ds-table-group,.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{white-space:nowrap}.ds-choice-footer__summary-measure.sc-ds-table-group{position:absolute;visibility:hidden;pointer-events:none}.ds-choice-footer__clear.sc-ds-table-group,.ds-choice-footer__action.sc-ds-table-group{appearance:none;display:inline-flex;align-items:center;padding:0;border:0;border-radius:var(--dimension-radius-025);background:transparent;cursor:default}@media (forced-colors: active){.ds-choice-popup.sc-ds-table-group{outline:var(--dimension-stroke-width-012) solid var(--ds-forced-color-content);outline-offset:calc(-1 * var(--dimension-stroke-width-012))}.ds-choice-popup.sc-ds-table-group::after{box-shadow:none}.ds-choice-section--divided.sc-ds-table-group{border-bottom-color:var(--ds-forced-color-content)}.ds-choice-footer.sc-ds-table-group::before{background-color:var(--ds-forced-color-content)}}.ds-control-frame.sc-ds-table-group{display:inline-flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:var(--ds-control-padding-inline, var(--dimension-space-075));gap:var(--ds-control-gap, var(--dimension-space-050));border-radius:var(--ds-control-radius, var(--dimension-radius-025))}.ds-control-section-heading.sc-ds-table-group{display:flex;align-items:center;box-sizing:border-box;height:var(--ds-control-height, var(--dimension-size-400));padding-inline:calc( var(--ds-control-padding-inline, var(--dimension-space-075)) + var(--ds-control-label-inset, var(--dimension-space-025)) )}.ds-control-icon-box.sc-ds-table-group{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--ds-control-icon, var(--dimension-iconography-md));height:var(--ds-control-icon, var(--dimension-iconography-md))}.ds-control-label-box.sc-ds-table-group{min-width:0;padding-inline:var(--ds-control-label-inset, var(--dimension-space-025))}.ds-control-label-dot.sc-ds-table-group{position:relative;padding-inline-end:calc( var(--ds-control-label-inset, var(--dimension-space-025)) + var(--ds-control-gap, var(--dimension-space-050)) )}.ds-control-label-dot__badge.sc-ds-table-group{position:absolute;inset-block-start:0;inset-inline-end:0;pointer-events:none}.ds-table-caption-control.sc-ds-table-group-h{--ds-choice-popup-min-inline-size:var(--dimension-menu-width-xs)}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h{flex:0 0 auto;width:var(--ds-control-height, var(--dimension-size-400));height:var(--ds-control-height, var(--dimension-size-400));min-width:var(--ds-control-height, var(--dimension-size-400));min-height:var(--ds-control-height, var(--dimension-size-400));max-width:var(--ds-control-height, var(--dimension-size-400));inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger.sc-ds-table-group{justify-content:center;inline-size:100%;min-inline-size:100%;height:100%;padding-inline:0}.ds-table-caption-control.ds-table-caption-control--compact.sc-ds-table-group-h .trigger--has-value.sc-ds-table-group{--ds-select-prefix-fg:var(--ds-select-fg-active)}@container ds-table (max-width: 899px){.sc-ds-table-group-h.ds-table-caption-control{flex:0 0 auto;inline-size:var(--ds-control-height, var(--dimension-size-400));min-inline-size:var(--ds-control-height, var(--dimension-size-400));max-inline-size:var(--ds-control-height, var(--dimension-size-400))}.sc-ds-table-group-h.ds-table-caption-control .trigger{justify-content:center;inline-size:100%;min-inline-size:100%;padding-inline:0}.sc-ds-table-group-h.ds-table-caption-control .trigger--has-value{--ds-select-prefix-fg:var(--ds-select-fg-active)}}.sc-ds-table-group-h{display:inline-flex;min-inline-size:0;max-inline-size:var(--dimension-menu-width-xs)}[hidden].sc-ds-table-group-h{display:none}.table-group__body.sc-ds-table-group{display:grid;grid-template-columns:var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);min-height:calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));max-height:calc(100vh - var(--dimension-size-800) - var(--dimension-size-600))}.table-group__data-pane.sc-ds-table-group,.table-group__order-pane.sc-ds-table-group{display:flex;min-width:0;min-height:0;flex-direction:column}.table-group__data-pane.sc-ds-table-group{border-inline-end:var(--dimension-stroke-width-012) solid var(--color-border-tertiary)}.table-group__list.sc-ds-table-group{flex:1 1 auto}.table-group__empty.sc-ds-table-group{flex:1 1 auto}.table-group__footer.sc-ds-table-group{flex:0 0 auto}.table-group__footer.sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{justify-content:flex-start}.table-group__footer[aria-hidden='true'].sc-ds-table-group::before{visibility:hidden}.table-group__footer[aria-hidden='true'].sc-ds-table-group .ds-choice-footer__content.sc-ds-table-group{visibility:hidden}@media (forced-colors: active){.table-group__data-pane.sc-ds-table-group{border-inline-end-color:var(--ds-forced-color-content)}}`;const C=[{label:"Ascending",direction:"asc"},{label:"Descending",direction:"desc"}];let T=0;const j=e(class e extends o{constructor(e){super();if(e!==false){this.__registerHost()}this.dsGroupChange=i(this,"dsGroupChange",7);this.dsClear=i(this,"dsClear",7);this.dsOpenChange=i(this,"dsOpenChange",7);this.options=[];this.grouping=null;this.ariaLabel=null;this.open=false;this.emptyMessage="Select a group to choose its order.";this.clearLabel="Clear";this.shouldRender=false;this.closing=false;this.positionReady=false;this.pos={x:0,y:0};this.focusRingVisible=false;this.componentId=`ds-table-group-${++T}`;this.triggerId=`${this.componentId}-trigger`;this.popupId=`${this.componentId}-popup`;this.triggerElement=null;this.pendingInitialFocusVisible=false;this.closeTimer=null;this.position=new n({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,measure:(e,o)=>{if(!this.open)return null;const i=w(_.space050,_.space050);return{anchorRect:e.getBoundingClientRect(),popupWidth:o.offsetWidth||this.popupFallbackWidth,popupHeight:o.offsetHeight||this.popupFallbackHeight,side:"bottom",align:"end",sideOffsetPx:w(k.space050,_.space050),alignOffsetPx:d({align:"end",alignOffsetPx:0,sectionInsetPx:i}),viewportPadPx:w(_.space050,_.space050),viewportWidth:window.innerWidth,viewportHeight:window.innerHeight,collisionRect:a(e)}},apply:({x:e,y:o})=>{this.pos={x:e,y:o}},onReady:()=>{this.positionReady=true},liveUpdate:"double-frame",observeResize:true,topLayer:true});this.interaction=new c({getAnchor:()=>this.triggerElement,getPopup:()=>this.el.querySelector(".table-group-popup"),getOwnerDocument:()=>this.el.ownerDocument,onOutsideActivation:()=>this.close()})}componentDidLoad(){if(this.open)this.onOpenChange(true)}disconnectedCallback(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer)clearTimeout(this.closeTimer)}onOpenChange(e){if(e){this.teardown();this.shouldRender=true;this.closing=false;this.positionReady=false;this.focusRingVisible=this.pendingInitialFocusVisible;this.interaction.connect();this.position.observe();this.position.schedule((()=>this.focusInitialDataPoint()));return}if(!this.shouldRender)return;this.position.cancel();this.closing=true;this.interaction.disconnect();this.position.unobserve();const o=y(_.motionShort2,_.animationDurationShort3);if(o<=0)this.finishClose();else this.closeTimer=setTimeout((()=>this.finishClose()),o)}handleKeyDown(e){if(!this.shouldRender||this.closing)return;if(e.key==="Escape"){e.preventDefault();this.close();return}if(e.key!=="Tab"||!this.interaction.tabLeavesPopup(e))return;e.preventDefault();this.close(false);this.interaction.moveFocusAfterTab(e.shiftKey)}get popupFallbackWidth(){return w(_.menuWidthLg,_.menuWidthLg)}get popupFallbackHeight(){return w(_.menuFallbackHeight,_.menuFallbackHeight)}teardown(){this.position.unobserve();this.interaction.disconnect();if(this.closeTimer){clearTimeout(this.closeTimer);this.closeTimer=null}}toggle(e=false){if(this.open){this.close();return}this.pendingInitialFocusVisible=e;this.open=true;this.dsOpenChange.emit(true);this.onOpenChange(true)}close(e=true){if(e)this.interaction.focusAnchor();this.open=false;this.dsOpenChange.emit(false);this.onOpenChange(false)}finishClose(){const e=this.el.querySelector(".table-group-popup");if(e?.matches(":popover-open"))e.hidePopover();this.shouldRender=false;this.closing=false;this.closeTimer=null}focusInitialDataPoint(){requestAnimationFrame((()=>{const e=this.grouping?this.el.querySelector(`[data-group-value="${CSS.escape(this.grouping.columnId)}"] [role="option"]`):null;const o=e??this.el.querySelector('[data-group-value] [role="option"]:not([aria-disabled="true"])');o?.focus();this.pendingInitialFocusVisible=false}))}selectData(e){if(e.isInactive)return;if(this.grouping?.columnId===e.value){this.dsGroupChange.emit({...this.grouping});return}const o=e.orderOptions?.[0];this.dsGroupChange.emit({columnId:e.value,direction:o?.direction??"asc",...o?.orderBy?{orderBy:o.orderBy}:{}})}get activeOrderOptions(){const e=this.options.find((e=>e.value===this.grouping?.columnId))?.orderOptions;return e?.length?e:C}get selectedOrderIndex(){if(!this.grouping)return-1;const e=this.activeOrderOptions.findIndex((e=>e.direction===this.grouping?.direction&&e.orderBy===this.grouping?.orderBy));if(e>=0)return e;if(this.grouping.orderBy===undefined){return this.activeOrderOptions.findIndex((e=>e.direction===this.grouping?.direction))}return-1}selectOrder(e,o){if(!this.grouping||this.selectedOrderIndex===o)return;const i={columnId:this.grouping.columnId,direction:e.direction};if(e.orderBy)i.orderBy=e.orderBy;this.dsGroupChange.emit(i)}moveFocus(e,o,i,t){if(t&&(e.key==="ArrowLeft"||e.key==="ArrowRight")){e.preventDefault();this.focusRingVisible=true;this.el.querySelector(t)?.focus();return}if(!["ArrowDown","ArrowUp","Home","End"].includes(e.key))return;e.preventDefault();const s=Array.from(this.el.querySelectorAll(o)).filter((e=>e.getAttribute("aria-disabled")!=="true"));if(!s.length)return;let r;if(e.key==="Home")r=0;else if(e.key==="End")r=s.length-1;else r=(i+(e.key==="ArrowDown"?1:-1)+s.length)%s.length;this.focusRingVisible=true;s[r]?.focus()}renderDataOption(e,o){const i=e.value===this.grouping?.columnId;return t(p,{id:`${this.componentId}-data-${o}`,option:{...e},selected:i,active:i,focusRingVisible:this.focusRingVisible,usesSubtext:Boolean(e.description),tabIndex:i||!this.grouping&&o===0?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectData(e),onKeyDown:o=>{if(o.key==="Enter"||o.key===" "){o.preventDefault();this.selectData(e);return}this.moveFocus(o,'[data-group-value] [role="option"]',this.options.filter((e=>!e.isInactive)).findIndex((o=>o.value===e.value)),this.grouping?`[data-group-order-index="${this.selectedOrderIndex}"] [role="option"]`:undefined)}})}renderOrder(e,o){const i=o===this.selectedOrderIndex;return t(p,{id:`${this.componentId}-order-${o}`,option:{label:e.label,value:String(o)},selected:i,active:i,focusRingVisible:this.focusRingVisible,usesSubtext:false,tabIndex:i?0:-1,onHover:()=>{this.focusRingVisible=false},onSelect:()=>this.selectOrder(e,o),onKeyDown:i=>{if(i.key==="Enter"||i.key===" "){i.preventDefault();this.selectOrder(e,o);return}this.moveFocus(i,'[data-group-order-index] [role="option"]',o,`[data-group-value="${CSS.escape(this.grouping?.columnId??"")}"] [role="option"]`)}})}render(){const e=this.ariaLabel?.trim()||"Group table";const o={position:"fixed",left:"0",top:"0",transform:`translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,zIndex:"9998",visibility:this.positionReady?"visible":"hidden"};return t(s,{key:"003ea9f04a16376c31932bfe0a7203c8d481ca08",hidden:this.options.length===0?true:undefined},this.options.length?t("ds-button-unfilled",{ref:e=>{this.triggerElement=e??null},id:this.triggerId,variant:"icon-label",size:"md",icon:"SectionList",label:"Group",labelEmphasis:false,pressScale:false,"aria-label":e,hasMenu:true,collapseLabel:true,expanded:this.open,controls:this.popupId,onDsClick:e=>this.toggle(e.detail.detail===0)}):null,this.shouldRender?t("div",{id:this.popupId,popover:"manual",class:{"table-group-popup":true,"ds-choice-popup":true,"ds-choice-popup--closing":this.closing},style:o,role:"dialog","aria-label":e},t("div",{class:"table-group__body"},t("div",{class:"table-group__data-pane"},t(l,{heading:"Data",ariaLabel:"Group data",className:"table-group__list"},this.options.map(((e,o)=>t("div",{"data-group-value":e.value},this.renderDataOption(e,o))))),t("div",{class:"table-group__footer ds-choice-footer","aria-hidden":!this.grouping?"true":undefined},t("div",{class:"ds-choice-footer__content ds-control--md"},this.grouping?t("button",{class:"ds-choice-footer__clear ds-text-action ds-focus-ring",type:"button",onClick:()=>this.dsClear.emit()},t("ds-text",{as:"span",variant:"text-body-medium",color:"inherit"},this.clearLabel)):null))),t("div",{class:"table-group__order-pane"},this.grouping?t(l,{heading:"Order",ariaLabel:"Group order",className:"table-group__list"},this.activeOrderOptions.map(((e,o)=>t("div",{"data-group-order-index":o},this.renderOrder(e,o))))):t("div",{class:"table-group__empty ds-choice-empty ds-empty-region"},t("ds-empty-state",{body:this.emptyMessage}))))):null)}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return z()}},[2,"ds-table-group",{options:[16],grouping:[16],ariaLabel:[1,"aria-label"],open:[1028],emptyMessage:[1,"empty-message"],clearLabel:[1,"clear-label"],shouldRender:[32],closing:[32],positionReady:[32],pos:[32],focusRingVisible:[32]},[[0,"keydown","handleKeyDown"]],{open:[{onOpenChange:0}]}]);function O(){if(typeof customElements==="undefined"){return}const e=["ds-table-group","ds-badge","ds-button-unfilled","ds-empty-state","ds-icon","ds-input","ds-loader","ds-text","ds-tooltip"];e.forEach((e=>{switch(e){case"ds-table-group":if(!customElements.get(r(e))){customElements.define(r(e),j)}break;case"ds-badge":if(!customElements.get(r(e))){u()}break;case"ds-button-unfilled":if(!customElements.get(r(e))){g()}break;case"ds-empty-state":if(!customElements.get(r(e))){h()}break;case"ds-icon":if(!customElements.get(r(e))){b()}break;case"ds-input":if(!customElements.get(r(e))){f()}break;case"ds-loader":if(!customElements.get(r(e))){v()}break;case"ds-text":if(!customElements.get(r(e))){m()}break;case"ds-tooltip":if(!customElements.get(r(e))){x()}break}}))}O();const D=j;const E=O;export{D as DsTableGroup,E as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=ds-table-group.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["tableGroupCss","tableGroupSeq","TableGroup","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","grouping","ariaLabel","open","emptyMessage","clearLabel","shouldRender","closing","positionReady","pos","x","y","focusRingVisible","componentId","triggerId","popupId","triggerElement","pendingInitialFocusVisible","closeTimer","position","AnchoredPositionController","getAnchor","getPopup","el","querySelector","getOwnerDocument","ownerDocument","measure","anchor","popup","sectionInsetPx","resolveCssLengthPx","TOKEN_DEFAULTS","space050","anchorRect","getBoundingClientRect","popupWidth","offsetWidth","popupFallbackWidth","popupHeight","offsetHeight","popupFallbackHeight","side","align","sideOffsetPx","TOKEN_CSS_LENGTHS","alignOffsetPx","resolveChoicePopupAlignOffset","viewportPadPx","viewportWidth","window","innerWidth","viewportHeight","innerHeight","collisionRect","resolveAnchoredOverlayBoundaryRect","apply","onReady","liveUpdate","observeResize","topLayer","interaction","AnchoredOverlayInteractionController","onOutsideActivation","close","componentDidLoad","onOpenChange","disconnectedCallback","unobserve","disconnect","clearTimeout","isOpen","teardown","connect","observe","schedule","focusInitialDataPoint","cancel","duration","resolveMotionTimeMs","motionShort2","animationDurationShort3","finishClose","setTimeout","handleKeyDown","event","key","preventDefault","tabLeavesPopup","moveFocusAfterTab","shiftKey","menuWidthLg","menuFallbackHeight","toggle","fromKeyboard","dsOpenChange","emit","restoreFocus","focusAnchor","matches","hidePopover","requestAnimationFrame","selected","CSS","escape","columnId","initial","focus","selectData","option","isInactive","dsGroupChange","value","direction","selectDirection","moveFocus","selector","currentIndex","oppositeSelector","includes","items","Array","from","querySelectorAll","filter","item","getAttribute","length","next","renderDataOption","index","h","ChoiceOptionRow","id","active","usesSubtext","Boolean","description","tabIndex","onHover","onSelect","onKeyDown","candidate","findIndex","undefined","renderDirection","label","render","name","trim","popupStyle","left","top","transform","Math","round","zIndex","visibility","Host","hidden","ref","element","variant","size","icon","labelEmphasis","pressScale","hasMenu","collapseLabel","expanded","controls","onDsClick","detail","popover","class","style","role","ChoiceListSection","heading","className","map","type","onClick","dsClear","as","color","body"],"sources":["src/wc/components/TableGroup/TableGroup.css?tag=ds-table-group&encapsulation=scoped","src/wc/components/TableGroup/TableGroup.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/table-caption-control.css';\n\n:host {\n display: inline-flex;\n min-inline-size: 0;\n max-inline-size: var(--dimension-menu-width-xs);\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.table-group__body {\n display: grid;\n grid-template-columns: var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);\n min-height: calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));\n max-height: calc(100vh - var(--dimension-size-800) - var(--dimension-size-600));\n}\n\n.table-group__data-pane,\n.table-group__order-pane {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex-direction: column;\n}\n\n.table-group__data-pane {\n border-inline-end: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n}\n\n.table-group__list {\n flex: 1 1 auto;\n}\n\n.table-group__empty {\n flex: 1 1 auto;\n}\n\n.table-group__footer {\n flex: 0 0 auto;\n}\n\n.table-group__footer .ds-choice-footer__content {\n justify-content: flex-start;\n}\n\n.table-group__footer[aria-hidden='true']::before {\n visibility: hidden;\n}\n\n.table-group__footer[aria-hidden='true'] .ds-choice-footer__content {\n visibility: hidden;\n}\n\n@media (forced-colors: active) {\n .table-group__data-pane {\n border-inline-end-color: var(--ds-forced-color-content);\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n resolveChoicePopupAlignOffset,\n resolveCssLengthPx,\n resolveMotionTimeMs,\n TOKEN_CSS_LENGTHS,\n TOKEN_DEFAULTS,\n} from '../../utils';\nimport { AnchoredPositionController } from '../../utils/anchored-position-controller';\nimport { AnchoredOverlayInteractionController } from '../../utils/anchored-overlay-interaction-controller';\nimport { resolveAnchoredOverlayBoundaryRect } from '../../utils/anchored-overlay-boundary';\nimport { ChoiceListSection, ChoiceOptionRow } from '../../utils/choice-list-parts';\nimport type { TableGroupingState, TableSortDirection } from '../Table/table-types';\n\nexport interface TableGroupOption {\n label: string;\n value: string;\n description?: string;\n isInactive?: boolean;\n}\n\nlet tableGroupSeq = 0;\n\n@Component({\n tag: 'ds-table-group',\n styleUrl: 'TableGroup.css',\n scoped: true,\n})\nexport class TableGroup {\n @Element() private el!: HTMLElement;\n\n /** Product-owned data points that may group the table. */\n @Prop() options: TableGroupOption[] = [];\n /** Controlled grouping field and the order of its group sections. */\n @Prop() grouping: TableGroupingState | null = null;\n /** Accessible name for the trigger and non-modal dialog. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** Controlled popup visibility. */\n @Prop({ mutable: true }) open = false;\n /** Empty message kept in the order pane until a grouping data point is selected. */\n @Prop() emptyMessage = 'Select a group to choose its order.';\n /** Clear action label. */\n @Prop() clearLabel = 'Clear';\n\n /** Requests replacement of the complete controlled grouping state. */\n @Event() dsGroupChange!: EventEmitter<TableGroupingState>;\n /** Requests removal of the controlled grouping state. */\n @Event() dsClear!: EventEmitter<void>;\n /** Reports controlled popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private shouldRender = false;\n @State() private closing = false;\n @State() private positionReady = false;\n @State() private pos = { x: 0, y: 0 };\n @State() private focusRingVisible = false;\n\n private readonly componentId = `ds-table-group-${++tableGroupSeq}`;\n private readonly triggerId = `${this.componentId}-trigger`;\n private readonly popupId = `${this.componentId}-popup`;\n private triggerElement: HTMLElement | null = null;\n private pendingInitialFocusVisible = false;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n\n private readonly position = new AnchoredPositionController({\n getAnchor: () => this.triggerElement,\n getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n getOwnerDocument: () => this.el.ownerDocument,\n measure: (anchor, popup) => {\n if (!this.open) return null;\n const sectionInsetPx = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n return {\n anchorRect: anchor.getBoundingClientRect(),\n popupWidth: popup.offsetWidth || this.popupFallbackWidth,\n popupHeight: popup.offsetHeight || this.popupFallbackHeight,\n side: 'bottom',\n align: 'end',\n sideOffsetPx: resolveCssLengthPx(TOKEN_CSS_LENGTHS.space050, TOKEN_DEFAULTS.space050),\n alignOffsetPx: resolveChoicePopupAlignOffset({\n align: 'end',\n alignOffsetPx: 0,\n sectionInsetPx,\n }),\n viewportPadPx: resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050),\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n collisionRect: resolveAnchoredOverlayBoundaryRect(anchor),\n };\n },\n apply: ({ x, y }) => {\n this.pos = { x, y };\n },\n onReady: () => {\n this.positionReady = true;\n },\n liveUpdate: 'double-frame',\n observeResize: true,\n topLayer: true,\n });\n\n private readonly interaction = new AnchoredOverlayInteractionController({\n getAnchor: () => this.triggerElement,\n getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n getOwnerDocument: () => this.el.ownerDocument,\n onOutsideActivation: () => this.close(),\n });\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.position.unobserve();\n this.interaction.disconnect();\n if (this.closeTimer) clearTimeout(this.closeTimer);\n }\n\n @Watch('open')\n onOpenChange(isOpen: boolean) {\n if (isOpen) {\n this.teardown();\n this.shouldRender = true;\n this.closing = false;\n this.positionReady = false;\n this.focusRingVisible = this.pendingInitialFocusVisible;\n this.interaction.connect();\n this.position.observe();\n this.position.schedule(() => this.focusInitialDataPoint());\n return;\n }\n if (!this.shouldRender) return;\n this.position.cancel();\n this.closing = true;\n this.interaction.disconnect();\n this.position.unobserve();\n const duration = resolveMotionTimeMs(\n TOKEN_DEFAULTS.motionShort2,\n TOKEN_DEFAULTS.animationDurationShort3\n );\n if (duration <= 0) this.finishClose();\n else this.closeTimer = setTimeout(() => this.finishClose(), duration);\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (!this.shouldRender || this.closing) return;\n if (event.key === 'Escape') {\n event.preventDefault();\n this.close();\n return;\n }\n if (event.key !== 'Tab' || !this.interaction.tabLeavesPopup(event)) return;\n event.preventDefault();\n this.close(false);\n this.interaction.moveFocusAfterTab(event.shiftKey);\n }\n\n private get popupFallbackWidth(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthLg, TOKEN_DEFAULTS.menuWidthLg);\n }\n\n private get popupFallbackHeight(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n }\n\n private teardown() {\n this.position.unobserve();\n this.interaction.disconnect();\n if (this.closeTimer) {\n clearTimeout(this.closeTimer);\n this.closeTimer = null;\n }\n }\n\n private toggle(fromKeyboard = false) {\n if (this.open) {\n this.close();\n return;\n }\n this.pendingInitialFocusVisible = fromKeyboard;\n this.open = true;\n this.dsOpenChange.emit(true);\n this.onOpenChange(true);\n }\n\n private close(restoreFocus = true) {\n if (restoreFocus) this.interaction.focusAnchor();\n this.open = false;\n this.dsOpenChange.emit(false);\n this.onOpenChange(false);\n }\n\n private finishClose() {\n const popup = this.el.querySelector<HTMLElement>('.table-group-popup');\n if (popup?.matches(':popover-open')) popup.hidePopover();\n this.shouldRender = false;\n this.closing = false;\n this.closeTimer = null;\n }\n\n private focusInitialDataPoint() {\n requestAnimationFrame(() => {\n const selected = this.grouping\n ? this.el.querySelector<HTMLElement>(\n `[data-group-value=\"${CSS.escape(this.grouping.columnId)}\"] [role=\"option\"]`\n )\n : null;\n const initial =\n selected ??\n this.el.querySelector<HTMLElement>(\n '[data-group-value] [role=\"option\"]:not([aria-disabled=\"true\"])'\n );\n initial?.focus();\n this.pendingInitialFocusVisible = false;\n });\n }\n\n private selectData(option: TableGroupOption) {\n if (option.isInactive) return;\n this.dsGroupChange.emit({\n columnId: option.value,\n direction: this.grouping?.columnId === option.value ? this.grouping.direction : 'asc',\n });\n }\n\n private selectDirection(direction: TableSortDirection) {\n if (!this.grouping || this.grouping.direction === direction) return;\n this.dsGroupChange.emit({ ...this.grouping, direction });\n }\n\n private moveFocus(\n event: KeyboardEvent,\n selector: string,\n currentIndex: number,\n oppositeSelector?: string\n ) {\n if (oppositeSelector && (event.key === 'ArrowLeft' || event.key === 'ArrowRight')) {\n event.preventDefault();\n this.focusRingVisible = true;\n this.el.querySelector<HTMLElement>(oppositeSelector)?.focus();\n return;\n }\n if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;\n event.preventDefault();\n const items = Array.from(this.el.querySelectorAll<HTMLElement>(selector)).filter(\n item => item.getAttribute('aria-disabled') !== 'true'\n );\n if (!items.length) return;\n let next: number;\n if (event.key === 'Home') next = 0;\n else if (event.key === 'End') next = items.length - 1;\n else next = (currentIndex + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length;\n this.focusRingVisible = true;\n items[next]?.focus();\n }\n\n private renderDataOption(option: TableGroupOption, index: number) {\n const selected = option.value === this.grouping?.columnId;\n return (\n <ChoiceOptionRow\n id={`${this.componentId}-data-${index}`}\n option={{ ...option }}\n selected={selected}\n active={selected}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={Boolean(option.description)}\n tabIndex={selected || (!this.grouping && index === 0) ? 0 : -1}\n onHover={() => {\n this.focusRingVisible = false;\n }}\n onSelect={() => this.selectData(option)}\n onKeyDown={(event: KeyboardEvent) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.selectData(option);\n return;\n }\n this.moveFocus(\n event,\n '[data-group-value] [role=\"option\"]',\n this.options\n .filter(candidate => !candidate.isInactive)\n .findIndex(candidate => candidate.value === option.value),\n this.grouping\n ? `[data-group-direction=\"${this.grouping.direction}\"] [role=\"option\"]`\n : undefined\n );\n }}\n />\n );\n }\n\n private renderDirection(direction: TableSortDirection, label: string, index: number) {\n const selected = direction === this.grouping?.direction;\n return (\n <ChoiceOptionRow\n id={`${this.componentId}-direction-${direction}`}\n option={{ label, value: direction }}\n selected={selected}\n active={selected}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={false}\n tabIndex={selected ? 0 : -1}\n onHover={() => {\n this.focusRingVisible = false;\n }}\n onSelect={() => this.selectDirection(direction)}\n onKeyDown={(event: KeyboardEvent) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.selectDirection(direction);\n return;\n }\n this.moveFocus(\n event,\n '[data-group-direction] [role=\"option\"]',\n index,\n `[data-group-value=\"${CSS.escape(this.grouping?.columnId ?? '')}\"] [role=\"option\"]`\n );\n }}\n />\n );\n }\n\n render() {\n const name = this.ariaLabel?.trim() || 'Group table';\n const popupStyle: Record<string, string> = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n zIndex: '9998',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n\n return (\n <Host hidden={this.options.length === 0 ? true : undefined}>\n {this.options.length ? (\n <ds-button-unfilled\n ref={element => {\n this.triggerElement = (element as HTMLElement) ?? null;\n }}\n id={this.triggerId}\n variant=\"icon-label\"\n size=\"md\"\n icon=\"SectionList\"\n label=\"Group\"\n labelEmphasis={false}\n pressScale={false}\n aria-label={name}\n hasMenu={true}\n collapseLabel={true}\n expanded={this.open}\n controls={this.popupId}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.toggle(event.detail.detail === 0)}\n />\n ) : null}\n\n {this.shouldRender ? (\n <div\n id={this.popupId}\n popover=\"manual\"\n class={{\n 'table-group-popup': true,\n 'ds-choice-popup': true,\n 'ds-choice-popup--closing': this.closing,\n }}\n style={popupStyle}\n role=\"dialog\"\n aria-label={name}\n >\n <div class=\"table-group__body\">\n <div class=\"table-group__data-pane\">\n <ChoiceListSection\n heading=\"Data\"\n ariaLabel=\"Group data\"\n className=\"table-group__list\"\n >\n {this.options.map((option, index) => (\n <div data-group-value={option.value}>\n {this.renderDataOption(option, index)}\n </div>\n ))}\n </ChoiceListSection>\n <div\n class=\"table-group__footer ds-choice-footer\"\n aria-hidden={!this.grouping ? 'true' : undefined}\n >\n <div class=\"ds-choice-footer__content ds-control--md\">\n {this.grouping ? (\n <button\n class=\"ds-choice-footer__clear ds-text-action ds-focus-ring\"\n type=\"button\"\n onClick={() => this.dsClear.emit()}\n >\n <ds-text as=\"span\" variant=\"text-body-medium\" color=\"inherit\">\n {this.clearLabel}\n </ds-text>\n </button>\n ) : null}\n </div>\n </div>\n </div>\n\n <div class=\"table-group__order-pane\">\n {this.grouping ? (\n <ChoiceListSection\n heading=\"Order\"\n ariaLabel=\"Group order\"\n className=\"table-group__list\"\n >\n <div data-group-direction=\"asc\">\n {this.renderDirection('asc', 'Ascending', 0)}\n </div>\n <div data-group-direction=\"desc\">\n {this.renderDirection('desc', 'Descending', 1)}\n </div>\n </ChoiceListSection>\n ) : (\n <div class=\"table-group__empty ds-choice-empty ds-empty-region\">\n <ds-empty-state body={this.emptyMessage} />\n </div>\n )}\n </div>\n </div>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["tableGroupCss","DEFAULT_ORDER_OPTIONS","label","direction","tableGroupSeq","TableGroup","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","options","grouping","ariaLabel","open","emptyMessage","clearLabel","shouldRender","closing","positionReady","pos","x","y","focusRingVisible","componentId","triggerId","popupId","triggerElement","pendingInitialFocusVisible","closeTimer","position","AnchoredPositionController","getAnchor","getPopup","el","querySelector","getOwnerDocument","ownerDocument","measure","anchor","popup","sectionInsetPx","resolveCssLengthPx","TOKEN_DEFAULTS","space050","anchorRect","getBoundingClientRect","popupWidth","offsetWidth","popupFallbackWidth","popupHeight","offsetHeight","popupFallbackHeight","side","align","sideOffsetPx","TOKEN_CSS_LENGTHS","alignOffsetPx","resolveChoicePopupAlignOffset","viewportPadPx","viewportWidth","window","innerWidth","viewportHeight","innerHeight","collisionRect","resolveAnchoredOverlayBoundaryRect","apply","onReady","liveUpdate","observeResize","topLayer","interaction","AnchoredOverlayInteractionController","onOutsideActivation","close","componentDidLoad","onOpenChange","disconnectedCallback","unobserve","disconnect","clearTimeout","isOpen","teardown","connect","observe","schedule","focusInitialDataPoint","cancel","duration","resolveMotionTimeMs","motionShort2","animationDurationShort3","finishClose","setTimeout","handleKeyDown","event","key","preventDefault","tabLeavesPopup","moveFocusAfterTab","shiftKey","menuWidthLg","menuFallbackHeight","toggle","fromKeyboard","dsOpenChange","emit","restoreFocus","focusAnchor","matches","hidePopover","requestAnimationFrame","selected","CSS","escape","columnId","initial","focus","selectData","option","isInactive","value","dsGroupChange","initialOrder","orderOptions","orderBy","activeOrderOptions","configured","find","length","selectedOrderIndex","exact","findIndex","undefined","selectOrder","index","moveFocus","selector","currentIndex","oppositeSelector","includes","items","Array","from","querySelectorAll","filter","item","getAttribute","next","renderDataOption","h","ChoiceOptionRow","id","active","usesSubtext","Boolean","description","tabIndex","onHover","onSelect","onKeyDown","candidate","renderOrder","String","render","name","trim","popupStyle","left","top","transform","Math","round","zIndex","visibility","Host","hidden","ref","element","variant","size","icon","labelEmphasis","pressScale","hasMenu","collapseLabel","expanded","controls","onDsClick","detail","popover","class","style","role","ChoiceListSection","heading","className","map","type","onClick","dsClear","as","color","body"],"sources":["src/wc/components/TableGroup/TableGroup.css?tag=ds-table-group&encapsulation=scoped","src/wc/components/TableGroup/TableGroup.tsx"],"sourcesContent":["@import '../../utils/choice-list.css';\n@import '../../utils/control-parts.css';\n@import '../../utils/table-caption-control.css';\n\n:host {\n display: inline-flex;\n min-inline-size: 0;\n max-inline-size: var(--dimension-menu-width-xs);\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.table-group__body {\n display: grid;\n grid-template-columns: var(--dimension-menu-width-xs) var(--dimension-menu-width-sm);\n min-height: calc(var(--dimension-size-800) * 4 + var(--dimension-space-150));\n max-height: calc(100vh - var(--dimension-size-800) - var(--dimension-size-600));\n}\n\n.table-group__data-pane,\n.table-group__order-pane {\n display: flex;\n min-width: 0;\n min-height: 0;\n flex-direction: column;\n}\n\n.table-group__data-pane {\n border-inline-end: var(--dimension-stroke-width-012) solid var(--color-border-tertiary);\n}\n\n.table-group__list {\n flex: 1 1 auto;\n}\n\n.table-group__empty {\n flex: 1 1 auto;\n}\n\n.table-group__footer {\n flex: 0 0 auto;\n}\n\n.table-group__footer .ds-choice-footer__content {\n justify-content: flex-start;\n}\n\n.table-group__footer[aria-hidden='true']::before {\n visibility: hidden;\n}\n\n.table-group__footer[aria-hidden='true'] .ds-choice-footer__content {\n visibility: hidden;\n}\n\n@media (forced-colors: active) {\n .table-group__data-pane {\n border-inline-end-color: var(--ds-forced-color-content);\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport {\n resolveChoicePopupAlignOffset,\n resolveCssLengthPx,\n resolveMotionTimeMs,\n TOKEN_CSS_LENGTHS,\n TOKEN_DEFAULTS,\n} from '../../utils';\nimport { AnchoredPositionController } from '../../utils/anchored-position-controller';\nimport { AnchoredOverlayInteractionController } from '../../utils/anchored-overlay-interaction-controller';\nimport { resolveAnchoredOverlayBoundaryRect } from '../../utils/anchored-overlay-boundary';\nimport { ChoiceListSection, ChoiceOptionRow } from '../../utils/choice-list-parts';\nimport type { TableGroupingState, TableSortDirection } from '../Table/table-types';\n\nexport interface TableGroupOrderOption {\n label: string;\n direction: TableSortDirection;\n /** Optional application-owned data point used to order the group sections. */\n orderBy?: string;\n}\n\nexport interface TableGroupOption {\n label: string;\n value: string;\n description?: string;\n isInactive?: boolean;\n /** Product-owned order choices for this grouping data point. */\n orderOptions?: TableGroupOrderOption[];\n}\n\nconst DEFAULT_ORDER_OPTIONS: TableGroupOrderOption[] = [\n { label: 'Ascending', direction: 'asc' },\n { label: 'Descending', direction: 'desc' },\n];\n\nlet tableGroupSeq = 0;\n\n@Component({\n tag: 'ds-table-group',\n styleUrl: 'TableGroup.css',\n scoped: true,\n})\nexport class TableGroup {\n @Element() private el!: HTMLElement;\n\n /** Product-owned data points that may group the table. */\n @Prop() options: TableGroupOption[] = [];\n /** Controlled grouping field and the order of its group sections. */\n @Prop() grouping: TableGroupingState | null = null;\n /** Accessible name for the trigger and non-modal dialog. */\n @Prop({ attribute: 'aria-label' }) ariaLabel: string | null = null;\n /** Controlled popup visibility. */\n @Prop({ mutable: true }) open = false;\n /** Empty message kept in the order pane until a grouping data point is selected. */\n @Prop() emptyMessage = 'Select a group to choose its order.';\n /** Clear action label. */\n @Prop() clearLabel = 'Clear';\n\n /** Requests replacement of the complete controlled grouping state. */\n @Event() dsGroupChange!: EventEmitter<TableGroupingState>;\n /** Requests removal of the controlled grouping state. */\n @Event() dsClear!: EventEmitter<void>;\n /** Reports controlled popup visibility changes. */\n @Event() dsOpenChange!: EventEmitter<boolean>;\n\n @State() private shouldRender = false;\n @State() private closing = false;\n @State() private positionReady = false;\n @State() private pos = { x: 0, y: 0 };\n @State() private focusRingVisible = false;\n\n private readonly componentId = `ds-table-group-${++tableGroupSeq}`;\n private readonly triggerId = `${this.componentId}-trigger`;\n private readonly popupId = `${this.componentId}-popup`;\n private triggerElement: HTMLElement | null = null;\n private pendingInitialFocusVisible = false;\n private closeTimer: ReturnType<typeof setTimeout> | null = null;\n\n private readonly position = new AnchoredPositionController({\n getAnchor: () => this.triggerElement,\n getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n getOwnerDocument: () => this.el.ownerDocument,\n measure: (anchor, popup) => {\n if (!this.open) return null;\n const sectionInsetPx = resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050);\n return {\n anchorRect: anchor.getBoundingClientRect(),\n popupWidth: popup.offsetWidth || this.popupFallbackWidth,\n popupHeight: popup.offsetHeight || this.popupFallbackHeight,\n side: 'bottom',\n align: 'end',\n sideOffsetPx: resolveCssLengthPx(TOKEN_CSS_LENGTHS.space050, TOKEN_DEFAULTS.space050),\n alignOffsetPx: resolveChoicePopupAlignOffset({\n align: 'end',\n alignOffsetPx: 0,\n sectionInsetPx,\n }),\n viewportPadPx: resolveCssLengthPx(TOKEN_DEFAULTS.space050, TOKEN_DEFAULTS.space050),\n viewportWidth: window.innerWidth,\n viewportHeight: window.innerHeight,\n collisionRect: resolveAnchoredOverlayBoundaryRect(anchor),\n };\n },\n apply: ({ x, y }) => {\n this.pos = { x, y };\n },\n onReady: () => {\n this.positionReady = true;\n },\n liveUpdate: 'double-frame',\n observeResize: true,\n topLayer: true,\n });\n\n private readonly interaction = new AnchoredOverlayInteractionController({\n getAnchor: () => this.triggerElement,\n getPopup: () => this.el.querySelector<HTMLElement>('.table-group-popup'),\n getOwnerDocument: () => this.el.ownerDocument,\n onOutsideActivation: () => this.close(),\n });\n\n componentDidLoad() {\n if (this.open) this.onOpenChange(true);\n }\n\n disconnectedCallback() {\n this.position.unobserve();\n this.interaction.disconnect();\n if (this.closeTimer) clearTimeout(this.closeTimer);\n }\n\n @Watch('open')\n onOpenChange(isOpen: boolean) {\n if (isOpen) {\n this.teardown();\n this.shouldRender = true;\n this.closing = false;\n this.positionReady = false;\n this.focusRingVisible = this.pendingInitialFocusVisible;\n this.interaction.connect();\n this.position.observe();\n this.position.schedule(() => this.focusInitialDataPoint());\n return;\n }\n if (!this.shouldRender) return;\n this.position.cancel();\n this.closing = true;\n this.interaction.disconnect();\n this.position.unobserve();\n const duration = resolveMotionTimeMs(\n TOKEN_DEFAULTS.motionShort2,\n TOKEN_DEFAULTS.animationDurationShort3\n );\n if (duration <= 0) this.finishClose();\n else this.closeTimer = setTimeout(() => this.finishClose(), duration);\n }\n\n @Listen('keydown')\n handleKeyDown(event: KeyboardEvent) {\n if (!this.shouldRender || this.closing) return;\n if (event.key === 'Escape') {\n event.preventDefault();\n this.close();\n return;\n }\n if (event.key !== 'Tab' || !this.interaction.tabLeavesPopup(event)) return;\n event.preventDefault();\n this.close(false);\n this.interaction.moveFocusAfterTab(event.shiftKey);\n }\n\n private get popupFallbackWidth(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.menuWidthLg, TOKEN_DEFAULTS.menuWidthLg);\n }\n\n private get popupFallbackHeight(): number {\n return resolveCssLengthPx(TOKEN_DEFAULTS.menuFallbackHeight, TOKEN_DEFAULTS.menuFallbackHeight);\n }\n\n private teardown() {\n this.position.unobserve();\n this.interaction.disconnect();\n if (this.closeTimer) {\n clearTimeout(this.closeTimer);\n this.closeTimer = null;\n }\n }\n\n private toggle(fromKeyboard = false) {\n if (this.open) {\n this.close();\n return;\n }\n this.pendingInitialFocusVisible = fromKeyboard;\n this.open = true;\n this.dsOpenChange.emit(true);\n this.onOpenChange(true);\n }\n\n private close(restoreFocus = true) {\n if (restoreFocus) this.interaction.focusAnchor();\n this.open = false;\n this.dsOpenChange.emit(false);\n this.onOpenChange(false);\n }\n\n private finishClose() {\n const popup = this.el.querySelector<HTMLElement>('.table-group-popup');\n if (popup?.matches(':popover-open')) popup.hidePopover();\n this.shouldRender = false;\n this.closing = false;\n this.closeTimer = null;\n }\n\n private focusInitialDataPoint() {\n requestAnimationFrame(() => {\n const selected = this.grouping\n ? this.el.querySelector<HTMLElement>(\n `[data-group-value=\"${CSS.escape(this.grouping.columnId)}\"] [role=\"option\"]`\n )\n : null;\n const initial =\n selected ??\n this.el.querySelector<HTMLElement>(\n '[data-group-value] [role=\"option\"]:not([aria-disabled=\"true\"])'\n );\n initial?.focus();\n this.pendingInitialFocusVisible = false;\n });\n }\n\n private selectData(option: TableGroupOption) {\n if (option.isInactive) return;\n if (this.grouping?.columnId === option.value) {\n this.dsGroupChange.emit({ ...this.grouping });\n return;\n }\n const initialOrder = option.orderOptions?.[0];\n this.dsGroupChange.emit({\n columnId: option.value,\n direction: initialOrder?.direction ?? 'asc',\n ...(initialOrder?.orderBy ? { orderBy: initialOrder.orderBy } : {}),\n });\n }\n\n private get activeOrderOptions(): TableGroupOrderOption[] {\n const configured = this.options.find(\n option => option.value === this.grouping?.columnId\n )?.orderOptions;\n return configured?.length ? configured : DEFAULT_ORDER_OPTIONS;\n }\n\n private get selectedOrderIndex(): number {\n if (!this.grouping) return -1;\n const exact = this.activeOrderOptions.findIndex(\n option =>\n option.direction === this.grouping?.direction && option.orderBy === this.grouping?.orderBy\n );\n if (exact >= 0) return exact;\n if (this.grouping.orderBy === undefined) {\n return this.activeOrderOptions.findIndex(\n option => option.direction === this.grouping?.direction\n );\n }\n return -1;\n }\n\n private selectOrder(option: TableGroupOrderOption, index: number) {\n if (!this.grouping || this.selectedOrderIndex === index) return;\n const grouping: TableGroupingState = {\n columnId: this.grouping.columnId,\n direction: option.direction,\n };\n if (option.orderBy) grouping.orderBy = option.orderBy;\n this.dsGroupChange.emit(grouping);\n }\n\n private moveFocus(\n event: KeyboardEvent,\n selector: string,\n currentIndex: number,\n oppositeSelector?: string\n ) {\n if (oppositeSelector && (event.key === 'ArrowLeft' || event.key === 'ArrowRight')) {\n event.preventDefault();\n this.focusRingVisible = true;\n this.el.querySelector<HTMLElement>(oppositeSelector)?.focus();\n return;\n }\n if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;\n event.preventDefault();\n const items = Array.from(this.el.querySelectorAll<HTMLElement>(selector)).filter(\n item => item.getAttribute('aria-disabled') !== 'true'\n );\n if (!items.length) return;\n let next: number;\n if (event.key === 'Home') next = 0;\n else if (event.key === 'End') next = items.length - 1;\n else next = (currentIndex + (event.key === 'ArrowDown' ? 1 : -1) + items.length) % items.length;\n this.focusRingVisible = true;\n items[next]?.focus();\n }\n\n private renderDataOption(option: TableGroupOption, index: number) {\n const selected = option.value === this.grouping?.columnId;\n return (\n <ChoiceOptionRow\n id={`${this.componentId}-data-${index}`}\n option={{ ...option }}\n selected={selected}\n active={selected}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={Boolean(option.description)}\n tabIndex={selected || (!this.grouping && index === 0) ? 0 : -1}\n onHover={() => {\n this.focusRingVisible = false;\n }}\n onSelect={() => this.selectData(option)}\n onKeyDown={(event: KeyboardEvent) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.selectData(option);\n return;\n }\n this.moveFocus(\n event,\n '[data-group-value] [role=\"option\"]',\n this.options\n .filter(candidate => !candidate.isInactive)\n .findIndex(candidate => candidate.value === option.value),\n this.grouping\n ? `[data-group-order-index=\"${this.selectedOrderIndex}\"] [role=\"option\"]`\n : undefined\n );\n }}\n />\n );\n }\n\n private renderOrder(option: TableGroupOrderOption, index: number) {\n const selected = index === this.selectedOrderIndex;\n return (\n <ChoiceOptionRow\n id={`${this.componentId}-order-${index}`}\n option={{ label: option.label, value: String(index) }}\n selected={selected}\n active={selected}\n focusRingVisible={this.focusRingVisible}\n usesSubtext={false}\n tabIndex={selected ? 0 : -1}\n onHover={() => {\n this.focusRingVisible = false;\n }}\n onSelect={() => this.selectOrder(option, index)}\n onKeyDown={(event: KeyboardEvent) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n this.selectOrder(option, index);\n return;\n }\n this.moveFocus(\n event,\n '[data-group-order-index] [role=\"option\"]',\n index,\n `[data-group-value=\"${CSS.escape(this.grouping?.columnId ?? '')}\"] [role=\"option\"]`\n );\n }}\n />\n );\n }\n\n render() {\n const name = this.ariaLabel?.trim() || 'Group table';\n const popupStyle: Record<string, string> = {\n position: 'fixed',\n left: '0',\n top: '0',\n transform: `translate(${Math.round(this.pos.x)}px, ${Math.round(this.pos.y)}px)`,\n zIndex: '9998',\n visibility: this.positionReady ? 'visible' : 'hidden',\n };\n\n return (\n <Host hidden={this.options.length === 0 ? true : undefined}>\n {this.options.length ? (\n <ds-button-unfilled\n ref={element => {\n this.triggerElement = (element as HTMLElement) ?? null;\n }}\n id={this.triggerId}\n variant=\"icon-label\"\n size=\"md\"\n icon=\"SectionList\"\n label=\"Group\"\n labelEmphasis={false}\n pressScale={false}\n aria-label={name}\n hasMenu={true}\n collapseLabel={true}\n expanded={this.open}\n controls={this.popupId}\n onDsClick={(event: CustomEvent<MouseEvent>) => this.toggle(event.detail.detail === 0)}\n />\n ) : null}\n\n {this.shouldRender ? (\n <div\n id={this.popupId}\n popover=\"manual\"\n class={{\n 'table-group-popup': true,\n 'ds-choice-popup': true,\n 'ds-choice-popup--closing': this.closing,\n }}\n style={popupStyle}\n role=\"dialog\"\n aria-label={name}\n >\n <div class=\"table-group__body\">\n <div class=\"table-group__data-pane\">\n <ChoiceListSection\n heading=\"Data\"\n ariaLabel=\"Group data\"\n className=\"table-group__list\"\n >\n {this.options.map((option, index) => (\n <div data-group-value={option.value}>\n {this.renderDataOption(option, index)}\n </div>\n ))}\n </ChoiceListSection>\n <div\n class=\"table-group__footer ds-choice-footer\"\n aria-hidden={!this.grouping ? 'true' : undefined}\n >\n <div class=\"ds-choice-footer__content ds-control--md\">\n {this.grouping ? (\n <button\n class=\"ds-choice-footer__clear ds-text-action ds-focus-ring\"\n type=\"button\"\n onClick={() => this.dsClear.emit()}\n >\n <ds-text as=\"span\" variant=\"text-body-medium\" color=\"inherit\">\n {this.clearLabel}\n </ds-text>\n </button>\n ) : null}\n </div>\n </div>\n </div>\n\n <div class=\"table-group__order-pane\">\n {this.grouping ? (\n <ChoiceListSection\n heading=\"Order\"\n ariaLabel=\"Group order\"\n className=\"table-group__list\"\n >\n {this.activeOrderOptions.map((option, index) => (\n <div data-group-order-index={index}>{this.renderOrder(option, index)}</div>\n ))}\n </ChoiceListSection>\n ) : (\n <div class=\"table-group__empty ds-choice-empty ds-empty-region\">\n <ds-empty-state body={this.emptyMessage} />\n </div>\n )}\n </div>\n </div>\n </div>\n ) : null}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|